Merge branch 'devlopment' of http://pms.dtyx.net:3000/wuxueyu/Industrial-image-management-system---web into devlopment

src/apis/equipment/approval.ts

@@ -1,49 +1,70 @@
 import http from '@/utils/http'
-import type { EquipmentApprovalReq, EquipmentApprovalResp, EquipmentApprovalListReq } from './type'
+import type { EquipmentApprovalListReq, EquipmentApprovalResp } from './type'
 
 /**
- * 设备审批管理API
+ * 设备审批API
  */
 export const equipmentApprovalApi = {
   /**
    * 分页查询待审批的设备采购申请
    */
-  getPendingApprovals: (params: EquipmentApprovalListReq) => {
+  getPendingApprovals(params: EquipmentApprovalListReq) {
-    return http.get<ApiRes<PageRes<EquipmentApprovalResp>>>('/equipment/approval/pending', { params })
+    return http.get<EquipmentApprovalResp[]>('/equipment/approval/pending', params)
   },
 
   /**
    * 分页查询已审批的设备采购申请
    */
-  getApprovedApprovals: (params: EquipmentApprovalListReq) => {
+  getApprovedApprovals(params: EquipmentApprovalListReq) {
-    return http.get<ApiRes<PageRes<EquipmentApprovalResp>>>('/equipment/approval/approved', { params })
+    return http.get<EquipmentApprovalResp[]>('/equipment/approval/approved', params)
   },
 
   /**
    * 审批通过
    */
-  approve: (approvalId: string, data: EquipmentApprovalReq) => {
+  approve(approvalId: string, data: any) {
-    return http.post<ApiRes<null>>(`/equipment/approval/${approvalId}/approve`, data)
+    return http.post(`/equipment/approval/${approvalId}/approve`, data)
   },
 
   /**
    * 审批拒绝
    */
-  reject: (approvalId: string, data: EquipmentApprovalReq) => {
+  reject(approvalId: string, data: any) {
-    return http.post<ApiRes<null>>(`/equipment/approval/${approvalId}/reject`, data)
+    return http.post(`/equipment/approval/${approvalId}/reject`, data)
   },
 
   /**
    * 获取审批详情
    */
-  getApprovalDetail: (approvalId: string) => {
+  getApprovalDetail(approvalId: string) {
-    return http.get<ApiRes<EquipmentApprovalResp>>(`/equipment/approval/${approvalId}`)
+    return http.get<EquipmentApprovalResp>(`/equipment/approval/${approvalId}`)
   },
 
   /**
    * 获取审批统计信息
    */
-  getApprovalStats: () => {
+  getApprovalStats() {
-    return http.get<ApiRes<unknown>>('/equipment/approval/stats')
+    return http.get('/equipment/approval/stats')
+  },
+
+  /**
+   * 提交采购申请
+   */
+  submitProcurementApplication(data: any) {
+    return http.post('/equipment/approval/procurement/apply', data)
+  },
+
+  /**
+   * 获取我的采购申请
+   */
+  getMyProcurementApplications(params: EquipmentApprovalListReq) {
+    return http.get<EquipmentApprovalResp[]>('/equipment/approval/procurement/my-applications', params)
+  },
+
+  /**
+   * 撤回采购申请
+   */
+  withdrawProcurementApplication(approvalId: string) {
+    return http.post(`/equipment/approval/procurement/${approvalId}/withdraw`)
   }
 }

src/apis/project/personnel-dispatch.ts

@@ -0,0 +1,98 @@
+import type * as T from './type'
+import http from '@/utils/http'
+
+export type * from './type'
+
+const BASE_URL = '/project-member'
+
+// ==================== 项目看板相关接口 ====================
+
+/** @desc 获取项目看板统计数据 */
+export function getProjectKanbanStats() {
+  return http.get<T.ProjectKanbanStats>(`${BASE_URL}/kanban/stats`)
+}
+
+/** @desc 获取项目看板数据 */
+export function getProjectKanbanData() {
+  return http.get<T.ProjectKanbanData>(`${BASE_URL}/kanban/data`)
+}
+
+/** @desc 获取项目详情 */
+export function getProjectDetail(id: string | number) {
+  return http.get<T.ProjectDetailResp>(`${BASE_URL}/project/${id}/detail`)
+}
+
+// ==================== 团队成员管理 ====================
+
+/** @desc 获取项目团队成员列表（支持筛选、分页、搜索） */
+export function getProjectTeamMembers(params: T.TeamMemberQuery) {
+  const { projectId, ...queryParams } = params
+  return http.get<T.BackendTeamMemberResp[]>(`${BASE_URL}/project/${projectId}/team-members`, { params: queryParams })
+}
+
+/** @desc 创建团队成员 */
+export function createTeamMember(data: T.CreateTeamMemberForm) {
+  return http.post<T.TeamMemberResp>(`${BASE_URL}/team-member`, data)
+}
+
+/** @desc 更新团队成员信息（支持更新状态） */
+export function updateTeamMember(id: string | number, data: T.UpdateTeamMemberForm) {
+  return http.put<T.TeamMemberResp>(`${BASE_URL}/team-member/${id}`, data)
+}
+
+/** @desc 删除团队成员（支持单个或批量删除） */
+export function deleteTeamMembers(ids: string | number | (string | number)[]) {
+  const idArray = Array.isArray(ids) ? ids : [ids]
+  return http.del(`${BASE_URL}/team-member/batch`, { data: { ids: idArray } })
+}
+
+/** @desc 导入团队成员数据 */
+export function importTeamMembers(projectId: string | number, file: File) {
+  const formData = new FormData()
+  formData.append('file', file)
+  formData.append('projectId', projectId.toString())
+  return http.post(`${BASE_URL}/team-member/import`, formData, {
+    headers: {
+      'Content-Type': 'multipart/form-data'
+    }
+  })
+}
+
+/** @desc 导出团队成员数据 */
+export function exportTeamMembers(params: T.TeamMemberExportQuery) {
+  return http.get(`${BASE_URL}/team-member/export`, { 
+    params,
+    responseType: 'blob'
+  })
+}
+
+/** @desc 下载导入模板 */
+export function downloadImportTemplate() {
+  return http.get(`${BASE_URL}/team-member/template`, {
+    responseType: 'blob'
+  })
+}
+
+// ==================== 项目需求管理 ====================
+
+/** @desc 获取项目需求列表 */
+export function getProjectRequirements(projectId: string | number) {
+  return http.get<T.ProjectRequirementResp[]>(`${BASE_URL}/project/${projectId}/requirements`)
+}
+
+/** @desc 发布项目需求 */
+export function createProjectRequirement(data: T.CreateProjectRequirementForm) {
+  return http.post(`${BASE_URL}/requirement`, data)
+}
+
+/** @desc 更新项目需求状态 */
+export function updateRequirementStatus(data: T.UpdateRequirementStatusForm) {
+  return http.patch(`${BASE_URL}/requirement/status`, data)
+}
+
+/** @desc 删除项目需求 */
+export function deleteProjectRequirement(requirementId: string | number) {
+  return http.del(`${BASE_URL}/requirement/${requirementId}`)
+}
+
+ 

src/apis/project/type.ts

@@ -86,3 +86,249 @@ export interface TaskQuery {
 }
 
 export interface TaskPageQuery extends TaskQuery, PageQuery {} 
+
+// ==================== 人员调度相关类型 ====================
+
+/** 项目看板统计数据 */
+export interface ProjectKanbanStats {
+  totalProjectsCount: string
+  pendingProjectCount: string
+  inProgressProjectCount: string
+  completedProjectCount: string
+  auditedProjectCount: string
+  acceptedProjectCount: string
+  totalTurbineCount: string
+  pendingTurbineCount: string
+  inProgressTurbineCount: string
+  completedTurbineCount: string
+  auditedTurbineCount: string
+  acceptedTurbineCount: string
+  totalTaskCount: string
+  pendingTaskCount: string
+  inProgressTaskCount: string
+  completedTaskCount: string
+  totalMemberCount: string
+  projectManagerCount: string
+  safetyOfficerCount: string
+  qualityOfficerCount: string
+  constructorCount: string
+  teamLeaderCount: string
+}
+
+/** 项目看板数据 */
+export interface ProjectKanbanData {
+  inProgressProjects: never[]
+  preparingProjects: ProjectCard[]
+  ongoingProjects: ProjectCard[]
+  pendingProjects: ProjectCard[]
+}
+
+/** 项目卡片信息 */
+export interface ProjectCard {
+  id: string | number
+  name: string
+  status: 'preparing' | 'ongoing' | 'pending'
+  budget: number
+  manager: string
+  teamSize: number
+  preparationProgress?: number
+  progress?: number
+  startDate?: string
+  endDate?: string
+  plannedStartDate?: string
+  alerts?: ProjectAlert[]
+  teamMembers: TeamMemberResp[]
+  requirements: ProjectRequirementResp[]
+}
+
+/** 项目异常信息 */
+export interface ProjectAlert {
+  type: 'cost' | 'personnel' | 'schedule' | 'quality'
+  message: string
+}
+
+/** 项目详情响应 */
+export interface ProjectDetailResp extends ProjectCard {
+  // 继承ProjectCard的所有字段，可以添加更多详情字段
+}
+
+/** 团队成员响应 */
+export interface TeamMemberResp {
+  id: string | number
+  name: string
+  position: string
+  phone?: string
+  email?: string
+  avatar?: string
+  joinDate?: string
+  performance?: number
+  remark?: string
+  status?: 'available' | 'busy' | 'offline'
+}
+
+/** 后端返回的团队成员数据结构 */
+export interface BackendTeamMemberResp {
+  memberId: string
+  projectId: string
+  projectName: string
+  turbineId: string | null
+  turbineName: string | null
+  taskGroupId: string | null
+  taskGroupName: string | null
+  taskId: string | null
+  taskName: string | null
+  userId: string
+  name: string
+  phone: string | null
+  email: string | null
+  position: string
+  status: 'ACTIVE' | 'BUSY' | 'OFFLINE'
+  skills: string
+  joinDate: string
+  remark: string
+  userAccount: string
+  userAvatar: string | null
+  roleType: string
+  roleTypeDesc: string
+  jobCode: string
+  jobCodeDesc: string
+  jobDesc: string
+  leaveDate: string | null
+  statusDesc: string
+}
+
+/** 团队成员查询参数（支持筛选、分页、搜索） */
+export interface TeamMemberQuery extends PageQuery {
+  projectId: string | number
+  name?: string // 姓名搜索
+  position?: string // 岗位筛选
+  status?: string // 状态筛选
+  joinDateStart?: string // 入职日期开始
+  joinDateEnd?: string // 入职日期结束
+  sortBy?: 'name' | 'position' | 'joinDate' | 'status' // 排序字段
+  sortOrder?: 'asc' | 'desc' // 排序方向
+}
+
+/** 团队成员导出查询参数（不包含分页） */
+export interface TeamMemberExportQuery {
+  projectId: string | number
+  name?: string // 姓名搜索
+  position?: string // 岗位筛选
+  status?: string // 状态筛选
+  joinDateStart?: string // 入职日期开始
+  joinDateEnd?: string // 入职日期结束
+  sortBy?: 'name' | 'position' | 'joinDate' | 'status' // 排序字段
+  sortOrder?: 'asc' | 'desc' // 排序方向
+}
+
+/** 创建团队成员表单 */
+export interface CreateTeamMemberForm {
+  projectId: string | number
+  name: string
+  phone: string
+  email?: string
+  position: string
+  status?: 'available' | 'busy' | 'offline'
+  joinDate?: string
+  remark?: string
+}
+
+/** 更新团队成员表单 */
+export interface UpdateTeamMemberForm {
+  name?: string
+  phone?: string
+  email?: string
+  position?: string
+  status?: 'available' | 'busy' | 'offline'
+  joinDate?: string
+  remark?: string
+}
+
+
+
+/** 批量操作表单 */
+export interface BatchOperationForm {
+  ids: (string | number)[]
+  operation: 'delete' | 'updateStatus'
+  status?: 'available' | 'busy' | 'offline'
+}
+
+/** 导入结果响应 */
+export interface ImportResultResp {
+  success: boolean
+  totalCount: number
+  successCount: number
+  failCount: number
+  errors?: Array<{
+    row: number
+    message: string
+  }>
+}
+
+/** 人员需求响应 */
+export interface PersonnelRequirementResp {
+  id: string | number
+  title: string
+  type: 'personnel' | 'equipment'
+  position?: string
+  equipmentType?: string
+  count: number
+  skills: string[]
+  description?: string
+  priority: 'low' | 'medium' | 'high'
+  status: 'pending' | 'recruiting' | 'completed'
+  createTime: string
+  updateTime: string
+}
+
+/** 创建需求表单 */
+export interface CreateRequirementForm {
+  projectId: string | number
+  type: 'personnel' | 'equipment'
+  position?: string
+  equipmentType?: string
+  count: number
+  skills: string[]
+  description?: string
+  priority: 'low' | 'medium' | 'high'
+}
+
+/** 简化项目需求响应类型 */
+export interface ProjectRequirementResp {
+  id: string | number
+  title: string
+  description: string
+  priority: 'low' | 'medium' | 'high'
+  status: 'pending' | 'recruiting' | 'completed'
+  createTime: string
+  updateTime: string
+}
+
+/** 简化创建项目需求表单类型 */
+export interface CreateProjectRequirementForm {
+  projectId: string | number
+  description: string
+  priority: 'low' | 'medium' | 'high'
+}
+
+/** 更新需求状态表单 */
+export interface UpdateRequirementStatusForm {
+  requirementId: string | number
+  status: 'pending' | 'recruiting' | 'completed'
+}
+
+
+
+/** 分页查询基础参数 */
+export interface PageQuery {
+  page: number
+  pageSize: number
+}
+
+/** 分页响应 */
+export interface PageRes<T> {
+  list: T[]
+  total: number
+  page: number
+  pageSize: number
+} 

src/layout/components/HeaderRightBar/index.vue

@@ -74,9 +74,9 @@
 </template>
 
 <script setup lang="ts">
-import { Modal } from '@arco-design/web-vue'
+import { Modal, Notification } from '@arco-design/web-vue'
 import { useFullscreen } from '@vueuse/core'
-import { onMounted, ref, nextTick } from 'vue'
+import { onMounted, ref, nextTick, onBeforeUnmount } from 'vue'
 import Message from './Message.vue'
 import SettingDrawer from './SettingDrawer.vue'
 import Search from './Search.vue'
@@ -116,29 +116,61 @@ const initWebSocket = (token: string) => {
     }
     
     try {
-      socket = new WebSocket(`${import.meta.env.VITE_API_WS_URL}/websocket?token=${token}`)
+      const wsUrl = import.meta.env.VITE_API_WS_URL || 'ws://localhost:8888'
+      console.log('正在连接WebSocket:', `${wsUrl}/websocket?token=${token}`)
+      
+      socket = new WebSocket(`${wsUrl}/websocket?token=${token}`)
       
       socket.onopen = () => {
-        // console.log('WebSocket connection opened')
+        console.log('WebSocket连接成功')
       }
 
       socket.onmessage = (event) => {
-        const count = Number.parseInt(event.data)
+        console.log('收到WebSocket消息:', event.data)
-        if (!isNaN(count)) {
+        try {
-          unreadMessageCount.value = count
+          const data = JSON.parse(event.data)
+          
+          // 处理通知消息
+          if (data.type && data.title && data.content) {
+            console.log('处理通知消息:', data)
+            // 显示通知
+            Notification.info({
+              title: data.title,
+              content: data.content,
+              duration: 5000,
+              closable: true,
+              position: 'topRight'
+            })
+            
+            // 增加未读消息计数
+            unreadMessageCount.value++
+          } else {
+            // 处理简单的数字消息（兼容旧版本）
+            const count = Number.parseInt(event.data)
+            if (!isNaN(count)) {
+              unreadMessageCount.value = count
+            }
+          }
+        } catch (error) {
+          console.error('解析WebSocket消息失败:', error)
+          // 尝试解析为数字（兼容旧版本）
+          const count = Number.parseInt(event.data)
+          if (!isNaN(count)) {
+            unreadMessageCount.value = count
+          }
         }
       }
 
-      socket.onerror = () => {
+      socket.onerror = (error) => {
-        // console.error('WebSocket error:', error)
+        console.error('WebSocket连接错误:', error)
       }
 
-      socket.onclose = () => {
+      socket.onclose = (event) => {
-        // console.log('WebSocket connection closed')
+        console.log('WebSocket连接关闭:', event.code, event.reason)
         socket = null
       }
     } catch (error) {
-      console.error('Failed to create WebSocket connection:', error)
+      console.error('创建WebSocket连接失败:', error)
     }
     
     initTimer = null

src/router/route.ts

@@ -830,6 +830,29 @@ export const systemRoutes: RouteRecordRaw[] = [
           },
         ],
       },
+
+      //项目中控台
+      {
+        path: '/project-management/projects/personnel-dispatch',
+        name: 'PersonnelDispatch',
+        component: () => import('@/views/project-management/personnel-dispatch/index.vue'),
+        meta: {
+          title: '项目中控台',
+          icon: 'user-group',
+          hidden: false,
+        },
+      },
+      
+      {
+        path: '/project-management/personnel-dispatch/construction-personnel',
+        name: 'ConstructionPersonnel',
+        component: () => import('@/views/project-management/personnel-dispatch/construction-personnel.vue'),
+        meta: {
+          title: '团队成员管理',
+          icon: 'user',
+          hidden: true,
+        },
+      },
     ],
   },
 

src/types/components.d.ts

@@ -7,66 +7,7 @@ export {}
 
 declare module 'vue' {
   export interface GlobalComponents {
-    Avatar: typeof import('./../components/Avatar/index.vue')['default']
-    Breadcrumb: typeof import('./../components/Breadcrumb/index.vue')['default']
-    CellCopy: typeof import('./../components/CellCopy/index.vue')['default']
-    Chart: typeof import('./../components/Chart/index.vue')['default']
-    ColumnSetting: typeof import('./../components/GiTable/src/components/ColumnSetting.vue')['default']
-    CronForm: typeof import('./../components/GenCron/CronForm/index.vue')['default']
-    CronModal: typeof import('./../components/GenCron/CronModal/index.vue')['default']
-    DateRangePicker: typeof import('./../components/DateRangePicker/index.vue')['default']
-    DayForm: typeof import('./../components/GenCron/CronForm/component/day-form.vue')['default']
-    FilePreview: typeof import('./../components/FilePreview/index.vue')['default']
-    GiCellAvatar: typeof import('./../components/GiCell/GiCellAvatar.vue')['default']
-    GiCellGender: typeof import('./../components/GiCell/GiCellGender.vue')['default']
-    GiCellStatus: typeof import('./../components/GiCell/GiCellStatus.vue')['default']
-    GiCellTag: typeof import('./../components/GiCell/GiCellTag.vue')['default']
-    GiCellTags: typeof import('./../components/GiCell/GiCellTags.vue')['default']
-    GiCodeView: typeof import('./../components/GiCodeView/index.vue')['default']
-    GiDot: typeof import('./../components/GiDot/index.tsx')['default']
-    GiEditTable: typeof import('./../components/GiEditTable/GiEditTable.vue')['default']
-    GiFooter: typeof import('./../components/GiFooter/index.vue')['default']
-    GiForm: typeof import('./../components/GiForm/src/GiForm.vue')['default']
-    GiIconBox: typeof import('./../components/GiIconBox/index.vue')['default']
-    GiIconSelector: typeof import('./../components/GiIconSelector/index.vue')['default']
-    GiIframe: typeof import('./../components/GiIframe/index.vue')['default']
-    GiOption: typeof import('./../components/GiOption/index.vue')['default']
-    GiOptionItem: typeof import('./../components/GiOptionItem/index.vue')['default']
-    GiPageLayout: typeof import('./../components/GiPageLayout/index.vue')['default']
-    GiSpace: typeof import('./../components/GiSpace/index.vue')['default']
-    GiSplitButton: typeof import('./../components/GiSplitButton/index.vue')['default']
-    GiSplitPane: typeof import('./../components/GiSplitPane/index.vue')['default']
-    GiSplitPaneFlexibleBox: typeof import('./../components/GiSplitPane/components/GiSplitPaneFlexibleBox.vue')['default']
-    GiSvgIcon: typeof import('./../components/GiSvgIcon/index.vue')['default']
-    GiTable: typeof import('./../components/GiTable/src/GiTable.vue')['default']
-    GiTag: typeof import('./../components/GiTag/index.tsx')['default']
-    GiThemeBtn: typeof import('./../components/GiThemeBtn/index.vue')['default']
-    HourForm: typeof import('./../components/GenCron/CronForm/component/hour-form.vue')['default']
-    Icon403: typeof import('./../components/icons/Icon403.vue')['default']
-    Icon404: typeof import('./../components/icons/Icon404.vue')['default']
-    Icon500: typeof import('./../components/icons/Icon500.vue')['default']
-    IconBorders: typeof import('./../components/icons/IconBorders.vue')['default']
-    IconTableSize: typeof import('./../components/icons/IconTableSize.vue')['default']
-    IconTreeAdd: typeof import('./../components/icons/IconTreeAdd.vue')['default']
-    IconTreeReduce: typeof import('./../components/icons/IconTreeReduce.vue')['default']
-    ImageImport: typeof import('./../components/ImageImport/index.vue')['default']
-    ImageImportWizard: typeof import('./../components/ImageImportWizard/index.vue')['default']
-    IndustrialImageList: typeof import('./../components/IndustrialImageList/index.vue')['default']
-    JsonPretty: typeof import('./../components/JsonPretty/index.vue')['default']
-    MinuteForm: typeof import('./../components/GenCron/CronForm/component/minute-form.vue')['default']
-    MonthForm: typeof import('./../components/GenCron/CronForm/component/month-form.vue')['default']
-    ParentView: typeof import('./../components/ParentView/index.vue')['default']
     RouterLink: typeof import('vue-router')['RouterLink']
     RouterView: typeof import('vue-router')['RouterView']
-    SecondForm: typeof import('./../components/GenCron/CronForm/component/second-form.vue')['default']
-    SplitPanel: typeof import('./../components/SplitPanel/index.vue')['default']
-    TextCopy: typeof import('./../components/TextCopy/index.vue')['default']
-    TurbineGrid: typeof import('./../components/TurbineGrid/index.vue')['default']
-    UserSelect: typeof import('./../components/UserSelect/index.vue')['default']
-    Verify: typeof import('./../components/Verify/index.vue')['default']
-    VerifyPoints: typeof import('./../components/Verify/Verify/VerifyPoints.vue')['default']
-    VerifySlide: typeof import('./../components/Verify/Verify/VerifySlide.vue')['default']
-    WeekForm: typeof import('./../components/GenCron/CronForm/component/week-form.vue')['default']
-    YearForm: typeof import('./../components/GenCron/CronForm/component/year-form.vue')['default']
   }
 }

src/types/env.d.ts

@@ -4,6 +4,7 @@
 interface ImportMetaEnv {
   readonly VITE_API_PREFIX: string
   readonly VITE_API_BASE_URL: string
+  readonly VITE_API_WS_URL: string
   readonly VITE_BASE: string
   readonly VITE_APP_SETTING: string
   readonly VITE_CLIENT_ID: string

src/utils/http.ts

@@ -225,7 +225,3 @@ export default {
   requestRaw,
   download,
 }
-
-export const updateContract = (contractId, contractData) => {
-  return http.put(`/contract/${contractId}`, contractData)
-}

src/views/project-management/contract/revenue-contract/ContractEdit.vue

@@ -0,0 +1,122 @@
+<template>
+  <a-form :model="contractData" layout="vertical">
+    <a-row :gutter="16">
+      <a-col :span="12">
+        <a-form-item field="code" label="合同编号">
+          <a-input v-model="contractData.code" />
+        </a-form-item>
+      </a-col>
+      <a-col :span="12">
+        <a-form-item field="projectName" label="项目名称">
+          <a-input v-model="contractData.projectName" />
+        </a-form-item>
+      </a-col>
+    </a-row>
+
+    <a-row :gutter="16">
+      <a-col :span="12">
+        <a-form-item field="customer" label="客户名称">
+          <a-input v-model="contractData.customer" />
+        </a-form-item>
+      </a-col>
+      <a-col :span="12">
+        <a-form-item field="amount" label="合同金额">
+          <a-input-number v-model="contractData.amount" style="width: 100%" />
+        </a-form-item>
+      </a-col>
+    </a-row>
+
+    <a-row :gutter="16">
+      <a-col :span="12">
+        <a-form-item field="accountNumber" label="收款账号">
+          <a-input v-model="contractData.accountNumber" />
+        </a-form-item>
+      </a-col>
+      <a-col :span="12">
+        <a-form-item field="contractStatus" label="合同状态">
+          <a-select v-model="contractData.contractStatus">
+            <a-option value="未确认">未确认</a-option>
+            <a-option value="待审批">待审批</a-option>
+            <a-option value="已签署">已签署</a-option>
+            <a-option value="执行中">执行中</a-option>
+            <a-option value="已完成">已完成</a-option>
+            <a-option value="已终止">已终止</a-option>
+          </a-select>
+        </a-form-item>
+      </a-col>
+    </a-row>
+
+    <a-row :gutter="16">
+      <a-col :span="12">
+        <a-form-item field="signDate" label="签订日期">
+          <a-date-picker v-model="contractData.signDate" style="width: 100%" />
+        </a-form-item>
+      </a-col>
+      <a-col :span="12">
+        <a-form-item field="performanceDeadline" label="履约期限">
+          <a-date-picker v-model="contractData.performanceDeadline" style="width: 100%" />
+        </a-form-item>
+      </a-col>
+    </a-row>
+
+    <a-row :gutter="16">
+      <a-col :span="12">
+        <a-form-item field="paymentDate" label="付款日期">
+          <a-date-picker v-model="contractData.paymentDate" style="width: 100%" />
+        </a-form-item>
+      </a-col>
+      <a-col :span="12">
+        <a-form-item field="productService" label="产品或服务">
+          <a-input v-model="contractData.productService" />
+        </a-form-item>
+      </a-col>
+    </a-row>
+
+    <a-form-item field="paymentAddress" label="付款地址">
+      <a-input v-model="contractData.paymentAddress" />
+    </a-form-item>
+
+    <a-form-item field="notes" label="备注">
+      <a-textarea v-model="contractData.notes" />
+    </a-form-item>
+
+    <a-form-item field="contractText" label="合同内容">
+      <a-textarea v-model="contractData.contractText" />
+    </a-form-item>
+  </a-form>
+</template>
+
+<script setup lang="ts">
+import { ref, watch } from 'vue'
+import type { ContractItem } from './index.vue'
+
+const props = defineProps<{
+  contractData: ContractItem
+}>()
+
+const emit = defineEmits<{
+  (e: 'update:contractData', data: ContractItem): void
+}>()
+
+const contractData = ref({ ...props.contractData })
+
+// 监听props变化更新内部数据
+watch(
+  () => props.contractData,
+  (newVal) => {
+    if (newVal) {
+      contractData.value = { ...newVal }
+    }
+  },
+  { immediate: true },
+)
+
+// 监听内部数据变化并触发更新事件
+watch(
+  contractData,
+  (newVal) => {
+    emit('update:contractData', newVal)
+  },
+  { deep: true },
+)
+</script>

src/views/project-management/contract/revenue-contract/index.vue

@@ -1,25 +1,25 @@
 <template>
   <GiPageLayout>
     <GiTable
-        row-key="id"
+      row-key="id"
-        title="收入合同管理"
+      title="收入合同管理"
-        :data="dataList"
+      :data="dataList"
-        :columns="tableColumns"
+      :columns="tableColumns"
-        :loading="loading"
+      :loading="loading"
-        :scroll="{ x: '100%', y: '100%', minWidth: 1600 }"
+      :scroll="{ x: '100%', y: '100%', minWidth: 1600 }"
-        :pagination="pagination"
+      :pagination="pagination"
-        @page-change="onPageChange"
+      @page-change="onPageChange"
-        @page-size-change="onPageSizeChange"
+      @page-size-change="onPageSizeChange"
-        @refresh="search"
+      @refresh="search"
     >
       <template #top>
         <GiForm
-            v-model="searchForm"
+          v-model="searchForm"
-            search
+          search
-            :columns="queryFormColumns"
+          :columns="queryFormColumns"
-            size="medium"
+          size="medium"
-            @search="search"
+          @search="search"
-            @reset="reset"
+          @reset="reset"
         />
       </template>
 
@@ -53,36 +53,53 @@
         <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 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-link v-if="record.contractStatus !== '已签署' && record.contractStatus !== '已完成'" @click="deleteContract(record)">删除</a-link>
         </a-space>
       </template>
     </GiTable>
 
     <!-- 合同详情弹窗 -->
     <a-modal
-        v-model:visible="showDetailModal"
+      v-model:visible="showDetailModal"
-        title="合同详情"
+      title="合同详情"
-        :width="800"
+      :width="800"
-        @cancel="closeDetailModal"
+      :footer="false"
-        :footer="false"
+      @cancel="closeDetailModal"
     >
       <ContractDetail v-if="showDetailModal" :contract-id="selectedContractId" />
     </a-modal>
+
+    <!-- 合同编辑弹窗 -->
+    <a-modal
+      v-model:visible="showEditModal"
+      title="编辑合同"
+      :width="800"
+      @cancel="closeEditModal"
+      @before-ok="handleEditSubmit"
+    >
+      <ContractEdit
+        v-if="showEditModal"
+        :contract-data="selectedContractData"
+        @update:contract-data="handleContractDataUpdate"
+      />
+    </a-modal>
   </GiPageLayout>
 </template>
 
 <script setup lang="ts">
-import { ref, reactive, onMounted } from 'vue'
+import { onMounted, reactive, ref } from 'vue'
 import { Message, Modal } from '@arco-design/web-vue'
 import type { TableColumnData } from '@arco-design/web-vue'
-import http from '@/utils/http'
+import ContractEdit from './ContractEdit.vue'
+
 import ContractDetail from './ContractDetail.vue'
+import http from '@/utils/http'
 
 // 接口数据类型定义
 interface ContractItem {
@@ -181,7 +198,6 @@ const tableColumns: TableColumnData[] = [
   { title: '备注', dataIndex: 'notes', width: 200, ellipsis: true, tooltip: true },
   { title: '操作', slotName: 'action', width: 200, fixed: 'right' },
 ]
-
 // 数据状态
 const loading = ref(false)
 const dataList = ref<ContractItem[]>([])
@@ -297,6 +313,108 @@ const exportContract = () => {
   Message.info('导出合同功能开发中...')
 }
 
+// 显示合同编辑弹窗
+const showEditModal = ref(false)
+const selectedContractData = ref<ContractItem | null>(null)
+const editedContractData = ref<ContractItem | null>(null)
+
+const editRecord = (record: ContractItem) => {
+  // 确保所有必要的字段都存在
+  const completeRecord = {
+    ...record,
+    amount: record.amount || 0,
+    projectId: record.projectId || '',
+    type: record.type || '收入合同',
+    contractStatus: record.contractStatus || '未确认',
+  }
+
+  selectedContractData.value = completeRecord
+  showEditModal.value = true
+}
+
+const closeEditModal = () => {
+  showEditModal.value = false
+  selectedContractData.value = null
+  editedContractData.value = null
+}
+
+const handleContractDataUpdate = (data: ContractItem) => {
+  editedContractData.value = data
+}
+
+const handleEditSubmit = async () => {
+  if (!editedContractData.value) return false;
+
+  try {
+    const requestData = {
+      ...editedContractData.value,
+      accountNumber: editedContractData.value.accountNumber || '',
+      amount: editedContractData.value.amount || 0,
+      code: editedContractData.value.code || '',
+      contractId: editedContractData.value.contractId,
+      contractStatus: editedContractData.value.contractStatus || '',
+      contractText: editedContractData.value.contractText || '',
+      customer: editedContractData.value.customer || '',
+      departmentId: editedContractData.value.departmentId || '',
+      duration: editedContractData.value.duration || '',
+      notes: editedContractData.value.notes || '',
+      paymentAddress: editedContractData.value.paymentAddress || '',
+      paymentDate: editedContractData.value.paymentDate || null,
+      performanceDeadline: editedContractData.value.performanceDeadline || null,
+      productService: editedContractData.value.productService || '',
+      projectId: editedContractData.value.projectId || '',
+      salespersonId: editedContractData.value.salespersonId || '',
+      signDate: editedContractData.value.signDate || null,
+      type: editedContractData.value.type || '',
+    };
+
+    console.log('Edited Contract Data:', requestData); // 打印请求数据以便调试
+
+    // 修改此处，直接向 /contract 发送 PUT 请求
+    const response = await http.put('/contract', requestData);
+
+    // 检查响应状态
+    if (response.status === 200 && response.code === 200) {
+      Message.success('合同编辑成功');
+      closeEditModal();
+      search(); // 刷新列表
+      return true;
+    } else {
+      Message.error(response.msg || '合同编辑失败');
+      return false;
+    }
+  } catch (error) {
+    console.error('合同编辑失败:', error);
+    Message.error('合同编辑失败: ' + (error.message || '请稍后再试'));
+    return false;
+  }
+}
+
+
+// 删除合同
+const deleteContract = async (record: ContractItem) => {
+  try {
+    await Modal.confirm({
+      title: '确认删除',
+      content: `确定要删除合同 "${record.projectName}" 吗？`,
+    })
+
+    const response = await http.delete(`/contract/${record.contractId}`)
+    if (response.code === 200) {
+      Message.success('合同删除成功')
+      search() // 刷新列表
+    } else {
+      Message.error(response.msg || '合同删除失败')
+    }
+  } catch (error) {
+    // 用户取消删除或请求失败
+    if (error !== 'cancel') {
+      console.error('合同删除失败:', error)
+      Message.error('合同删除失败')
+    }
+  }
+}
+
 // 显示合同详情弹窗
 const showDetailModal = ref(false)
 const selectedContractId = ref<string | null>(null)
@@ -311,10 +429,6 @@ const closeDetailModal = () => {
   selectedContractId.value = null
 }
 
-const editRecord = (record: ContractItem) => {
-  Message.info(`编辑合同: ${record.projectName}`)
-}
-
 const approveContract = (record: ContractItem) => {
   Message.info(`审批合同: ${record.projectName}`)
 }

src/views/project-management/personnel-dispatch/construction-personnel.vue

@@ -0,0 +1,952 @@
+<!--
+  团队成员管理页面
+  功能特性:
+  1. 团队成员列表展示
+  2. 新增团队成员
+  3. 编辑团队成员信息
+  4. 删除团队成员
+  5. 导入导出团队成员数据
+-->
+<template>
+  <GiPageLayout>
+    <!-- 页面头部 -->
+    <div class="page-header">
+      <div class="header-left">
+        <a-button @click="$router.back()" class="back-btn">
+          <template #icon><icon-left /></template>
+          返回
+        </a-button>
+        <div class="header-title">
+          <icon-user-group class="title-icon" />
+          <h1>团队成员管理</h1>
+          <span v-if="projectId" class="project-info">项目ID: {{ projectId }}</span>
+        </div>
+      </div>
+      <div class="header-actions">
+        <a-button type="primary" @click="openAddModal">
+          <template #icon><icon-plus /></template>
+          新增成员
+        </a-button>
+        <a-button @click="openImportModal">
+          <template #icon><icon-upload /></template>
+          导入
+        </a-button>
+        <a-button @click="exportData">
+          <template #icon><icon-download /></template>
+          导出
+        </a-button>
+      </div>
+    </div>
+
+    <!-- 简洁搜索区域 -->
+    <div class="search-section">
+      <a-card :bordered="false" class="search-card">
+        <a-form layout="inline" :model="searchForm">
+          <a-form-item label="姓名">
+            <a-input 
+              v-model="searchForm.name" 
+              placeholder="请输入姓名" 
+              style="width: 180px"
+              allow-clear
+              @press-enter="handleSearch"
+            />
+          </a-form-item>
+          <a-form-item label="岗位">
+            <a-select 
+              v-model="searchForm.position" 
+              placeholder="请选择岗位" 
+              style="width: 150px"
+              allow-clear
+            >
+              <a-option 
+                v-for="option in POSITION_OPTIONS" 
+                :key="option.value" 
+                :value="option.value"
+              >
+                {{ option.label }}
+              </a-option>
+            </a-select>
+          </a-form-item>
+          <a-form-item label="状态">
+            <a-select 
+              v-model="searchForm.status" 
+              placeholder="请选择状态" 
+              style="width: 120px"
+              allow-clear
+            >
+              <a-option 
+                v-for="option in STATUS_OPTIONS" 
+                :key="option.value" 
+                :value="option.value"
+              >
+                {{ option.label }}
+              </a-option>
+            </a-select>
+          </a-form-item>
+          <a-form-item>
+            <a-space>
+              <a-button type="primary" @click="handleSearch">
+                <template #icon><icon-search /></template>
+                搜索
+              </a-button>
+              <a-button @click="handleReset">
+                <template #icon><icon-refresh /></template>
+                重置
+              </a-button>
+            </a-space>
+          </a-form-item>
+        </a-form>
+      </a-card>
+    </div>
+
+    <!-- 数据表格 -->
+    <GiTable
+      row-key="id"
+      :data="dataList"
+      :columns="tableColumns"
+      :loading="loading"
+      :scroll="{ x: '100%', minWidth: 1200 }"
+      :pagination="pagination"
+      :disabled-tools="['size']"
+      @page-change="onPageChange"
+      @page-size-change="onPageSizeChange"
+      @refresh="loadData"
+    >
+      <!-- 状态列 -->
+      <template #status="{ record }">
+        <a-tag :color="getStatusColor(record.status || 'offline')">
+          {{ getStatusText(record.status || 'offline') }}
+        </a-tag>
+      </template>
+
+
+
+      <!-- 备注列 -->
+      <template #remark="{ record }">
+        <div class="remark-content" v-if="record.remark">
+          {{ record.remark }}
+        </div>
+        <span v-else class="no-remark">暂无备注</span>
+      </template>
+
+      <!-- 操作列 -->
+      <template #action="{ record }">
+        <a-space>
+          <a-link title="编辑" @click="openEditModal(record)">编辑</a-link>
+          <a-link title="状态调整" @click="openStatusModal(record)">状态</a-link>
+          <a-link status="danger" title="删除" @click="confirmDelete(record)">删除</a-link>
+        </a-space>
+      </template>
+    </GiTable>
+
+    <!-- 新增/编辑弹窗 -->
+    <a-modal
+      v-model:visible="memberModalVisible"
+      :title="isEdit ? '编辑团队成员' : '新增团队成员'"
+      width="600px"
+      @ok="saveMember"
+      @cancel="cancelMember"
+    >
+      <div class="member-form">
+        <div class="form-row">
+          <div class="form-item">
+            <label>姓名 <span class="required">*</span></label>
+            <a-input v-model="memberForm.name" placeholder="请输入姓名" />
+          </div>
+          <div class="form-item">
+            <label>联系电话 <span class="required">*</span></label>
+            <a-input v-model="memberForm.phone" placeholder="请输入联系电话" />
+          </div>
+        </div>
+        <div class="form-row">
+          <div class="form-item">
+            <label>岗位 <span class="required">*</span></label>
+            <a-select v-model="memberForm.position" placeholder="请选择岗位">
+              <a-option 
+                v-for="option in POSITION_OPTIONS" 
+                :key="option.value" 
+                :value="option.value"
+              >
+                {{ option.label }}
+              </a-option>
+            </a-select>
+          </div>
+          <div class="form-item">
+            <label>状态</label>
+            <a-select v-model="memberForm.status" placeholder="请选择状态">
+              <a-option 
+                v-for="option in STATUS_OPTIONS" 
+                :key="option.value" 
+                :value="option.value"
+              >
+                {{ option.label }}
+              </a-option>
+            </a-select>
+          </div>
+        </div>
+        <div class="form-row">
+          <div class="form-item">
+            <label>邮箱</label>
+            <a-input v-model="memberForm.email" placeholder="请输入邮箱" />
+          </div>
+          <div class="form-item">
+            <label>入职日期</label>
+            <a-date-picker v-model="memberForm.joinDate" placeholder="请选择入职日期" />
+          </div>
+        </div>
+
+        <div class="form-item">
+          <label>备注信息</label>
+          <a-textarea 
+            v-model="memberForm.remark" 
+            placeholder="请输入备注信息，格式：主要负责：项目经理，次要负责：安全员等"
+            :rows="3"
+          />
+        </div>
+      </div>
+    </a-modal>
+
+    <!-- 状态调整弹窗 -->
+    <a-modal
+      v-model:visible="statusModalVisible"
+      title="调整状态"
+      width="400px"
+      @ok="saveStatus"
+      @cancel="cancelStatus"
+    >
+      <div class="status-form">
+        <div class="form-item">
+          <label>成员姓名:</label>
+          <span>{{ statusForm.name }}</span>
+        </div>
+        <div class="form-item">
+          <label>当前状态:</label>
+          <span>{{ getStatusText(statusForm.currentStatus) }}</span>
+        </div>
+        <div class="form-item">
+          <label>新状态:</label>
+          <a-select v-model="statusForm.newStatus" placeholder="请选择新状态">
+            <a-option 
+              v-for="option in STATUS_OPTIONS" 
+              :key="option.value" 
+              :value="option.value"
+            >
+              {{ option.label }}
+            </a-option>
+          </a-select>
+        </div>
+      </div>
+    </a-modal>
+
+    <!-- 导入弹窗 -->
+    <a-modal
+      v-model:visible="importModalVisible"
+      title="导入团队成员"
+      width="500px"
+      @ok="confirmImport"
+      @cancel="cancelImport"
+    >
+      <div class="import-form">
+        <div class="form-item">
+          <label>选择文件:</label>
+          <a-upload
+            v-model:file-list="fileList"
+            :custom-request="customUpload"
+            :show-file-list="true"
+            accept=".xlsx,.xls,.csv"
+            :limit="1"
+          >
+            <a-button>
+              <template #icon><icon-upload /></template>
+              选择文件
+            </a-button>
+          </a-upload>
+        </div>
+        <div class="form-item">
+          <label>下载模板:</label>
+          <a-button type="text" @click="downloadTemplate">
+            <template #icon><icon-download /></template>
+            下载导入模板
+          </a-button>
+        </div>
+      </div>
+    </a-modal>
+  </GiPageLayout>
+</template>
+
+<script setup lang="ts">
+import { ref, reactive, onMounted } from 'vue'
+import { Message, Modal } from '@arco-design/web-vue'
+import { useRoute } from 'vue-router'
+import type { TeamMemberResp, TeamMemberQuery, TeamMemberExportQuery, CreateTeamMemberForm, UpdateTeamMemberForm, BackendTeamMemberResp } from '@/apis/project/type'
+import { 
+  getProjectTeamMembers, 
+  createTeamMember, 
+  updateTeamMember, 
+  deleteTeamMembers,
+  importTeamMembers,
+  exportTeamMembers,
+  downloadImportTemplate
+} from '@/apis/project/personnel-dispatch'
+
+// 获取路由参数
+const route = useRoute()
+const projectId = route.query.projectId as string
+
+// 选项数据常量
+const POSITION_OPTIONS = [
+  { label: '项目经理', value: '项目经理' },
+  { label: '技术负责人', value: '技术负责人' },
+  { label: '安全员', value: '安全员' },
+  { label: '质量员', value: '质量员' },
+  { label: '施工员', value: '施工员' },
+  { label: '材料员', value: '材料员' },
+  { label: '资料员', value: '资料员' },
+  { label: '实习生', value: '实习生' },
+  { label: '技术工人', value: '技术工人' },
+  { label: '普通工人', value: '普通工人' }
+]
+
+const STATUS_OPTIONS = [
+  { label: '可用', value: 'available' },
+  { label: '忙碌', value: 'busy' },
+  { label: '离线', value: 'offline' }
+]
+
+// 响应式数据
+const loading = ref(false)
+const dataList = ref<TeamMemberResp[]>([])
+const pagination = reactive({
+  current: 1,
+  pageSize: 10,
+  total: 0,
+  showTotal: true,
+  showJumper: true,
+  showPageSize: true
+})
+
+// 搜索表单
+const searchForm = reactive<{
+  name: string
+  position: string
+  status: string
+}>({
+  name: '',
+  position: '',
+  status: ''
+})
+
+// 表格列配置
+const tableColumns = [
+  { title: '姓名', dataIndex: 'name', width: 100, fixed: 'left' },
+  { title: '联系电话', dataIndex: 'phone', width: 120 },
+  { title: '邮箱', dataIndex: 'email', width: 150 },
+  { title: '项目岗位', dataIndex: 'position', width: 120 },
+  { title: '状态', dataIndex: 'status', width: 100, slotName: 'status' },
+  { title: '入职日期', dataIndex: 'joinDate', width: 120 },
+  { title: '备注', dataIndex: 'remark', width: 200, slotName: 'remark' },
+  { title: '操作', dataIndex: 'action', width: 180, fixed: 'right', slotName: 'action' }
+]
+
+// 弹窗状态
+const memberModalVisible = ref(false)
+const statusModalVisible = ref(false)
+const importModalVisible = ref(false)
+const isEdit = ref(false)
+
+// 表单数据
+const memberForm = reactive<CreateTeamMemberForm & { id?: string | number }>({
+  projectId: projectId,
+  name: '',
+  phone: '',
+  email: '',
+  position: '',
+  status: 'available',
+  joinDate: '',
+  remark: ''
+})
+
+const statusForm = reactive<{
+  id: string | number
+  name: string
+  currentStatus: string
+  newStatus: 'available' | 'busy' | 'offline'
+}>({
+  id: '',
+  name: '',
+  currentStatus: '',
+  newStatus: 'available'
+})
+
+const fileList = ref<any[]>([])
+
+// 方法
+const loadData = async () => {
+  if (!projectId) {
+    console.warn('未获取到项目ID，无法加载团队成员数据')
+    Message.warning('未获取到项目信息，请从项目详情页面进入')
+    return
+  }
+
+  loading.value = true
+  try {
+    console.log('正在加载项目团队成员数据，项目ID:', projectId)
+    
+    // 构建查询参数
+    const queryParams: TeamMemberQuery = {
+      projectId: projectId,
+      page: pagination.current,
+      pageSize: pagination.pageSize,
+      name: searchForm.name || undefined,
+      position: searchForm.position || undefined,
+      status: searchForm.status || undefined
+    }
+    
+    const response = await getProjectTeamMembers(queryParams)
+    
+    console.log('API响应数据:', response.data)
+    
+    // 确保response.data是数组
+    const rawData = Array.isArray(response.data) ? response.data : [response.data]
+    
+    console.log('处理后的原始数据:', rawData)
+    
+    // 处理后端返回的数据，将后端字段映射到前端期望的字段
+    const mappedData = rawData.map((item: BackendTeamMemberResp) => {
+      const mappedItem: TeamMemberResp = {
+        id: item.memberId,
+        name: item.name || '',
+        phone: item.phone || '',
+        email: item.email || '',
+        position: item.position || '',
+        status: (item.status === 'ACTIVE' ? 'available' : item.status === 'BUSY' ? 'busy' : 'offline') as 'available' | 'busy' | 'offline',
+        joinDate: item.joinDate || '',
+        remark: item.remark || '',
+        avatar: item.userAvatar || ''
+      }
+      console.log('映射后的数据项:', mappedItem)
+      return mappedItem
+    })
+    
+    dataList.value = mappedData
+    pagination.total = mappedData.length
+    
+    console.log('团队成员数据加载完成，显示数据:', dataList.value.length, '条，总计:', pagination.total, '条')
+    
+  } catch (error) {
+    console.error('团队成员数据加载失败:', error)
+    Message.error('团队成员数据加载失败')
+  } finally {
+    loading.value = false
+  }
+}
+
+const handleSearch = async () => {
+  pagination.current = 1
+  await loadData()
+}
+
+const handleReset = () => {
+  console.log('重置搜索表单')
+  Object.assign(searchForm, {
+    name: '',
+    position: '',
+    status: ''
+  })
+  pagination.current = 1
+  loadData()
+}
+
+const onPageChange = (page: number) => {
+  pagination.current = page
+  loadData()
+}
+
+const onPageSizeChange = (pageSize: number) => {
+  pagination.pageSize = pageSize
+  pagination.current = 1
+  loadData()
+}
+
+const openAddModal = () => {
+  isEdit.value = false
+  resetMemberForm()
+  memberModalVisible.value = true
+}
+
+const openEditModal = (record: TeamMemberResp) => {
+  isEdit.value = true
+  Object.assign(memberForm, {
+    id: record.id,
+    projectId: projectId,
+    name: record.name,
+    phone: record.phone || '',
+    email: record.email || '',
+    position: record.position,
+    status: record.status || 'available',
+    joinDate: record.joinDate || '',
+    remark: record.remark || ''
+  })
+  memberModalVisible.value = true
+}
+
+const saveMember = async () => {
+  if (!memberForm.name || !memberForm.phone || !memberForm.position) {
+    Message.error('请填写必填项')
+    return
+  }
+
+  try {
+    if (isEdit.value && memberForm.id) {
+      // 更新团队成员
+      const updateData: UpdateTeamMemberForm = {
+        name: memberForm.name,
+        phone: memberForm.phone,
+        email: memberForm.email,
+        position: memberForm.position,
+        status: memberForm.status,
+        joinDate: memberForm.joinDate,
+        remark: memberForm.remark
+      }
+      await updateTeamMember(memberForm.id, updateData)
+      Message.success('更新成功')
+    } else {
+      // 创建团队成员
+      const createData: CreateTeamMemberForm = {
+        projectId: projectId,
+        name: memberForm.name,
+        phone: memberForm.phone,
+        email: memberForm.email,
+        position: memberForm.position,
+        status: memberForm.status,
+        joinDate: memberForm.joinDate,
+        remark: memberForm.remark
+      }
+      await createTeamMember(createData)
+      Message.success('添加成功')
+    }
+    
+    memberModalVisible.value = false
+    loadData()
+  } catch (error) {
+    console.error('保存团队成员失败:', error)
+    Message.error(isEdit.value ? '更新失败' : '添加失败')
+  }
+}
+
+const cancelMember = () => {
+  memberModalVisible.value = false
+  resetMemberForm()
+}
+
+const resetMemberForm = () => {
+  Object.assign(memberForm, {
+    id: undefined,
+    projectId: projectId,
+    name: '',
+    phone: '',
+    email: '',
+    position: '',
+    status: 'available',
+    joinDate: '',
+    remark: ''
+  })
+}
+
+const openStatusModal = (record: TeamMemberResp) => {
+  Object.assign(statusForm, {
+    id: record.id,
+    name: record.name,
+    currentStatus: record.status || 'available',
+    newStatus: record.status || 'available'
+  })
+  statusModalVisible.value = true
+}
+
+const saveStatus = async () => {
+  try {
+    await updateTeamMember(statusForm.id, { 
+      status: statusForm.newStatus as 'available' | 'busy' | 'offline' 
+    })
+    Message.success('状态更新成功')
+    statusModalVisible.value = false
+    loadData()
+  } catch (error) {
+    console.error('状态更新失败:', error)
+    Message.error('状态更新失败')
+  }
+}
+
+const cancelStatus = () => {
+  statusModalVisible.value = false
+}
+
+const confirmDelete = (record: TeamMemberResp) => {
+  Modal.confirm({
+    title: '确认删除',
+    content: `确定要删除团队成员"${record.name}"吗？`,
+    onOk: async () => {
+      try {
+        await deleteTeamMembers(record.id)
+        Message.success('删除成功')
+        loadData()
+      } catch (error) {
+        console.error('删除失败:', error)
+        Message.error('删除失败')
+      }
+    }
+  })
+}
+
+const openImportModal = () => {
+  importModalVisible.value = true
+}
+
+const customUpload = (options: any) => {
+  const { file } = options
+  fileList.value = [file]
+}
+
+const confirmImport = async () => {
+  if (fileList.value.length === 0) {
+    Message.error('请选择要导入的文件')
+    return
+  }
+
+  try {
+    const file = fileList.value[0].originFileObj
+    await importTeamMembers(projectId, file)
+    Message.success('导入成功')
+    importModalVisible.value = false
+    fileList.value = []
+    loadData()
+  } catch (error) {
+    console.error('导入失败:', error)
+    Message.error('导入失败')
+  }
+}
+
+const cancelImport = () => {
+  importModalVisible.value = false
+  fileList.value = []
+}
+
+const downloadTemplate = async () => {
+  try {
+    const response = await downloadImportTemplate()
+    const blob = new Blob([response.data], { 
+      type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' 
+    })
+    const url = window.URL.createObjectURL(blob)
+    const link = document.createElement('a')
+    link.href = url
+    link.download = '团队成员导入模板.xlsx'
+    link.click()
+    window.URL.revokeObjectURL(url)
+    Message.success('模板下载成功')
+  } catch (error) {
+    console.error('模板下载失败:', error)
+    Message.error('模板下载失败')
+  }
+}
+
+const exportData = async () => {
+  try {
+    const queryParams: TeamMemberExportQuery = {
+      projectId: projectId,
+      name: searchForm.name || undefined,
+      position: searchForm.position || undefined,
+      status: searchForm.status || undefined
+    }
+    
+    const response = await exportTeamMembers(queryParams)
+    const blob = new Blob([response.data], { 
+      type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' 
+    })
+    const url = window.URL.createObjectURL(blob)
+    const link = document.createElement('a')
+    link.href = url
+    link.download = `团队成员数据_${new Date().toISOString().split('T')[0]}.xlsx`
+    link.click()
+    window.URL.revokeObjectURL(url)
+    Message.success('导出成功')
+  } catch (error) {
+    console.error('导出失败:', error)
+    Message.error('导出失败')
+  }
+}
+
+// 工具方法
+const getStatusColor = (status: string) => {
+  const colorMap: Record<string, string> = {
+    available: 'green',
+    busy: 'orange',
+    offline: 'gray'
+  }
+  return colorMap[status] || 'gray'
+}
+
+const getStatusText = (status: string) => {
+  const textMap: Record<string, string> = {
+    available: '可用',
+    busy: '忙碌',
+    offline: '离线'
+  }
+  return textMap[status] || '未知'
+}
+
+// 生命周期
+onMounted(() => {
+  console.log('团队成员管理页面加载，项目ID:', projectId)
+  if (projectId) {
+    loadData()
+  } else {
+    console.warn('未获取到项目ID，无法加载团队成员数据')
+    Message.warning('未获取到项目信息，请从项目详情页面进入')
+  }
+})
+</script>
+
+<style lang="scss" scoped>
+// 确保页面可以正常滚动
+:deep(.gi-page-layout) {
+  height: auto !important;
+  min-height: 100vh;
+  overflow-y: visible;
+}
+
+:deep(.gi-page-layout__body) {
+  height: auto !important;
+  overflow-y: visible;
+}
+
+// 确保全局滚动正常
+:deep(body), :deep(html) {
+  overflow-y: auto !important;
+  height: auto !important;
+}
+
+// 确保页面容器可以滚动
+:deep(.app-main), :deep(.main-content), :deep(.layout-content) {
+  overflow-y: auto !important;
+  height: auto !important;
+}
+
+// 确保表格容器可以滚动
+:deep(.arco-table-container) {
+  overflow-x: auto;
+  overflow-y: visible;
+}
+.page-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin-bottom: 24px;
+  padding: 20px;
+  background: white;
+  border-radius: 8px;
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
+
+  .header-left {
+    display: flex;
+    align-items: center;
+    gap: 16px;
+
+    .back-btn {
+      border: none;
+      background: #f7f8fa;
+      color: #4e5969;
+      
+      &:hover {
+        background: #e5e6eb;
+        color: #1d2129;
+      }
+    }
+
+    .header-title {
+      display: flex;
+      align-items: center;
+      gap: 8px;
+
+      .title-icon {
+        font-size: 24px;
+        color: #667eea;
+      }
+
+      h1 {
+        margin: 0;
+        font-size: 20px;
+        font-weight: 600;
+        color: #1d2129;
+      }
+
+      .project-info {
+        font-size: 14px;
+        color: #969fa8;
+      }
+    }
+  }
+
+  .header-actions {
+    display: flex;
+    gap: 12px;
+  }
+}
+
+.search-section {
+  margin-bottom: 16px;
+  
+  .search-card {
+    background: white;
+    border-radius: 8px;
+    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
+    
+    :deep(.arco-card-body) {
+      padding: 20px;
+    }
+    
+    :deep(.arco-form-item) {
+      margin-bottom: 0;
+      margin-right: 16px;
+    }
+    
+    :deep(.arco-form-item-label) {
+      font-weight: 500;
+      color: #4e5969;
+    }
+    
+    :deep(.arco-input),
+    :deep(.arco-select) {
+      width: 100%;
+    }
+  }
+}
+
+// 表格区域样式
+:deep(.gi-table) {
+  background: white;
+  border-radius: 8px;
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
+  margin-bottom: 24px;
+  
+  .arco-table-container {
+    overflow-x: auto;
+    overflow-y: visible;
+  }
+  
+  .arco-table {
+    overflow: visible;
+  }
+}
+
+
+
+.remark-content {
+  max-width: 180px;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  color: #4e5969;
+}
+
+.no-remark {
+  color: #c9cdd4;
+  font-style: italic;
+}
+
+.member-form {
+  .form-row {
+    display: grid;
+    grid-template-columns: 1fr 1fr;
+    gap: 16px;
+    margin-bottom: 16px;
+  }
+
+  .form-item {
+    margin-bottom: 16px;
+
+    label {
+      display: block;
+      font-weight: 500;
+      color: #4e5969;
+      margin-bottom: 6px;
+
+      .required {
+        color: #f53f3f;
+      }
+    }
+
+    .arco-input,
+    .arco-select,
+    .arco-textarea,
+    .arco-date-picker {
+      width: 100%;
+    }
+  }
+}
+
+.status-form {
+  .form-item {
+    display: flex;
+    align-items: center;
+    gap: 12px;
+    margin-bottom: 16px;
+
+    label {
+      font-weight: 500;
+      color: #4e5969;
+      min-width: 80px;
+    }
+
+    .arco-select {
+      flex: 1;
+    }
+  }
+}
+
+.import-form {
+  .form-item {
+    margin-bottom: 16px;
+
+    label {
+      display: block;
+      font-weight: 500;
+      color: #4e5969;
+      margin-bottom: 6px;
+    }
+  }
+}
+
+// 响应式设计
+@media (max-width: 768px) {
+  .page-header {
+    flex-direction: column;
+    gap: 16px;
+    align-items: stretch;
+
+    .header-actions {
+      justify-content: center;
+    }
+  }
+
+  .search-section {
+    .search-card {
+      :deep(.arco-form) {
+        flex-direction: column;
+        align-items: stretch;
+      }
+      
+      :deep(.arco-form-item) {
+        margin-right: 0;
+        margin-bottom: 16px;
+      }
+    }
+  }
+
+  .member-form {
+    .form-row {
+      grid-template-columns: 1fr;
+    }
+  }
+}
+</style> 

src/views/system-resource/device-management/approval/components/ApprovalSearch.vue

@@ -129,29 +129,18 @@ const debouncedSearch = debounce(() => {
 const search = () => {
   console.log('🔍 ApprovalSearch - 搜索按钮被点击')
   console.log('🔍 ApprovalSearch - 搜索表单数据:', searchForm)
-  console.log('🔍 ApprovalSearch - 搜索表单数据类型:', typeof searchForm)
-  console.log('🔍 ApprovalSearch - 搜索表单的键值对:')
-  Object.entries(searchForm).forEach(([key, value]) => {
-    console.log(`  ${key}: ${value} (${typeof value})`)
-  })
 
-  // 构建搜索参数
+  // 构建搜索参数 - 参考设备采购功能的实现
   const searchParams: EquipmentApprovalListReq = {
     equipmentName: searchForm.equipmentName || undefined,
     applicantName: searchForm.applicantName || undefined,
-    businessType: searchForm.businessType,
+    businessType: searchForm.businessType || undefined,
-    approvalStatus: searchForm.approvalStatus,
+    approvalStatus: searchForm.approvalStatus || undefined,
-    applyTimeStart: searchForm.applyTimeStart,
+    applyTimeStart: searchForm.applyTimeStart || undefined,
-    applyTimeEnd: searchForm.applyTimeEnd
+    applyTimeEnd: searchForm.applyTimeEnd || undefined,
   }
 
   console.log('🔍 ApprovalSearch - 发送的搜索参数:', searchParams)
-  console.log('🔍 ApprovalSearch - 发送参数的类型:', typeof searchParams)
-  console.log('🔍 ApprovalSearch - 发送参数的键值对:')
-  Object.entries(searchParams).forEach(([key, value]) => {
-    console.log(`  ${key}: ${value} (${typeof value})`)
-  })
-
   emit('search', searchParams)
 }
 

src/views/system-resource/device-management/approval/index.vue

@@ -458,10 +458,10 @@ const loadData = async (searchParams?: EquipmentApprovalListReq) => {
 
   loading.value = true
   try {
+    // 构建完整的请求参数 - 参考设备采购功能的实现
     const params: EquipmentApprovalListReq = {
-      pageSize: pagination.pageSize || 10,
+      pageSize: pagination.pageSize,
-      page: pagination.current || 1,
+      page: pagination.current,
-      pageNum: pagination.current || 1, // 添加 pageNum 参数，以防后端期望这个名称
       ...(searchParams || {}),
     }
 

src/views/system-resource/device-management/procurement/components/ProcurementApplicationModal.vue

@@ -0,0 +1,340 @@
+<template>
+  <a-modal
+    :visible="visible"
+    :title="modalTitle"
+    width="800px"
+    @ok="handleSubmit"
+    @cancel="handleCancel"
+    @update:visible="(value) => emit('update:visible', value)"
+    :confirm-loading="submitLoading"
+  >
+    <a-form
+      ref="formRef"
+      :model="formData"
+      :rules="rules"
+      layout="vertical"
+      class="procurement-application-form"
+    >
+      <a-row :gutter="16">
+        <a-col :span="12">
+          <a-form-item label="设备名称" field="equipmentName">
+            <a-input 
+              v-model="formData.equipmentName" 
+              placeholder="请输入设备名称"
+              allow-clear
+            />
+          </a-form-item>
+        </a-col>
+        <a-col :span="12">
+          <a-form-item label="设备类型" field="equipmentType">
+            <a-select 
+              v-model="formData.equipmentType" 
+              placeholder="请选择设备类型"
+              allow-clear
+            >
+              <a-option value="服务器">服务器</a-option>
+              <a-option value="网络设备">网络设备</a-option>
+              <a-option value="办公设备">办公设备</a-option>
+              <a-option value="计算机">计算机</a-option>
+              <a-option value="安防设备">安防设备</a-option>
+              <a-option value="显示设备">显示设备</a-option>
+              <a-option value="测试设备">测试设备</a-option>
+            </a-select>
+          </a-form-item>
+        </a-col>
+      </a-row>
+      
+      <a-row :gutter="16">
+        <a-col :span="12">
+          <a-form-item label="设备型号" field="equipmentModel">
+            <a-input 
+              v-model="formData.equipmentModel" 
+              placeholder="请输入设备型号"
+              allow-clear
+            />
+          </a-form-item>
+        </a-col>
+        <a-col :span="12">
+          <a-form-item label="品牌" field="brand">
+            <a-input 
+              v-model="formData.brand" 
+              placeholder="请输入品牌"
+              allow-clear
+            />
+          </a-form-item>
+        </a-col>
+      </a-row>
+      
+      <a-row :gutter="16">
+        <a-col :span="12">
+          <a-form-item label="供应商名称" field="supplierName">
+            <a-input 
+              v-model="formData.supplierName" 
+              placeholder="请输入供应商名称"
+              allow-clear
+            />
+          </a-form-item>
+        </a-col>
+        <a-col :span="12">
+          <a-form-item label="数量" field="quantity">
+            <a-input-number 
+              v-model="formData.quantity" 
+              placeholder="请输入数量"
+              :min="1"
+              :precision="0"
+              style="width: 100%"
+            />
+          </a-form-item>
+        </a-col>
+      </a-row>
+      
+      <a-row :gutter="16">
+        <a-col :span="12">
+          <a-form-item label="预算金额" field="budgetAmount">
+            <a-input-number 
+              v-model="formData.budgetAmount" 
+              placeholder="请输入预算金额"
+              :min="0"
+              :precision="2"
+              style="width: 100%"
+            />
+          </a-form-item>
+        </a-col>
+        <a-col :span="12">
+          <a-form-item label="紧急程度" field="urgencyLevel">
+            <a-select 
+              v-model="formData.urgencyLevel" 
+              placeholder="请选择紧急程度"
+              allow-clear
+            >
+              <a-option value="LOW">低</a-option>
+              <a-option value="NORMAL">普通</a-option>
+              <a-option value="HIGH">高</a-option>
+              <a-option value="URGENT">紧急</a-option>
+            </a-select>
+          </a-form-item>
+        </a-col>
+      </a-row>
+      
+      <a-row :gutter="16">
+        <a-col :span="12">
+          <a-form-item label="采购类型" field="procurementType">
+            <a-select 
+              v-model="formData.procurementType" 
+              placeholder="请选择采购类型"
+              allow-clear
+            >
+              <a-option value="NEW_PURCHASE">新采购</a-option>
+              <a-option value="REPLACEMENT">更换</a-option>
+              <a-option value="UPGRADE">升级</a-option>
+            </a-select>
+          </a-form-item>
+        </a-col>
+        <a-col :span="12">
+          <a-form-item label="预期交付日期" field="expectedDeliveryDate">
+            <a-date-picker 
+              v-model="formData.expectedDeliveryDate" 
+              placeholder="请选择预期交付日期"
+              style="width: 100%"
+            />
+          </a-form-item>
+        </a-col>
+      </a-row>
+      
+      <a-form-item label="申请原因" field="applyReason">
+        <a-textarea 
+          v-model="formData.applyReason" 
+          placeholder="请详细说明采购原因"
+          :rows="4"
+          allow-clear
+        />
+      </a-form-item>
+      
+      <a-form-item label="技术要求" field="technicalRequirements">
+        <a-textarea 
+          v-model="formData.technicalRequirements" 
+          placeholder="请描述设备的技术要求（可选）"
+          :rows="3"
+          allow-clear
+        />
+      </a-form-item>
+      
+      <a-form-item label="业务合理性说明" field="businessJustification">
+        <a-textarea 
+          v-model="formData.businessJustification" 
+          placeholder="请说明采购的业务合理性（可选）"
+          :rows="3"
+          allow-clear
+        />
+      </a-form-item>
+    </a-form>
+  </a-modal>
+</template>
+
+<script setup lang="ts">
+import { ref, reactive, watch } from 'vue'
+import { Message } from '@arco-design/web-vue'
+import { equipmentApprovalApi } from '@/apis/equipment/approval'
+
+interface Props {
+  visible: boolean
+  equipmentData?: any
+}
+
+interface Emits {
+  (e: 'update:visible', value: boolean): void
+  (e: 'success'): void
+}
+
+const props = defineProps<Props>()
+const emit = defineEmits<Emits>()
+
+const modalTitle = ref('申请采购')
+const submitLoading = ref(false)
+const formRef = ref()
+
+// 表单数据
+const formData = reactive({
+  equipmentId: '', // 添加设备ID字段
+  equipmentName: '',
+  equipmentType: '',
+  equipmentModel: '',
+  brand: '',
+  supplierName: '',
+  quantity: 1,
+  budgetAmount: undefined,
+  urgencyLevel: 'NORMAL',
+  procurementType: 'NEW_PURCHASE',
+  expectedDeliveryDate: null,
+  applyReason: '',
+  technicalRequirements: '',
+  businessJustification: ''
+})
+
+// 表单验证规则
+const rules = {
+  equipmentId: [{ required: true, message: '设备ID不能为空' }],
+  equipmentName: [{ required: true, message: '请输入设备名称' }],
+  equipmentType: [{ required: true, message: '请选择设备类型' }],
+  quantity: [{ required: true, message: '请输入数量' }],
+  budgetAmount: [{ required: true, message: '请输入预算金额' }],
+  urgencyLevel: [{ required: true, message: '请选择紧急程度' }],
+  procurementType: [{ required: true, message: '请选择采购类型' }],
+  applyReason: [
+    { required: true, message: '请输入申请原因' },
+    { 
+      validator: (value: string) => {
+        if (!value || value.trim() === '') {
+          return new Error('申请原因不能为空')
+        }
+        return true
+      }
+    }
+  ]
+}
+
+// 监听设备数据变化，填充表单
+watch(() => props.equipmentData, (newData) => {
+  if (newData) {
+    // 填充设备数据到表单
+    Object.assign(formData, {
+      equipmentId: newData.equipmentId || '', // 添加设备ID
+      equipmentName: newData.equipmentName || '',
+      equipmentType: newData.equipmentType || '',
+      equipmentModel: newData.equipmentModel || '',
+      brand: newData.brand || '',
+      supplierName: newData.supplierName || '',
+      quantity: newData.quantity || 1,
+      budgetAmount: newData.unitPrice || undefined,
+      urgencyLevel: 'NORMAL',
+      procurementType: 'NEW_PURCHASE',
+      expectedDeliveryDate: null,
+      applyReason: '', // 申请原因需要用户填写
+      technicalRequirements: '',
+      businessJustification: ''
+    })
+  }
+}, { immediate: true })
+
+// 监听模态框显示状态
+watch(() => props.visible, (visible) => {
+  if (visible) {
+    // 模态框打开时，如果有设备数据则填充，否则重置表单
+    if (props.equipmentData) {
+      // 设备数据会在上面的 watch 中处理
+    } else {
+      // 没有设备数据时重置表单
+      formRef.value?.resetFields()
+    }
+  }
+})
+
+// 提交表单
+const handleSubmit = async () => {
+  try {
+    // 手动验证 applyReason 字段
+    if (!formData.applyReason || formData.applyReason.trim() === '') {
+      Message.error('请输入申请原因')
+      return
+    }
+    
+    await formRef.value.validate()
+    submitLoading.value = true
+    
+    const submitData = {
+      ...formData,
+      applyReason: formData.applyReason.trim(), // 确保去除空格
+      expectedDeliveryDate: formData.expectedDeliveryDate ? 
+        (formData.expectedDeliveryDate as any).format('YYYY-MM-DD') : null
+    }
+    
+    // 调试信息：打印提交的数据
+    console.log('提交的表单数据:', submitData)
+    console.log('applyReason 值:', submitData.applyReason)
+    console.log('applyReason 类型:', typeof submitData.applyReason)
+    console.log('applyReason 长度:', submitData.applyReason?.length)
+    
+    await equipmentApprovalApi.submitProcurementApplication(submitData)
+    
+    Message.success('采购申请提交成功')
+    emit('success')
+    handleCancel()
+  } catch (error: any) {
+    console.error('提交采购申请失败:', error)
+    Message.error(error?.message || '提交失败')
+  } finally {
+    submitLoading.value = false
+  }
+}
+
+// 取消
+const handleCancel = () => {
+  emit('update:visible', false)
+  // 清空用户输入的数据，保留设备基本信息
+  formData.equipmentId = ''
+  formData.applyReason = ''
+  formData.technicalRequirements = ''
+  formData.businessJustification = ''
+  formData.expectedDeliveryDate = null
+  formRef.value?.resetFields()
+}
+</script>
+
+<style scoped lang="scss">
+.procurement-application-form {
+  .arco-form-item {
+    margin-bottom: 16px;
+  }
+  
+  .arco-input,
+  .arco-select,
+  .arco-input-number,
+  .arco-date-picker {
+    border-radius: 6px;
+  }
+  
+  .arco-textarea {
+    border-radius: 6px;
+  }
+}
+</style>

src/views/system-resource/device-management/procurement/index.vue

@@ -175,6 +175,19 @@
             <a-button type="text" size="small" @click="handleEdit(record)">
               编辑
             </a-button>
+            <!-- 申请采购按钮 -->
+            <a-button 
+              v-if="canApplyProcurement(record)"
+              type="primary" 
+              size="small" 
+              @click="handleApplyProcurement(record)"
+            >
+              申请采购
+            </a-button>
+            <!-- 显示审批状态 -->
+            <a-tag v-if="record.approvalStatus" :color="getApprovalStatusColor(record.approvalStatus)">
+              {{ getApprovalStatusText(record.approvalStatus) }}
+            </a-tag>
             <a-popconfirm
               content="确定要删除这条采购记录吗？"
               @ok="handleDelete(record)"
@@ -195,6 +208,13 @@
       :mode="modalMode"
       @success="handleModalSuccess"
     />
+
+    <!-- 采购申请弹窗 -->
+    <ProcurementApplicationModal
+      v-model:visible="applicationModalVisible"
+      :equipment-data="currentApplicationData"
+      @success="handleApplicationSuccess"
+    />
   </div>
 </template>
 
@@ -213,7 +233,9 @@ import {
 import message from '@arco-design/web-vue/es/message'
 import ProcurementModal from './components/ProcurementModal.vue'
 import ProcurementSearch from './components/ProcurementSearch.vue'
+import ProcurementApplicationModal from './components/ProcurementApplicationModal.vue'
 import { equipmentProcurementApi } from '@/apis/equipment/procurement'
+import { equipmentApprovalApi } from '@/apis/equipment/approval'
 import type { EquipmentListReq, EquipmentResp } from '@/apis/equipment/type'
 
 defineOptions({ name: 'EquipmentProcurement' })
@@ -243,6 +265,10 @@ const modalVisible = ref(false)
 const currentProcurement = ref<EquipmentResp | null>(null)
 const modalMode = ref<'add' | 'edit' | 'view'>('add')
 
+// 采购申请弹窗控制
+const applicationModalVisible = ref(false)
+const currentApplicationData = ref<EquipmentResp | null>(null)
+
 // 表格选择
 const selectedRowKeys = ref<string[]>([])
 const rowSelection = reactive({
@@ -611,6 +637,12 @@ const handleEdit = (record: EquipmentResp) => {
   modalVisible.value = true
 }
 
+// 申请采购
+const handleApplyProcurement = (record: EquipmentResp) => {
+  currentApplicationData.value = { ...record }
+  applicationModalVisible.value = true
+}
+
 // 删除
 const handleDelete = async (record: EquipmentResp) => {
   try {
@@ -629,6 +661,12 @@ const handleModalSuccess = () => {
   loadData(currentSearchParams.value)
 }
 
+// 采购申请成功回调
+const handleApplicationSuccess = () => {
+  applicationModalVisible.value = false
+  loadData(currentSearchParams.value)
+}
+
 // 刷新数据
 const refreshData = () => {
   loadData(currentSearchParams.value)
@@ -674,6 +712,36 @@ const getTotalAmount = () => {
   return formatPrice(total)
 }
 
+// 检查是否可以申请采购
+const canApplyProcurement = (record: EquipmentResp) => {
+  // 检查是否有审批状态，如果没有或者状态为待申请，则可以申请
+  return !record.approvalStatus || record.approvalStatus === 'PENDING_APPLICATION'
+}
+
+// 获取审批状态颜色
+const getApprovalStatusColor = (status: string) => {
+  const colorMap: Record<string, string> = {
+    'PENDING_APPLICATION': 'blue',
+    'PENDING': 'orange',
+    'APPROVED': 'green',
+    'REJECTED': 'red',
+    'WITHDRAWN': 'gray'
+  }
+  return colorMap[status] || 'blue'
+}
+
+// 获取审批状态文本
+const getApprovalStatusText = (status: string) => {
+  const textMap: Record<string, string> = {
+    'PENDING_APPLICATION': '待申请',
+    'PENDING': '待审批',
+    'APPROVED': '已通过',
+    'REJECTED': '已拒绝',
+    'WITHDRAWN': '已撤回'
+  }
+  return textMap[status] || '未知'
+}
+
 onMounted(() => {
   loadData()
 })