diff --git a/src/api/wuziguanli/caigouPlan/index.ts b/src/api/wuziguanli/caigouPlan/index.ts
new file mode 100644
index 0000000..ba6a719
--- /dev/null
+++ b/src/api/wuziguanli/caigouPlan/index.ts
@@ -0,0 +1,56 @@
+import request from '@/utils/request';
+import { AxiosPromise } from 'axios';
+import { CaigouPlanVO, CaigouPlanForm, CaigouPlanQuery } from '@/api/wuziguanli/caigouPlan/types';
+
+/**
+ * 查询运维-物资-采购计划单列表
+ * @param query
+ * @returns {*}
+ */
+
+export const listCaigouPlan = (query?: CaigouPlanQuery): AxiosPromise<CaigouPlanVO[]> => {
+  return request({
+    url: '/ops/caigouPlan/list',
+    method: 'get',
+    params: query
+  });
+};
+
+/**
+ * 查询采购商列表
+ * @param query
+ * @returns {*}
+ */
+
+export const getSupplierList = (data:any): AxiosPromise<any> => {
+  return request({
+    url: '/ops/tenderSupplierInput/getList',
+    method: 'get',
+    params: data
+  });
+};
+
+/**
+ * 新增运维-物资-采购计划单
+ * @param data
+ * @returns {*}
+ */
+export const addCaigouPlan = (data: CaigouPlanForm): AxiosPromise<CaigouPlanVO> => {
+  return request({
+    url: '/ops/caigouPlan',
+    method: 'post',
+    data: data
+  });
+};
+
+/**
+ * 查询运维-物资-采购计划单详情
+ * @param id
+ * @returns {*}
+ */
+export const caigouPlanDetail = (id: string | number): AxiosPromise<CaigouPlanVO> => {
+  return request({
+    url: `/ops/caigouPlan/`+id,
+    method: 'get'
+  });
+};
diff --git a/src/api/wuziguanli/caigouPlan/types.ts b/src/api/wuziguanli/caigouPlan/types.ts
new file mode 100644
index 0000000..83d1196
--- /dev/null
+++ b/src/api/wuziguanli/caigouPlan/types.ts
@@ -0,0 +1,558 @@
+export interface CaigouPlanVO {
+    /**
+     * id
+     */
+    id: string | number;
+
+    /**
+     * 项目id
+     */
+    projectId: string | number;
+
+    /**
+     * 计划名称
+     */
+    jihuaName: string;
+
+    /**
+     * 计划编号
+     */
+    jihuaBianhao: string;
+
+    /**
+     * 采购单位（当前登录人部门）
+     */
+    caigouDanwei: number;
+
+    /**
+     * 采购单位名称
+     */
+    caigouDanweiName: string;
+
+    /**
+     * 经办人
+     */
+    jingbanren: number;
+
+    /**
+     * 经办人名称
+     */
+    jingbanrenName: string;
+
+    /**
+     * 合同类型
+     */
+    hetonType: string;
+
+    /**
+     * 采购类型
+     */
+    caigouType: string;
+
+    /**
+     * 仓库地址
+     */
+    cangkuUrl: string;
+
+    /**
+     * 合同名称
+     */
+    hetonName: string;
+
+    /**
+     * 供应商id
+     */
+    gonyingshangId: string | number;
+
+    /**
+     * 出货时间
+     */
+    chuhuoTime: string;
+
+    /**
+     * 付款条件
+     */
+    fukuantiaojian: string;
+
+    /**
+     * 发票开具方式
+     */
+    fapiaoKjfs: string;
+
+    /**
+     * 计划状态
+     */
+    status: string;
+
+    /**
+     * 审核状态
+     */
+    shenheStatus: string;
+
+    /**
+     * 预计金额
+     */
+    yujiJine: number;
+
+    /**
+     * 实际采购金额
+     */
+    shijiJine: number;
+    /**
+     * 文件id
+     */
+    fileId: string | number;
+
+    /**
+     * 文件地址
+     */
+    fileUrl: string;
+
+    /**
+     * 文件名称
+     */
+    fileName: string;
+
+    /**
+     * 采购申请计划id
+     */
+    caigouPlanId: string | number;
+
+    /**
+     * 产品名称
+     */
+    chanpinName: string;
+
+    /**
+     * 产品型号
+     */
+    chanpinType: string;
+
+    /**
+     * 产品单价
+     */
+    chanpinMonovalent: number;
+
+    /**
+     * 购买数量
+     */
+    goumaiNumber: number;
+
+    /**
+     * 单位
+     */
+    danwei: string;
+
+    /**
+     * 用途
+     */
+    yontu: string;
+
+    /**
+     * 总价
+     */
+    totalPrice: number;
+     /**
+     * 申请时间
+     */
+    createTime?: string;
+    /**
+     * 出货时间
+     */
+    chouhuoTime?: string;
+     /**
+     * 采购申请计划文件 新增
+     */
+    opsCaigouPlanFilesBos?: Array<any>;
+    /**
+     * 采购申请计划产品 新增
+     */
+    opsCaigouPlanChanpinBos?:Array<any>;
+
+    /**
+     * 采购申请计划产品 查询
+     */
+    opsCaigouPlanChanpinVos?: Array<any>;
+
+    /**
+     * 采购申请计划文件 查询
+     */
+    opsCaigouPlanFilesVos?: Array<any>;
+
+}
+
+export interface CaigouPlanForm extends BaseEntity {
+    /**
+     * id
+     */
+    id?: string | number;
+
+    /**
+     * 项目id
+     */
+    projectId?: string | number;
+
+    /**
+     * 计划名称
+     */
+    jihuaName?: string;
+
+    /**
+     * 计划编号
+     */
+    jihuaBianhao?: string;
+
+    /**
+     * 采购单位（当前登录人部门）
+     */
+    caigouDanwei?: number;
+
+    /**
+     * 采购单位名称
+     */
+    caigouDanweiName?: string;
+
+    /**
+     * 经办人
+     */
+    jingbanren?: number;
+
+    /**
+     * 经办人名称
+     */
+    jingbanrenName?: string;
+
+    /**
+     * 合同类型
+     */
+    hetonType?: string;
+
+    /**
+     * 采购类型
+     */
+    caigouType?: string;
+
+    /**
+     * 仓库地址
+     */
+    cangkuUrl?: string;
+
+    /**
+     * 合同名称
+     */
+    hetonName?: string;
+
+    /**
+     * 供应商id
+     */
+    gonyingshangId?: string | number;
+
+    /**
+     * 出货时间
+     */
+    chuhuoTime?: string;
+
+    /**
+     * 付款条件
+     */
+    fukuantiaojian?: string;
+
+    /**
+     * 发票开具方式
+     */
+    fapiaoKjfs?: string;
+
+    /**
+     * 计划状态
+     */
+    status?: string;
+
+    /**
+     * 审核状态
+     */
+    shenheStatus?: string;
+
+    /**
+     * 预计金额
+     */
+    yujiJine?: number;
+
+    /**
+     * 实际采购金额
+     */
+    shijiJine?: number;
+    /**
+     * 采购申请计划id
+     */
+    caigouPlanId?: string | number;
+
+    /**
+     * 文件id
+     */
+    fileId?: string | number;
+
+    /**
+     * 文件地址
+     */
+    fileUrl?: string;
+
+    /**
+     * 文件名称
+     */
+    fileName?: string;
+    /**
+     * 产品名称
+     */
+    chanpinName?: string;
+
+    /**
+     * 产品型号
+     */
+    chanpinType?: string;
+
+    /**
+     * 产品单价
+     */
+    chanpinMonovalent?: number;
+
+    /**
+     * 购买数量
+     */
+    goumaiNumber?: number;
+
+    /**
+     * 单位
+     */
+    danwei?: string;
+
+    /**
+     * 用途
+     */
+    yontu?: string;
+
+    /**
+     * 总价
+     */
+    totalPrice?: number;
+    /**
+     * 采购申请计划文件 新增
+     */
+    opsCaigouPlanFilesBos?: Array<any>;
+    /**
+     * 采购申请计划产品 新增
+     */
+    opsCaigouPlanChanpinBos?:Array<any>;
+
+    /**
+     * 采购申请计划产品 查询
+     */
+    opsCaigouPlanChanpinVos?: Array<any>;
+
+    /**
+     * 采购申请计划文件 查询
+     */
+    opsCaigouPlanFilesVos?: Array<any>;
+      /**
+     * 申请时间
+     */
+    createTime?: string;
+    /**
+     * 出货时间
+     */
+    chouhuoTime?: string;
+   
+
+}
+
+export interface CaigouPlanQuery extends PageQuery {
+
+    /**
+     * 项目id
+     */
+    projectId?: string | number;
+
+    /**
+     * 计划名称
+     */
+    jihuaName?: string;
+
+    /**
+     * 计划编号
+     */
+    jihuaBianhao?: string;
+
+    /**
+     * 采购单位（当前登录人部门）
+     */
+    caigouDanwei?: number;
+
+    /**
+     * 采购单位名称
+     */
+    caigouDanweiName?: string;
+
+    /**
+     * 经办人
+     */
+    jingbanren?: number;
+
+    /**
+     * 经办人名称
+     */
+    jingbanrenName?: string;
+
+    /**
+     * 合同类型
+     */
+    hetonType?: string;
+
+    /**
+     * 采购类型
+     */
+    caigouType?: string;
+
+    /**
+     * 仓库地址
+     */
+    cangkuUrl?: string;
+
+    /**
+     * 合同名称
+     */
+    hetonName?: string;
+
+    /**
+     * 供应商id
+     */
+    gonyingshangId?: string | number;
+
+    /**
+     * 出货时间
+     */
+    chuhuoTime?: string;
+
+    /**
+     * 付款条件
+     */
+    fukuantiaojian?: string;
+
+    /**
+     * 发票开具方式
+     */
+    fapiaoKjfs?: string;
+
+    /**
+     * 计划状态
+     */
+    status?: string;
+
+    /**
+     * 审核状态
+     */
+    shenheStatus?: string;
+
+    /**
+     * 预计金额
+     */
+    yujiJine?: number;
+
+    /**
+     * 实际采购金额
+     */
+    shijiJine?: number;
+
+    /**
+     * 日期范围参数
+     */
+    params?: any;
+    /**
+   * 采购申请计划id
+   */
+    caigouPlanId?: string | number;
+
+    /**
+     * 文件id
+     */
+    fileId?: string | number;
+
+    /**
+     * 文件地址
+     */
+    fileUrl?: string;
+
+    /**
+     * 文件名称
+     */
+    fileName?: string;
+
+    /**
+     * 产品名称
+     */
+    chanpinName?: string;
+
+    /**
+     * 产品型号
+     */
+    chanpinType?: string;
+
+    /**
+     * 产品单价
+     */
+    chanpinMonovalent?: number;
+
+    /**
+     * 购买数量
+     */
+    goumaiNumber?: number;
+
+    /**
+     * 单位
+     */
+    danwei?: string;
+
+    /**
+     * 用途
+     */
+    yontu?: string;
+
+    /**
+     * 总价
+     */
+    totalPrice?: number;
+    /**
+     * 采购申请计划文件 新增
+     */
+    opsCaigouPlanFilesBos?: Array<any>;
+    /**
+     * 采购申请计划产品 新增
+     */
+    opsCaigouPlanChanpinBos?:Array<any>;
+
+    /**
+     * 采购申请计划产品 查询
+     */
+    opsCaigouPlanChanpinVos?: Array<any>;
+
+    /**
+     * 采购申请计划文件 查询
+     */
+    opsCaigouPlanFilesVos?: Array<any>;
+     /**
+     * 申请时间
+     */
+    createTime?: string;
+      /**
+     * 出货时间
+     */
+    chouhuoTime?: string;
+}
+
+
+
+
+
+
+
+
+
+
diff --git a/src/components/FileUpload/index.vue b/src/components/FileUpload/index.vue
index 1767b1b..13093ec 100644
--- a/src/components/FileUpload/index.vue
+++ b/src/components/FileUpload/index.vue
@@ -3,6 +3,7 @@
     <el-upload
       ref="fileUploadRef"
       multiple
