From 348c0396ebc2ae9ce95a349072c9d08851cfc6c2 Mon Sep 17 00:00:00 2001
From: Maple <869445424@qq.com>
Date: Fri, 8 Aug 2025 10:49:58 +0800
Subject: [PATCH] =?UTF-8?q?fix:=E6=94=B6=E5=85=A5=E5=90=88=E5=90=8C?=
 =?UTF-8?q?=E7=9A=84=E8=AF=A6=E6=83=85=E4=BB=A5=E5=8F=8A=E6=98=BE=E7=A4=BA?=
 =?UTF-8?q?=EF=BC=8C=E4=BB=A5=E5=8F=8A=E5=AE=8C=E6=88=90=E5=92=8C=E5=90=8E?=
 =?UTF-8?q?=E7=AB=AFapi=E7=9A=84=E8=B0=83=E7=94=A8=E3=80=82?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/types/auto-imports.d.ts                   |   2 +-
 src/utils/http.ts                             |  20 +-
 .../revenue-contract/ContractDetail.vue       | 155 +++++++++
 .../contract/revenue-contract/index.vue       | 314 ++++++++++--------
 4 files changed, 342 insertions(+), 149 deletions(-)
 create mode 100644 src/views/project-management/contract/revenue-contract/ContractDetail.vue

diff --git a/src/types/auto-imports.d.ts b/src/types/auto-imports.d.ts
index 9026869..6a35f3a 100644
--- a/src/types/auto-imports.d.ts
+++ b/src/types/auto-imports.d.ts
@@ -69,6 +69,6 @@ declare global {
 // for type re-export
 declare global {
   // @ts-ignore
-  export type { Component, ComponentPublicInstance, ComputedRef, DirectiveBinding, ExtractDefaultPropTypes, ExtractPropTypes, ExtractPublicPropTypes, InjectionKey, PropType, Ref, MaybeRef, MaybeRefOrGetter, VNode, WritableComputedRef } from 'vue'
+  export type { Component, ComponentPublicInstance, ComputedRef, ExtractDefaultPropTypes, ExtractPropTypes, ExtractPublicPropTypes, InjectionKey, PropType, Ref, VNode, WritableComputedRef } from 'vue'
   import('vue')
 }
diff --git a/src/utils/http.ts b/src/utils/http.ts
index 063186a..5894b18 100644
--- a/src/utils/http.ts
+++ b/src/utils/http.ts
@@ -70,10 +70,10 @@ http.interceptors.response.use(
     if (data && data.rows !== undefined && data.data === undefined) {
       data.data = data.rows
     }
-    
+
     // 兼容不同的API响应结构
     const { success, code, msg } = data
-    
+
     // 检查响应类型是否是blob
     if (response.request.responseType === 'blob') {
       const contentType = data.type
@@ -96,7 +96,7 @@ http.interceptors.response.use(
         return response
       }
     }
-    
+
     // 判断请求是否成功：明确的success字段为true，或者code为200都视为成功
     const isSuccess = success !== undefined ? success : (code === 200 || code === '200')
     if (isSuccess) {
@@ -139,17 +139,17 @@ const request = async <T = unknown>(config: AxiosRequestConfig): Promise<ApiRes<
     .then((res: AxiosResponse) => {
       // 处理返回数据结构，兼容rows和data字段
       const responseData = res.data
-      
+
       // 如果返回的数据中有rows字段但没有data字段，将rows赋值给data
       if (responseData.rows !== undefined && responseData.data === undefined) {
         responseData.data = responseData.rows
       }
-      
+
       // 如果返回的code是200但没有设置success字段，将success设置为true
       if ((responseData.code === 200 || responseData.code === '200') && responseData.success === undefined) {
         responseData.success = true
       }
-      
+
       return responseData
     })
     .catch((err: { msg: string }) => Promise.reject(err))
@@ -168,7 +168,7 @@ const requestRaw = async <T = unknown>(config: AxiosRequestConfig): Promise<Axio
     baseURL: import.meta.env.VITE_API_PREFIX ?? import.meta.env.VITE_API_BASE_URL,
     timeout: 30 * 1000,
   })
-  
+
   // 只添加请求拦截器来设置token，不添加响应拦截器
   rawAxios.interceptors.request.use(
     (config: AxiosRequestConfig) => {
@@ -183,7 +183,7 @@ const requestRaw = async <T = unknown>(config: AxiosRequestConfig): Promise<Axio
     },
     (error) => Promise.reject(error),
   )
-  
+
   return rawAxios.request<T>(config)
 }
 
