任务列表 tab切换

pages/index/index.vue

@@ -1,5 +1,19 @@
 <template>
-  <view class="">
+  <view class="orderPage">
+    <van-sticky :offset-top="40">
+      <van-tabs
+        sticky
+        v-model="searchForm.basetype"
+        class="van-hairline--bottom"
+        @click="tabList(searchForm.basetype)"
+      >
+        <van-tab
+          v-for="(item, key) in tabOptions"
+          :key="key"
+          :title="`${item.name}(${item.num})`"
+        ></van-tab>
+      </van-tabs>
+    </van-sticky>
     <!-- :finished="finished" -->
     <van-list
       v-model="loading"
@@ -9,32 +23,65 @@
       finished-text="没有更多了~"
       @load="getList"
     >
-      <div border class="list-item" v-for="(item, key) in pcsjList" :key="key">
-        <div>{{ item.name }}</div>
-        <div class="nameTitle">{{ item.xmmc }}</div>
+      <view
+        class="list-item"
+        v-for="(item, key) in pcsjList"
+        :key="key"
+        @click="goDetail(item)"
+      >
+        <div class="nameTitle">{{ item.name }}</div>
         <div>下发时间：{{ item.jsdw }}</div>
         <div>结束时间：{{ item.jsdw }}</div>
-        <div>核查图斑：{{ item.spotsnumber }}个</div>
+        <div>核查图斑：{{ item.spotsnumber || 0 }}个</div>
         <div>核查人员：{{ item.jsdw }}</div>
-      </div>
+        <view class="status">{{ item.status }}</view>
+      </view>
     </van-list>
   </view>
 </template>
 <script>
 import { listPcsj } from "@/api/apis.js";
+import order from "./order.vue";
 export default {
   name: "list",
-  components: {},
+  components: {
+    order,
+  },
   data() {
     return {
+      searchForm: {},
+      tabOptions: [
+        {
+          name: "全部",
+          num: 2,
+        },
+        {
+          name: "未完成",
+          num: 1,
+        },
+        {
+          name: "已完成",
+          num: 1,
+        },
+      ],
       queryParams: {},
       loading: false,
-      pcsjList: [{ name: "sjcdsicjdifc" }, {}],
+      pcsjList: [
+        {
+          name: "sjcdsicjdifc",
+          status: 0,
+        },
+        {},
+        {},
+        {},
+        {},
+        {},
+      ],
       total: 0,
     };
   },
   mounted() {
-    this.getList();
+    // this.getList();
   },
 
   unmounted() {},
@@ -49,8 +96,51 @@ export default {
         this.loading = false;
       });
     },
+    //跳转到详情页
+    goDetail(value) {
+      uni.setStorage({
+        key: "my_param",
+        data: value,
+        success: () => {
+          uni.switchTab({ url: "/pages/check/index" });
+        },
+      });
+      //   uni.navigateTo({
+      //     url: "/pages/check/index?item=" + value,
+      //   });
+    },
   },
 };
 </script>
-<style scoped>
+<style scoped lang="scss">
+page {
+  background: $page-bg-color;
+}
+
+.orderPage {
+  padding: 30rpx;
+  background: azure;
+
+  .list-item {
+    background: #fff;
+    padding: 40rpx 20rpx;
+    border-radius: 20rpx;
+    margin-bottom: 30rpx;
+    position: relative;
+
+    .nameTitle {
+      color: red;
+      line-height: 50rpx;
+    }
+
+    .status {
+      width: 100rpx;
+      height: 100rpx;
+      background: aqua;
+      position: absolute;
+      right: 20rpx;
+      top: 20rpx;
+    }
+  }
+}
 </style>

unpackage/dist/cache/.vite/deps/_metadata.json

@@ -1,25 +1,85 @@
 {
-  "hash": "9f22cad2",
+  "hash": "5b537a50",
   "configHash": "44361e95",
-  "lockfileHash": "75f23bf9",
-  "browserHash": "c6495eb6",
+  "lockfileHash": "9176b4a4",
+  "browserHash": "3df66231",
   "optimized": {
+    "vant": {
+      "src": "../../../../../node_modules/vant/es/index.mjs",
+      "file": "vant.js",
+      "fileHash": "cacd26e1",
+      "needsInterop": false
+    },
     "axios": {
       "src": "../../../../../node_modules/axios/index.js",
       "file": "axios.js",
-      "fileHash": "d155ad97",
+      "fileHash": "9d73001c",
       "needsInterop": true
     },
-    "vant": {
-      "src": "../../../../../node_modules/vant/es/index.js",
-      "file": "vant.js",
-      "fileHash": "47b8b45e",
+    "js-cookie": {
+      "src": "../../../../../node_modules/js-cookie/dist/js.cookie.mjs",
+      "file": "js-cookie.js",
+      "fileHash": "efcf5834",
+      "needsInterop": false
+    },
+    "gcoord": {
+      "src": "../../../../../node_modules/gcoord/dist/gcoord.esm-bundler.js",
+      "file": "gcoord.js",
+      "fileHash": "da0227e9",
+      "needsInterop": false
+    },
+    "ol/Map": {
+      "src": "../../../../../node_modules/ol/Map.js",
+      "file": "ol_Map.js",
+      "fileHash": "b8bf4277",
+      "needsInterop": false
+    },
+    "ol/View": {
+      "src": "../../../../../node_modules/ol/View.js",
+      "file": "ol_View.js",
+      "fileHash": "975bcedc",
+      "needsInterop": false
+    },
+    "ol/layer/Tile": {
+      "src": "../../../../../node_modules/ol/layer/Tile.js",
+      "file": "ol_layer_Tile.js",
+      "fileHash": "0de228c4",
+      "needsInterop": false
+    },
+    "ol/source/OSM": {
+      "src": "../../../../../node_modules/ol/source/OSM.js",
+      "file": "ol_source_OSM.js",
+      "fileHash": "0b3922ec",
+      "needsInterop": false
+    },
+    "ol/source/XYZ": {
+      "src": "../../../../../node_modules/ol/source/XYZ.js",
+      "file": "ol_source_XYZ.js",
+      "fileHash": "cfe28e71",
       "needsInterop": false
     }
   },
   "chunks": {
-    "chunk-LQ2VYIYD": {
-      "file": "chunk-LQ2VYIYD.js"
+    "chunk-43QHDAHF": {
+      "file": "chunk-43QHDAHF.js"
+    },
+    "chunk-ODWSXVJP": {
+      "file": "chunk-ODWSXVJP.js"
+    },
+    "chunk-A4TP4HJM": {
+      "file": "chunk-A4TP4HJM.js"
+    },
+    "chunk-ILZSFBFK": {
+      "file": "chunk-ILZSFBFK.js"
+    },
+    "chunk-7LDF7HX2": {
+      "file": "chunk-7LDF7HX2.js"
+    },
+    "chunk-MGM5EASI": {
+      "file": "chunk-MGM5EASI.js"
+    },
+    "chunk-TYRVL62N": {
+      "file": "chunk-TYRVL62N.js"
     }
   }
 }