From 1e99b1ef23d907bc68b50040791d9ca30e4b79ed Mon Sep 17 00:00:00 2001
From: ywyonui <ywyonui@163.com>
Date: Sat, 20 Sep 2025 23:06:15 +0800
Subject: [PATCH] =?UTF-8?q?=E8=B0=83=E6=95=B4=E5=AE=A1=E6=89=B9=E6=B5=81?=
 =?UTF-8?q?=E7=A8=8B=E7=9A=84=E6=98=BE=E7=A4=BA=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/LcglSp/index.vue | 134 +++++++++++++++-----------------
 src/pages/base/xk/tf/detail.vue |   4 +-
 src/store/modules/data.ts       |  11 ++-
 3 files changed, 74 insertions(+), 75 deletions(-)

diff --git a/src/components/LcglSp/index.vue b/src/components/LcglSp/index.vue
index 0d4ad20..d50c007 100644
--- a/src/components/LcglSp/index.vue
+++ b/src/components/LcglSp/index.vue
@@ -6,32 +6,32 @@
       <view class="sp-list">
         <view class="sp-item">
           <view class="sp-info">
-            <text class="name">{{ sqr.userName }}</text>
-            <text class="dept">{{ sqr.deptName }}</text>
-            <text class="status" :class="getSqrStatusClass(sqr.approveStatus)">
-              {{ getSqrStatusText(sqr.approveStatus) }}
+            <text class="name">{{ sqrSp.userName }}</text>
+            <text class="dept">{{ sqrSp.deptName }}</text>
+            <text class="status" :class="getSqrStatusClass(sqrSp.approveStatus)">
+              {{ getSqrStatusText(sqrSp.approveStatus) }}
             </text>
           </view>
           <!-- 显示审批意见和审批时间 -->
-          <view class="sp-detail" v-if="sqr.approveRemark || sqr.approveTime">
-            <view class="approval-info" v-if="sqr.approveRemark">
+          <view class="sp-detail" v-if="sqrSp.approveRemark || sqrSp.approveTime">
+            <view class="approval-info" v-if="sqrSp.approveRemark">
               <text class="info-label">申请意见：</text>
-              <text class="info-value">{{ sqr.approveRemark }}</text>
+              <text class="info-value">{{ sqrSp.approveRemark }}</text>
             </view>
-            <view class="approval-info" v-if="sqr.approveTime">
+            <view class="approval-info" v-if="sqrSp.approveTime">
               <text class="info-label">申请时间：</text>
-              <text class="info-value">{{ formatTime(sqr.approveTime) }}</text>
+              <text class="info-value">{{ formatTime(sqrSp.approveTime) }}</text>
             </view>
           </view>
         </view>
       </view>
     </view>
     <!-- 审批人 -->
-    <view class="info-section spr" v-if="sprList.length > 0">
+    <view class="info-section spr" v-if="sprSpList.length > 0">
       <view class="section-title">审批人</view>
       <view class="sp-list">
-        <view v-for="spr in sprList" :key="spr.id" class="sp-item">
-          <view class="sp-info">             
+        <view v-for="spr in sprSpList" :key="spr.id" class="sp-item">
+          <view class="sp-info">
             <text class="name">{{ spr.userName }}</text>
             <text class="dept">{{ spr.deptName }}</text>
             <text class="status" :class="getSprStatusClass(spr.approveStatus)">
@@ -53,11 +53,11 @@
       </view>
     </view>
     <!-- 抄送人 -->
-    <view class="info-section csr" v-if="csrList.length > 0">
+    <view class="info-section csr" v-if="csrSpList.length > 0">
       <view class="section-title">抄送人</view>
       <view class="sp-list">
         <view v-for="csr in displayedcsrList" :key="csr.id" class="sp-item">
-          <view class="sp-info">             
+          <view class="sp-info">
             <text class="name">{{ csr.userName }}</text>
             <text class="dept">{{ csr.deptName }}</text>
             <text class="status" :class="getSprStatusClass(csr.approveStatus)">
@@ -67,9 +67,9 @@
         </view>
       </view>
       <!-- 更多按钮 -->
-      <view v-if="csrList.length > 2" class="more-button" @click="toggleCsrExpanded">
+      <view v-if="csrSpList.length > 2" class="more-button" @click="toggleCsrExpanded">
         <text class="more-text">
-          {{ csrExpanded ? '收起' : `更多(${csrList.length - 2})` }}
+          {{ csrExpanded ? '收起' : `更多(${csrSpList.length - 2})` }}
         </text>
         <text class="more-icon" :class="{ expanded: csrExpanded }">▼</text>
       </view>