@@ -225,3 +225,7 @@ export default {
   requestRaw,
   download,
 }
+
+export const updateContract = (contractId, contractData) => {
+  return http.put(`/contract/${contractId}`, contractData)
+}
diff --git a/src/views/project-management/contract/revenue-contract/ContractDetail.vue b/src/views/project-management/contract/revenue-contract/ContractDetail.vue
new file mode 100644
index 0000000..dbba383
--- /dev/null
+++ b/src/views/project-management/contract/revenue-contract/ContractDetail.vue
@@ -0,0 +1,155 @@
+<template>
+  <a-spin :loading="loading">
+    <div v-if="contractDetail">
+      <a-descriptions
+          :column="1"
+          size="medium"
+          :label-style="{ width: '120px' }"
+      >
+        <a-descriptions-item label="合同编号">
+          {{ contractDetail.code }}
+        </a-descriptions-item>
+        <a-descriptions-item label="项目名称">
+          {{ contractDetail.projectName }}
+        </a-descriptions-item>
+        <a-descriptions-item label="客户名称">
+          {{ contractDetail.customer }}
+        </a-descriptions-item>
+        <a-descriptions-item label="合同金额">
+          <span class="font-medium text-green-600">￥{{ (contractDetail.amount || 0).toLocaleString() }}</span>
+        </a-descriptions-item>
+        <a-descriptions-item label="已收款金额">
+          <span class="font-medium text-blue-600">￥{{ (contractDetail.receivedAmount || 0).toLocaleString() }}</span>
+        </a-descriptions-item>
+        <a-descriptions-item label="未收款金额">
+          <span class="font-medium text-orange-600">￥{{ (contractDetail.pendingAmount || 0).toLocaleString() }}</span>
+        </a-descriptions-item>
+        <a-descriptions-item label="签署日期">
+          {{ contractDetail.signDate }}
+        </a-descriptions-item>
+        <a-descriptions-item label="履约期限">
+          {{ contractDetail.performanceDeadline }}
+        </a-descriptions-item>
+        <a-descriptions-item label="付款日期">
+          {{ contractDetail.paymentDate }}
+        </a-descriptions-item>
+        <a-descriptions-item label="合同状态">
+          <a-tag :color="getStatusColor(contractDetail.contractStatus)">
+            {{ getStatusText(contractDetail.contractStatusLabel || contractDetail.contractStatus) }}
+          </a-tag>
+        </a-descriptions-item>
+        <a-descriptions-item label="销售人员">
+          {{ contractDetail.salespersonName }}
+        </a-descriptions-item>
+        <a-descriptions-item label="销售部门">
+          {{ contractDetail.salespersonDeptName }}
+        </a-descriptions-item>
+        <a-descriptions-item label="产品服务">
+          {{ contractDetail.productService }}
+        </a-descriptions-item>
+        <a-descriptions-item label="备注">
+          {{ contractDetail.notes }}
+        </a-descriptions-item>
+      </a-descriptions>
+    </div>
+    <div v-else-if="!loading" class="empty-container">
+      <a-empty description="暂无信息" />
+    </div>
+  </a-spin>
+</template>
+
+<script setup lang="ts">
+import { ref, onMounted } from 'vue'
+import http from '@/utils/http'
+import { Message } from '@arco-design/web-vue'
+
+interface ContractDetail {
+  contractId: string
+  customer: string
+  code: string
+  projectId: string
+  type: string
+  productService: string
+  paymentDate: string | null
+  performanceDeadline: string | null
+  paymentAddress: string
+  amount: number
+  accountNumber: string
+  notes: string
+  contractStatus: string
+  contractText: string | null
+  projectName: string
+  salespersonName: string | null
+  salespersonDeptName: string
+  settlementAmount: number | null
+  receivedAmount: number | null
+  contractStatusLabel: string | null
+  createBy: string | null
+  updateBy: string | null
+  createTime: string
+  updateTime: string
+  page: number
+  pageSize: number
+  signDate: string
+  duration: string
+  pendingAmount?: number
+}
+
+const props = defineProps({
+  contractId: {
+    type: String,
+    required: true
+  }
+})
+
+const contractDetail = ref<ContractDetail | null>(null)
+const loading = ref(false)
+
+const getStatusColor = (status: string) => {
+  const colorMap: Record<string, string> = {
+    未确认: 'gray',
+    待审批: 'orange',
+    已签署: 'blue',
+    执行中: 'cyan',
+    已完成: 'green',
+    已终止: 'red'
+  }
+  return colorMap[status] || 'gray'
+}
+
+const getStatusText = (status: string) => {
+  return status || '未知状态'
+}
+
+const fetchContractDetail = async () => {
+  try {
+    loading.value = true
+    const response = await http.get(`/contract/${props.contractId}`)
+    if (response.code === 200) {
+      contractDetail.value = response.data
+      // 计算未收款金额
+      if (contractDetail.value) {
+        contractDetail.value.pendingAmount = (contractDetail.value.amount || 0) - (contractDetail.value.receivedAmount || 0)
+      }
+    } else {
+      Message.error(response.msg || '获取合同详情失败')
+    }
+  } catch (error) {
+    console.error('获取合同详情失败:', error)
+    Message.error('获取合同详情失败')
+  } finally {
+    loading.value = false
+  }
+}
+
+onMounted(() => {
+  fetchContractDetail()
+})
+</script>
+
+<style scoped>
+.empty-container {
+  text-align: center;
+  padding: 40px 0;
+}
+</style>
diff --git a/src/views/project-management/contract/revenue-contract/index.vue b/src/views/project-management/contract/revenue-contract/index.vue
index 6a6c018..0e79d54 100644
--- a/src/views/project-management/contract/revenue-contract/index.vue
+++ b/src/views/project-management/contract/revenue-contract/index.vue
@@ -1,28 +1,28 @@
 <template>
   <GiPageLayout>
     <GiTable
