修改

.gitignore

@@ -20,4 +20,4 @@ dist
 *.sln
 *.sw?
 
-stats.html
+# stats.html

src/components/ut-tabar/ut-tabar.vue

@@ -4,12 +4,12 @@
             <image class="w-100%" src="/static/images/plant/bottombg.png" mode="widthFix" style="position: absolute; bottom: 0; left: 0; z-index: -1" />
             <view class="d-flex h-140 w-100% j-sa" style="position: absolute; bottom: 0; left: 0">
                 <view class="d-flex a-c flex1 j-sa">
-                    <view class="c-#999 f-s-24 d-flex flex-cln">
+                    <view @click="goToSwitchWithParams('/pages/switch/index1', { type: 'plant', title: '种植端基地', path: '/pages/plant/base/index' })" class="c-#999 f-s-24 d-flex flex-cln">
                         <image v-if="activeTab !== 'base'" class="w-80" src="/static/images/plant/bottomBase.png" mode="widthFix" />
                         <image v-if="activeTab === 'base'" class="w-80" src="/static/images/plant/bottomBaseActive.png" mode="widthFix" />
                         <view class="text-center" :class="activeTab === 'base' ? 'c-primary f-w-5' : ''">基地</view>
                     </view>
-                    <view class="c-#999 f-s-24 d-flex flex-cln">
+                    <view @click="goToSwitchWithParams('/pages/switch/index2', { type: 'port', title: '种植端种养殖', path: '/pages/plant/port/index' })" class="c-#999 f-s-24 d-flex flex-cln">
                         <image v-if="activeTab !== 'planting'" class="w-80" src="/static/images/plant/bottomPlantingBreeding.png" mode="widthFix" />
                         <image v-if="activeTab === 'planting'" class="w-80" src="/static/images/plant/bottomPlantingBreedingActive.png" mode="widthFix" />
                         <view class="text-center" :class="activeTab === 'planting' ? 'c-primary f-w-5' : ''">种养殖</view>
@@ -38,9 +38,14 @@
 </template>
 
 <script setup lang="ts">
+import { goToSwitchPage } from '@/utils/public';
 defineProps<{
     activeTab?: string; // 当前活跃的tab标识符：'base' | 'planting' | 'warehouse' | 'processing' | 'more'
 }>();
 const windowInfo = uni.getWindowInfo();
 const safeAreaBottom = windowInfo.safeAreaInsets.bottom;
+const goToSwitchWithParams = (pages: string, data: unknown): void => {
+    // 使用公共函数跳转到switch页面并传递参数
+    goToSwitchPage(pages, data);
+};
 </script>

src/manifest.json