@@ -129,6 +129,9 @@
 <script setup lang="ts">
 import dayjs from "dayjs";
 import { getLcglApi } from "@/api/base/lcglSpApi";
+import { useDataStore } from "@/store/modules/data";
+
+const { setLcgl } = useDataStore();
 
 // 接收外部传入属性
 const props = withDefaults(defineProps<{
@@ -139,9 +142,9 @@ const props = withDefaults(defineProps<{
   ywType: ''
 });
 
-const sqr = ref<any>({});
-const sprList = ref<any>([]);
-const csrList = ref<any>([]);
+const sqrSp = ref<any>({});
+const sprSpList = ref<any>([]);
+const csrSpList = ref<any>([]);
 const logList = ref<any>([]);
 
 // 抄送人展开状态
@@ -151,10 +154,10 @@ const logExpanded = ref(false);
 
 // 计算属性：显示的抄送人列表
 const displayedcsrList = computed(() => {
-  if (csrExpanded.value || csrList.value.length <= 2) {
-    return csrList.value;
+  if (csrExpanded.value || csrSpList.value.length <= 2) {
+    return csrSpList.value;
   }
-  return csrList.value.slice(0, 2);
+  return csrSpList.value.slice(0, 2);
 });
 
 // 计算属性：显示的操作记录列表
@@ -184,28 +187,6 @@ const toggleLogExpanded = () => {
   logExpanded.value = !logExpanded.value;
 };
 
-// 获取状态样式类
-const getStatusClass = (status: any) => {
-  const statusMap: Record<string, string> = {
-    draft: "status-draft",
-    pending: "status-pending",
-    approved: "status-approved",
-    rejected: "status-rejected",
-  };
-  return statusMap[status] || "status-default";
-};
-
-// 获取状态文本
-const getStatusText = (status: any) => {
-  const statusMap: Record<string, string> = {
-    draft: "草稿",
-    pending: "待审批",
-    approved: "已通过",
-    rejected: "已驳回",
-  };
-  return statusMap[status] || "未知";
-};
-
 // 获取审批人状态文本
 const getSqrStatusText = (status: any) => {
   const statusMap: Record<string, string> = {
@@ -217,8 +198,7 @@ const getSqrStatusText = (status: any) => {
 // 获取抄送人状态样式类
 const getSqrStatusClass = (status: any) => {
   const statusMap: Record<string, string> = {
-    unread: "status-unread",
-    read: "status-read",
+    apply: "status-read",
   };
   return statusMap[status] || "status-default";
 };
@@ -230,6 +210,8 @@ const getSprStatusClass = (status: any) => {
     approved: "status-approved",
     rejected: "status-rejected",
     skipped: "status-skipped",
+    stop: "status-stop",
+    transfer: "status-transfer",
   };
   return statusMap[status] || "status-default";
 };
@@ -241,12 +223,14 @@ const getSprStatusText = (status: any) => {
     approved: "已同意",
     rejected: "已驳回",
     skipped: "已跳过",
+    stop: "已终止",
+    transfer: "已转办",
   };
   return statusMap[status] || "未知";
 };
 
 // 获取抄送人状态样式类
-const getCCStatusClass = (status: any) => {
+const getCsrStatusClass = (status: any) => {
   const statusMap: Record<string, string> = {
     unread: "status-unread",
     read: "status-read",
@@ -255,7 +239,7 @@ const getCCStatusClass = (status: any) => {
 };
 
 // 获取抄送人状态文本
-const getCCStatusText = (status: any) => {
+const getCsrStatusText = (status: any) => {
   const statusMap: Record<string, string> = {
     unread: "未读",
     read: "已读",
@@ -275,14 +259,15 @@ const loadLcgl = async () => {
     }
     // 调用后端API获取审批流程数据
     const res = await getLcglApi(params);
-    sqr.value = {};
-    sprList.value = [];
-    csrList.value = [];
+    sqrSp.value = {};
+    sqrSp.value = [];
+    csrSpList.value = [];
     logList.value = [];
+    setLcgl(res.result || {});
     if (res.resultCode === 1 && res.result) {
-      sqr.value = res.result.sqrSp || {};
-      sprList.value = res.result.sprSpList || [];
-      csrList.value = res.result.csrSpList || [];
+      sqrSp.value = res.result.sqrSp || {};
+      sprSpList.value = res.result.sprSpList || [];
+      csrSpList.value = res.result.csrSpList || [];
       logList.value = res.result.logList || [];
     }
   } catch (error) {
@@ -311,27 +296,29 @@ if (props.ywId) {
 <style lang="scss" scoped>
 .lcgl-info {
   padding: 0 30rpx;
+
   .info-section {
     margin-bottom: 30rpx;
     padding: 30rpx;
     background: #fff;
     border-radius: 16rpx;
     box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.1);
+
     &.sqr {
       /* 申请人区域特殊样式可以在这里添加 */
       background-color: white;
     }
-    
+
     &.spr {
       /* 审批人区域特殊样式可以在这里添加 */
       background-color: white;
     }
-    
+
     &.csr {
       /* 抄送人区域特殊样式可以在这里添加 */
       background-color: white;
     }
-    
+
     &.log {
       margin-bottom: 80rpx; // 操作记录区域增加底部间距
     }
@@ -381,38 +368,43 @@ if (props.ywId) {
         margin-left: auto;
 
         &.status-pending {
-          background: #fff7e6;
+          background-color: #fff7e6;
           color: #fa8c16;
         }
 
         &.status-approved {
-          background: #f6ffed;
+          background-color: #f6ffed;
           color: #52c41a;
         }
 
         &.status-rejected {
-          background: #fff2f0;
-          color: #ff4d4f;
+          background-color: #fff1f0;
+          color: #f5222d;
+        }
+
+        &.status-withdrawn {
+          background-color: #f9f9f9;
+          color: #8c8c8c;
         }
 
         &.status-skipped {
-          background: #f0f0f0;
-          color: #666;
+          background-color: #f0f5ff;
+          color: #2f54eb;
         }
 
-        &.status-unread {
-          background: #fff7e6;
-          color: #fa8c16;
+        &.status-stop {
+          background-color: #fff1f0;
+          color: #ff4d4f;
         }
 
-        &.status-read {
-          background: #f6ffed;
-          color: #52c41a;
+        &.status-transfer {
+          background-color: #f9f0ff;
+          color: #722ed1;
         }
 
         &.status-default {
-          background: #f0f0f0;
-          color: #666;
+          background-color: #fafafa;
+          color: #595959;
         }
       }
     }
diff --git a/src/pages/base/xk/tf/detail.vue b/src/pages/base/xk/tf/detail.vue
index 4e63080..0a0495e 100644
--- a/src/pages/base/xk/tf/detail.vue
+++ b/src/pages/base/xk/tf/detail.vue
@@ -23,7 +23,7 @@
 				</view>
 			</view>
 			<!-- 审批流程 -->
-      <LcglSpList :yw-id="xkTf.id" yw-type="XK_TF" />
+      <LcglSp :yw-id="xkTf.id" yw-type="XK_TF" />
 		</view>
 		<template #bottom>
 			<view class="white-bg-color py-5">
@@ -41,7 +41,7 @@ import { useDataStore } from "@/store/modules/data";
 import { useUserStore } from "@/store/modules/user";
 import XkPayXs from "@/pages/base/xk/components/XkPayXs/index.vue"
 import XkPaySuccessXkkc from "@/pages/base/xk/components/XkPaySuccessXkkc/index.vue"
-import LcglSpList from "@/components/LcglSpList/index.vue";
+import LcglSp from "@/components/LcglSp/index.vue";
 import PreviewImage from "@/components/PreviewImage/index.vue";
 import { getXkTfDetailByIdApi } from "@/api/base/xkApi";
 import { xxtsFindByIdApi } from "@/api/base/xxtsApi";
diff --git a/src/store/modules/data.ts b/src/store/modules/data.ts
index b5778dc..d8f56bb 100644
--- a/src/store/modules/data.ts
+++ b/src/store/modules/data.ts
@@ -11,7 +11,8 @@ export const useDataStore = defineStore({
     params: {},
     appCode: "JZ",
     qk: {},
-    tf: {}
+    tf: {},
+    lcgl: {}
   }),
   getters: {
     getData(): any {
@@ -40,7 +41,10 @@ export const useDataStore = defineStore({
     },
     getTf(): any {
       return this.tf;
-    }
+    },
+    getLcgl(): any {
+      return this.lcgl;
+    },
   },
   actions: {
     cleanData() {
@@ -77,6 +81,9 @@ export const useDataStore = defineStore({
     setTf(data: any) {
       this.tf = data;
     },
+    setLcgl(data: any) {
+      this.lcgl = data;
+    },
   },
   persist: {
     enabled: true,