-      row-key="id"
-      title="收入合同管理"
-      :data="dataList"
-      :columns="tableColumns"
-      :loading="loading"
-      :scroll="{ x: '100%', y: '100%', minWidth: 1600 }"
-      :pagination="pagination"
-      @page-change="onPageChange"
-      @page-size-change="onPageSizeChange"
-      @refresh="search"
+        row-key="id"
+        title="收入合同管理"
+        :data="dataList"
+        :columns="tableColumns"
+        :loading="loading"
+        :scroll="{ x: '100%', y: '100%', minWidth: 1600 }"
+        :pagination="pagination"
+        @page-change="onPageChange"
+        @page-size-change="onPageSizeChange"
+        @refresh="search"
     >
       <template #top>
-        <GiForm 
-          v-model="searchForm" 
-          search 
-          :columns="queryFormColumns" 
-          size="medium" 
-          @search="search" 
-          @reset="reset"
+        <GiForm
+            v-model="searchForm"
+            search
+            :columns="queryFormColumns"
+            size="medium"
+            @search="search"
+            @reset="reset"
         />
       </template>
-      
+
       <template #toolbar-left>
         <a-space>
           <a-button type="primary" @click="openAddModal">
@@ -35,51 +35,96 @@
           </a-button>
         </a-space>
       </template>
-      
+
       <!-- 合同状态 -->
       <template #status="{ record }">
-        <a-tag :color="getStatusColor(record.status)">
-          {{ getStatusText(record.status) }}
+        <a-tag :color="getStatusColor(record.contractStatus)">
+          {{ getStatusText(record.contractStatusLabel || record.contractStatus) }}
         </a-tag>
       </template>
-      
+
       <!-- 合同金额 -->
       <template #contractAmount="{ record }">
-        <span class="font-medium text-green-600">￥{{ record.contractAmount.toLocaleString() }}万</span>
+        <span class="font-medium text-green-600">￥{{ (record.amount || 0).toLocaleString() }}</span>
       </template>
-      
+
       <!-- 已收款金额 -->
       <template #receivedAmount="{ record }">