+      :drag="isDrag"
       :action="uploadFileUrl"
       :before-upload="handleBeforeUpload"
       :file-list="fileList"
@@ -17,7 +18,13 @@
       v-if="!disabled"
     >
       <!-- 上传按钮 -->
-      <el-button type="primary">选取文件</el-button>
+      <el-button type="primary" v-if="!isDrag">选取文件</el-button>
+      <div v-else>
+        <el-icon class="el-icon--upload"><upload-filled /></el-icon>
+        <div class="el-upload__text">
+          拖拽文件到此处，或 <em>点击上传</em>
+        </div>
+      </div>
     </el-upload>
     <!-- 上传提示 -->
     <div v-if="showTip && !disabled" class="el-upload__tip">
@@ -63,11 +70,13 @@ const props = defineProps({
   // 是否显示提示
   isShowTip: propTypes.bool.def(true),
   // 禁用组件（仅查看文件）
-  disabled: propTypes.bool.def(false)
+  disabled: propTypes.bool.def(false),
+  // 是否开启拖拽上传
+  isDrag: propTypes.bool.def(false)
 });
 
 const { proxy } = getCurrentInstance() as ComponentInternalInstance;
-const emit = defineEmits(['update:modelValue']);
+const emit = defineEmits(['update:modelValue', 'update:fileList']);
 const number = ref(0);
 const uploadList = ref<any[]>([]);
 
@@ -80,6 +89,7 @@ const showTip = computed(() => props.isShowTip && (props.fileType || props.fileS
 
 const fileUploadRef = ref<ElUploadInstance>();
 
+
 // 监听 fileType 变化，更新 fileAccept
 const fileAccept = computed(() => props.fileType.map((type) => `.${type}`).join(','));
 
@@ -164,6 +174,7 @@ const handleUploadSuccess = (res: any, file: UploadFile) => {
       url: res.data.url,
       ossId: res.data.ossId
     });
+    
     uploadedSuccessfully();
   } else {
     number.value--;
@@ -189,6 +200,7 @@ const uploadedSuccessfully = () => {
     uploadList.value = [];
     number.value = 0;
     emit('update:modelValue', listToString(fileList.value));
+    emit('update:fileList', fileList.value);
     proxy?.$modal.closeLoading();
   }
 };
diff --git a/src/views/materialManagement/components/detailInfo.vue b/src/views/materialManagement/components/detailInfo.vue
index f404af7..9b807ab 100644
--- a/src/views/materialManagement/components/detailInfo.vue
+++ b/src/views/materialManagement/components/detailInfo.vue
@@ -5,35 +5,35 @@
             <template #header>
                 <h3>基础信息</h3>
             </template>
-            <el-form :model="basicInfo" label-width="120px">
+            <el-form :model="detailInfo" label-width="120px">
                 <el-row :gutter="20">
                     <el-col :span="8">
-                        <el-form-item label="订单编号">
-                            <el-input v-model="basicInfo.orderNo" disabled />
+                        <el-form-item label="采购单号">
+                            <el-input v-model="detailInfo.id" disabled />
                         </el-form-item>
                     </el-col>
                     <el-col :span="8">
                         <el-form-item label="创建时间">
-                            <el-input v-model="basicInfo.createTime" disabled />
+                            <el-input v-model="detailInfo.createTime" disabled />
                         </el-form-item>
                     </el-col>
                     <el-col :span="8">
                         <el-form-item label="经办人">
-                            <el-input v-model="basicInfo.handler" disabled />
+                            <el-input v-model="detailInfo.jingbanrenName" disabled />
                         </el-form-item>
                     </el-col>
                 </el-row>
                 <el-row :gutter="20">
                     <el-col :span="12">
                         <el-form-item label="所属部门">
-                            <el-select v-model="basicInfo.dept" placeholder="请选择">
+                            <el-select v-model="detailInfo.caigouDanweiName" placeholder="请选择">
                                 <el-option label="运维部" value="运维部" />
                             </el-select>
                         </el-form-item>
                     </el-col>
                     <el-col :span="12">
                         <el-form-item label="采购类型">
-                            <el-select v-model="basicInfo.purchaseType" placeholder="请选择">
+                            <el-select v-model="detailInfo.caigouType" placeholder="请选择">
                                 <el-option label="项目业务" value="项目业务" />
                             </el-select>
                         </el-form-item>
@@ -50,18 +50,18 @@
             <template #header>
                 <h3>供应商信息</h3>
             </template>
-            <el-form :model="supplierInfo" label-width="120px">
+            <el-form :model="detailInfo" label-width="120px">
                 <el-row :gutter="20">
                     <el-col :span="12">
                         <el-form-item label="供应商单位">
-                            <el-select v-model="supplierInfo.supplierName" placeholder="请选择">
+                            <el-select v-model="detailInfo.gonyingshangId" placeholder="请选择">
                                 <el-option label="AAAA精密仪器制造有限公司" value="AAAA精密仪器制造有限公司" />
                             </el-select>
                         </el-form-item>
                     </el-col>
                     <el-col :span="12">
                         <el-form-item label="出货时间">
-                            <el-select v-model="supplierInfo.deliveryTime" placeholder="请选择">
+                            <el-select v-model="detailInfo.chouhuoTime" placeholder="请选择">
                                 <el-option label="2年零4个月" value="2年零4个月" />
                             </el-select>
                         </el-form-item>
@@ -75,13 +75,13 @@
             <template #header>
                 <h3>产品信息</h3>
             </template>
