fix: 增加表单校验

src/views/project/project-manage/project-create/index.vue

@@ -9,12 +9,13 @@
               <span class="basic-title-text">项目信息</span>
             </div>
             <div class="basic-title-right">
+              <a-button type="primary" @click="reset">重置</a-button>
               <a-button type="primary" @click="submit">提交</a-button>
             </div>
           </div>
           <div class="steps-content">
             <a-row :gutter="16" class="smart-query-form-row">
-              <a-col :span="8">
+              <a-col :span="16">
                 <a-form-item label="项目名称" name="deliveryName" class="smart-query-form-item">
                   <a-input v-model:value="formModel.deliveryName" placeholder="请输入项目名称" />
                 </a-form-item>
@@ -24,91 +25,66 @@
                   <DictSelect key-code="MATE_DELIVERY_TYPE" v-model:value="formModel.deliveryType" placeholder="请选择项目类型" width="100%" />
                 </a-form-item>
               </a-col>
-              <a-col :span="8">
-                <a-form-item label="项目类别" name="deliveryType" class="smart-query-form-item">
-                  <DictSelect key-code="MATE_DELIVERY_TYPE" v-model:value="formModel.deliveryType" placeholder="请选择项目类型" width="100%" />
-                </a-form-item>
-              </a-col>
             </a-row>
             <a-row :gutter="16" class="smart-query-form-row">
               <a-col :span="8">
-                <a-form-item label="项目状态" name="customerType" class="smart-query-form-item">
-                  <DictSelect key-code="MATE_CUSTOMER_TYPE" v-model:value="formModel.customerType" placeholder="请选择项目状态" width="100%" />
-                </a-form-item>
-              </a-col>
-              <a-col :span="8">
-                <a-form-item label="客户名称" name="customerName" class="smart-query-form-item">
-                  <a-input v-model:value="formModel.customerName" placeholder="请输入客户名称" />
-                </a-form-item>
-              </a-col>
-              <a-col :span="8">
-                <a-form-item label="服务客户" name="deliveryType" class="smart-query-form-item">
-                  <DictSelect key-code="MATE_DELIVERY_TYPE" v-model:value="formModel.deliveryType" placeholder="请选择项目类型" width="100%" />
+                <a-form-item label="项目状态" name="deliveryStatus" class="smart-query-form-item">
+                  <DictSelect key-code="MATE_DELIVERY_STATUS" v-model:value="formModel.deliveryStatus" placeholder="请选择项目状态" width="100%" />
                 </a-form-item>
               </a-col>
-            </a-row>
-            <a-row :gutter="16" class="smart-query-form-row">
               <a-col :span="8">
-                <a-form-item label="客户经理" name="deliveryCharge1" class="smart-query-form-item">
+                <a-form-item label="交付经理" name="deliveryCharge1" class="smart-query-form-item">
                   <a-input
                     v-model:value="formModel.deliveryCharge1"
                     placeholder="请选择岗位人员"
-                    @click="showSelectUser('deliveryManager')"
-                    allowClear
+                    @click="showSelectUser('deliveryManager', index)"
+                    readonly
+                  />
+                  <EmployeeTableSelectModal
+                    ref="selectDeliveryManagerRef"
+                    type="radio"
+                    @selectDataList="selectedUser('deliveryManager', index, $event)"
                   />
-                  <EmployeeTableSelectModal ref="selectDeliveryManagerRef" type="radio" @selectDataList="selectedUser('deliveryManager', $event)" />
                 </a-form-item>
               </a-col>
               <a-col :span="8">
-                <a-form-item label="项目经理" name="marketManagerCode" class="smart-query-form-item">
+                <a-form-item label="营销经理" name="marketManagerCode" class="smart-query-form-item">
                   <a-input
                     v-model:value="formModel.marketManagerCode"
                     placeholder="请选择岗位人员"