-        <span class="font-medium text-blue-600">￥{{ record.receivedAmount.toLocaleString() }}万</span>
+        <span class="font-medium text-blue-600">￥{{ (record.receivedAmount || 0).toLocaleString() }}</span>
       </template>
-      
+
       <!-- 操作列 -->
       <template #action="{ record }">
         <a-space>
           <a-link @click="viewDetail(record)">详情</a-link>
-          <a-link @click="editRecord(record)" v-if="record.status === 'draft'">编辑</a-link>
-          <a-link @click="approveContract(record)" v-if="record.status === 'pending'">审批</a-link>
+          <a-link v-if="record.contractStatus === '未确认'" @click="editRecord(record)">编辑</a-link>
+          <a-link v-if="record.contractStatus === '待审批'" @click="approveContract(record)">审批</a-link>
           <a-link @click="viewPayment(record)">收款记录</a-link>
         </a-space>
       </template>
     </GiTable>
+
+    <!-- 合同详情弹窗 -->
+    <a-modal
+        v-model:visible="showDetailModal"
+        title="合同详情"
+        :width="800"
+        @cancel="closeDetailModal"
+        :footer="false"
+    >
+      <ContractDetail v-if="showDetailModal" :contract-id="selectedContractId" />
+    </a-modal>
   </GiPageLayout>
 </template>
 
 <script setup lang="ts">
 import { ref, reactive, onMounted } from 'vue'
-import { Message } from '@arco-design/web-vue'
+import { Message, Modal } from '@arco-design/web-vue'
 import type { TableColumnData } from '@arco-design/web-vue'
+import http from '@/utils/http'
+import ContractDetail from './ContractDetail.vue'
+
+// 接口数据类型定义
+interface ContractItem {
+  contractId: string
+  customer: string
+  code: string
+  projectId: string
+  type: string
+  productService: string
+  paymentDate: string | null
+  performanceDeadline: string | null
+  paymentAddress: string
+  amount: number
+  accountNumber: string
+  notes: string
+  contractStatus: string
+  contractText: string | null
+  projectName: string
+  salespersonName: string | null
+  salespersonDeptName: string
+  settlementAmount: number | null
+  receivedAmount: number | null
+  contractStatusLabel: string | null
+  createBy: string | null
+  updateBy: string | null
+  createTime: string
+  updateTime: string
+  page: number
+  pageSize: number
+  signDate: string
+  duration: string
+}
 
 // 搜索表单
