采购单

src/views/materials/appointment/index.vue

@@ -1,15 +1,16 @@
 <template>
-  <div class="p-6 bg-gray-50">
+  <div class="p-6 bg-gray-50 pt-50">
     <div class="appWidth mx-auto bg-white rounded-xl shadow-sm overflow-hidden transition-all duration-300 hover:shadow-md">
       <!-- 表单标题区域 -->
       <div class="bg-gradient-to-r from-blue-500 to-blue-600 text-white p-6">
         <h2 class="text-2xl font-bold flex items-center"><i class="el-icon-user-circle mr-3"></i>人员配置</h2>
         <p class="text-blue-100 mt-2 opacity-90">请配置采购专员信息</p>
         <!-- ，带 <span class="text-red-300">*</span> 为必填项 -->
+        <el-button @click="isDisabled = false" class="px-8 py-2.5 transition-all duration-300 font-medium" v-if="isDisabled"> 点击编辑 </el-button>
       </div>
 
       <!-- 表单内容区域 -->
-      <el-form ref="leaveFormRef" :model="form" :rules="rules" label-width="120px" class="p-6 space-y-6">
+      <el-form ref="leaveFormRef" :model="form" :rules="rules" label-width="120px" class="p-6 pt30 space-y-6 h75" :disabled="isDisabled">
         <!-- 设计负责人 -->
         <div class="fonts">
           <el-form-item label="采购专员" prop="userId" class="mb-4">
@@ -24,7 +25,7 @@
         </div>
 
         <!-- 提交按钮区域 -->
-        <div class="flex justify-center space-x-6 mt-8 pt-6 border-t border-gray-100">
+        <div class="flex justify-center space-x-6 mt-8 pt-6 border-t border-gray-100" v-if="!isDisabled">
           <el-button
             type="primary"
             @click="submitForm"
@@ -60,6 +61,7 @@ const userStore = useUserStoreHook();
 const currentProject = computed(() => userStore.selectedProject);
 // 专业字典数据
 const { des_user_major } = toRefs<any>(proxy?.useDict('des_user_major'));
+const isDisabled = ref(false);
 
 // 表单数据
 const form = reactive({
@@ -106,9 +108,12 @@ const designUser = async () => {
       if (!res.data) {
         resetForm();
         form.id = null;
+        isDisabled.value = false;
+
         return;
       }
       Object.assign(form, res.data);
+      isDisabled.value = true;
     }
   } catch (error) {
     ElMessage.error('获取配置数据失败');
@@ -136,6 +141,7 @@ const submitForm = async () => {
     const res = await designUserAdd(data);
     if (res.code === 200) {
       ElMessage.success('提交成功');
+      isDisabled.value = true;
     } else {
       ElMessage.error(res.msg || '提交失败');
     }