-                    @click="showSelectUser('marketManager')"
-                    allowClear
+                    @click="showSelectMarketManager('marketManager', index)"
+                    readonly
                   />
-                  <EmployeeTableSelectModal ref="selectMarketManagerRef" type="radio" @selectDataList="selectedUser('marketManager', $event)" />
-                </a-form-item>
-              </a-col>
-              <a-col :span="8">
-                <a-form-item label="产品经理" name="productManagerCode" class="smart-query-form-item">
-                  <a-input
-                    v-model:value="formModel.productManagerCode"
-                    placeholder="请选择岗位人员"
-                    @click="showSelectUser('productManager')"
-                    allowClear
+                  <EmployeeTableSelectModal
+                    ref="selectMarketManagerRef"
+                    type="radio"
+                    @selectDataList="selectedMarketManager('marketManager', index, $event)"
                   />
-                  <EmployeeTableSelectModal ref="selectProductManagerRef" @selectDataList="selectedUser('productManager', $event)" />
                 </a-form-item>
               </a-col>
             </a-row>
+          </div>
+        </div>
+        <div>
+          <div class="basic-title">
+            <div class="basic-title-left">
+              <div class="basic-title-line"></div>
+              <span class="basic-title-text">客户信息</span>
+            </div>
+            <div class="basic-title-right">
+              <!-- <a-button type="primary">提交</a-button> -->
+            </div>
+          </div>
+          <div class="steps-content">
             <a-row :gutter="16" class="smart-query-form-row">
               <a-col :span="8">
-                <a-form-item label="前端开发" name="frontendDeveloper" class="smart-query-form-item">
-                  <a-input
-                    v-model:value="formModel.frontendDeveloper"
-                    placeholder="请选择岗位人员"
-                    @click="showSelectUser('frontendDeveloper')"
-                    allowClear
-                  />
-                  <EmployeeTableSelectModal ref="selectFrontendDeveloperRef" @selectDataList="selectedUser('frontendDeveloper', $event)" />
-                </a-form-item>
-              </a-col>
-              <a-col :span="8">
-                <a-form-item label="后端开发" name="backendDeveloper" class="smart-query-form-item">
-                  <a-input
-                    v-model:value="formModel.backendDeveloper"
-                    placeholder="请选择岗位人员"
-                    @click="showSelectUser('backendDeveloper')"
-                    allowClear
-                  />
-                  <EmployeeTableSelectModal ref="selectBackendDeveloperRef" @selectDataList="selectedUser('backendDeveloper', $event)" />
+                <a-form-item label="客户名称" name="customerName" class="smart-query-form-item">
+                  <a-input v-model:value="formModel.customerName" placeholder="请输入客户名称" />
                 </a-form-item>
               </a-col>
               <a-col :span="8">
-                <a-form-item label="测试" name="tester" class="smart-query-form-item">
-                  <a-input v-model:value="formModel.tester" placeholder="请选择岗位人员" @click="showSelectUser('tester')" allowClear />
-                  <EmployeeTableSelectModal ref="selectTesterRef" @selectDataList="selectedUser('tester', $event)" />
+                <a-form-item label="客户类型" name="customerType" class="smart-query-form-item">
+                  <DictSelect key-code="MATE_CUSTOMER_TYPE" v-model:value="formModel.customerType" placeholder="请选择项目状态" width="100%" />
                 </a-form-item>
               </a-col>
             </a-row>
@@ -153,7 +129,6 @@
     </a-form>
   </a-card>
 </template>
-
 <script setup>
   import { onMounted, reactive, ref, useAttrs } from 'vue';
   import { useRouter } from 'vue-router';
@@ -168,44 +143,35 @@
   const stepFormRef = ref(null);
   const router = useRouter();
 