-let searchForm = reactive({
+const searchForm = reactive({
   contractName: '',
   contractCode: '',
   client: '',
   status: '',
   signDate: '',
   page: 1,
-  size: 10
+  size: 10,
 })
 
 // 查询条件配置
@@ -89,16 +134,16 @@ const queryFormColumns = [
     label: '合同名称',
     type: 'input' as const,
     props: {
-      placeholder: '请输入合同名称'
-    }
+      placeholder: '请输入合同名称',
+    },
   },
   {
     field: 'client',
     label: '客户',
     type: 'input' as const,
     props: {
-      placeholder: '请输入客户名称'
-    }
+      placeholder: '请输入客户名称',
+    },
   },
   {
     field: 'status',
@@ -107,132 +152,111 @@ const queryFormColumns = [
     props: {
       placeholder: '请选择合同状态',
       options: [
-        { label: '草稿', value: 'draft' },
-        { label: '待审批', value: 'pending' },
-        { label: '已签署', value: 'signed' },
-        { label: '执行中', value: 'executing' },
-        { label: '已完成', value: 'completed' },
-        { label: '已终止', value: 'terminated' }
-      ]
-    }
-  }
+        { label: '未确认', value: '未确认' },
+        { label: '待审批', value: '待审批' },
+        { label: '已签署', value: '已签署' },
+        { label: '执行中', value: '执行中' },
+        { label: '已完成', value: '已完成' },
+        { label: '已终止', value: '已终止' },
+      ],
+    },
+  },
 ]
 
 // 表格列配置
 const tableColumns: TableColumnData[] = [
-  { title: '合同编号', dataIndex: 'contractCode', width: 150 },
-  { title: '合同名称', dataIndex: 'contractName', width: 250, ellipsis: true, tooltip: true },
-  { title: '客户名称', dataIndex: 'client', width: 200, ellipsis: true, tooltip: true },
-  { title: '合同金额', dataIndex: 'contractAmount', slotName: 'contractAmount', width: 120 },
+  { title: '合同编号', dataIndex: 'code', width: 150 },
+  { title: '项目名称', dataIndex: 'projectName', width: 250, ellipsis: true, tooltip: true },
+  { title: '客户名称', dataIndex: 'customer', width: 200, ellipsis: true, tooltip: true },
+  { title: '合同金额', dataIndex: 'amount', slotName: 'contractAmount', width: 120 },
   { title: '已收款金额', dataIndex: 'receivedAmount', slotName: 'receivedAmount', width: 120 },
   { title: '未收款金额', dataIndex: 'pendingAmount', width: 120 },
   { title: '签署日期', dataIndex: 'signDate', width: 120 },
-  { title: '开始日期', dataIndex: 'startDate', width: 120 },
-  { title: '结束日期', dataIndex: 'endDate', width: 120 },
-  { title: '合同状态', dataIndex: 'status', slotName: 'status', width: 100 },
-  { title: '项目经理', dataIndex: 'projectManager', width: 100 },
-  { title: '销售经理', dataIndex: 'salesManager', width: 100 },
-  { title: '完成进度', dataIndex: 'progress', width: 100 },
-  { title: '备注', dataIndex: 'remark', width: 200, ellipsis: true, tooltip: true },
-  { title: '操作', slotName: 'action', width: 200, fixed: 'right' }
+  { title: '履约期限', dataIndex: 'performanceDeadline', width: 120 },
+  { title: '付款日期', dataIndex: 'paymentDate', width: 120 },
+  { title: '合同状态', dataIndex: 'contractStatus', slotName: 'status', width: 100 },
+  { title: '销售人员', dataIndex: 'salespersonName', width: 100 },
+  { title: '销售部门', dataIndex: 'salespersonDeptName', width: 100 },
+  { title: '产品服务', dataIndex: 'productService', width: 120, ellipsis: true, tooltip: true },
+  { title: '备注', dataIndex: 'notes', width: 200, ellipsis: true, tooltip: true },
+  { title: '操作', slotName: 'action', width: 200, fixed: 'right' },
 ]
 
 // 数据状态
 const loading = ref(false)
