From 3130c262986e1264906120d0c60b4a8812303132 Mon Sep 17 00:00:00 2001
From: dzq <dzq@ys.com>
Date: Fri, 13 Jun 2025 11:38:49 +0800
Subject: [PATCH] =?UTF-8?q?feat(approval):=20=E6=96=B0=E5=A2=9E=E8=B5=84?=
 =?UTF-8?q?=E4=BA=A7=E5=AE=A1=E6=89=B9=E5=88=97=E8=A1=A8=E9=A1=B5=E9=9D=A2?=
 =?UTF-8?q?=E5=B9=B6=E4=BC=98=E5=8C=96=E5=8E=9F=E6=9C=89=E5=AE=A1=E6=89=B9?=
 =?UTF-8?q?=E9=80=BB=E8=BE=91?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 添加新的资产审批列表页面(src/pages/approvalAsset/list.vue)
- 在原有审批列表中添加approvalType参数区分审批类型
- 统一审批详情页路由跳转逻辑
- 将原有样式改为scss语法
---
 src/pages/approval/list.vue      |   9 +-
 src/pages/approvalAsset/list.vue | 197 +++++++++++++++++++++++++++++++
 2 files changed, 200 insertions(+), 6 deletions(-)
 create mode 100644 src/pages/approvalAsset/list.vue

diff --git a/src/pages/approval/list.vue b/src/pages/approval/list.vue
index fcf599a..6853af5 100644
--- a/src/pages/approval/list.vue
+++ b/src/pages/approval/list.vue
@@ -67,6 +67,7 @@ const wxStore = useWxStore();
 // 搜索参数
 const searchParams = reactive<SearchApiReturnApprovalQuery>({
     corpid: wxStore.corpid,
+    approvalType: 0,
     pageNum: 1,
     pageSize: 10,
 })
@@ -103,11 +104,7 @@ const handleCellClick = (approvalId: number) => {
     if (currentItem) {
         approvalStore.setCurrentApproval(currentItem);
     }
-    if (currentItem?.approvalType == 1) {
-        router.push(`/approval/handleApply/${approvalId}`);
-    } else {
-        router.push(`/approval/handle/${approvalId}`);
-    }
+    router.push(`/approval/handle/${approvalId}`);
 }
 
 // 状态标签类型
@@ -182,7 +179,7 @@ const onLoad = async () => {
 }
 </script>
 
-<style scoped>
+<style lang="scss" scoped>
 .approval-list-container {
     padding: 12px;
 }