@@ -1,34 +1,34 @@
 {
-   "h5": {
-    "router": {
-      "mode": "history",
-      "base": "/"  // 可设置基础路径
-    }
-  },
-    "name" : "",
-    "appid" : "",
-    "description" : "",
-    "versionName" : "1.0.0",
-    "versionCode" : "100",
-    "transformPx" : false,
+    "h5": {
+        "router": {
+            "mode": "history",
+            "base": "/" // 可设置基础路径
+        }
+    },
+    "name": "",
+    "appid": "",
+    "description": "",
+    "versionName": "1.0.0",
+    "versionCode": "100",
+    "transformPx": false,
     /* 5+App特有相关 */
-    "app-plus" : {
-        "usingComponents" : true,
-        "nvueStyleCompiler" : "uni-app",
-        "compilerVersion" : 3,
-        "splashscreen" : {
-            "alwaysShowBeforeRender" : true,
-            "waiting" : true,
-            "autoclose" : true,
-            "delay" : 0
+    "app-plus": {
+        "usingComponents": true,
+        "nvueStyleCompiler": "uni-app",
+        "compilerVersion": 3,
+        "splashscreen": {
+            "alwaysShowBeforeRender": true,
+            "waiting": true,
+            "autoclose": true,
+            "delay": 0
         },
         /* 模块配置 */
-        "modules" : {},
+        "modules": {},
         /* 应用发布信息 */
-        "distribute" : {
+        "distribute": {
             /* android打包配置 */
-            "android" : {
-                "permissions" : [
+            "android": {
+                "permissions": [
                     "<uses-permission android:name=\"android.permission.CHANGE_NETWORK_STATE\"/>",
                     "<uses-permission android:name=\"android.permission.MOUNT_UNMOUNT_FILESYSTEMS\"/>",
                     "<uses-permission android:name=\"android.permission.VIBRATE\"/>",
@@ -47,40 +47,40 @@
                 ]
             },
             /* ios打包配置 */
-            "ios" : {},
+            "ios": {},
             /* SDK配置 */
-            "sdkConfigs" : {}
+            "sdkConfigs": {}
         }
     },
     /* 快应用特有相关 */
-    "quickapp" : {},
+    "quickapp": {},
     /* 小程序特有相关 */
-    "mp-weixin" : {
-        "appid" : "wx77a892f4c82cb7a3",
-        "setting" : {
-            "urlCheck" : false
+    "mp-weixin": {
+        "appid": "wxf11517e71e36169f",
+        "setting": {
+            "urlCheck": false
         },
-        "usingComponents" : true,
-        "mergeVirtualHostAttributes" : true,
+        "usingComponents": true,
+        "mergeVirtualHostAttributes": true,
         "styleIsolation": "shared",
-         "permission" : {
-            "scope.userLocation" : {
-                "desc" : "您的位置信息将用于基地位置选择"
+        "permission": {
+            "scope.userLocation": {
+                "desc": "您的位置信息将用于基地位置选择"
             }
         },
-        "requiredPrivateInfos" : [ "chooseAddress", "chooseLocation", "getLocation" ]
+        "requiredPrivateInfos": ["chooseAddress", "chooseLocation", "getLocation"]
     },
-    "mp-alipay" : {
-        "usingComponents" : true
+    "mp-alipay": {
+        "usingComponents": true
     },
-    "mp-baidu" : {
-        "usingComponents" : true
+    "mp-baidu": {
+        "usingComponents": true
     },
-    "mp-toutiao" : {
-        "usingComponents" : true
+    "mp-toutiao": {
+        "usingComponents": true
     },
-    "uniStatistics": {  
+    "uniStatistics": {
         "enable": false
     },
-    "vueVersion" : "3"
+    "vueVersion": "3"
 }

src/pages.json

@@ -113,6 +113,18 @@
                 }
             ]
         },
+        // 种养殖
+        {
+            "root": "plant/port",
+            "pages": [
+                {
+                    "path": "port-create/index",
+                    "style": {
+                        "navigationBarTitleText": "创建种养殖任务"
+                    }
+                }
+            ]
+        },
         {
             "root": "tools",
             "pages": [

src/pages/plant/base/index.vue

@@ -292,7 +292,7 @@ const handlechose = (item: string) => {
     basetype.value = item;
 };
 
-// 处理删除取消
+// 处理取消
 const handleDeleteCancel = () => {
     showDeleteDialog.value = false;
     basetype.value = null;
@@ -307,7 +307,6 @@ onMounted(() => {
         .select('#topup-navbar')
         .boundingClientRect((data: any) => {
             console.log(data);
-
             stickyTop.value = data.top + data.height;
         })
         .exec();

src/pages/plant/port/index.vue

@@ -5,27 +5,67 @@
                 <template #left><view class=""></view></template>
             </ut-navbar>
         </template>
-        <view class="b-radius pt-0 bg-#f7f7f7">
-            <up-sticky :offset-top="10">
-                <view class="d-flex a-c pd-26 bg-#f7f7f7">
-                    <view class="min-w-170 flex1">
-                        <ut-action-sheet v-model="form.queryType" :tabs="[{ label: '全部', value: '' }]" @change="onRefresh" title="选择原料类型">
-                            <view class="d-flex search-select-item a-c">
-                                <view class="flex1 ov-hd f-s-28 c-333 text-center f-w-5 w-s-no">{{ '全部' }} </view>
-                                <up-icon size="24rpx" color="#333" name="arrow-down-fill" class="mr-5"></up-icon>
-                            </view>
-                        </ut-action-sheet>
+        <up-sticky :offset-top="0">
+            <view class="d-flex a-c pd-26 pb-0 bg-#f7f7f7">
+                <view class="min-w-170 flex1">
+                    <ut-action-sheet v-model="form.queryType" :tabs="[{ label: '全部', value: '' }]" @change="onRefresh" title="选择原料类型">
+                        <view class="d-flex search-select-item a-c">
+                            <view class="flex1 ov-hd f-s-28 c-333 text-center f-w-5 w-s-no">{{ '全部' }} </view>
+                            <up-icon size="24rpx" color="#333" name="arrow-down-fill" class="mr-5"></up-icon>
+                        </view>
+                    </ut-action-sheet>
+                </view>
+                <view class="h-86 pl-20 w-100%">
+                    <ut-search ref="searchRef" v-model="form.keyword" @search="changeSeach" margin="0" :border="false" placeholder="搜批次号、品种名、基地名" bgColor="#fff" height="86rpx" borderRadius="10rpx"></ut-search>
+                </view>
+            </view>
+            <view class="pd-26 bg-#f7f7f7" :style="{ width: windowInfo ? windowInfo.screenWidth - 26 + 'px' : '100%' }">
+                <up-subsection :list="subList" :current="subCurrent" @change="sectionChange" style="width: 100%; height: 100rpx; background-color: #fff" inactive-color="#999" active-color="#37A954" fontSize="36rpx" mode="subsection"></up-subsection>
+            </view>
+        </up-sticky>
+        <!-- 养殖 -->
+        <view class="pd-26 pt-0">
+            <view class="b-radius bg-#fff pd-10">
+                <view class="d-flex j-ed f-s-22 c-#666"> 2025-12-25 </view>
+                <view class="d-flex a-ed pd-16 pt-8 pb-8">
+                    <view class="c-#333 f-s-34 f-w-5 mr-6"> 美洲大蠊</view>
+                    <view class="c-#666 f-s-26">虫卵属蓝棵</view>
+                </view>
+                <view class="d-flex a-c f-s-28 pd-16 pt-8 pb-8">
+                    <view class="c-#666 w-s-no">养殖批号:</view>
+                    <view class="c-#333 f-w-5">1231231231232</view>
+                </view>
+                <view class="d-flex a-c f-s-28 pd-16 pt-8 pb-8">
+                    <view class="c-#666 w-s-no">种源批号:</view>
+                    <view class="c-#333 f-w-5">1231231231232</view>
+                </view>
+                <view class="d-flex a-c f-s-28 pd-16 pt-8 pb-8">
+                    <view class="c-#666 w-s-no">基地:</view>
+                    <view class="c-#333 f-w-5 tx-ov w-s-no ov-hd">123112312312312312312312312312312312312312312323</view>
+                    <view class="flex1 d-flex j-ed"><up-icon name="arrow-right" size="34rpx"></up-icon></view>
+                </view>
+                <view class="d-flex f-s-28 pd-16 pt-8 pb-8">
+                    <view class="d-flex a-c w-50%">
+                        <view class="c-#666 w-s-no">养殖区域:</view>
+                        <view class="c-#333 f-w-5 tx-ov w-s-no ov-hd">20亩</view>
                     </view>
-                    <view class="h-86 pl-20 w-100%">
-                        <ut-search ref="searchRef" v-model="form.keyword" @search="changeSeach" margin="0" :border="false" placeholder="搜批次号、品种名、基地名" bgColor="#fff" height="86rpx" borderRadius="10rpx"></ut-search>
+                    <view class="d-flex a-c w-50%">
+                        <view class="c-#666 w-s-no">养殖量:</view>
+                        <view class="c-#333 f-w-5 tx-ov w-s-no ov-hd">120000</view>
                     </view>
                 </view>
-                <view class="pl-26 pr-26">
-                    <up-subsection :list="subList" :current="subCurrent" @change="sectionChange" style="width: 100%; height: 100rpx; background-color: #fff" active-color="#37A954" mode="subsection"></up-subsection>
+                <view class="pd-16 pt-8 pb-8">
+                    <up-line color="#f7f7f7"></up-line>
+                </view>
+                <view class="pd-16 pt-8 pb-8 d-flex j-sb gap-20">
+                    <up-button :customStyle="customStyle1">种源信息</up-button>
+                    <up-button :customStyle="customStyle2">饲养管理</up-button>
+                    <up-button :customStyle="customStyle3">采收管理</up-button>
                 </view>
-            </up-sticky>
+            </view>
         </view>
-        <view class="pd-26">
+        <!-- 种苗繁育 -->
+        <view class="pd-26 pt-0">
             <view class="b-radius bg-#fff pd-10">
                 <view class="d-flex j-ed f-s-22 c-#666"> 2025-12-25 </view>
                 <view class="d-flex a-ed pd-16 pt-8 pb-8">
@@ -33,7 +73,89 @@
                     <view class="c-#666 f-s-26">虫卵属蓝棵</view>
                 </view>
                 <view class="d-flex a-c f-s-28 pd-16 pt-8 pb-8">
-                    <view class="c-#666 w-s-no">养殖批号:</view>
+                    <view class="c-#666 w-s-no">繁育批号:</view>
+                    <view class="c-#333 f-w-5">1231231231232</view>
+                </view>
+                <view class="d-flex a-c f-s-28 pd-16 pt-8 pb-8">
+                    <view class="c-#666 w-s-no">种源批号:</view>
+                    <view class="c-#333 f-w-5">1231231231232</view>
+                </view>
+                <view class="d-flex a-c f-s-28 pd-16 pt-8 pb-8">
+                    <view class="c-#666 w-s-no">基地:</view>
+                    <view class="c-#333 f-w-5 tx-ov w-s-no ov-hd">123112312312312312312312312312312312312312312323</view>
+                    <view class="flex1 d-flex j-ed"><up-icon name="arrow-right" size="34rpx"></up-icon></view>
+                </view>
+                <view class="d-flex f-s-28 pd-16 pt-8 pb-8">
+                    <view class="d-flex a-c w-50%">
+                        <view class="c-#666 w-s-no">种植面积:</view>
+                        <view class="c-#333 f-w-5 tx-ov w-s-no ov-hd">20亩</view>
+                    </view>
+                    <view class="d-flex a-c w-50%">
+                        <view class="c-#666 w-s-no">繁育量:</view>
+                        <view class="c-#333 f-w-5 tx-ov w-s-no ov-hd">120000</view>
+                    </view>
+                </view>
+                <view class="pd-16 pt-8 pb-8">
+                    <up-line color="#f7f7f7"></up-line>
+                </view>
+                <view class="pd-16 pt-8 pb-8 d-flex j-sb gap-20">
+                    <up-button :customStyle="customStyle1">种源信息</up-button>
+                    <up-button :customStyle="customStyle2">种植管理</up-button>
+                    <up-button :customStyle="customStyle3">采收管理</up-button>
+                </view>
+            </view>
+        </view>
+        <!-- 种植 -->
+        <view class="pd-26 pt-0">
+            <view class="b-radius bg-#fff pd-10">
+                <view class="d-flex j-ed f-s-22 c-#666"> 2025-12-25 </view>
+                <view class="d-flex a-ed pd-16 pt-8 pb-8">
+                    <view class="c-#333 f-s-34 f-w-5 mr-6"> 美洲大蠊</view>
+                    <view class="c-#666 f-s-26">虫卵属蓝棵</view>
+                </view>
+                <view class="d-flex a-c f-s-28 pd-16 pt-8 pb-8">
+                    <view class="c-#666 w-s-no">种植批号:</view>
+                    <view class="c-#333 f-w-5">1231231231232</view>
+                </view>
+                <view class="d-flex a-c f-s-28 pd-16 pt-8 pb-8">
+                    <view class="c-#666 w-s-no">种源批号:</view>
+                    <view class="c-#333 f-w-5">1231231231232</view>
+                </view>
+                <view class="d-flex a-c f-s-28 pd-16 pt-8 pb-8">
+                    <view class="c-#666 w-s-no">基地:</view>
+                    <view class="c-#333 f-w-5 tx-ov w-s-no ov-hd">123112312312312312312312312312312312312312312323</view>
+                    <view class="flex1 d-flex j-ed"><up-icon name="arrow-right" size="34rpx"></up-icon></view>
+                </view>
+                <view class="d-flex f-s-28 pd-16 pt-8 pb-8">
+                    <view class="d-flex a-c w-50%">
+                        <view class="c-#666 w-s-no">种植面积:</view>
+                        <view class="c-#333 f-w-5 tx-ov w-s-no ov-hd">20亩</view>
+                    </view>
+                    <view class="d-flex a-c w-50%">
+                        <view class="c-#666 w-s-no">种植量:</view>
+                        <view class="c-#333 f-w-5 tx-ov w-s-no ov-hd">120000</view>
+                    </view>
+                </view>
+                <view class="pd-16 pt-8 pb-8">
+                    <up-line color="#f7f7f7"></up-line>
+                </view>
+                <view class="pd-16 pt-8 pb-8 d-flex j-sb gap-20">
+                    <up-button :customStyle="customStyle1">种源信息</up-button>
+                    <up-button :customStyle="customStyle2">种植管理</up-button>
+                    <up-button :customStyle="customStyle3">采收管理</up-button>
+                </view>
+            </view>
+        </view>
+        <!-- 种畜繁育 -->
+        <view class="pd-26 pt-0">
+            <view class="b-radius bg-#fff pd-10">
+                <view class="d-flex j-ed f-s-22 c-#666"> 2025-12-25 </view>
+                <view class="d-flex a-ed pd-16 pt-8 pb-8">
+                    <view class="c-#333 f-s-34 f-w-5 mr-6"> 美洲大蠊</view>
+                    <view class="c-#666 f-s-26">虫卵属蓝棵</view>
+                </view>
+                <view class="d-flex a-c f-s-28 pd-16 pt-8 pb-8">
+                    <view class="c-#666 w-s-no">繁育批号:</view>
                     <view class="c-#333 f-w-5">1231231231232</view>
                 </view>
                 <view class="d-flex a-c f-s-28 pd-16 pt-8 pb-8">
@@ -65,20 +187,58 @@
                 </view>
             </view>
         </view>
-
         <view class="h-210" v-if="list?.length"></view>
         <view v-if="list?.length" :style="{ height: `${safeAreaBottom}px` }"></view>
+        <template #empty>
+            <view class="d-flex flex-cln a-c" style="margin-top: -200rpx">
+                <ut-empty class="mg-at" color="#ccc" size="28rpx" image="/static/images/plant/noEmptyBase.png">暂无进行中的养殖任务</ut-empty>
+                <text class="c-#ccc f-s-28">点击下方按钮去添加吧～</text>
+            </view>
+        </template>
         <template #bottom>
             <ut-tabar activeTab="planting"></ut-tabar>
         </template>
     </z-paging>
+    <ut-suspension v-if="sus?.left" :imageWidth="60" :imageHeight="60" :x="sus?.left" :y="sus?.bottom" :inertia="false" :snap-threshold="40">
+        <image src="/static/images/plant/addBase.png" mode="widthFix" class="w-120 h-120" @click="showDeleteDialog = true"></image>
+    </ut-suspension>
+    <ut-confirm-dialog v-model:show="showDeleteDialog" width="80vw" title="请选择要创建的任务类型" :confirmText="'确认选择'" :cancelText="'取消'" @confirm="handlechoseConfirm" @cancel="handleDeleteCancel">
+        <view class="" v-for="item in pt_task_type" :key="item?.value">
+            <view style="border: 1rpx solid" :style="{ backgroundColor: item?.value == basetype ? '#EBF6EE' : '#f7f7f7', borderColor: item?.value == basetype ? '#37A954' : 'transparent' }" class="pr-30 d-flex a-c mb-20 radius-100" @click="handlechose(item.value)">
+                <view class="radius-50% mg-8">
+                    <up-avatar size="90rpx" :src="item?.avatar || 'https://ta.zycpzs.cn/oss-file/smart-trace/szyy/images/common/avatar.png'" class="mr-20"></up-avatar>
+                </view>
+                <view class="c-#333 f-s-34">
+                    {{ item?.label }}
+                </view>
+                <view class="flex1"></view>
+                <view class="d-flex">
+                    <img v-if="basetype === item.value" class="w-30 h-30" src="/static/images/plant/chooseSuccessfully.png" mode="widthFix" alt="" />
+                </view>
+            </view>
+        </view>
+    </ut-confirm-dialog>
 </template>
 <script setup lang="ts">
-const list = ref<unknown[]>([]);
+import { useClientRequest } from '@/utils/request';
+const { proxy } = getCurrentInstance() as ComponentInternalInstance;
+const { pt_task_type } = toRefs<any>(proxy?.useDict('pt_task_type'));
+setTimeout(() => {
+    console.log(pt_task_type.value, 'pt_task_type');
+}, 2000);
+
+const list = ref<unknown[]>();
 const form = ref({ queryType: '', keyword: '' });
 const paging = ref();
 const windowInfo = uni.getWindowInfo();
 const safeAreaBottom = windowInfo.safeAreaInsets.bottom;
+const systemInfo = uni.getSystemInfoSync();
+const sus = ref({
+    left: 0,
+    bottom: 0,
+});
+sus.value.left = systemInfo.windowWidth - 10;
+sus.value.bottom = systemInfo.windowHeight - 200;
 //分段器的配置
 const subList = ref(['进行中', '已结束']);
 const subCurrent = ref(0);
@@ -89,6 +249,18 @@ const sectionChange = (index: number) => {
 const changeSeach = () => {
     paging.value.reload();
 };
+const query = async (pageNum: number, pageSize: number) => {
+    const params = {
+        pageNum,
+        pageSize,
+        ...form.value,
+    };
+    const res = await useClientRequest.get('/plt-api/app/base/pageList', params);
+    if (res) {
+        const { rows } = res;
+        paging.value.complete(rows);
+    }
+};
 //按钮样式
 const customStyle1 = reactive({
     color: '#37A954',
@@ -114,6 +286,20 @@ const customStyle3 = reactive({
 const onRefresh = () => {
     paging.value.reload();
 };
+//选择创建类型
+const showDeleteDialog = ref(false);
+const basetype = ref();
+const handlechose = (item: string) => {
+    basetype.value = item;
+};
+// 处理取消
+const handleDeleteCancel = () => {
+    showDeleteDialog.value = false;
+    basetype.value = null;
+};
+const handlechoseConfirm = () => {
+    uni.$u.route({ type: 'navigateTo', url: '/plant/port/port-create/index', params: { baseType: basetype.value } });
+};
 </script>
 <style lang="scss" scoped>
 // @import '@/assets/styles/theme.scss';

src/plant/port/port-create/index.vue

@@ -0,0 +1,122 @@
+<template>
+    <z-paging ref="paging" v-model="list" bgColor="#f7f7f7" @query="query" safe-area-inset-bottom>
+        <template #top>
+            <ut-navbar title="创建种养殖任务" :fixed="false"></ut-navbar>
+        </template>
+        <view class="pt-26">
+            <up-form class="p-rtv" labelPosition="top" :model="form" :rules="rules" labelWidth="auto" ref="upFormRef">
+                <view class="startline-title pl-24 ml-26 mb-16">基地信息</view>
+                <view class="bg-#fff pd-26">
+                    <view class="b-radius bg-#EBF6EE c-primary f-s-24 pd-26"> 注意：关联时请确保已添加到地块；关联时必须选到地块/圈 舍/组培架。</view>
+                </view>
+                <view class="bg-#fff pd-26 mb-20">
+                    <up-form-item :borderBottom="false" label="种养殖所在基地" required prop="plantBase">
+                        <view class="w-100% d-flex a-c j-c pd-26 b-radius bg-#FBFDFB border-#AFDDBB" @click="openDrawer">
+                            <view class=""></view>
+                            <view class="f-s-34 c-primary">请选择种养殖所在的基地</view>
+                        </view>
+                    </up-form-item>
+                </view>
+                <view class="startline-title pl-24 ml-26 mb-16">种养殖信息</view>
+                <view class="bg-#fff pd-26 mb-20">
+                    <ut-action-sheet v-model="form.queryType" :tabs="pt_task_type" title="选择任务类型">
+                        <up-form-item borderBottom label="任务类型" required prop="baseType">
+                            <view v-if="form.queryType1" class="f-s-30 c-333 f-w-5 flex1">{{ selectDictLabel(pt_org_type, form.queryType1) }}</view>
+                            <view v-else class="f-s-30 c-ccc f-w-4 flex1">请选择任务类型</view>
+                            <template #right>
+                                <up-icon size="22rpx" color="#2A6D52" name="arrow-down-fill"></up-icon>
+                            </template>
+                        </up-form-item>
+                    </ut-action-sheet>
+                    <ut-action-sheet v-model="form.queryType1" :tabs="pt_org_type" title="选择溯源级别">
+                        <up-form-item borderBottom label="溯源级别" required prop="orgType">
+                            <view v-if="form.queryType1" class="f-s-30 c-333 f-w-5 flex1">{{ selectDictLabel(pt_org_type, form.queryType1) }}</view>
+                            <view v-else class="f-s-30 c-ccc f-w-4 flex1">请选择溯源级别</view>
+                            <template #right>
+                                <up-icon size="22rpx" color="#2A6D52" name="arrow-down-fill"></up-icon>
+                            </template>
+                        </up-form-item>
+                    </ut-action-sheet>
+                    <up-form-item borderBottom label="符合要求" required prop="gapFlag">
+                        <view v-if="form.queryType2" class="f-s-30 c-333 f-w-5 flex1">{{ selectDictLabel(pt_org_type, form.queryType1) }}</view>
+                        <view v-else class="f-s-30 c-ccc f-w-4 flex1">请选择符合要求</view>
+                        <template #right>
+                            <up-icon size="22rpx" color="#2A6D52" name="arrow-down-fill"></up-icon>
+                        </template>
+                    </up-form-item>
+                    <up-form-item borderBottom label="动物名称" required prop="plantBase">
+                        <view class="w-100% d-flex a-c j-c pd-26 b-radius bg-#FBFDFB border-#AFDDBB">
+                            <view class=""></view>
+                            <view class="f-s-34 c-primary">请选择养植的动物名称</view>
+                        </view>
+                    </up-form-item>
+                    <up-form-item borderBottom label="养殖批号" required prop="plantBase">
+                        <view class="d-flex a-c j-sb w-100%">
+                            <up-input v-model="form.queryType3" placeholder="请输入养殖批号" border="none"></up-input>
+                            <up-button class="c-#fff" type="primary" style="height: 50rpx; width: 130rpx">随机生成</up-button>
+                        </view>
+                    </up-form-item>
+                    <up-form-item label="请选择养殖技术规程文件" prop="environmentInfo.report" borderBottom>
+                        <ut-upload v-model="form.queryType4" :max-count="9" valueType="array" accept="file"></ut-upload>
+                    </up-form-item>
+                    <ut-action-sheet v-model="form.queryType5" :tabs="pt_task_type" title="选择任务类型">
+                        <up-form-item borderBottom label="任务类型" required prop="baseType">
+                            <view v-if="form.queryType1" class="f-s-30 c-333 f-w-5 flex1">{{ selectDictLabel(pt_org_type, form.queryType1) }}</view>
+                            <view v-else class="f-s-30 c-ccc f-w-4 flex1">请选择养殖方式</view>
+                            <template #right>
+                                <up-icon size="22rpx" color="#2A6D52" name="arrow-down-fill"></up-icon>
+                            </template>
+                        </up-form-item>
+                    </ut-action-sheet>
+                </view>
+            </up-form>
+        </view>
+    </z-paging>
+
+    <!-- 添加drawer组件 -->
+    <Drawer v-if="drawerVisible" v-model="drawerVisible" @open="onDrawerOpen" @close="onDrawerClose" />
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue';
+import Drawer from './models/drawer.vue';
+const { proxy } = getCurrentInstance() as ComponentInternalInstance;
+const { pt_task_type, pt_org_type, yes_no } = toRefs<any>(proxy?.useDict('pt_task_type', 'pt_org_type', 'yes_no'));
+const form = ref({
+    queryType: '',
+    queryType1: '',
+    queryType2: '',
+    queryType3: '',
+    queryType4: '',
+    queryType5: '',
+});
+const paging = ref<unknown>('paging');
+const list = ref<unknown>([]);
+
+// 控制抽屉显示状态
+const drawerVisible = ref(false);
+
+// 打开抽屉
+function openDrawer() {
+    drawerVisible.value = true;
+}
+
+// 关闭抽屉
+function closeDrawer() {
+    drawerVisible.value = false;
+}
+
+// 处理抽屉打开事件
+function onDrawerOpen() {
+    console.log('抽屉打开了');
+}
+
+// 处理抽屉关闭事件
+function onDrawerClose() {
+    console.log('抽屉关闭了');
+}
+
+onLoad((options) => {
+    console.log(options);
+});
+</script>

src/plant/port/port-create/models/drawer.vue

@@ -0,0 +1,193 @@
+<template>
+    <up-popup :show="modelValue" mode="right" @close="handleClose" @open="handleOpen">
+        <ut-navbar :fixed="false" bgColor="transparent">
+            <template #left>
+                <view class="c-#333 f-s-34 f-w-5">请选择种养殖所在基地</view>
+            </template>
+        </ut-navbar>
+        <view class="h-86 pd-20 pt-0">
+            <ut-search ref="searchRef" v-model="form.keyword" @search="changeSeach" margin="0" :border="false" placeholder="搜基地名称、编号、地址、负责人" bgColor="#f7f7f7" height="86rpx" borderRadius="16rpx"></ut-search>
+        </view>
+        <view class="d-flex pl-20 mb-20">
+            <view class="f-s-26 w-90 h-54 radius-100 bg-#f7f7f7 d-flex a-c j-c mr-20 c-#333" @click="changeSelect(0)" :style="{ backgroundColor: activeSelect == 0 ? '#37A954' : '', color: activeSelect == 0 ? '#FFF' : '' }">全部</view>
+            <view class="f-s-26 w-150 h-54 radius-100 bg-#f7f7f7 d-flex a-c j-c mr-20 c-#333" @click="changeSelect(1)" :style="{ backgroundColor: activeSelect == 1 ? '#37A954' : '', color: activeSelect == 1 ? '#FFF' : '' }">GAP基地</view>
+            <view class="f-s-26 w-200 h-54 radius-100 bg-#f7f7f7 d-flex a-c j-c mr-20 c-#333" @click="changeSelect(2)" :style="{ backgroundColor: activeSelect == 2 ? '#37A954' : '', color: activeSelect == 2 ? '#FFF' : '' }">三无一全基地</view>
+        </view>
+        <view class="w-700 d-flex" id="scroll">
+            <scroll-view class="w-50% bg-#f7f7f7 c-#fff" :style="`height: calc(100vh - ${top}px)`" scroll-y="true">
+                <view v-for="(item, index) in 10" :key="index" class="border-#E6E6E6 pd-20 title" :class="{ activeTitle: activeBase == index }" @click="changeBase(index)">
+                    <view class="">
+                        <text class="base">香格里拉市虎跳峡镇宝山村基地 </text>
+                        <text class="area">12000平方米</text>
+                    </view>
+                    <view class="pt-10">
+                        <view class="label">GAP</view>
+                    </view>
+                </view>
+            </scroll-view>
+            <scroll-view class="w-50% pd-16" :style="`height: calc(100vh - ${top}px)`" scroll-y="true">
+                <up-checkbox label="全选" labelColor="#333" name="agree" usedAlone :checked="aloneChecked" @change="handleAllCheckboxChange"></up-checkbox>
+                <!-- 复选框组包含全选框 -->
+                <up-checkbox-group activeColor="#37a954" :modelValue="checkBox" @change="handleCheckboxGroupChange" iconPlacement="right" placement="column">
+                    <up-checkbox v-for="(item, index) in mixData" :key="index" :name="item?.name" :label="item?.label"></up-checkbox>
+                </up-checkbox-group>
+            </scroll-view>
+        </view>
+    </up-popup>
+</template>
+<script setup lang="ts">
+import { ref, reactive, watch, computed } from 'vue';
+const instance = getCurrentInstance();
+defineProps<{
+    modelValue: boolean;
+}>();
+const form = ref({
+    keyword: '',
+});
+// 定义emit事件：通知父组件状态变化
+const emit = defineEmits<{
+    (e: 'update:modelValue', value: boolean): void;
+    (e: 'open'): void;
+    (e: 'close'): void;
+}>();
+
+// 处理关闭事件
+function handleClose() {
+    emit('update:modelValue', false);
+    emit('close');
+}
+
+// 处理打开事件
+function handleOpen() {
+    emit('open');
+}
+// 处理切换搜索
+const activeSelect = ref(0);
+const changeSelect = (index: number) => {
+    activeSelect.value = index;
+};
+
+// 处理搜索
+const changeSeach = () => {
+    console.log('搜索关键词:', form.value.keyword);
+    // 这里可以添加实际的搜索逻辑
+};
+// 切换基地>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>
+const activeBase = ref(0);
+const changeBase = (index: number) => {
+    activeBase.value = index;
+};
+// 选择checkbox>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>
+// 所有复选框的name值
+//模拟数据
+const mixData = ref([
+    {
+        name: 'red',
+        label: '红色',
+    },
+    {
+        name: 'green',
+        label: '绿色',
+    },
+    {
+        name: 'blue',
+        label: '蓝色',
+    },
+]);
+let allCheckboxNames: string[] = [];
+setTimeout(() => {
+    mixData.value.forEach((item) => {
+        allCheckboxNames.push(item.name);
+    });
+}, 2000);
+
+let checkBox = ref<string[]>([]);
+const aloneChecked = ref(false);
+
+// 全选框change事件处理
+const handleAllCheckboxChange = (value: boolean) => {
+    aloneChecked.value = value;
+    if (value) {
+        // 全选：将checkBox设置为所有name
+        checkBox.value = [...allCheckboxNames];
+    } else {
+        // 取消全选：清空checkBox
+        checkBox.value = [];
+    }
+};
+
+// 复选框组change事件处理
+const handleCheckboxGroupChange = (value: string[]) => {
+    checkBox.value = value;
+    // 检查是否所有复选框都被选中
+    const allSelected = allCheckboxNames.every((name) => value.includes(name));
+    aloneChecked.value = allSelected;
+};
+const top = ref(0);
+onMounted(() => {
+    const querys = uni.createSelectorQuery().in(instance?.proxy);
+    querys
+        .select('#scroll')
+        .boundingClientRect((data: any) => {
+            top.value = data.top;
+        })
+        .exec();
+});
+</script>
+<style scoped lang="scss">
+:deep(.u-border-bottom) {
+    border-color: transparent !important;
+}
+.title {
+    .base {
+        font-size: 28rpx;
+        color: #333;
+        font-weight: 500;
+    }
+    .area {
+        font-size: 24rpx;
+        color: #999;
+    }
+    .label {
+        font-size: 24rpx;
+        color: #37a954;
+        border-radius: 100rpx;
+        background-color: #e3efe6;
+        width: max-content;
+        padding-left: 14rpx;
+        padding-right: 14rpx;
+        padding-top: 6rpx;
+        padding-bottom: 6rpx;
+    }
+}
+.activeTitle {
+    background-color: #37a954;
+    .base {
+        font-size: 28rpx;
+        color: #fff;
+        font-weight: 500;
+    }
+    .area {
+        font-size: 24rpx;
+        color: #ebf6ee;
+    }
+    .label {
+        font-size: 24rpx;
+        color: #fff;
+        border-radius: 100rpx;
+        background-color: #5fba76;
+        width: max-content;
+        padding-left: 14rpx;
+        padding-right: 14rpx;
+        padding-top: 6rpx;
+        padding-bottom: 6rpx;
+    }
+}
+:deep(.u-checkbox-label--left) {
+    flex-direction: row-reverse !important;
+}
+:deep(.u-checkbox__icon-wrap) {
+    margin-right: 0 !important;
+    margin-left: 10px;
+}
+</style>

unocss.config.js

@@ -157,6 +157,16 @@ export default defineConfig({
                 transform: 'rotate(360deg)',
             }),
         ],
+        //边框
+        [
+            /^border-([\w#-]+)$/,
+            ([_, color]) => ({
+                'border-color': color,
+                'border-style': 'solid',
+                'border-width': '1rpx',
+                transform: 'rotate(360deg)',
+            }),
+        ],
         // 旋转度数
         [
             /^rotate-([\-\.\d]+)$/,