fix : 修复页面细节

src/views/project-management/implementation/uploadFee.vue

@@ -1,7 +1,7 @@
 <template>
   <baseTitle title="上传费用"></baseTitle>
-  <el-form :model="tableForm" :rules="rules">
-    <el-table :data="tableForm.tableData" style="width: 100%">
+  <el-form :model="tableData" ref="form" :rules="rules">
+    <el-table :data="tableData" style="width: 100%">
       <el-table-column prop="projectName" label="项目名称">
         <template #default="scope">
           <el-form-item prop="projectName">
@@ -12,38 +12,60 @@
       </el-table-column>
       <el-table-column prop="time" label="时间">
         <template #default="scope">
-          <el-date-picker
-              v-model="scope.row.time"
-              type="date"
-              format="YYYY-MM-DD"
-              value-format="YYYY-MM-DD"
-              placeholder="选择时间"
-          >
-          </el-date-picker>
+          <el-form-item prop="time">
+            <el-date-picker
+                v-model="scope.row.time"
+                type="date"
+                format="YYYY-MM-DD"
+                value-format="YYYY-MM-DD"
+                placeholder="选择时间"
+            >
+            </el-date-picker>
+          </el-form-item>
         </template>
       </el-table-column>
       <el-table-column prop="projectCost" label="项目费用">
         <template #default="scope">
-          <el-input v-model="scope.row.projectCost" placeholder="请输入项目费用" clearable>
-          </el-input>
+          <el-form-item prop="projectCost">
+            <el-select v-model="scope.row.projectCost" placeholder="请选择费用性质" clearable filterable>
+              <el-option
+                  v-for="item in cacheStore.getDict('project_cost')"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value"
+              />
+            </el-select>
+          </el-form-item>
         </template>
       </el-table-column>
       <el-table-column prop="researchStage" label="研发阶段">
         <template #default="scope">
-          <el-input v-model="scope.row.researchStage" placeholder="请选择研发阶段" clearable>
-          </el-input>
+          <el-form-item prop="researchStage">
+            <el-select v-model="scope.row.researchStage" placeholder="请选择研发阶段" clearable filterable>
+              <el-option
+                  v-for="item in cacheStore.getDict('research_stage')"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value"
+              />
+            </el-select>
+          </el-form-item>
         </template>
       </el-table-column>
       <el-table-column prop="digest" label="摘要">
         <template #default="scope">
-          <el-input v-model="scope.row.digest" placeholder="请输入摘要" clearable>
-          </el-input>
+          <el-form-item prop="digest">
+            <el-input v-model="scope.row.digest" placeholder="请输入摘要" clearable>
+            </el-input>
+          </el-form-item>
         </template>
       </el-table-column>
       <el-table-column prop="afterTax" label="税后余额(元)">
         <template #default="scope">
-          <el-input v-model="scope.row.afterTax" placeholder="请输入税后余额" clearable>
-          </el-input>
+          <el-form-item prop="afterTax">
+            <el-input v-model="scope.row.afterTax" placeholder="请输入税后余额" clearable>
+            </el-input>
+          </el-form-item>
         </template>
       </el-table-column>
       <el-table-column prop="oper" label="操作">
@@ -57,7 +79,7 @@
     <el-button type="primary" @click="handleAdd" link style="font-size: 18px">添加一行</el-button>
   </div>
   <div class="oper-page-btn">
-    <el-button color="#DED0B2" @click="handleSubmit">提交</el-button>
+    <el-button color="#DED0B2" @click="handleSubmit(form)">提交</el-button>
     <el-button @click="handleBack">返回</el-button>
   </div>
 </template>
@@ -67,26 +89,45 @@ import {ElNotification} from "element-plus";
 import {addLedger} from "@/api/project-manage";
 import {useTagsView} from '@/stores/tagsview.js'
 import {useRoute} from "vue-router";
+import {useCacheStore} from '@/stores/cache.js'
 
+const cacheStore = useCacheStore()
 const route = useRoute()
 const tagsViewStore = useTagsView()
 const formData = ref({})
+const form = ref()
 const rules = reactive({
-  auditOpinion: [{required: true, message: '请输入审核意见', trigger: 'blur'}],
-})
-const tableForm = reactive({
-  tableData: [
-    {
-      projectId: route.query.id,
-      projectName: '',
-      time: '',
-      projectCost: '',
-      researchStage: '',
-      digest: '',
-      afterTax: ''
-    }
-  ]
+  projectName: [{required: true, message: '请输入项目名称', trigger:["blur", 'change']}],
+  time: [{required: true, message: '请选择时间', trigger: 'blur'}],
+  projectCost: [{required: true, message: '请输入项目费用', trigger: 'blur'}],
+  researchStage: [{required: true, message: '请输入研发阶段', trigger: 'blur'}],
+  digest: [{required: true, message: '请输入摘要', trigger: 'blur'}],
+  afterTax: [{required: true, message: '请输入税后余额', trigger: 'blur'}]
 })
+const tableData=ref([
+  {
+    projectId: route.query.id,
+    projectName: '',
+    time: '',
+    projectCost: '',
+    researchStage: '',
+    digest: '',
+    afterTax: ''
+  }
+])
+// const tableForm = reactive({
+//   tableData: [
+//     {
+//       projectId: route.query.id,
+//       projectName: '',
+//       time: '',
+//       projectCost: '',
+//       researchStage: '',
+//       digest: '',
+//       afterTax: ''
+//     }
+//   ]
+// })
 const handleAdd = () => {
   let row = {
     projectId: route.query.id,
@@ -97,30 +138,29 @@ const handleAdd = () => {
     digest: '',
     afterTax: ''
   }
-  tableForm.tableData.push(row)
+  tableData.value.push(row)
 }
 const handleDelete = (index) => {
-  tableForm.tableData.splice(index, 1)
+  tableData.value.splice(index, 1)
 }
 const handleSubmit = (instance) => {
-  // if (!instance) return
-  // instance.validate(async (valid) => {
-  //   if (!valid) return
-  let params = {}
-  console.log('params', tableForm.tableData)
-  const res = addLedger(tableForm.tableData)
-  ElNotification({
-    title: '提示',
-    message: res.msg,
-    type: res.code === 1000 ? 'success' : 'error'
+  if (!instance) return
+  instance.validate(async (valid) => {
+    if (!valid) return
+    console.log('params', tableData.value)
+    // const res = addLedger(tableData.value)
+    // ElNotification({
+    //   title: '提示',
+    //   message: res.msg,
+    //   type: res.code === 1000 ? 'success' : 'error'
+    // })
+    // if (res.code === 1000) {
+    //   tagsViewStore.delVisitedViews(router.currentRoute.value.path)
+    //   router.push({
+    //     name: 'Implementation'
+    //   })
+    // }
   })
-  if (res.code === 1000) {
-    tagsViewStore.delVisitedViews(router.currentRoute.value.path)
-    router.push({
-      name: 'Implementation'
-    })
-  }
-  // })
 }
 const handleBack = () => {
   history.back()