-const dataList = ref([
-  {
-    id: 1,
-    contractCode: 'RC2024001',
-    contractName: '华能新能源风电场叶片检测服务合同',
-    client: '华能新能源股份有限公司',
-    contractAmount: 320,
-    receivedAmount: 192,
-    pendingAmount: 128,
-    signDate: '2024-02-20',
-    startDate: '2024-03-01',
-    endDate: '2024-04-30',
-    status: 'executing',
-    projectManager: '张项目经理',
-    salesManager: '李销售经理',
-    progress: '60%',
-    remark: '项目进展顺利，客户满意度高'
-  },
-  {
-    id: 2,
-    contractCode: 'RC2024002',
-    contractName: '大唐风电场防雷检测项目合同',
-    client: '大唐新能源股份有限公司',
-    contractAmount: 268,
-    receivedAmount: 134,
-    pendingAmount: 134,
-    signDate: '2024-02-25',
-    startDate: '2024-03-05',
-    endDate: '2024-04-20',
-    status: 'executing',
-    projectManager: '王项目经理',
-    salesManager: '赵销售经理',
-    progress: '45%',
-    remark: '按计划执行中'
-  },
-  {
-    id: 3,
-    contractCode: 'RC2024003',
-    contractName: '中广核风电场设备维护服务合同',
-    client: '中广核新能源投资有限公司',
-    contractAmount: 450,
-    receivedAmount: 450,
-    pendingAmount: 0,
-    signDate: '2024-01-15',
-    startDate: '2024-01-20',
-    endDate: '2024-01-31',
-    status: 'completed',
-    projectManager: '刘项目经理',
-    salesManager: '孙销售经理',
-    progress: '100%',
-    remark: '项目已完成，客户验收通过'
+const dataList = ref<ContractItem[]>([])
+
+// API调用函数
+const fetchContractList = async () => {
+  try {
+    loading.value = true
+    const params = {
+      page: searchForm.page,
+      pageSize: searchForm.size,
+      contractName: searchForm.contractName,
+      code: searchForm.contractCode,
+      customer: searchForm.client,
+      contractStatus: searchForm.status,
+      signDate: searchForm.signDate,
+    }
+
+    const response = await http.get('/contract/list', params)
+
+    if (response.code === 200) {
+      // 过滤出类型为"收入合同"的数据
+      const allContracts = response.rows || []
+      const revenueContracts = allContracts.filter((item: ContractItem) => item.type === '收入合同')
+
+      // 计算未收款金额
+      dataList.value = revenueContracts.map((item: ContractItem) => ({
+        ...item,
+        pendingAmount: (item.amount || 0) - (item.receivedAmount || 0),
+      }))
+
+      pagination.total = Number.parseInt(response.total) || 0
+    } else {
+      Message.error(response.msg || '获取合同列表失败')
+      dataList.value = []
+    }
+  } catch (error) {
+    console.error('获取合同列表失败:', error)
+    Message.error('获取合同列表失败')
+    dataList.value = []
+  } finally {
+    loading.value = false
   }
-])
+}
 
 const pagination = reactive({
   current: 1,
   pageSize: 10,
-  total: 3,
+  total: 0,
   showTotal: true,
-  showPageSize: true
+  showPageSize: true,
 })
 
 // 获取状态颜色
 const getStatusColor = (status: string) => {
   const colorMap: Record<string, string> = {
-    'draft': 'gray',
-    'pending': 'orange',
-    'signed': 'blue',
-    'executing': 'cyan',
-    'completed': 'green',
-    'terminated': 'red'
+    未确认: 'gray',
+    待审批: 'orange',
+    已签署: 'blue',
+    执行中: 'cyan',
+    已完成: 'green',
+    已终止: 'red',
   }
   return colorMap[status] || 'gray'
 }
 
 // 获取状态文本
 const getStatusText = (status: string) => {
-  const textMap: Record<string, string> = {
-    'draft': '草稿',
-    'pending': '待审批',
-    'signed': '已签署',
-    'executing': '执行中',
-    'completed': '已完成',
-    'terminated': '已终止'
-  }
-  return textMap[status] || status
+  // 直接返回后端返回的状态文本，如果有contractStatusLabel则使用，否则使用contractStatus
+  return status || '未知状态'
 }
 
 // 搜索和重置
 const search = async () => {
-  loading.value = true
-  setTimeout(() => {
-    loading.value = false
-  }, 1000)
+  await fetchContractList()
 }
 
 const reset = () => {
@@ -243,7 +267,7 @@ const reset = () => {
     status: '',
     signDate: '',
     page: 1,
-    size: 10
+    size: 10,
   })
   pagination.current = 1
   search()
@@ -273,23 +297,33 @@ const exportContract = () => {
   Message.info('导出合同功能开发中...')
 }
 
-const viewDetail = (record: any) => {
-  Message.info(`查看合同详情: ${record.contractName}`)
+// 显示合同详情弹窗
+const showDetailModal = ref(false)
+const selectedContractId = ref<string | null>(null)
+
+const viewDetail = (record: ContractItem) => {
+  selectedContractId.value = record.contractId
+  showDetailModal.value = true
 }
 
-const editRecord = (record: any) => {
-  Message.info(`编辑合同: ${record.contractName}`)
+const closeDetailModal = () => {
+  showDetailModal.value = false
+  selectedContractId.value = null
 }
 
-const approveContract = (record: any) => {
-  Message.info(`审批合同: ${record.contractName}`)
+const editRecord = (record: ContractItem) => {
+  Message.info(`编辑合同: ${record.projectName}`)
 }
 
-const viewPayment = (record: any) => {
-  Message.info(`查看收款记录: ${record.contractName}`)
+const approveContract = (record: ContractItem) => {
+  Message.info(`审批合同: ${record.projectName}`)
+}
+
+const viewPayment = (record: ContractItem) => {
+  Message.info(`查看收款记录: ${record.projectName}`)
 }
 
 onMounted(() => {
-  search()
+  fetchContractList()
 })
-</script> 
\ No newline at end of file
+</script>