|  | @@ -2,59 +2,48 @@
 | 
	
		
			
				|  |  |  <route lang="json5" type="home">
 | 
	
		
			
				|  |  |  {
 | 
	
		
			
				|  |  |    style: {
 | 
	
		
			
				|  |  | -    navigationStyle: 'custom',
 | 
	
		
			
				|  |  | +    //navigationStyle: 'custom',  // 用来隐藏顶部 首页 的导航
 | 
	
		
			
				|  |  | +    navigationBarBackgroundColor: '#f59e0b',
 | 
	
		
			
				|  |  |      navigationBarTitleText: '首页',
 | 
	
		
			
				|  |  |    },
 | 
	
		
			
				|  |  |  }
 | 
	
		
			
				|  |  |  </route>
 | 
	
		
			
				|  |  |  <template>
 | 
	
		
			
				|  |  | -  <view class="containe px-4">
 | 
	
		
			
				|  |  | -    <!-- 渐变色 -->
 | 
	
		
			
				|  |  | -    <view class="top-content"></view>
 | 
	
		
			
				|  |  | -    <view
 | 
	
		
			
				|  |  | -      class="overflow-hidden header header-fixed header-bg"
 | 
	
		
			
				|  |  | -      :style="{ paddingTop: safeAreaInsets?.top + 'px' }"
 | 
	
		
			
				|  |  | -    >
 | 
	
		
			
				|  |  | -      <wd-badge modelValue="12" @click="watchNotice">
 | 
	
		
			
				|  |  | -        <wd-icon name="dong" size="48rpx" />
 | 
	
		
			
				|  |  | -      </wd-badge>
 | 
	
		
			
				|  |  | -      <view class="input-box mt-2" @click="handleSerch">
 | 
	
		
			
				|  |  | +  <view class="containe">
 | 
	
		
			
				|  |  | +    <!-- 搜索框 -->
 | 
	
		
			
				|  |  | +    <view class="header header-fixed header-bg">
 | 
	
		
			
				|  |  | +      <view class="input-box" @click="handleSerch">
 | 
	
		
			
				|  |  |          <wd-icon name="search" />
 | 
	
		
			
				|  |  |          请输入牛号
 | 
	
		
			
				|  |  |        </view>
 | 
	
		
			
				|  |  |      </view>
 | 
	
		
			
				|  |  | -    <!-- 进度 -->
 | 
	
		
			
				|  |  | -    <view class="work shadow-xl">
 | 
	
		
			
				|  |  | -      <view class="mt-4 mb-4 px-2 pb-2 title">工作进度</view>
 | 
	
		
			
				|  |  | -      <view class="work-box flex justify-around">
 | 
	
		
			
				|  |  | -        <wd-circle
 | 
	
		
			
				|  |  | -          customClass="z-index: -1; position: reletive;"
 | 
	
		
			
				|  |  | -          v-model="current"
 | 
	
		
			
				|  |  | -          color="#f59e0b"
 | 
	
		
			
				|  |  | -          :strokeWidth="15"
 | 
	
		
			
				|  |  | -          :text="`已完成${current}%`"
 | 
	
		
			
				|  |  | -        ></wd-circle>
 | 
	
		
			
				|  |  | -        <view class="do-work" @click="switchPage">
 | 
	
		
			
				|  |  | -          <text>待办事件:</text>
 | 
	
		
			
				|  |  | -          <text class="num">{{ 4 }}/</text>
 | 
	
		
			
				|  |  | -          <text class="num1">{{ 20 }}</text>
 | 
	
		
			
				|  |  | +    <!-- 菜单悬浮按钮  -->
 | 
	
		
			
				|  |  | +    <wd-fab v-model:active="active"></wd-fab>
 | 
	
		
			
				|  |  | +    <!-- 弹出层导航 -->
 | 
	
		
			
				|  |  | +    <wd-popup v-model="active" position="right" custom-style="padding:40rpx 20rpx  ;width:90%">
 | 
	
		
			
				|  |  | +      <view v-for="(item, index) in navList" :key="item.id">
 | 
	
		
			
				|  |  | +        <view class="mt-4 mb-4 px-2 title">{{ item.name }}</view>
 | 
	
		
			
				|  |  | +        <view class="work-box-t flex justify-left flex-row flex-wrap">
 | 
	
		
			
				|  |  | +          <view class="work-item mb-4 px-2" v-for="(child, index) in item.children" :key="index">
 | 
	
		
			
				|  |  | +            <navigator :url="child.url">
 | 
	
		
			
				|  |  | +              <image :src="child.img" mode="scaleToFill" class="image" />
 | 
	
		
			
				|  |  | +              <view class="item-title">
 | 
	
		
			
				|  |  | +                {{ child.title }}
 | 
	
		
			
				|  |  | +              </view>
 | 
	
		
			
				|  |  | +            </navigator>
 | 
	
		
			
				|  |  | +          </view>
 | 
	
		
			
				|  |  |          </view>
 | 
	
		
			
				|  |  |        </view>
 | 
	
		
			
				|  |  | -    </view>
 | 
	
		
			
				|  |  | -    <!-- 常用工具 -->
 | 
	
		
			
				|  |  | -    <view class="work mt-4 shadow-xl work-t">
 | 
	
		
			
				|  |  | -      <view class="mt-4 mb-4 px-2 title">常用工具</view>
 | 
	
		
			
				|  |  | -      <view class="work-box-t flex justify-left flex-row flex-wrap">
 | 
	
		
			
				|  |  | -        <view class="work-item mb-4 px-2" v-for="item in workList" :key="item.id">
 | 
	
		
			
				|  |  | -          <navigator :url="item.url">
 | 
	
		
			
				|  |  | -            <image :src="item.img" mode="scaleToFill" class="image" />
 | 
	
		
			
				|  |  | -            <view class="item-title">
 | 
	
		
			
				|  |  | -              {{ item.title }}
 | 
	
		
			
				|  |  | -            </view>
 | 
	
		
			
				|  |  | -          </navigator>
 | 
	
		
			
				|  |  | -        </view>
 | 
	
		
			
				|  |  | -      </view>
 | 
	
		
			
				|  |  | -    </view>
 | 
	
		
			
				|  |  | +    </wd-popup>
 | 
	
		
			
				|  |  | +    <!-- 标签页 -->
 | 
	
		
			
				|  |  | +    <wd-tabs v-model="tab" class="pt-3 overflow-hiddren">
 | 
	
		
			
				|  |  | +      <wd-tab title="工作台(待办20)">
 | 
	
		
			
				|  |  | +        <Works></Works>
 | 
	
		
			
				|  |  | +      </wd-tab>
 | 
	
		
			
				|  |  | +      <wd-tab title="分析">
 | 
	
		
			
				|  |  | +        <view>hhh</view>
 | 
	
		
			
				|  |  | +      </wd-tab>
 | 
	
		
			
				|  |  | +    </wd-tabs>
 | 
	
		
			
				|  |  |      <!-- 加载 -->
 | 
	
		
			
				|  |  |      <!-- <Loading></Loading> -->
 | 
	
		
			
				|  |  |    </view>
 | 
	
	
		
			
				|  | @@ -62,94 +51,135 @@
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  |  <script lang="ts" setup>
 | 
	
		
			
				|  |  |  import { ref } from 'vue'
 | 
	
		
			
				|  |  | +import Works from './components/works.vue'
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  |  defineOptions({
 | 
	
		
			
				|  |  |    name: 'Home',
 | 
	
		
			
				|  |  |  })
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  | +const tab = ref<number>(0)
 | 
	
		
			
				|  |  | +const active = ref<boolean>(false)
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  |  // 获取屏幕边界到安全区域距离
 | 
	
		
			
				|  |  |  const { safeAreaInsets } = uni.getSystemInfoSync()
 | 
	
		
			
				|  |  | -const workList = reactive([
 | 
	
		
			
				|  |  | -  {
 | 
	
		
			
				|  |  | -    id: '1-1',
 | 
	
		
			
				|  |  | -    img: '../../static/images/work/jinchang.png',
 | 
	
		
			
				|  |  | -    title: '购牛',
 | 
	
		
			
				|  |  | -    url: '/pages/purchase/purchase',
 | 
	
		
			
				|  |  | -  },
 | 
	
		
			
				|  |  | -  {
 | 
	
		
			
				|  |  | -    id: '1-2',
 | 
	
		
			
				|  |  | -    img: '../../static/images/work/lichang.png',
 | 
	
		
			
				|  |  | -    title: '入场',
 | 
	
		
			
				|  |  | -    url: '/pages/approach/approach',
 | 
	
		
			
				|  |  | -  },
 | 
	
		
			
				|  |  | -  {
 | 
	
		
			
				|  |  | -    id: 5,
 | 
	
		
			
				|  |  | -    img: '../../static/images/work/bohuan1.png',
 | 
	
		
			
				|  |  | -    title: '脖环绑定',
 | 
	
		
			
				|  |  | -    url: '/pages/neckRing/neckRing',
 | 
	
		
			
				|  |  | -  },
 | 
	
		
			
				|  |  | -  {
 | 
	
		
			
				|  |  | -    id: 1,
 | 
	
		
			
				|  |  | -    img: '../../static/images/work/weight.png',
 | 
	
		
			
				|  |  | -    title: '称重登记',
 | 
	
		
			
				|  |  | -    url: '/pages/weight/weight',
 | 
	
		
			
				|  |  | -  },
 | 
	
		
			
				|  |  | -  {
 | 
	
		
			
				|  |  | -    id: 5,
 | 
	
		
			
				|  |  | -    img: '../../static/images/work/bohuan1.png',
 | 
	
		
			
				|  |  | -    title: '脖环解绑',
 | 
	
		
			
				|  |  | -    url: '/pages/untyNeckRing/untyNeckRing',
 | 
	
		
			
				|  |  | -  },
 | 
	
		
			
				|  |  | -  {
 | 
	
		
			
				|  |  | -    id: 2,
 | 
	
		
			
				|  |  | -    img: '../../static/images/work/zhiliao.png',
 | 
	
		
			
				|  |  | -    title: '登记治疗',
 | 
	
		
			
				|  |  | -    url: '',
 | 
	
		
			
				|  |  | -  },
 | 
	
		
			
				|  |  | +const navList = ref([
 | 
	
		
			
				|  |  |    {
 | 
	
		
			
				|  |  | -    id: 3,
 | 
	
		
			
				|  |  | -    img: '../../static/images/work/fabing.png',
 | 
	
		
			
				|  |  | -    title: '诊断',
 | 
	
		
			
				|  |  | -    url: '',
 | 
	
		
			
				|  |  | -  },
 | 
	
		
			
				|  |  | -  {
 | 
	
		
			
				|  |  | -    id: 4,
 | 
	
		
			
				|  |  | -    img: '../../static/images/work/liuchan.png',
 | 
	
		
			
				|  |  | -    title: '流产登记',
 | 
	
		
			
				|  |  | -    url: '',
 | 
	
		
			
				|  |  | -  },
 | 
	
		
			
				|  |  | +    id: '1',
 | 
	
		
			
				|  |  | +    name: '牛只事件',
 | 
	
		
			
				|  |  | +    children: [
 | 
	
		
			
				|  |  | +      {
 | 
	
		
			
				|  |  | +        id: '1-1',
 | 
	
		
			
				|  |  | +        img: '../../static/images/work/jinchang.png',
 | 
	
		
			
				|  |  | +        title: '购牛',
 | 
	
		
			
				|  |  | +        url: '/pages/purchase/purchase',
 | 
	
		
			
				|  |  | +      },
 | 
	
		
			
				|  |  | +      {
 | 
	
		
			
				|  |  | +        id: '1-2',
 | 
	
		
			
				|  |  | +        img: '../../static/images/work/lichang.png',
 | 
	
		
			
				|  |  | +        title: '肉牛进场',
 | 
	
		
			
				|  |  | +        url: '/pages/approach/approach',
 | 
	
		
			
				|  |  | +      },
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  | -  {
 | 
	
		
			
				|  |  | -    id: 6,
 | 
	
		
			
				|  |  | -    img: '../../static/images/work/result.png',
 | 
	
		
			
				|  |  | -    title: '治疗结果',
 | 
	
		
			
				|  |  | -    url: '',
 | 
	
		
			
				|  |  | -  },
 | 
	
		
			
				|  |  | -  {
 | 
	
		
			
				|  |  | -    id: 7,
 | 
	
		
			
				|  |  | -    img: '../../static/images/work/faqing.png',
 | 
	
		
			
				|  |  | -    title: '发情',
 | 
	
		
			
				|  |  | -    url: '',
 | 
	
		
			
				|  |  | -  },
 | 
	
		
			
				|  |  | -  {
 | 
	
		
			
				|  |  | -    id: 8,
 | 
	
		
			
				|  |  | -    img: '../../static/images/work/peizhong.png',
 | 
	
		
			
				|  |  | -    title: '配种',
 | 
	
		
			
				|  |  | -    url: '',
 | 
	
		
			
				|  |  | +      {
 | 
	
		
			
				|  |  | +        id: '1-3',
 | 
	
		
			
				|  |  | +        img: '../../static/images/work/bohuan1.png',
 | 
	
		
			
				|  |  | +        title: '脖环绑定',
 | 
	
		
			
				|  |  | +        url: '/pages/neckRing/neckRing',
 | 
	
		
			
				|  |  | +      },
 | 
	
		
			
				|  |  | +      {
 | 
	
		
			
				|  |  | +        id: '1-5',
 | 
	
		
			
				|  |  | +        img: '../../static/images/work/weight.png',
 | 
	
		
			
				|  |  | +        title: '称重',
 | 
	
		
			
				|  |  | +        url: '/pages/weight/weight',
 | 
	
		
			
				|  |  | +      },
 | 
	
		
			
				|  |  | +      {
 | 
	
		
			
				|  |  | +        id: '1-6',
 | 
	
		
			
				|  |  | +        img: '../../static/images/work/bohuan1.png',
 | 
	
		
			
				|  |  | +        title: '脖环解绑',
 | 
	
		
			
				|  |  | +        url: '/pages/untyNeckRing/untyNeckRing',
 | 
	
		
			
				|  |  | +      },
 | 
	
		
			
				|  |  | +      {
 | 
	
		
			
				|  |  | +        id: '1-2',
 | 
	
		
			
				|  |  | +        img: '../../static/images/work/lichang.png',
 | 
	
		
			
				|  |  | +        title: '繁殖进场',
 | 
	
		
			
				|  |  | +        url: '/pages/approach/approach',
 | 
	
		
			
				|  |  | +      },
 | 
	
		
			
				|  |  | +    ],
 | 
	
		
			
				|  |  |    },
 | 
	
		
			
				|  |  |    {
 | 
	
		
			
				|  |  | -    id: 9,
 | 
	
		
			
				|  |  | -    img: '../../static/images/work/yunjian.png',
 | 
	
		
			
				|  |  | -    title: '孕检登记',
 | 
	
		
			
				|  |  | -    url: '',
 | 
	
		
			
				|  |  | -  },
 | 
	
		
			
				|  |  | -  {
 | 
	
		
			
				|  |  | -    id: 10,
 | 
	
		
			
				|  |  | -    img: '../../static/images/work/jinweichan.png',
 | 
	
		
			
				|  |  | -    title: '进围产',
 | 
	
		
			
				|  |  | -    url: '',
 | 
	
		
			
				|  |  | +    id: '2',
 | 
	
		
			
				|  |  | +    name: '兽医事件',
 | 
	
		
			
				|  |  | +    children: [
 | 
	
		
			
				|  |  | +      {
 | 
	
		
			
				|  |  | +        id: '2-1',
 | 
	
		
			
				|  |  | +        img: '../../static/images/work/fabing.png',
 | 
	
		
			
				|  |  | +        title: '发病',
 | 
	
		
			
				|  |  | +        url: '/pages/treat/treat',
 | 
	
		
			
				|  |  | +      },
 | 
	
		
			
				|  |  | +      {
 | 
	
		
			
				|  |  | +        id: '2-2',
 | 
	
		
			
				|  |  | +        img: '../../static/images/work/zhiliao.png',
 | 
	
		
			
				|  |  | +        title: '去势',
 | 
	
		
			
				|  |  | +        url: '',
 | 
	
		
			
				|  |  | +      },
 | 
	
		
			
				|  |  | +      {
 | 
	
		
			
				|  |  | +        id: '2-2',
 | 
	
		
			
				|  |  | +        img: '../../static/images/work/zhiliao.png',
 | 
	
		
			
				|  |  | +        title: '检疫',
 | 
	
		
			
				|  |  | +        url: '',
 | 
	
		
			
				|  |  | +      },
 | 
	
		
			
				|  |  | +      {
 | 
	
		
			
				|  |  | +        id: '2-2',
 | 
	
		
			
				|  |  | +        img: '../../static/images/work/zhiliao.png',
 | 
	
		
			
				|  |  | +        title: '驱虫',
 | 
	
		
			
				|  |  | +        url: '',
 | 
	
		
			
				|  |  | +      },
 | 
	
		
			
				|  |  | +      {
 | 
	
		
			
				|  |  | +        id: '2-2',
 | 
	
		
			
				|  |  | +        img: '../../static/images/work/zhiliao.png',
 | 
	
		
			
				|  |  | +        title: '免疫',
 | 
	
		
			
				|  |  | +        url: '',
 | 
	
		
			
				|  |  | +      },
 | 
	
		
			
				|  |  | +    ],
 | 
	
		
			
				|  |  |    },
 | 
	
		
			
				|  |  | +  // {
 | 
	
		
			
				|  |  | +  //   id: '3',
 | 
	
		
			
				|  |  | +  //   name: '繁殖事件',
 | 
	
		
			
				|  |  | +  //   children: [
 | 
	
		
			
				|  |  | +  //     {
 | 
	
		
			
				|  |  | +  //       id: '3-1',
 | 
	
		
			
				|  |  | +  //       img: '../../static/images/work/liuchan.png',
 | 
	
		
			
				|  |  | +  //       title: '流产登记',
 | 
	
		
			
				|  |  | +  //       url: '',
 | 
	
		
			
				|  |  | +  //     },
 | 
	
		
			
				|  |  | +  //     {
 | 
	
		
			
				|  |  | +  //       id: '3-2',
 | 
	
		
			
				|  |  | +  //       img: '../../static/images/work/faqing.png',
 | 
	
		
			
				|  |  | +  //       title: '发情',
 | 
	
		
			
				|  |  | +  //       url: '',
 | 
	
		
			
				|  |  | +  //     },
 | 
	
		
			
				|  |  | +  //     {
 | 
	
		
			
				|  |  | +  //       id: '3-3',
 | 
	
		
			
				|  |  | +  //       img: '../../static/images/work/peizhong.png',
 | 
	
		
			
				|  |  | +  //       title: '配种',
 | 
	
		
			
				|  |  | +  //       url: '',
 | 
	
		
			
				|  |  | +  //     },
 | 
	
		
			
				|  |  | +  //     {
 | 
	
		
			
				|  |  | +  //       id: '3-4',
 | 
	
		
			
				|  |  | +  //       img: '../../static/images/work/yunjian.png',
 | 
	
		
			
				|  |  | +  //       title: '孕检登记',
 | 
	
		
			
				|  |  | +  //       url: '',
 | 
	
		
			
				|  |  | +  //     },
 | 
	
		
			
				|  |  | +  //     {
 | 
	
		
			
				|  |  | +  //       id: '3-5',
 | 
	
		
			
				|  |  | +  //       img: '../../static/images/work/jinweichan.png',
 | 
	
		
			
				|  |  | +  //       title: '进围产',
 | 
	
		
			
				|  |  | +  //       url: '',
 | 
	
		
			
				|  |  | +  //     },
 | 
	
		
			
				|  |  | +  //   ],
 | 
	
		
			
				|  |  | +  // },
 | 
	
		
			
				|  |  |  ])
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  |  const current = ref(20)
 | 
	
		
			
				|  |  |  let earTag = ref<string | null>(null)
 | 
	
		
			
				|  |  |  
 | 
	
	
		
			
				|  | @@ -183,6 +213,10 @@ onLoad(() => {
 | 
	
		
			
				|  |  |  </script>
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  |  <style lang="scss" scoped>
 | 
	
		
			
				|  |  | +.containe {
 | 
	
		
			
				|  |  | +  height: 100%;
 | 
	
		
			
				|  |  | +  // overflow: hidden;
 | 
	
		
			
				|  |  | +}
 | 
	
		
			
				|  |  |  .item-title {
 | 
	
		
			
				|  |  |    font-size: 28rpx;
 | 
	
		
			
				|  |  |  }
 | 
	
	
		
			
				|  | @@ -194,7 +228,7 @@ onLoad(() => {
 | 
	
		
			
				|  |  |    text-align: center;
 | 
	
		
			
				|  |  |  }
 | 
	
		
			
				|  |  |  .header {
 | 
	
		
			
				|  |  | -  padding: 32rpx;
 | 
	
		
			
				|  |  | +  padding: 32rpx 54rpx;
 | 
	
		
			
				|  |  |    margin-right: -32rpx;
 | 
	
		
			
				|  |  |    margin-left: -32rpx;
 | 
	
		
			
				|  |  |  }
 | 
	
	
		
			
				|  | @@ -205,20 +239,16 @@ onLoad(() => {
 | 
	
		
			
				|  |  |  }
 | 
	
		
			
				|  |  |  .header-bg {
 | 
	
		
			
				|  |  |    background: linear-gradient(to bottom, #f59e0b, #f5d198);
 | 
	
		
			
				|  |  | -  // background-color: #fafafa;
 | 
	
		
			
				|  |  |  }
 | 
	
		
			
				|  |  |  .image {
 | 
	
		
			
				|  |  |    width: 100rpx;
 | 
	
		
			
				|  |  |    height: 100rpx;
 | 
	
		
			
				|  |  |    margin-bottom: 30rpx;
 | 
	
		
			
				|  |  |  }
 | 
	
		
			
				|  |  | -.containe {
 | 
	
		
			
				|  |  | -  // background: #fafafa;
 | 
	
		
			
				|  |  | -  // position: relative;
 | 
	
		
			
				|  |  | -}
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  |  .input-box {
 | 
	
		
			
				|  |  |    height: 80rpx;
 | 
	
		
			
				|  |  | -  margin-top: 44rpx;
 | 
	
		
			
				|  |  | +  // margin-top: 10rpx;
 | 
	
		
			
				|  |  |    line-height: 80rpx;
 | 
	
		
			
				|  |  |    color: #6b7280;
 | 
	
		
			
				|  |  |    text-align: center;
 | 
	
	
		
			
				|  | @@ -231,7 +261,7 @@ onLoad(() => {
 | 
	
		
			
				|  |  |    right: 0;
 | 
	
		
			
				|  |  |    left: 0;
 | 
	
		
			
				|  |  |    z-index: -1;
 | 
	
		
			
				|  |  | -  height: 422rpx;
 | 
	
		
			
				|  |  | +  height: 222rpx;
 | 
	
		
			
				|  |  |    text-align: center;
 | 
	
		
			
				|  |  |    background: linear-gradient(to bottom, #f59e0b, #fffbeb);
 | 
	
		
			
				|  |  |  }
 |