-            <el-table :data="productInfo.tableData" border style="width: 100%">
-                <el-table-column prop="productName" label="产品名称" />
-                <el-table-column prop="productModel" label="产品型号" />
-                <el-table-column prop="productPrice" label="产品单价" align="center" :cell-style="{ background: 'pink' }" />
-                <el-table-column prop="buyQuantity" label="购买数量" align="center" :cell-style="{ background: 'pink' }" />
-                <el-table-column prop="usage" label="用途" />
-                <el-table-column prop="total" label="合计" />
+            <el-table :data="detailInfo.opsCaigouPlanChanpinVos" border style="width: 100%">
+                <el-table-column prop="chanpinName" label="产品名称" />
+                <el-table-column prop="chanpinType" label="产品型号" />
+                <el-table-column prop="chanpinMonovalent" label="产品单价" align="center" :cell-style="{ background: 'pink' }" />
+                <el-table-column prop="goumaiNumber" label="购买数量" align="center" :cell-style="{ background: 'pink' }" />
+                <el-table-column prop="yontu" label="用途" />
+                <el-table-column prop="totalPrice" label="合计" />
             </el-table>
         </el-card>
 
@@ -94,14 +94,14 @@
                 <el-row :gutter="20">
                     <el-col :span="12">
                         <el-form-item label="付款条件">
-                            <el-select v-model="contractInfo.paymentCondition" placeholder="请选择">
+                            <el-select v-model="detailInfo.fukuantiaojian" placeholder="请选择">
                                 <el-option label="银行卡" value="银行卡" />
                             </el-select>
                         </el-form-item>
                     </el-col>
                     <el-col :span="12">
                         <el-form-item label="发票开具方式">
-                            <el-select v-model="contractInfo.invoiceWay" placeholder="请选择">
+                            <el-select v-model="detailInfo.fapiaoKjfs" placeholder="请选择">
                                 <el-option label="请选择" value="请选择" />
                             </el-select>
                         </el-form-item>
@@ -134,9 +134,39 @@
     </div>
 </template>
 
-<script setup>
-import { ref } from 'vue';
+<script setup lang="ts">
+import { ref, onMounted, getCurrentInstance, toRefs } from 'vue';
+import { useRoute } from 'vue-router';
+import type { ComponentInternalInstance } from 'vue';
+const route = useRoute();
+const { proxy } = getCurrentInstance() as ComponentInternalInstance;
+const { wz_invoicing_way, wz_payment_terms, wz_purchase_type, wz_contract_type, wz_caigou_examine } = toRefs<any>(proxy?.useDict('wz_invoicing_way', 'wz_payment_terms', 'wz_purchase_type', 'wz_contract_type', 'wz_caigou_examine'));
 
+import { caigouPlanDetail } from '@/api/wuziguanli/caigouPlan';
+import { CaigouPlanVO, CaigouPlanQuery, CaigouPlanForm } from '@/api/wuziguanli/caigouPlan/types';
+
+// 存储计划详情数据
+const detailInfo = ref<CaigouPlanVO>({} as CaigouPlanVO);
+
+// 存储计划编号
+const id = ref('');
+
+const getDetailInfo = async () => {
+    const res = await caigouPlanDetail(id.value);
+    if (res.code === 200) {
+       detailInfo.value = res.data;
+       console.log(detailInfo.value);
+       
+    }
+}
+onMounted(() => {
+    // 接收路由参数
+    id.value = route.query.id as string;
+    getDetailInfo();
+
+
+
+});
 // 基础信息数据
 const basicInfo = ref({
     orderNo: '0035455',
diff --git a/src/views/materialManagement/components/dropUpload.vue b/src/views/materialManagement/components/dropUpload.vue
new file mode 100644
index 0000000..e69de29
diff --git a/src/views/materialManagement/components/updateInfo.vue b/src/views/materialManagement/components/updateInfo.vue
new file mode 100644
index 0000000..7a4b752
--- /dev/null
+++ b/src/views/materialManagement/components/updateInfo.vue
@@ -0,0 +1,261 @@
+<template>
+    <div class="approval-form">
+        <!-- 基础信息 -->
+        <el-card class="card" shadow="hover">
+            <template #header>
+                <h3>基础信息</h3>
+            </template>
+            <el-form :model="basicInfo" label-width="120px">
+                <el-row :gutter="20">
+                    <el-col :span="8">
+                        <el-form-item label="订单编号">
+                            <el-input v-model="basicInfo.orderNo" disabled />
+                        </el-form-item>
+                    </el-col>
+                    <el-col :span="8">
+                        <el-form-item label="创建时间">
+                            <el-input v-model="basicInfo.createTime" disabled />
+                        </el-form-item>
+                    </el-col>
+                    <el-col :span="8">
+                        <el-form-item label="经办人">
+                            <el-input v-model="basicInfo.handler" disabled />
+                        </el-form-item>
+                    </el-col>
+                </el-row>
+                <el-row :gutter="20">
+                    <el-col :span="12">
+                        <el-form-item label="所属部门">
+                            <el-select v-model="basicInfo.dept" placeholder="请选择">
+                                <el-option label="运维部" value="运维部" />
+                            </el-select>
+                        </el-form-item>
+                    </el-col>
+                    <el-col :span="12">
+                        <el-form-item label="采购类型">
+                            <el-select v-model="basicInfo.purchaseType" placeholder="请选择">
+                                <el-option label="项目业务" value="项目业务" />
+                            </el-select>
+                        </el-form-item>
+                    </el-col>
+                </el-row>
+                <el-form-item label="申请原因">
+                    <el-input v-model="basicInfo.applyReason" type="textarea" :rows="2" placeholder="请输入申请原因" />
+                </el-form-item>
+            </el-form>
+        </el-card>
+
+        <!-- 供应商信息 -->
+        <el-card class="card" shadow="hover" style="margin-top: 20px">
+            <template #header>
+                <h3>供应商信息</h3>
+            </template>
+            <el-form :model="supplierInfo" label-width="120px">
+                <el-row :gutter="20">
+                    <el-col :span="12">
+                        <el-form-item label="供应商单位">
+                            <el-select v-model="supplierInfo.supplierName" placeholder="请选择">
+                                <el-option label="AAAA精密仪器制造有限公司" value="AAAA精密仪器制造有限公司" />
+                            </el-select>
+                        </el-form-item>
+                    </el-col>
+                    <el-col :span="12">
+                        <el-form-item label="出货时间">
+                            <el-select v-model="supplierInfo.deliveryTime" placeholder="请选择">
+                                <el-option label="2年零4个月" value="2年零4个月" />
+                            </el-select>
+                        </el-form-item>
+                    </el-col>
+                </el-row>
+            </el-form>
+        </el-card>
+
+        <!-- 产品信息 -->
+        <el-card class="card" shadow="hover" style="margin-top: 20px">
+            <template #header>
+                <h3>产品信息</h3>
+            </template>
+            <el-table :data="productInfo.tableData" border style="width: 100%">
+                <el-table-column prop="productName" label="产品名称" />
+                <el-table-column prop="productModel" label="产品型号" />
+                <el-table-column prop="productPrice" label="产品单价" align="center" :cell-style="{ background: 'pink' }" />
+                <el-table-column prop="buyQuantity" label="购买数量" align="center" :cell-style="{ background: 'pink' }" />
+                <el-table-column prop="usage" label="用途" />
+                <el-table-column prop="total" label="合计" />
+            </el-table>
+        </el-card>
+
+        <!-- 合同条款 -->
+        <el-card class="card" shadow="hover" style="margin-top: 20px">
+            <template #header>
+                <h3>合同条款</h3>
+            </template>
+            <el-form :model="contractInfo" label-width="120px">
+                <el-row :gutter="20">
+                    <el-col :span="12">
+                        <el-form-item label="付款条件">
+                            <el-select v-model="contractInfo.paymentCondition" placeholder="请选择">
+                                <el-option label="银行卡" value="银行卡" />
+                            </el-select>
+                        </el-form-item>
+                    </el-col>
+                    <el-col :span="12">
+                        <el-form-item label="发票开具方式">
+                            <el-select v-model="contractInfo.invoiceWay" placeholder="请选择">
+                                <el-option label="请选择" value="请选择" />
+                            </el-select>
+                        </el-form-item>
+                    </el-col>
+                </el-row>
+            </el-form>
+        </el-card>
+
+        <!-- 附件 -->
+        <el-card class="card" shadow="hover" style="margin-top: 20px">
+            <template #header>
+                <h3>附件</h3>
+            </template>
+            <el-upload class="upload-demo" action="#" :file-list="fileList" :auto-upload="false"
+                :on-preview="handlePreview">
+                <el-table :data="fileList" border style="width: 100%">
+                    <el-table-column prop="name" label="文件名" width="300" />
+                    <el-table-column prop="size" label="大小" width="100" />
+                    <el-table-column label="操作" width="100">
+                        <template #default="scope">
+                            <!-- <el-link type="primary" @click="handlePreview(scope.row)"> -->
+                            <el-link type="primary">
+                                预览
+                            </el-link>
+                        </template>
+                    </el-table-column>
+                </el-table>
+            </el-upload>
+        </el-card>
+    </div>
+</template>
+
+<script setup lang="ts">
+import { ref, onMounted, getCurrentInstance, toRefs } from 'vue';
+import { useRoute } from 'vue-router';
+import type { ComponentInternalInstance } from 'vue';
+const route = useRoute();
+const { proxy } = getCurrentInstance() as ComponentInternalInstance;
+const { wz_invoicing_way, wz_payment_terms, wz_purchase_type, wz_contract_type, wz_caigou_examine } = toRefs<any>(proxy?.useDict('wz_invoicing_way', 'wz_payment_terms', 'wz_purchase_type', 'wz_contract_type', 'wz_caigou_examine'));
+
+import { caigouPlanDetail } from '@/api/wuziguanli/caigouPlan';
+import { CaigouPlanVO, CaigouPlanQuery, CaigouPlanForm } from '@/api/wuziguanli/caigouPlan/types';
+
+
+// 存储计划编号
+const id = ref('');
+
+const getDetailInfo = async () => {
+    const res = await caigouPlanDetail(id.value);
+    if (res.code === 200) {
+       console.log(res);
+       
+    }
+}
+onMounted(() => {
+    // 接收路由参数
+    id.value = route.query.id as string;
+    getDetailInfo();
+
+
+
+});
+// 基础信息数据
+const basicInfo = ref({
+    orderNo: '0035455',
+    createTime: '2023-11-02 16:32',
+    handler: '李四',
+    dept: '运维部',
+    purchaseType: '项目业务',
+    applyReason:
+        '随着业务拓展，光伏电站业务负责增加，现有设备已运行5年，部分出现效率下降情况。为保证电站正常运行，计划采购一批新的逆变器替换老旧设备，并补充备件库存。',
+});
+
+// 供应商信息数据
+const supplierInfo = ref({
+    supplierName: 'AAAA精密仪器制造有限公司',
+    deliveryTime: '2年零4个月',
+    remark: '',
+});
+
+// 产品信息数据
+const productInfo = ref({
+    tableData: [
+        {
+            productName: 'AAABBBCCC',
+            productModel: '15-42',
+            productPrice: 500,
+            buyQuantity: 10,
+            usage: '组件',
+            total: 5000,
+        },
+    ],
+    remark: '',
+});
+
+// 合同条款数据
+const contractInfo = ref({
+    paymentCondition: '银行卡',
+    invoiceWay: '请选择',
+    remark: '',
+});
+
+// 附件数据
+const fileList = ref([
+    {
+        name: 'MWwwwww.jpg',
+        size: '30kb',
+        url: '',
+    },
+    {
+        name: '231234124w.zip',
+        size: '50kb',
+        url: '',
+    },
+    {
+        name: '12451asdas.doc',
+        size: '80kb',
+        url: '',
+    },
+    {
+        name: '21seasda.xls',
+        size: '29kb',
+        url: '',
+    },
+    {
+        name: '12kjaklskw.png',
+        size: '16kb',
+        url: '',
+    },
+]);
+
+// 预览文件
+const handlePreview = (file) => {
+    console.log('预览文件：', file);
+    // 实际场景可在这里处理文件预览逻辑，如打开新窗口等
+};
+</script>
+
+<style scoped>
+.approval-form {
+    padding: 20px;
+}
+
+.card {
+    border-radius: 8px;
+}
+
+.error-tip {
+    color: red;
+    font-size: 12px;
+    margin-top: 5px;
+}
+
+::v-deep(.el-input__inner) {
+    color: red;
+}
+</style>
\ No newline at end of file
diff --git a/src/views/materialManagement/inventoryManagement.vue b/src/views/materialManagement/inventoryManagement.vue
index 2d88994..e291202 100644
--- a/src/views/materialManagement/inventoryManagement.vue
+++ b/src/views/materialManagement/inventoryManagement.vue
@@ -61,7 +61,7 @@
                                     : '添加入库单' }}</el-button>
                             </div>
                             <el-table v-loading="loading" border :data="churukudanList"