diff --git a/src/pages/approvalAsset/list.vue b/src/pages/approvalAsset/list.vue
new file mode 100644
index 0000000..e70ca17
--- /dev/null
+++ b/src/pages/approvalAsset/list.vue
@@ -0,0 +1,197 @@
+<template>
+    <div class="approval-list-container">
+        <!-- 搜索表单 -->
+        <van-form @submit="handleSearch">
+            <van-field v-model="searchParams.approvalId" label="审批单号" type="number" placeholder="请输入审批单号" />
+
+            <van-field v-model="searchParams.orderId" label="订单编号" type="number" placeholder="请输入订单编号" />
+
+            <van-field v-model="searchParams.goodsId" label="商品ID" type="number" placeholder="请输入商品ID" />
+
+            <van-field name="status" label="审批状态" readonly clickable v-model="statusText" placeholder="请选择状态"
+                @click="showStatusPicker = true" />
+            <van-popup v-model:show="showStatusPicker" position="bottom">
+                <van-picker :columns="statusOptions" @confirm="onStatusConfirm" @cancel="showStatusPicker = false" />
+            </van-popup>
+
+            <!-- <van-field
+        readonly
+        clickable
+        name="date"
+        :value="dateRangeText"
+        label="申请时间"
+        placeholder="选择时间范围"
+        @click="showDatePicker = true"
+      />
+      <van-popup v-model:show="showDatePicker" position="bottom">
+        <van-datetime-picker
+          type="daterange"
+          @confirm="onDateConfirm"
+          @cancel="showDatePicker = false"
+        />
+      </van-popup> -->
+
+            <div style="margin: 16px;">
+                <van-button block type="primary" native-type="submit">搜索</van-button>
+                <van-button block plain type="primary" style="margin-top: 10px;" @click="handleReset">重置</van-button>
+            </div>
+        </van-form>
+
+        <!-- 审批列表 -->
+        <van-list v-model:loading="loading" :finished="finished" finished-text="没有更多了" @load="onLoad">
+            <van-cell v-for="item in list" :key="item.approvalId" :title="`审批单号：${item.approvalId}`" clickable
+                @click="handleCellClick(item.approvalId)">
+                <template #label>
+                    <div>商品名称：{{ item.goodsName }}</div>
+                    <div>申请时间：{{ item.createTime }}</div>
+                    <van-tag :type="statusTagType(item.status)">
+                        {{ statusMap[item.status] }}
+                    </van-tag>
+                </template>
+            </van-cell>
+        </van-list>
+    </div>
+</template>
+
+<script lang="ts" setup>
+import { ref, reactive } from 'vue'
+import { getApprovalListApi } from '@/common/apis/approval'
+import type { SearchApiReturnApprovalQuery, ReturnApprovalEntity } from '@/common/apis/approval/type'
+import type { PickerConfirmEventParams } from 'vant/es';
+import { useApprovalStore } from '@/pinia/stores/approval';
+import { useWxStore } from '@/pinia/stores/wx';
+
+const router = useRouter();
+const wxStore = useWxStore();
+
+// 搜索参数
+const searchParams = reactive<SearchApiReturnApprovalQuery>({
+    corpid: wxStore.corpid,
+    approvalType: 1,
+    pageNum: 1,
+    pageSize: 10,
+})
+
+// 状态选择相关
+const showStatusPicker = ref(false)
+const statusOptions = [
+    { text: '全部', value: undefined },
+    { text: '待审核', value: 1 },
+    { text: '已通过', value: 2 },
+    { text: '已驳回', value: 3 },
+]
+
+const statusMap: { [key: number]: string } = {
+    1: '待审核',
+    2: '已通过',
+    3: '已驳回'
+}
+
+const statusText = ref('')
+
+// 时间选择相关
+const showDatePicker = ref(false)
+const dateRangeText = ref('')
+
+// 列表相关
+const list = ref<ReturnApprovalEntity[]>([])
+const loading = ref(false)
+const finished = ref(false)
+
+const handleCellClick = (approvalId: number) => {
+    const approvalStore = useApprovalStore()
+    const currentItem = list.value.find(item => item.approvalId === approvalId)
+    if (currentItem) {
+        approvalStore.setCurrentApproval(currentItem);
+    }
+    router.push(`/approval/handleApply/${approvalId}`);
+}
+
+// 状态标签类型
+const statusTagType = (status: number) => {
+    switch (status) {
+        case 1: return 'warning'
+        case 2: return 'success'
+        case 3: return 'danger'
+        default: return 'default'
+    }
+}
+
+// 处理状态选择
+const onStatusConfirm = (e: PickerConfirmEventParams) => {
+    const { selectedOptions } = e;
+    searchParams.status = selectedOptions[0]?.value ? Number(selectedOptions[0]?.value) : undefined;
+    showStatusPicker.value = false;
+    // 确保赋值给 statusText 的是字符串类型
+    statusText.value = String(selectedOptions[0]?.text || '');
+}
+
+// 处理时间选择
+const onDateConfirm = (values: Date[]) => {
+    const [start, end] = values
+    searchParams.startTime = start.toISOString().split('T')[0]
+    searchParams.endTime = end.toISOString().split('T')[0]
+    dateRangeText.value = `${searchParams.startTime} 至 ${searchParams.endTime}`
+    showDatePicker.value = false
+}
+
+// 搜索处理
+const handleSearch = () => {
+    list.value = []
+    searchParams.pageNum = 1
+    onLoad()
+}
+
+// 重置表单
+const handleReset = () => {
+    Object.assign(searchParams, {
+        pageNum: 1,
+        pageSize: 10,
+        approvalId: undefined,
+        orderId: undefined,
+        goodsId: undefined,
+        status: undefined,
+        startTime: undefined,
+        endTime: undefined
+    })
+    statusText.value = ''
+    dateRangeText.value = ''
+    handleSearch()
+}
+
+// 加载数据
+const onLoad = async () => {
+    try {
+        searchParams.corpid = wxStore.corpid;
+        const { data } = await getApprovalListApi(searchParams)
+        list.value.push(...data.rows)
+        loading.value = false
+
+        if (list.value.length >= data.total) {
+            finished.value = true
+        } else {
+            searchParams.pageNum++
+        }
+    } catch (error) {
+        console.error('获取审批列表失败', error)
+        finished.value = true
+    }
+}
+</script>
+
+<style lang="scss" scoped>
+.approval-list-container {
+    padding: 12px;
+}
+
+.van-cell__title {
+    font-size: 14px;
+    color: #333;
+}
+
+.van-cell__label {
+    margin-top: 8px;
+    color: #666;
+    font-size: 12px;
+}
+</style>
\ No newline at end of file