298 lines
9.7 KiB
Vue
298 lines
9.7 KiB
Vue
<script lang="ts" setup>
|
|
import type {TabsItem, TimelineItem} from '@nuxt/ui'
|
|
|
|
const items = [
|
|
{
|
|
label: '团队简介',
|
|
description: 'Make changes to your account here. Click save when you\'re done.',
|
|
|
|
slot: 'team' as const
|
|
},
|
|
{
|
|
label: '我们的优势',
|
|
description: 'Make changes to your account here. Click save when you\'re done.',
|
|
icon: 'i-lucide-layers',
|
|
slot: 'advantage' as const
|
|
},
|
|
{
|
|
label: '大事记',
|
|
description: 'Make changes to your account here. Click save when you\'re done.',
|
|
icon: 'i-lucide-cctv',
|
|
slot: 'record' as const
|
|
},
|
|
// {
|
|
// label: '荣誉资质',
|
|
// description: 'Make changes to your account here. Click save when you\'re done.',
|
|
// icon: 'i-lucide-circle-star',
|
|
// slot: 'account' as const
|
|
// },
|
|
// {
|
|
// label: '合作伙伴',
|
|
// description: 'Change your password here. After saving, you\'ll be logged out.',
|
|
// icon: 'i-lucide-heart-handshake',
|
|
// slot: 'password' as const
|
|
// }
|
|
] satisfies TabsItem[]
|
|
|
|
const cards = [
|
|
{
|
|
title: "国家级科研平台支撑",
|
|
description: "智能农业技术研究室隶属于国家级农业科研机构——中国农业科学院农业信息研究所，长期致力于农业信息技术应用研究与农业问题研究，对农业生产中人工智能和模拟模型技术、农产品质量安全控制技术、农业宏观决策分析技术、地理信息系统研究和应用等拥有较深刻的研究和丰富的实践积累。同时作为农业部农业大数据重点实验室和农业部农业信息服务技术重点实验室成员之一，拥有丰富的数据资源和计算资源。",
|
|
icon: "i-heroicons-academic-cap",
|
|
image: "/img/about/a1.png",
|
|
alt: "科研平台"
|
|
},
|
|
{
|
|
title: "复合型专家与技术团队",
|
|
description: "拥有作物信息科学、作物气象学等农学背景以及计算机科学、地图学与地理信息系统、农业信息技术、管理学等复合型专业背景的科研团队，长期从事农业信息技术研究与农业生产智能管控平台研发工作；同时拥有专门从事软硬件研发与运维服务的技术团队，为项目顺利实施提供了有力的专家支撑和技术保障。",
|
|
icon: "i-heroicons-user-group",
|
|
image: "/img/about/a2.png",
|
|
alt: "专家团队"
|
|
},
|
|
{
|
|
title: "聚焦蜂产业需求前沿",
|
|
description: "作为国内最早开展蜂产业信息技术研究的团队之一，已深耕蜂产业十余年，承担国家蜂产业关键技术及设备攻关项目，紧密围绕蜂产业发展需求和痛点，开展蜂业数字化、智能化、标准化养殖模式研究与应用，精准提供整体化解决方案。",
|
|
icon: "i-heroicons-light-bulb",
|
|
image: "/img/about/a3.png",
|
|
alt: "蜂产业研究"
|
|
},
|
|
{
|
|
title: "强大的产业体系护航",
|
|
description: "团队负责人为国家蜂产业技术体系岗位科学家，可充分发挥产业体系优势，借力行业资源，直接对接全国各省实验站和知名企业，孵化开发的产品可通过全国示范区快速推广。",
|
|
icon: "i-heroicons-shield-check",
|
|
image: "/img/about/a4.png",
|
|
alt: "产业体系"
|
|
},
|
|
{
|
|
title: "软硬一体化定制研发保障",
|
|
description: "提供蜂业全产业信息自动获取、查询、追溯及大数据分析等智能管控软件以及智能蜂箱等硬件设备定制化研发、生产服务，制定软硬一体化智慧养殖解决方案，建设高标准蜂场，提高蜂业生产效能。",
|
|
icon: "i-heroicons-cog",
|
|
image: "/img/about/a5.png",
|
|
alt: "软硬一体化"
|
|
}
|
|
]
|
|
|
|
const lineItems: TimelineItem[] = [
|
|
{
|
|
date: 'Jul 2023',
|
|
title: '智慧蜂业数字化服务平台上线',
|
|
description: '正式推出智慧蜂业数字化服务平台，实现蜂业全流程数字化管理',
|
|
icon: 'i-heroicons-cloud-arrow-up',
|
|
value: 'platform-launch'
|
|
},
|
|
{
|
|
date: 'Jun 2023',
|
|
title: '获得北京市农业技术推广奖三等奖',
|
|
description: '2020-2022年度北京市农业技术推广奖',
|
|
icon: 'i-heroicons-trophy',
|
|
value: 'award'
|
|
},
|
|
{
|
|
date: 'May 2023',
|
|
title: '优蜜蜂箱小程序上线',
|
|
description: '推出移动端蜂箱管理小程序，方便蜂农实时监控',
|
|
icon: 'i-heroicons-device-phone-mobile',
|
|
value: 'mini-program'
|
|
},
|
|
{
|
|
date: 'Nov 2022',
|
|
title: '智能蜂箱系统专利授权',
|
|
description: '基于深度学习的蜜蜂识别跟踪计数系统获得发明专利',
|
|
icon: 'i-heroicons-document-duplicate',
|
|
value: 'patent'
|
|
},
|
|
{
|
|
date: 'Jul 2022',
|
|
title: '慧养蜂蜂群认养系统上线',
|
|
description: '创新蜂群认养模式，连接消费者与养蜂人',
|
|
icon: 'i-heroicons-user-group',
|
|
value: 'adoption-system'
|
|
},
|
|
{
|
|
date: 'May 2022',
|
|
title: '慧养蜂大数据平台更新',
|
|
description: '升级数据分析功能，增强可视化展示',
|
|
icon: 'i-heroicons-chart-bar',
|
|
value: 'data-update'
|
|
},
|
|
{
|
|
date: 'Apr 2022',
|
|
title: '蜜源一张图上线',
|
|
description: '集成GIS技术的蜜源分布可视化系统',
|
|
icon: 'i-heroicons-map',
|
|
value: 'honey-map'
|
|
},
|
|
{
|
|
date: 'Dec 2021',
|
|
title: '智能蜂箱更新',
|
|
description: '新一代智能蜂箱硬件迭代升级',
|
|
icon: 'i-heroicons-cube',
|
|
value: 'hive-upgrade'
|
|
},
|
|
{
|
|
date: 'Nov 2021',
|
|
title: '蜂业上报系统上线',
|
|
description: '行业数据采集与上报平台',
|
|
icon: 'i-heroicons-document-text',
|
|
value: 'reporting-system'
|
|
},
|
|
{
|
|
date: 'Jun 2021',
|
|
title: '获农业农村部优秀项目',
|
|
description: '2021数字农业农村新技术新产品新模式优秀项目',
|
|
icon: 'i-heroicons-star',
|
|
value: 'ministry-award'
|
|
},
|
|
{
|
|
date: 'Apr 2021',
|
|
title: '蜂业一张图上线',
|
|
description: '蜂产业全景数据可视化平台',
|
|
icon: 'i-heroicons-globe-alt',
|
|
value: 'industry-map'
|
|
},
|
|
{
|
|
date: 'Feb 2021',
|
|
title: '调研记（蜂业备忘录）上线',
|
|
description: '养蜂调研数据记录工具',
|
|
icon: 'i-heroicons-clipboard-document-list',
|
|
value: 'research-notes'
|
|
},
|
|
{
|
|
date: 'Jan 2021',
|
|
title: '慧养蜂大数据平台上线',
|
|
description: '首个蜂业大数据分析展示平台',
|
|
icon: 'i-heroicons-server-stack',
|
|
value: 'big-data-launch'
|
|
},
|
|
{
|
|
date: 'May 2020',
|
|
title: '智能蜂箱系统上线',
|
|
description: '首套基于深度学习的蜜蜂识别跟踪系统',
|
|
icon: 'i-heroicons-cpu-chip',
|
|
value: 'ai-hive'
|
|
},
|
|
{
|
|
date: 'Mar 2020',
|
|
title: '蜂业工具套件发布',
|
|
description: '包含蜂群转运路障通、养蜂部落、养蜂百科',
|
|
icon: 'i-heroicons-wrench-screwdriver',
|
|
value: 'toolkit'
|
|
},
|
|
{
|
|
date: 'Jul 2019',
|
|
title: '团队负责人获体系科学家称号',
|
|
description: '国家蜂产业技术体系岗位科学家',
|
|
icon: 'i-heroicons-academic-cap',
|
|
value: 'scientist'
|
|
},
|
|
{
|
|
date: 'Dec 2018',
|
|
title: '慧养蜂智慧蜂业大数据上线',
|
|
description: '首个蜂业大数据平台雏形',
|
|
icon: 'i-heroicons-chart-pie',
|
|
value: 'data-pioneer'
|
|
},
|
|
{
|
|
date: 'Jul 2018',
|
|
title: '智能蜂箱发布',
|
|
description: '首代物联网智能蜂箱设备',
|
|
icon: 'i-heroicons-beaker',
|
|
value: 'first-hive'
|
|
},
|
|
{
|
|
date: 'Nov 2017',
|
|
title: '质量安全追溯系统上线',
|
|
description: '蜂产品全流程溯源平台',
|
|
icon: 'i-heroicons-shield-check',
|
|
value: 'traceability'
|
|
},
|
|
{
|
|
date: 'Aug 2016',
|
|
title: '北京市蜂产品质量安全控制网发布',
|
|
description: '区域性质量监控网络',
|
|
icon: 'i-heroicons-shield-exclamation',
|
|
value: 'safety-net'
|
|
},
|
|
{
|
|
date: 'Dec 2015',
|
|
title: '获北京市科学技术二等奖',
|
|
description: '蜂产品质量安全控制系统',
|
|
icon: 'i-heroicons-medal',
|
|
value: 'science-award'
|
|
},
|
|
{
|
|
date: '2007-2015',
|
|
title: '蜂产品质量溯源平台研发',
|
|
description: '8年技术积累期',
|
|
icon: 'i-heroicons-clock',
|
|
value: 'foundation'
|
|
}
|
|
]
|
|
|
|
const active = ref(0)
|
|
|
|
onMounted(() => {
|
|
setInterval(() => {
|
|
active.value = (active.value + 1) % lineItems.length
|
|
}, 2000)
|
|
})
|
|
|
|
</script>
|
|
<template>
|
|
<UPage>
|
|
<img alt="" class="w-full" src="/img/about/banner.png">
|
|
<UPageSection
|
|
:style="{ backgroundImage: `url('/img/about/bg.png')` , }"
|
|
class="space-y-6 bg-cover bg-no-repeat bg-center w-full mb-4">
|
|
<UTabs :items="items" :ui="{ trigger: 'grow' }" class="gap-4 w-full">
|
|
<template #team="{ item }">
|
|
|
|
<view class="grid lg:grid-cols-[2fr_3fr] gap-4 items-center">
|
|
<img alt="" src="/img/about/teamPhoto.png">
|
|
<img alt="" src="/img/about/about.png">
|
|
|
|
</view>
|
|
|
|
</template>
|
|
|
|
<template #advantage="{ item }">
|
|
|
|
<div
|
|
|
|
class="space-y-6 ">
|
|
<UPageCard
|
|
v-for="(card, index) in cards"
|
|
:key="index"
|
|
:description="card.description"
|
|
|
|
:title="card.title"
|
|
:ui="{
|
|
container: 'relative grid lg:grid-cols-[1fr_4fr] gap-8 p-6',
|
|
}"
|
|
orientation="horizontal"
|
|
reverse
|
|
spotlight
|
|
spotlight-color="primary"
|
|
>
|
|
|
|
<UIcon :name="card.icon" class="size-20 m-auto text-primary"/>
|
|
</UPageCard>
|
|
</div>
|
|
</template>
|
|
<template #record="{ item }">
|
|
<view/>
|
|
<UTimeline
|
|
v-model="active" :items="lineItems" :ui="{
|
|
date:'text-dimmed text-2xl',
|
|
title: 'font-medium text-highlighted text-3xl',
|
|
description: 'text-muted text-wrap text-xl'
|
|
}" class=" px-auto " size="3xl"/>
|
|
</template>
|
|
</UTabs>
|
|
</upagesection>
|
|
</UPage>
|
|
</template>
|
|
|
|
<style scoped>
|
|
|
|
</style> |