-                                style="width: 100%;margin-top: 15px;height: 1000px;">
+                                style="width: 100%;margin-top: 15px;">
                                 <el-table-column label="单据编号" align="center" prop="danjvNumber" />
                                 <el-table-column label="设备类型" align="center" prop="shebeiType">
                                     <template #default="scope">
diff --git a/src/views/materialManagement/procurementPlan.vue b/src/views/materialManagement/procurementPlan.vue
index e21f259..74d8d6d 100644
--- a/src/views/materialManagement/procurementPlan.vue
+++ b/src/views/materialManagement/procurementPlan.vue
@@ -79,7 +79,7 @@
 
                         <!-- 标签页导航 -->
                         <div class="tabs">
-                            <el-badge :value="pendingCount" type="warning">
+                            <!-- <el-badge :value="pendingCount" type="warning">
                                 <el-button :type="activeTab === 'pending' ? 'primary' : ''"
                                     @click="changeTab('pending')">待审批</el-button>
                             </el-badge>
@@ -100,21 +100,19 @@
                             <el-badge :value="completedCount" type="success">
                                 <el-button :type="activeTab === 'completed' ? 'primary' : ''"
                                     @click="changeTab('completed')">已完成</el-button>
-                            </el-badge>
+                            </el-badge> -->
                         </div>
                         <!-- 表格 -->
-                         <el-table :data="filteredTableData" border style="width: 100%;margin-top: 15px;">
-                            <el-table-column type="selection" width="55" align="center" />
-                            <el-table-column prop="planNumber" label="计划编号" align="center" />
-                            <el-table-column prop="planName" label="计划名称" align="center" />
-                            <el-table-column prop="equipmentType" label="设备类型" align="center" />
-                            <el-table-column prop="requestDept" label="申请部门" align="center" />
-                            <el-table-column prop="applicant" label="申请人" align="center" />
-                            <el-table-column prop="requestDate" label="申请日期" align="center" />
-                            <el-table-column prop="estimatedAmount" label="预计金额" align="center" />
-                            <el-table-column label="状态" align="center">
+                        <el-table :data="caigouPlanList" border style="width: 100%;margin-top: 15px;">
+                            <el-table-column label="计划编号" align="center" prop="jihuaBianhao" />
+                            <el-table-column label="计划名称" align="center" prop="jihuaName" />
+                            <el-table-column label="申请部门" align="center" prop="caigouDanweiName" />
+                            <el-table-column label="申请人" align="center" prop="jingbanrenName" />
+                            <el-table-column prop="createTime" label="申请日期" align="center" />
+                            <el-table-column label="预计金额" align="center" prop="yujiJine" />
+                            <el-table-column label="状态" align="center" prop="status">
                                 <template #default="scope">
-                                    <el-tag :type="getStatusTagType(scope.row.status)">{{ scope.row.status }}</el-tag>
+                                    <dict-tag :options="wz_caigou_examine" :value="scope.row.status" />
                                 </template>
                             </el-table-column>
                             <el-table-column label="操作" fixed="right" width="80" align="center">
@@ -126,9 +124,8 @@
 
                         <!-- 分页 -->
                         <div class="pagination-section">
-                            <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
-                                :current-page="currentPage" :page-sizes="[10, 20, 30, 40]" :page-size="pageSize"
-                                layout="total, sizes, prev, pager, next, jumper" :total="total" background />
+                            <pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum"
+                                v-model:limit="queryParams.pageSize" @pagination="getList" />
                         </div>
                     </div>
                 </el-card>
@@ -143,12 +140,12 @@
                     <el-row :gutter="20">
                         <el-col :span="12">
                             <el-form-item label="计划名称">
-                                <el-input v-model="newProcurementForm.planName" placeholder="请填写" />
+                                <el-input v-model="form.jihuaName" placeholder="请填写计划名称" />
                             </el-form-item>
                         </el-col>
                         <el-col :span="12">
                             <el-form-item label="合同名称">
-                                <el-input v-model="newProcurementForm.contractName" placeholder="请填写" />
+                                <el-input v-model="form.hetonName" placeholder="请填写合同名称" />
                             </el-form-item>
                         </el-col>
                     </el-row>
@@ -156,23 +153,23 @@
                     <el-row :gutter="20">
                         <el-col :span="8">
                             <el-form-item label="合同类型">
-                                <el-select v-model="newProcurementForm.contractType" placeholder="请选择">
-                                    <el-option v-for="option in wz_contract_type" :key="option.value" :label="option.label" :value="option.value" />
+                                <el-select v-model="form.hetonType" placeholder="请选择">
+                                    <el-option v-for="option in wz_contract_type" :key="option.value"
+                                        :label="option.label" :value="option.value" />
                                 </el-select>
                             </el-form-item>
                         </el-col>
                         <el-col :span="8">
                             <el-form-item label="采购类型">
-                                <el-select v-model="newProcurementForm.procurementType" placeholder="请选择">
-                                    <el-option v-for="option in wz_purchase_type" :key="option.value" :label="option.label" :value="option.value" />
+                                <el-select v-model="form.caigouType" placeholder="请选择">
+                                    <el-option v-for="option in wz_purchase_type" :key="option.value"
+                                        :label="option.label" :value="option.value" />
                                 </el-select>
                             </el-form-item>
                         </el-col>
                         <el-col :span="8">
                             <el-form-item label="仓库地址">
-                                <el-select v-model="newProcurementForm.contractAddress" placeholder="请选择">
-                                    <el-option v-for="option in contractAddressOptions" :key="option.value" :label="option.label" :value="option.value" />
-                                </el-select>
+                                <el-input v-model="form.cangkuUrl" placeholder="请输入仓库地址" />
                             </el-form-item>
                         </el-col>
                     </el-row>