-  // 数据
+  // --------------------- 数据 ---------------------
   const formModel = reactive({
-    deliveryName: undefined, // 项目名称
-    deliveryType: undefined, // 项目类型
-    deliveryStatus: undefined, // 项目状态
-    deliveryCharge: undefined, // 项目负责人
-    deliveryCharge1: undefined, // 客户经理显示的字符串
-    deliveryCharge1List: [], // 客户经理选中的用户列表
-    marketManager: undefined, // 营销经理
+    deliveryName: undefined, //项目名称
+    deliveryType: undefined, //项目类型
+    deliveryStatus: undefined, //项目状态
+    deliveryCharge: undefined, //项目负责人
+    deliveryCharge1: undefined,
+    marketManager: undefined, //营销经理
     marketManagerCode: undefined,
-    productManager: undefined, // 产品经理
-    productManagerCode: undefined,
-    customerName: undefined, // 客户名称
-    customerType: undefined, // 客户类型
-    remark: undefined, // 备注信息
-    attachment: undefined, // 附件集合
-    frontendDeveloper: undefined, // 前端开发
-    frontendDeveloperList: [],
-    backendDeveloper: undefined, // 后端开发
-    backendDeveloperList: [],
-    tester: undefined, // 测试
-    testerList: [],
+    customerName: undefined, //客户名称
+    customerType: undefined, //客户类型
+    remark: undefined, //	备注信息
+    attachment: undefined, //附件集合
   });
 
-  // 校验规则
+  // --------------------- 校验规则 ---------------------
   const formRules = {
     deliveryName: [{ required: true, message: '请输入项目名称', trigger: 'change' }],
     deliveryType: [{ required: true, message: '请选择项目类型', trigger: 'change' }],
     deliveryStatus: [{ required: true, message: '请选择项目状态', trigger: 'change' }],
-    deliveryCharge: [{ required: true, message: '请选择交付经理', trigger: 'change' }],
-    marketManager: [{ required: true, message: '请选择营销经理', trigger: 'change' }],
+    deliveryCharge1: [{ required: true, message: '请选择交付经理', trigger: 'change' }],
+    marketManagerCode: [{ required: true, message: '请选择营销经理', trigger: 'change' }],
     customerName: [{ required: true, message: '请输入客户名称', trigger: 'change' }],
     customerType: [{ required: true, message: '请选择客户类型', trigger: 'change' }],
   };
 
   const labelCol = { style: { width: '128px' } };
 
-  // 步骤相关
+  // ----------------------- 步骤相关 ---------------------------
   const query = router.currentRoute.value.query;
   console.log('query', query);
 
@@ -247,7 +213,8 @@
     }
   }
 
-  // 提交
+  //-----------------------------提交\重置---------------------------------
+
   const submit = () => {
     console.log('formModel', formModel);
     stepFormRef.value
@@ -276,45 +243,42 @@
     });
   };
 
-  // 重置
   const reset = () => {
     Object.keys(formModel).forEach((key) => {
       formModel[key] = undefined;
     });
   };
 
-  // 人员选择
+  //---------------------------人员选择------------------------------
+
   const selectDeliveryManagerRef = ref(null);
   const selectMarketManagerRef = ref(null);
-  const selectProductManagerRef = ref(null);
-  const selectFrontendDeveloperRef = ref(null);
-  const selectBackendDeveloperRef = ref(null);
-  const selectTesterRef = ref(null);
+  function showSelectMarketManager(type) {
+    if (type === 'marketManager') {
+      selectMarketManagerRef.value.showModal();
+    }
+  }
 
   function showSelectUser(type) {
-    const refs = {
-      deliveryManager: selectDeliveryManagerRef,
-      marketManager: selectMarketManagerRef,
-      productManager: selectProductManagerRef,
-      frontendDeveloper: selectFrontendDeveloperRef,
-      backendDeveloper: selectBackendDeveloperRef,
-      tester: selectTesterRef,
-    };
-    refs[type].value.showModal();
+    if (type === 'deliveryManager') {
+      selectDeliveryManagerRef.value.showModal();
+    }
+  }
+  function selectedUser(field, index, list) {
+    if (field === 'deliveryManager') {
+      formModel.deliveryCharge1 = list[0].actualName;
+      formModel.deliveryCharge = list[0].loginName;
+    }
   }
 
