feats

src/pages/index.vue

@@ -65,7 +65,7 @@ const goPromulgate = () => {
 }
 
 onMounted(() => {
-  getInvoiceFill(formData.data.invoiceId).then(res => {
+  getInvoiceFill(invoiceId).then(res => {
     Object.assign(formData, res)
   }).catch(err => {
     console.log(err)

src/pages/invoice/history.vue

@@ -1,65 +1,95 @@
 <template>
-  <div class="list">
-    <h2>填写记录</h2>
-    <van-list>
+  <div class="history-page">
+    <h3>填写记录</h3>
+    <van-list
+      class="history-list"
+      v-model:loading="loading"
+      :finished="finished"
+      @load="onLoad"
+      finished-text="我们是有底线的"
+    >
       <van-cell
         class="item"
-        v-for="item in recordList"
-        :key="item.invoiceId"
-        :title="item.name"
-        @click="() => goDetail(item.invoiceId)"
+        v-for="item in list"
+        :key="item.detailId"
+        :title="item.orgName"
+        is-link
+        :to="{ name: 'invoice.fill', query: { invoiceId, personId: item.personId } }"
       >
         <template #value>
-          <span>{{ item.createDate }} >></span>
+          <span class="pname">{{ item.personName }}</span>
         </template>
       </van-cell>
     </van-list>
   </div>
 </template>
 <script setup>
-import { onMounted, ref } from "vue"
-import { useRouter } from 'vue-router'
+import { computed, onMounted, reactive, ref } from "vue"
+import { useRouter, useRoute } from 'vue-router'
+import { getList } from "@/services/invoice";
 
 const router = useRouter();
+const route = useRoute();
+const { invoiceId } = route.query;
 
-const recordList = ref([
-  {
-    name: '电网一班',
-    invoiceId: '1',
-    createDate: '2022-4-8'
-  },
-  {
-    name: '电网二班',
-    invoiceId: '2',
-    createDate: '2022-6-8'
-  },
-  {
-    name: '电网三班',
-    invoiceId: '3',
-    createDate: '2022-9-8'
-  },
-  {
-    name: '电网四班',
-    invoiceId: '4',
-    createDate: '2022-2-8'
-  },
-])
+const list = ref([])
+const error = ref(false);
+const loading = ref(false);
+const pagenavi = reactive({ pageNum: 1, pageSize: 10, total: 0 })
+const finished = computed(() => pagenavi.pageNum * pagenavi.pageSize > pagenavi.total)
+
+const queryData = (params) => {
+  getList(invoiceId, params).then(res => {
+    const { records, ...pageInfo } = res;
+    if (pageInfo.current === 1) {
+      list.value = records || []
+    } else {
+      list.value = list.value.concat(records || [])
+    }
+
+    pagenavi.pageNum = pageInfo.current
+    pagenavi.total = pageInfo.total
+    error.value = false
+    loading.value = false
+  }).catch(() => {
+    error.value = true
+    loading.value = false
+  })
+}
+
+const onLoad = () => {
+  const params = { pageNum: pagenavi.pageNum + 1, pageSize: pagenavi.pageSize }
+  queryData(params)
+}
 
 onMounted(() => {
   //获取提交记录
+  const params = { pageNum: pagenavi.pageNum, pageSize: pagenavi.pageSize }
+  queryData(params)
 })
-const goDetail = (val) => {
-  router.push({ name: 'invoice.fill', params: { id: val } })
-}
+
 </script>
 <style lang="less" scoped>
-.list {
-  padding: 16px;
-  h2 {
+.history-page {
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+
+  h3 {
+    flex: none;
     text-align: center;
+    letter-spacing: 2px;
   }
-  .item + .item {
-    margin-top: 16px;
+
+  .history-list {
+    flex: 1;
+  }
+
+  .pname {
+    color: #333;
   }
+  // .item + .item {
+  //   margin-top: 16px;
+  // }
 }
 </style>

src/pages/publicity/list.vue

@@ -30,7 +30,7 @@ import { getList } from "@/services/invoice";
 
 const router = useRouter();
 const route = useRoute();
-const { invoiceId = 'f11ab8d28fd097e7aa4877ae7068a876' } = route;
+const { invoiceId } = route.query;
 
 const list = ref([])
 const error = ref(false);