@@ -184,20 +181,19 @@
                     <el-row :gutter="20">
                         <el-col :span="6">
                             <el-form-item label="供应商单位">
-                                <el-select v-model="newProcurementForm.supplierUnit" placeholder="请选择">
-                                    <el-option v-for="option in supplierUnitOptions" :key="option.value" :label="option.label" :value="option.value" />
+                                <el-select v-model="form.danwei" placeholder="请选择">
+                                    <!-- <el-option v-for="option in supplierList" :key="option.value" :label="option.label"
+                                        :value="option.value" /> -->
+                                        <el-option label="供应商1" value="供应商1" />
+                                         <el-option label="供应商1" value="供应商1" />
+                                          <el-option label="供应商1" value="供应商1" />
                                 </el-select>
                             </el-form-item>
                         </el-col>
                         <el-col :span="6">
                             <el-form-item label="送货时间">
-                                <el-date-picker
-                                    v-model="newProcurementForm.deliveryTime"
-                                    type="date"
-                                    placeholder="请选择送货日期"
-                                    value-format="YYYY-MM-DD"
-                                    style="width: 100%"
-                                />
+                                <el-date-picker v-model="form.chuhuoTime" type="date" placeholder="请选择送货日期"
+                                    value-format="YYYY-MM-DD" style="width: 100%" />
                             </el-form-item>
                         </el-col>
                     </el-row>
@@ -206,30 +202,32 @@
                 <!-- 产品信息 -->
                 <div class="form-section">
                     <h3>产品信息</h3>
-                    <el-table :data="newProcurementForm.products" border style="width: 100%">
-                        <el-table-column prop="productName" label="产品名称">
+                    <el-table :data="form.opsCaigouPlanChanpinBos" border style="width: 100%">
+                        <el-table-column prop="chanpinName" label="产品名称">
                             <template #default="scope">
-                                <el-input v-model="scope.row.productName" placeholder="请填写" />
+                                <el-input v-model="scope.row.chanpinName" placeholder="请填写" />
                             </template>
                         </el-table-column>
-                        <el-table-column prop="productModel" label="产品型号">
+                        <el-table-column prop="chanpinType" label="产品型号">
                             <template #default="scope">
-                                <el-input v-model="scope.row.productModel" placeholder="请填写" />
+                                <el-input v-model="scope.row.chanpinType" placeholder="请填写" />
                             </template>
                         </el-table-column>
-                        <el-table-column prop="productPrice" label="产品单价">
+                        <el-table-column prop="chanpinMonovalent" label="产品单价">
                             <template #default="scope">
-                                <el-input v-model="scope.row.productPrice" placeholder="请填写" type="number" @change="calculateTotalPrice(scope.row)" />
+                                <el-input v-model="scope.row.chanpinMonovalent" placeholder="请填写" type="number"
+                                    @change="calculateTotalPrice(scope.row)" />
                             </template>
                         </el-table-column>
-                        <el-table-column prop="purchaseQuantity" label="购买数量">
+                        <el-table-column prop="goumaiNumber" label="购买数量">
                             <template #default="scope">
-                                <el-input v-model="scope.row.purchaseQuantity" placeholder="请填写" type="number" @change="calculateTotalPrice(scope.row)" />
+                                <el-input v-model="scope.row.goumaiNumber" placeholder="请填写" type="number"
+                                    @change="calculateTotalPrice(scope.row)" />
                             </template>
                         </el-table-column>
-                        <el-table-column prop="unit" label="单位">
+                        <el-table-column prop="danwei" label="单位">
                             <template #default="scope">
-                                <el-input v-model="scope.row.unit" placeholder="请填写" />
+                                <el-input v-model="scope.row.danwei" placeholder="请填写" />
                             </template>
                         </el-table-column>
                         <el-table-column prop="totalPrice" label="合计" :formatter="calculateTotalPrice">
@@ -240,7 +238,7 @@
                         <el-table-column label="操作" fixed="right" width="80">
                             <template #default="scope">
                                 <el-button type="text" @click="removeProduct(scope.$index)"
-                                    :disabled="newProcurementForm.products.length <= 1">删除</el-button>
+                                    :disabled="form.opsCaigouPlanChanpinBos.length <= 1">删除</el-button>
                             </template>
                         </el-table-column>
                     </el-table>
@@ -252,18 +250,18 @@
                     <h3>合同条款</h3>
                     <el-row :gutter="20">
                         <el-col :span="6">
-                            <el-form-item label="付款条件">
-                                <el-select v-model="newProcurementForm.paymentTerms" placeholder="请选择">
-                                    <el-option label="请选择" value="" />
-                                    <el-option v-for="option in wz_payment_terms" :key="option.value" :label="option.label" :value="option.value" />
+                            <el-form-item label="付款方式">
+                                <el-select v-model="form.fukuantiaojian" placeholder="请选择">
+                                    <el-option v-for="option in wz_payment_terms" :key="option.value"
+                                        :label="option.label" :value="option.value" />
                                 </el-select>
                             </el-form-item>
                         </el-col>
                         <el-col :span="6">
                             <el-form-item label="发票开具方式">
-                                <el-select v-model="newProcurementForm.settlementMethod" placeholder="请选择">
-                                    <el-option label="请选择" value="" />
-                                    <el-option v-for="option in wz_invoicing_way" :key="option.value" :label="option.label" :value="option.value" />
+                                <el-select v-model="form.fapiaoKjfs" placeholder="请选择">
+                                    <el-option v-for="option in wz_invoicing_way" :key="option.value"
+                                        :label="option.label" :value="option.value" />
                                 </el-select>
                             </el-form-item>
                         </el-col>
@@ -273,26 +271,17 @@
                 <!-- 附件上传 -->
                 <div class="form-section">
                     <h3>附件上传</h3>
-                    <div class="upload-section">
-                        <el-upload class="upload-demo" action="" :on-preview="handlePreview" :on-remove="handleRemove"
-                            :before-remove="beforeRemove" multiple :limit="5" :on-exceed="handleExceed"
-                            :file-list="newProcurementForm.fileList" list-type="text">
-                            <el-button type="primary" :icon="Upload">上传文件</el-button>
-                            <template #tip>
-                                <div class="el-upload__tip">
-                                    请将文件拖到此处，或点击上传<br>
-                                    最多上传5个文件，单个文件大小不超过20M
-                                </div>
-                            </template>
-                        </el-upload>
-                    </div>
+                    <file-upload ref="fileUploadRef" :isDrag="true" :file-list="form.opsCaigouPlanFilesBos"
+                        :is-show-tip="false"
+                        @update:file-list="handleUpdateFileList"
+                        :file-type="['doc', 'docx', 'xls', 'xlsx', 'ppt', 'pptx', 'txt', 'pdf', 'png', 'jpg', 'jpeg']" />
                 </div>
             </div>
             <template #footer>
                 <div class="dialog-footer">
                     <el-button @click="cancelNewProcurement">取消</el-button>
-                    <el-button @click="saveDraft">保存草稿</el-button>
-                    <el-button type="primary" @click="submitProcurement">提交申请</el-button>
+                    <el-button @click="saveDraft" :loading="buttonLoading">保存草稿</el-button>
+                    <el-button type="primary" @click="submitProcurement" :loading="buttonLoading">提交申请</el-button>
                 </div>
             </template>
         </el-dialog>
@@ -373,344 +362,258 @@
 </style>
 <script setup lang="ts">
 import { ref, reactive, computed } from 'vue';
-import { useRouter } from 'vue-router';
-import { Upload } from '@element-plus/icons-vue';
 import { ElMessage, ElMessageBox } from 'element-plus';
 import { useProcurementDraftStore } from '@/store/modules/procurementDraft';
 const { proxy } = getCurrentInstance() as ComponentInternalInstance;
-const { wz_invoicing_way,wz_payment_terms,wz_purchase_type,wz_contract_type} = toRefs<any>(proxy?.useDict('wz_invoicing_way','wz_payment_terms','wz_purchase_type','wz_contract_type'));
+const { wz_invoicing_way, wz_payment_terms, wz_purchase_type, wz_contract_type, wz_caigou_examine } = toRefs<any>(proxy?.useDict('wz_invoicing_way', 'wz_payment_terms', 'wz_purchase_type', 'wz_contract_type', 'wz_caigou_examine'));
 
+import { listCaigouPlan, getSupplierList, addCaigouPlan } from '@/api/wuziguanli/caigouPlan';
+import { CaigouPlanVO, CaigouPlanQuery, CaigouPlanForm } from '@/api/wuziguanli/caigouPlan/types';
+
+import { useRouter } from 'vue-router';
 const router = useRouter();