-  function selectedUser(type, list) {
-    console.info('Selected users for', type, list);
-    const field = `${type}List`;
-    const displayField = type === 'deliveryManager' ? 'deliveryCharge1' : type;
-    formModel[field] = list.map((item) => ({
-      actualName: item.actualName,
-      loginName: item.loginName,
-    }));
-    formModel[displayField] = list.map((item) => item.actualName).join(', ');
+  function selectedMarketManager(field, index, list) {
+    console.info(1111111111111111111111);
+    formModel.marketManagerCode = list[0].actualName;
+    formModel.marketManager = list[0].loginName;
   }
 
-  // 上传附件
+  // ----------------------- 上传附件 ----------------------------
+  // 已上传的附件列表
   const defaultFileList = ref([]);
   function changeAttachment(fileList) {
     defaultFileList.value = fileList;
@@ -327,6 +291,7 @@
     display: flex;
     flex-direction: column;
     gap: 20px;
+    // width: 1350px;
     margin: 0 auto;
 
     .basic-title {

src/views/project/report-manage/report-today/index.vue

@@ -20,7 +20,7 @@
                 <a-switch v-model:checked="formModel.siteState" />
               </a-form-item>
             </a-col>
-            <a-col :span="12">
+            <a-col :span="12" v-if="formModel.siteState">
               <a-form-item label="驻场客户" name="customerName" class="smart-query-form-item">
                 <a-input allowClear v-model:value="formModel.customerName" placeholder="请选择驻场客户" @click="showSelectCustomer" />
               </a-form-item>
@@ -149,6 +149,10 @@
   const reportTodayDetailRef = ref();
   const reportHistroyDetailRef = ref();
 
+  const formRules = {
+    customerName: [{ required: true, message: '请选择驻场客户', trigger: 'change' }],
+  };
+
   //表单字段定义
   const formModel = reactive({
     customerId: undefined,

src/views/project/task-manage/task-create/index.vue

@@ -36,11 +36,11 @@
                 </a-form-item>
               </a-col>
               <a-col :span="8">
-                <a-form-item label="任务标签" name="rushState" class="smart-query-form-item">
+                <a-form-item label="任务标签" name="taskLabel" class="smart-query-form-item">
                   <DictSelect
                     key-code="BLINK_DELIVERY_SPECIAL_STATUS"
                     v-model:value="formModel.taskLabel"
-                    placeholder="请选择任务状态"
+                    placeholder="请选择任务标签"
                     width="100%"
                     :disabled="disabledStatus"
                   />
@@ -79,44 +79,50 @@
 
           <div class="steps-content">
             <a-button type="primary" @click="handleAdd" style="margin-bottom: 8px">分配任务</a-button>
-            <a-table :pagination="false" :columns="columns" :data-source="scheduleList" bordered>
-              <template v-for="col in ['positionStaff', 'planDays', 'planStartDate', 'planEndDate', 'settlementDays']" #[col]="{ index }" :key="col">
-                <div>
-                  <template v-if="col === 'positionStaff'">
-                    <a-input
-                      v-model:value="scheduleList[index].positionStaffA"
-                      placeholder="请选择岗位人员"
-                      @click="showSelectUser('deliveryManager', index)"
-                      readonly
-                    />
-                    <EmployeeTableSelectModal
-                      :ref="(el) => (selectDeliveryManagerRef[index] = el)"
-                      type="radio"
-                      @selectDataList="selectedUser('deliveryManager', index, $event)"
-                    />
-                  </template>
-                  <template v-else-if="col === 'planStartDate'">
-                    <a-date-picker v-model:value="scheduleList[index][col]" style="margin: -5px 0" format="YYYY-MM-DD" value-format="YYYY-MM-DD" />
-                  </template>
-                  <template v-else-if="col === 'planEndDate'">
-                    <a-date-picker v-model:value="scheduleList[index][col]" style="margin: -5px 0" format="YYYY-MM-DD" value-format="YYYY-MM-DD" />
-                  </template>
-                  <template v-else-if="col === 'planDays'">
-                    <a-input v-model:value="scheduleList[index][col]" style="margin: -5px 0" />
-                  </template>
-                  <template v-else>
-                    <a-input v-model:value="scheduleList[index][col]" style="margin: -5px 0" />
-                  </template>
-                </div>
-              </template>
-              <template #operation="{ index }">
-                <div class="editable-row-operations">
-                  <span>
-                    <a @click="onDelete(index)">删除</a>
-                  </span>
-                </div>
-              </template>
-            </a-table>
+            <a-form-item name="children" class="smart-query-form-item">
+              <a-table :pagination="false" :columns="columns" :data-source="scheduleList" bordered>
+                <template
+                  v-for="col in ['positionStaff', 'planDays', 'planStartDate', 'planEndDate', 'settlementDays']"
+                  #[col]="{ index }"
+                  :key="col"
+                >
+                  <div>
+                    <template v-if="col === 'positionStaff'">
+                      <a-input
+                        v-model:value="scheduleList[index].positionStaffA"
+                        placeholder="请选择岗位人员"
+                        @click="showSelectUser('deliveryManager', index)"
+                        readonly
+                      />
+                      <EmployeeTableSelectModal
+                        :ref="(el) => (selectDeliveryManagerRef[index] = el)"
+                        type="radio"
+                        @selectDataList="selectedUser('deliveryManager', index, $event)"
+                      />
+                    </template>
+                    <template v-else-if="col === 'planStartDate'">
+                      <a-date-picker v-model:value="scheduleList[index][col]" style="margin: -5px 0" format="YYYY-MM-DD" value-format="YYYY-MM-DD" />
+                    </template>
+                    <template v-else-if="col === 'planEndDate'">
+                      <a-date-picker v-model:value="scheduleList[index][col]" style="margin: -5px 0" format="YYYY-MM-DD" value-format="YYYY-MM-DD" />
+                    </template>
+                    <template v-else-if="col === 'planDays'">
+                      <a-input v-model:value="scheduleList[index][col]" style="margin: -5px 0" />
+                    </template>
+                    <template v-else>
+                      <a-input v-model:value="scheduleList[index][col]" style="margin: -5px 0" />
+                    </template>
+                  </div>
+                </template>
+                <template #operation="{ index }">
+                  <div class="editable-row-operations">
+                    <span>
+                      <a @click="onDelete(index)">删除</a>
+                    </span>
+                  </div>
+                </template>
+              </a-table>
+            </a-form-item>
           </div>
         </div>
       </div>
@@ -140,6 +146,15 @@
   const disabledStatus = ref(false);
   const router = useRouter();
 
+  const formRules = {
+    taskName: [{ required: true, message: '请输入任务名称', trigger: 'change' }],
+    taskType: [{ required: true, message: '请选择任务类型', trigger: 'change' }],
+    taskLabel: [{ required: true, message: '请选择任务标签', trigger: 'change' }],
+    taskLinks: [{ required: true, message: '请选择需求链接', trigger: 'change' }],
+    taskRemark: [{ required: true, message: '请选择任务说明', trigger: 'change' }],
+    children: [{ required: true, message: '请分配任务', trigger: 'change' }],
+  };
+
   onMounted(() => {
     reset();
     if (query.taskId) {
@@ -217,7 +232,7 @@
     scheduleList.value.forEach((item) => {
       const { createTime, createUserId, updateTime, updateUserId, ...restItem } = item;
       formData.push(restItem);
-    })
+    });
     formModel.children = formData;
     formModel.taskResource = 'personal';
     formModel.auditState = auditState;