+
+
+// 导入用户store
+import { useUserStore } from '@/store/modules/user';
+// 获取用户store
+const userStore = useUserStore();
+
+const caigouPlanList = ref<CaigouPlanVO[]>([]);
+const buttonLoading = ref(false);
+const loading = ref(true);
+const total = ref(0);
+
+const initFormData: CaigouPlanForm = {
+    id: undefined,
+    projectId: undefined,
+    jihuaName: undefined,
+    jihuaBianhao: undefined,
+    caigouDanwei: undefined,
+    caigouDanweiName: undefined,
+    jingbanren: undefined,
+    jingbanrenName: undefined,
+    hetonType: undefined,
+    caigouType: undefined,
+    cangkuUrl: undefined,
+    hetonName: undefined,
+    gonyingshangId: 1,
+    chuhuoTime: undefined,
+    fukuantiaojian: undefined,
+    fapiaoKjfs: undefined,
+    status: undefined,
+    shenheStatus: undefined,
+    yujiJine: undefined,
+    shijiJine: undefined,
+    opsCaigouPlanFilesBos: [],
+    opsCaigouPlanChanpinBos: [
+        {
+            chanpinName: '',
+            chanpinType: '',
+            chanpinMonovalent: 0,
+            goumaiNumber: 0,
+            danwei: '',
+            totalPrice: 0
+        }
+    ],
+}
+const data = reactive<PageData<CaigouPlanForm, CaigouPlanQuery>>({
+    form: { ...initFormData },
+    queryParams: {
+        pageNum: 1,
+        pageSize: 10,
+        projectId: undefined,
+        jihuaName: undefined,
+        jihuaBianhao: undefined,
+        caigouDanwei: undefined,
+        caigouDanweiName: undefined,
+        jingbanren: undefined,
+        jingbanrenName: undefined,
+        hetonType: undefined,
+        caigouType: undefined,
+        cangkuUrl: undefined,
+        hetonName: undefined,
+        gonyingshangId: 1,
+        chuhuoTime: undefined,
+        fukuantiaojian: undefined,
+        fapiaoKjfs: undefined,
+        status: undefined,
+        shenheStatus: undefined,
+        yujiJine: undefined,
+        shijiJine: undefined,
+        opsCaigouPlanChanpinBos: [
+            {
+                chanpinName: '',
+                chanpinType: '',
+                chanpinMonovalent: 0,
+                goumaiNumber: 0,
+                danwei: '',
+                totalPrice: 0
+            }
+        ],
+        opsCaigouPlanFilesBos: undefined,
+        params: {
+        }
+    },
+    rules: {}
+});
+   
+const { queryParams, form, rules } = toRefs(data);
+
+/** 查询运维-物资-采购计划单列表 */
+const getList = async () => {
+    loading.value = true;
+    const res = await listCaigouPlan(queryParams.value);
+    caigouPlanList.value = res.rows;
+    total.value = res.total;
+    loading.value = false;
+}
+// 新增采购计划单
+const addCaigouPlans = async () => {
+    buttonLoading.value = true; // 显示按钮加载状态
+    try {
+        // 提交表单数据到后端
+        const res = await addCaigouPlan(form.value);
+        
+        if (res.code === 200) {
+            ElMessage({ message: '采购申请单已成功提交，等待审批！', type: 'success' });
+            
+            // 刷新列表数据
+            getList();
+            
+            // 关闭对话框并重置表单
+            resetNewProcurementForm();
+            isNewProcurementDialogVisible.value = false;
+        } else {
+            // 显示详细的错误信息
+            ElMessage({ 
+                message: res.msg || '新增采购计划单失败，请重试', 
+                type: 'error'
+            });
+        }
+    } catch (error) {
+        ElMessage({ message: '失败', type: 'error' });
+    } finally {
+        buttonLoading.value = false; // 无论成功失败，都关闭加载状态
+    }
+}
+
+
+
+// 采购商列表
+const supplierList = ref([]);
+const getSupplierLists = async () => {
+    const res = await getSupplierList({
+        projectId: userStore.selectedProject.id
+    });
+    supplierList.value = res.rows;
+
+}
+
+
+
+onMounted(() => {
+    getList();
+    getSupplierLists();
+});
+// 监听用户选择的项目变化
+watch(() => userStore.selectedProject, (newProject) => {
+    if (newProject && newProject.id) {
+        queryParams.value.projectId = newProject.id;
+        // 只在新增表单时设置projectId，编辑表单保留原有值
+        if (!form.value.id) {
+            form.value.projectId = newProject.id;
+        }
+        // 调用getList刷新数据
+        getList();
+    }
+}, { immediate: true, deep: true });
 // 新建采购申请单对话框是否可见
 const isNewProcurementDialogVisible = ref(false);
 
-// 当前激活的标签页
-const activeTab = ref('pending');
-
-// 计算各状态的数量
-const pendingCount = computed(() => {
-    return tableData.value.filter(item => item.status === '待审批').length;
-});
-
-const purchasingCount = computed(() => {
-    return tableData.value.filter(item => item.status === '采购中').length;
-});
-
-const rejectedCount = computed(() => {
-    return tableData.value.filter(item => item.status === '未通过').length;
-});
-
-const approvedCount = computed(() => {
-    return tableData.value.filter(item => item.status === '已通过').length;
-});
-
-const completedCount = computed(() => {
-    return tableData.value.filter(item => item.status === '已完成').length;
-});
-// 下拉框选项数据
-const contractAddressOptions = [
-    { label: '主仓库', value: 'main' },
-    { label: '一号仓库', value: 'warehouse1' },
-    { label: '二号仓库', value: 'warehouse2' },
-    { label: '三号仓库', value: 'warehouse3' },
-    { label: '车间仓库', value: 'workshop' }
-];
-
-const supplierUnitOptions = [
-    { label: '供应商A', value: 'supplierA' },
-    { label: '供应商B', value: 'supplierB' },
-    { label: '供应商C', value: 'supplierC' },
-    { label: '供应商D', value: 'supplierD' },
-    { label: '供应商E', value: 'supplierE' }
-];
-
-
-
-
-
-
-
-// 新建采购申请单表单数据
-const newProcurementForm = reactive({
-    planName: '',
-    contractName: '',
-    contractType: '',
-    procurementType: '',
-    contractAddress: '',
-    supplierUnit: '',
-    deliveryTime: '',
-    paymentTerms: '',
-    settlementMethod: '',
-    products: [{
-        productName: '',
-        productModel: '',
-        productPrice: '',
-        purchaseQuantity: '',
-        unit: ''
-    }],
-    fileList: []
-});
-// 表格数据
-const tableData = ref([
-    {
-        planNumber: 'PLAN-2023-0615-001',
-        planName: 'Q2风电轴承采购计划',
-        equipmentType: '风电设备',
-        requestDept: '运维部',
-        applicant: '王主管',
-        requestDate: '2023-06-15 10:30',
-        estimatedAmount: '300,000.00',
-        status: '待审批'
-    },
-    {
-        planNumber: 'PLAN-2023-0615-002',
-        planName: '发电机维修备件采购',
-        equipmentType: '发电设备',
-        requestDept: '维修部',
-        applicant: '李工程师',
-        requestDate: '2023-06-16 09:15',
-        estimatedAmount: '150,000.00',
-        status: '待审批'
-    },
-    {
-        planNumber: 'PLAN-2023-0615-003',
-        planName: 'Q2润滑油采购计划',
-        equipmentType: '通用设备',
-        requestDept: '运维部',
-        applicant: '张助理',
-        requestDate: '2023-06-17 14:20',
-        estimatedAmount: '50,000.00',
-        status: '待审批'
-    },
-    {
-        planNumber: 'PLAN-2023-0614-004',
-        planName: '液压系统配件采购',
-        equipmentType: '液压设备',
-        requestDept: '工程部',
-        applicant: '赵经理',
-        requestDate: '2023-06-14 11:45',
-        estimatedAmount: '220,000.00',
-        status: '采购中'
-    },
-    {
-        planNumber: 'PLAN-2023-0613-005',
-        planName: '控制面板更新采购',
-        equipmentType: '电气设备',
-        requestDept: '电气部',
-        applicant: '陈工程师',
-        requestDate: '2023-06-13 16:10',
-        estimatedAmount: '180,000.00',
-        status: '采购中'
-    },
-    {
-        planNumber: 'PLAN-2023-0612-006',
-        planName: '安全防护装备采购',
-        equipmentType: '安全设备',
-        requestDept: '安全部',
-        applicant: '孙主管',
-        requestDate: '2023-06-12 08:50',
-        estimatedAmount: '80,000.00',
-        status: '未通过'
-    },
-    {
-        planNumber: 'PLAN-2023-0611-007',
-        planName: '水泵维修配件采购',
-        equipmentType: '水处理设备',
-        requestDept: '水处理部',
-        applicant: '周工程师',
-        requestDate: '2023-06-11 13:30',
-        estimatedAmount: '60,000.00',
-        status: '已通过'
-    },
-    {
-        planNumber: 'PLAN-2023-0610-008',
-        planName: '风机叶片检测设备采购',
-        equipmentType: '检测设备',
-        requestDept: '质检部',
-        applicant: '吴经理',
-        requestDate: '2023-06-10 10:20',
-        estimatedAmount: '450,000.00',
-        status: '已通过'
-    },
-    {
-        planNumber: 'PLAN-2023-0609-009',
-        planName: '仓库货架更新采购',
-        equipmentType: '仓储设备',
-        requestDept: '仓储部',
-        applicant: '郑主管',
-        requestDate: '2023-06-09 15:40',
-        estimatedAmount: '90,000.00',
-        status: '已完成'
-    },
-    {
-        planNumber: 'PLAN-2023-0608-010',
-        planName: '办公设备更新采购',
-        equipmentType: '办公设备',
-        requestDept: '行政部',
-        applicant: '冯助理',
-        requestDate: '2023-06-08 11:10',
-        estimatedAmount: '120,000.00',
-        status: '已完成'
-    },
-    {
-        planNumber: 'PLAN-2023-0607-011',
-        planName: '消防设备年检采购',
-        equipmentType: '消防设备',
-        requestDept: '安全部',
-        applicant: '蒋经理',
-        requestDate: '2023-06-07 09:30',
-        estimatedAmount: '40,000.00',
-        status: '已完成'
-    },
-    {
-        planNumber: 'PLAN-2023-0606-012',
-        planName: '网络设备升级采购',
-        equipmentType: 'IT设备',
-        requestDept: 'IT部',
-        applicant: '沈工程师',
-        requestDate: '2023-06-06 14:50',
-        estimatedAmount: '160,000.00',
-        status: '已完成'
-    }
-]);
-
-// 分页相关
-const currentPage = ref(1);
-const pageSize = ref(10);
-const total = computed(() => filteredTableData.value.length);
-
-// 状态映射关系
-const statusMap = {
-    pending: '待审批',
-    purchasing: '采购中',
-    rejected: '未通过',
-    approved: '已通过',
-    completed: '已完成'
-};
-
-// 根据activeTab筛选后的数据
-const filteredTableData = computed(() => {
-    if (activeTab.value === 'all') {
-        return tableData.value;
-    }
-    return tableData.value.filter(item => item.status === statusMap[activeTab.value]);
-});
-
-// 切换标签页
-const changeTab = (tab) => {
-    activeTab.value = tab;
-    currentPage.value = 1; // 切换标签页时重置到第一页
-};
-
-// 获取状态标签类型
-const getStatusTagType = (status) => {
-    switch (status) {
-        case '待审批':
-            return 'warning';
-        case '采购中':
-            return 'info';
-        case '未通过':
-            return 'danger';
-        case '已通过':
-            return 'primary';
-        case '已完成':
-            return 'success';
-        default:
-            return '';
-    }
-};
-
-// 查看详情
+// 跳转查看详情
 const handleView = (row) => {
-    console.log('查看采购计划详情:', row);
     router.push({
         path: '/materialManagement/planDetails',
         query: {
-            planNumber: row.planNumber
+            id: row.id
         }
     });
-    // 这里可以实现查看详情的逻辑，比如打开详情弹窗或跳转到详情页
 };
-
-// 分页大小变化
-const handleSizeChange = (size) => {
-    pageSize.value = size;
-    currentPage.value = 1;
-};
-
-// 当前页码变化
-const handleCurrentChange = (current) => {
-    currentPage.value = current;
-};
-
 // 计算产品总价
 const calculateTotalPrice = (row) => {
-    if (!row.productPrice || !row.purchaseQuantity) {
+    if (!row.chanpinMonovalent || !row.goumaiNumber) {
+        row.totalPrice = '0.00'; // 保存计算结果到对象中
         return '0.00';
     }
-    const price = parseFloat(row.productPrice);
-    const quantity = parseInt(row.purchaseQuantity);
+    const price = parseFloat(row.chanpinMonovalent);
+    const quantity = parseInt(row.goumaiNumber);
     if (isNaN(price) || isNaN(quantity)) {
+        row.totalPrice = '0.00'; // 保存计算结果到对象中
         return '0.00';
     }
-    return (price * quantity).toFixed(2);
+    const result = (price * quantity).toFixed(2);
+    row.totalPrice = result; // 保存计算结果到对象中
+    return result;
 };
 
 // 添加产品
 const addProduct = () => {
-    newProcurementForm.products.push({
-        productName: '',
-        productModel: '',
-        productPrice: '',
-        purchaseQuantity: '',
-        unit: ''
+    form.value.opsCaigouPlanChanpinBos.push({
+        chanpinName: '',
+        chanpinType: '',
+        chanpinMonovalent: 0,
+        goumaiNumber: 0,
+        danwei: '',
+        totalPrice: 0
     });
 };
 
 // 删除产品
 const removeProduct = (index) => {
-    if (newProcurementForm.products.length <= 1) {
+    if (form.value.opsCaigouPlanChanpinBos.length <= 1) {
         ElMessage({ message: '至少保留一个产品信息', type: 'warning' });
         return;
     }
-    newProcurementForm.products.splice(index, 1);
+    form.value.opsCaigouPlanChanpinBos.splice(index, 1);
 };
 
 // 重置新建采购申请表单
 const resetNewProcurementForm = () => {
-    newProcurementForm.planName = '';
-    newProcurementForm.contractName = '';
-    newProcurementForm.contractType = '';
-    newProcurementForm.procurementType = '';
-    newProcurementForm.contractAddress = '';
-    newProcurementForm.supplierUnit = '';
-    newProcurementForm.deliveryTime = '';
-    newProcurementForm.paymentTerms = '';
-    newProcurementForm.settlementMethod = '';
-    newProcurementForm.products = [{
-        productName: '',
-        productModel: '',
-        productPrice: '',
-        purchaseQuantity: '',
-        unit: ''
+    form.value.jihuaName = '';
+    form.value.hetonName = '';
+    form.value.hetonType = '';
+    form.value.caigouType = '';
+    form.value.cangkuUrl = '';
+    form.value.danwei = '';
+    form.value.chuhuoTime = '';
+    form.value.fukuantiaojian = '';
+    form.value.fapiaoKjfs = '';
+    form.value.opsCaigouPlanChanpinBos = [{
+        chanpinName: '',
+        chanpinType: '',
+        chanpinMonovalent: '',
+        goumaiNumber: '',
+        danwei: '',
+        totalPrice: ''
     }];
-    newProcurementForm.fileList = [];
+    form.value.opsCaigouPlanFilesBos = [];
 };
 
 // 取消新建采购申请
 const cancelNewProcurement = () => {
     // 检查是否有未保存的内容
-    const hasContent = Object.values(newProcurementForm).some(value => {
+    const hasContent = Object.values(form.value).some(value => {
         if (Array.isArray(value)) {
-            return value.length > 0 && 
-                   value.some(item => 
-                       typeof item === 'object' && 
-                       Object.values(item).some(v => v)
-                   );
+            return value.length > 0 &&
+                value.some(item =>
+                    typeof item === 'object' &&
+                    Object.values(item).some(v => v)
+                );
         }
         return !!value;
     });
-    
+
     if (hasContent) {
         ElMessageBox.confirm('表单内容尚未保存，确定要关闭吗？', '提示', {
             confirmButtonText: '确定',
@@ -729,15 +632,15 @@ const cancelNewProcurement = () => {
 // 草稿校验函数
 const validateDraft = () => {
     // 草稿只需要计划名称作为必填项
-    if (!newProcurementForm.planName.trim()) {
+    if (!form.value.jihuaName.trim()) {
         ElMessage({ message: '请填写计划名称', type: 'error' });
         return false;
     }
-    
+
     // 检查已填写的产品信息的有效性
-    for (let i = 0; i < newProcurementForm.products.length; i++) {
-        const product = newProcurementForm.products[i];
-        if (product.productName && !product.productModel) {
+    for (let i = 0; i < form.value.opsCaigouPlanChanpinBos.length; i++) {
+        const product = form.value.opsCaigouPlanChanpinBos[i];
+        if (product.chanpinName && !product.chanpinType) {
             ElMessage({ message: `第${i + 1}行产品：填写了产品名称，请也填写产品型号`, type: 'warning' });
         }
         if (product.productPrice && parseFloat(product.productPrice) <= 0) {
@@ -747,193 +650,169 @@ const validateDraft = () => {
             ElMessage({ message: `第${i + 1}行产品：购买数量应大于0`, type: 'warning' });
         }
     }
-    
+
     return true;
 };
 
 // 保存草稿
-const saveDraft = () => {
+const saveDraft = async () => {
     // 验证草稿
     if (!validateDraft()) {
         return;
     }
-    
-    // 使用pinia store保存草稿
-    const draftStore = useProcurementDraftStore();
-    const savedDraft = draftStore.saveDraft(newProcurementForm.planName, newProcurementForm);
-    
-    console.log('保存草稿:', {
-        draftNumber: savedDraft.draftNumber,
-        saveTime: savedDraft.saveTime,
-        content: savedDraft.content
-    });
-    
-    ElMessage({ message: `草稿已成功保存（编号：${savedDraft.draftNumber}），您可以在草稿箱中查看`, type: 'success' });
+
+    buttonLoading.value = true; // 显示按钮加载状态
+    try {
+        // 使用pinia store保存草稿
+        const draftStore = useProcurementDraftStore();
+        const savedDraft = draftStore.saveDraft(form.value.jihuaName, form.value);
+
+        console.log('保存草稿:', {
+            draftNumber: savedDraft.draftNumber,
+            saveTime: savedDraft.saveTime,
+            content: savedDraft.content
+        });
+
+        ElMessage({ message: `草稿已成功保存（编号：${savedDraft.draftNumber}），您可以在草稿箱中查看`, type: 'success' });
+    } catch (error) {
+        console.error('保存草稿失败:', error);
+        ElMessage({ 
+            message: '保存草稿失败，请重试', 
+            type: 'error'
+        });
+    } finally {
+        buttonLoading.value = false; // 无论成功失败，都关闭加载状态
+    }
 };
 
 // 表单校验函数
 const validateForm = () => {
     // 基础信息校验
-    if (!newProcurementForm.planName.trim()) {
+    if (!form.value.jihuaName.trim()) {
         ElMessage({ message: '请填写计划名称', type: 'error' });
         return false;
     }
-    
-    if (!newProcurementForm.contractName.trim()) {
+
+    if (!form.value.hetonName.trim()) {
         ElMessage({ message: '请填写合同名称', type: 'error' });
         return false;
     }
-    
-    if (!newProcurementForm.contractType) {
+
+    if (!form.value.hetonType) {
         ElMessage({ message: '请选择合同类型', type: 'error' });
         return false;
     }
-    
-    if (!newProcurementForm.procurementType) {
+
+    if (!form.value.caigouType) {
         ElMessage({ message: '请选择采购类型', type: 'error' });
         return false;
     }
-    
-    if (!newProcurementForm.contractAddress) {
+
+    if (!form.value.cangkuUrl) {
         ElMessage({ message: '请选择仓库地址', type: 'error' });
         return false;
     }
-    
-    if (!newProcurementForm.supplierUnit) {
+
+    if (!form.value.danwei) {
         ElMessage({ message: '请选择供应商单位', type: 'error' });
         return false;
     }
-    
+
     // 产品信息校验
-    const hasValidProduct = newProcurementForm.products.some(product => {
-        return product.productName && 
-               product.productModel && 
-               product.productPrice && parseFloat(product.productPrice) > 0 && 
-               product.purchaseQuantity && parseInt(product.purchaseQuantity) > 0 && 
-               product.unit;
+    const hasValidProduct = form.value.opsCaigouPlanChanpinBos.some(product => {
+        return product.chanpinName &&
+            product.chanpinType &&
+            product.chanpinMonovalent && parseFloat(product.chanpinMonovalent) > 0 &&
+            product.goumaiNumber && parseInt(product.goumaiNumber) > 0 &&
+            product.danwei;
     });
-    
+
     if (!hasValidProduct) {
         ElMessage({ message: '请至少填写一个有效的产品信息', type: 'error' });
         return false;
     }
-    
+
     // 检查每个产品的有效性
-    for (let i = 0; i < newProcurementForm.products.length; i++) {
-        const product = newProcurementForm.products[i];
-        if (product.productName || product.productModel || product.productPrice || product.purchaseQuantity || product.unit) {
-            if (!product.productName) {
+    for (let i = 0; i < form.value.opsCaigouPlanChanpinBos.length; i++) {
+        const product = form.value.opsCaigouPlanChanpinBos[i];
+        if (product.chanpinName || product.chanpinType || product.chanpinMonovalent || product.goumaiNumber) {
+            if (!product.chanpinName) {
                 ElMessage({ message: `第${i + 1}行产品：请填写产品名称`, type: 'error' });
                 return false;
             }
-            if (!product.productModel) {
+            if (!product.chanpinType) {
                 ElMessage({ message: `第${i + 1}行产品：请填写产品型号`, type: 'error' });
                 return false;
             }
-            if (!product.productPrice) {
+            if (!product.chanpinMonovalent) {
                 ElMessage({ message: `第${i + 1}行产品：请填写产品单价`, type: 'error' });
                 return false;
             }
-            if (parseFloat(product.productPrice) <= 0) {
+            if (parseFloat(product.chanpinMonovalent) <= 0) {
                 ElMessage({ message: `第${i + 1}行产品：产品单价必须大于0`, type: 'error' });
                 return false;
             }
-            if (!product.purchaseQuantity) {
+            if (!product.goumaiNumber) {
                 ElMessage({ message: `第${i + 1}行产品：请填写购买数量`, type: 'error' });
                 return false;
             }
-            if (parseInt(product.purchaseQuantity) <= 0) {
+            if (parseInt(product.goumaiNumber) <= 0) {
                 ElMessage({ message: `第${i + 1}行产品：购买数量必须大于0`, type: 'error' });
                 return false;
             }
-            if (!product.unit) {
+            if (!product.danwei) {
                 ElMessage({ message: `第${i + 1}行产品：请填写单位`, type: 'error' });
                 return false;
             }
         }
     }
-    
+
     return true;
 };
 
 // 提交申请
-const submitProcurement = () => {
+const submitProcurement = async () => {
+    // 在提交前，为所有产品行重新计算并保存总价
+    form.value.opsCaigouPlanChanpinBos.forEach(product => {
+        calculateTotalPrice(product);
+    });
+
     // 表单验证
     if (!validateForm()) {
         return;
     }
-    
-    // 确认提交
-    ElMessageBox.confirm('确定要提交采购申请单吗？提交后将进入审批流程，不可撤销。', '确认提交', {
-        confirmButtonText: '确认提交',
-        cancelButtonText: '取消',
-        type: 'warning'
-    }).then(() => {
-        // 计算总金额
-        const totalAmount = newProcurementForm.products.reduce((sum, product) => {
-            const price = parseFloat(product.productPrice) || 0;
-            const quantity = parseInt(product.purchaseQuantity) || 0;
-            return sum + (price * quantity);
-        }, 0);
-        
-        // 生成计划编号
-        const today = new Date();
-        const dateStr = today.getFullYear() + '-' + 
-                       String(today.getMonth() + 1).padStart(2, '0') + '-' + 
-                       String(today.getDate()).padStart(2, '0');
-        const randomNum = Math.floor(100 + Math.random() * 900);
-        const planNumber = `PLAN-${dateStr}-${randomNum}`;
-        
-        // 模拟提交数据
-        const newPlan = {
-            planNumber: planNumber,
-            planName: newProcurementForm.planName,
-            equipmentType: newProcurementForm.procurementType,
-            requestDept: '当前部门',
-            applicant: '当前用户',
-            requestDate: new Date().toLocaleString(),
-            estimatedAmount: totalAmount.toFixed(2),
-            status: '待审批'
-        };
-        
-        // 添加到表格数据中
-        tableData.value.unshift(newPlan);
-        
-        ElMessage({ message: '采购申请单已成功提交，等待审批！', type: 'success' });
-        
-        // 关闭对话框并重置表单
-        resetNewProcurementForm();
-        isNewProcurementDialogVisible.value = false;
-    }).catch(() => {
-        // 用户取消了提交
-    });
-};
 
-// 文件上传相关方法
-const handlePreview = (uploadFile) => {
-    console.log('预览文件:', uploadFile);
-    ElMessage({ message: '文件预览功能待实现', type: 'info' });
-};
+    try {
+        // 确认提交
+        await ElMessageBox.confirm(
+            '确定要提交采购申请单吗？提交后将进入审批流程，不可撤销。', 
+            '确认提交', 
+            {
+                confirmButtonText: '确认提交',
+                cancelButtonText: '取消',
+                type: 'warning'
+            }
+        );
 
-const handleRemove = (uploadFile, uploadFiles) => {
-    console.log('删除文件:', uploadFile);
-    // 从fileList中移除文件
-    const index = newProcurementForm.fileList.findIndex(file => file.uid === uploadFile.uid);
-    if (index !== -1) {
-        newProcurementForm.fileList.splice(index, 1);
-        ElMessage({ message: `文件 "${uploadFile.name}" 已移除`, type: 'success' });
+        // 调用提交函数
+        await addCaigouPlans();
+
+    } catch (error) {
+        // 处理用户取消或其他错误
+        if (error !== 'cancel') {
+            console.error('提交采购申请单时发生错误:', error);
+            ElMessage({ message: '提交过程中发生错误，请重试', type: 'error' });
+        }
     }
-};
+}
+    // });
 
-const beforeRemove = (uploadFile, uploadFiles) => {
-    return ElMessageBox.confirm(`确定要删除文件 "${uploadFile.name}" 吗？`, '确认删除', {
-        confirmButtonText: '确认',
-        cancelButtonText: '取消',
-        type: 'warning'
-    });
-};
-
-const handleExceed = (files, uploadFiles) => {
-    ElMessage({ message: '最多只能上传5个文件，已自动过滤多余文件', type: 'warning' });
+// 处理文件上传完成后获取完整文件列表
+const handleUpdateFileList = (fileList) => {
+    form.value.opsCaigouPlanFilesBos = fileList.map(file => ({
+        fileId: file.ossId,
+        fileName: file.name,
+        fileUrl: file.url,
+    }));
 };
 </script>
\ No newline at end of file