fix : 修改详情页数据回显问题及简化代码

src/components/DetailComponent/CollectionDetail.vue

@@ -7,17 +7,17 @@
             <span>{{ formData.requirementName }}</span>
           </el-form-item>
         </el-col>
-        <el-col :span="12">
-          <el-form-item label="所属公司">
-            <span>{{ formData.companyIds }}</span>
-          </el-form-item>
-        </el-col>
+<!--        <el-col :span="12">-->
+<!--          <el-form-item label="所属公司">-->
+<!--            <span>{{ formData.companyIds }}</span>-->
+<!--          </el-form-item>-->
+<!--        </el-col>-->
         <el-col :span="12">
           <el-form-item label="征集类型">
             <span>{{ formData.collectType }}</span>
           </el-form-item>
         </el-col>
-        <el-col :span="12">
+        <el-col :span="24">
           <el-form-item label="截止时间">
             <span>{{ formData.deadline }}</span>
           </el-form-item>
@@ -71,13 +71,11 @@
 <script setup lang="jsx">
 import OperationRender from '@/views/workflow/common/OperationRender.vue'
 import ProcessDiagramViewer from '@/views/workflow/common/ProcessDiagramViewer.vue'
-import {matterTree} from '@/utils/matterTree.js';
 import {downloadFile} from "@/api/project-demand";
 
 const emit = defineEmits(['getInfo',"update:formData"])
 const form = ref()
 const showTable = ref(false)
-const companyNameArray = ref([])
 
 const props = defineProps({
   formData: {
@@ -146,28 +144,11 @@ const handleDownload = (row) => {
     a.click()
   })
 }
-const getCompanyOptionItem = (val) => {
-  if (val instanceof Array) {
-    val.forEach(item => {
-      matterTree(companyNameArray.value, props.companyOption, item)
-    })
-  }
-  let uniqueArr = Array.from(new Set(companyNameArray.value));
-  return uniqueArr.join('，');
-}
 
 watch(() => props.loading, (newVal) => {
   props.loading = newVal
 }, {deep: true})
 
-watch(() => props.companyOption, (newVal) => {
-  props.companyOption = newVal
-}, {deep: true})
-watch(() => props.formData, (newVal) => {
-  if(newVal!=null){
-    props.formData.companyIds = getCompanyOptionItem(newVal.companyIds)
-  }
-}, {deep: true})
 watch(() => props.processViewer, (newVal) => {
   props.processViewer = newVal
 }, {deep: true})

src/components/DetailComponent/SummaryDetail.vue

@@ -8,8 +8,8 @@
           </el-form-item>
         </el-col>
         <el-col :span="12">
-          <el-form-item label="专项资金" prop="specialFund">
-            <span>{{ localFormData.specialFund }}</span>
+          <el-form-item label="专项资金" prop="specialFund" v-if="localFormData.specialFund">
+            <span>{{ changeName(fundOption, localFormData.specialFund) }}</span>
           </el-form-item>
         </el-col>
         <el-col :span="12">
@@ -22,59 +22,54 @@
             <span>{{ formData.endTime }}</span>
           </el-form-item>
         </el-col>
-        <el-col :span="12">
-          <el-form-item label="所属公司" prop="affiliatedCompanyId">
-            <span>{{ localFormData.affiliatedCompanyId }}</span>
-          </el-form-item>
-        </el-col>
         <el-col :span="12">
           <el-form-item label="项目类型" prop="projectType">
-            <span>{{ localFormData.projectType }}</span>
+            <span>{{ filterDict(cacheStore.getDict('project_type'), localFormData.projectType) }}</span>
           </el-form-item>
         </el-col>
         <el-col :span="12">
           <el-form-item label="研发主体" prop="rdSubject">
-            <span>{{ localFormData.rdSubject }}</span>
+            <span>{{ filterDict(cacheStore.getDict('rd_subject'), localFormData.rdSubject) }}</span>
           </el-form-item>
         </el-col>
         <el-col :span="12">
           <el-form-item label="出资类型" prop="investmentType">
-            <span>{{ localFormData.investmentType }}</span>
+            <span>{{ filterDict(cacheStore.getDict('invest_type'), localFormData.investmentType) }}</span>
           </el-form-item>
         </el-col>
         <el-col :span="12">
           <el-form-item label="项目影响" prop="projectImpact">
-            <span>{{ localFormData.projectImpact }}</span>
+            <span>{{ filterDict(cacheStore.getDict('project_impact'), localFormData.projectImpact) }}</span>
           </el-form-item>
         </el-col>
         <el-col :span="12">
           <el-form-item label="所属业务板块" prop="businessSegment">
-            <span>{{ localFormData.businessSegment }}</span>
+            <span>{{ filterDict(cacheStore.getDict('business_segment'), localFormData.businessSegment) }}</span>
           </el-form-item>
         </el-col>
         <el-col :span="12">
           <el-form-item label="预期成果形式" prop="resultForm">
-            <span>{{ localFormData.resultForm }}</span>
+            <span>{{ filterDict(cacheStore.getDict('result_form'), localFormData.resultForm) }}</span>
           </el-form-item>
         </el-col>
         <el-col :span="12">
           <el-form-item label="预期技术标准制定" prop="technicalStandard">
-            <span>{{ localFormData.technicalStandard }}</span>
+            <span>{{ filterDict(cacheStore.getDict('technical_standard'), localFormData.technicalStandard)}}</span>
           </el-form-item>
         </el-col>
         <el-col :span="12">
           <el-form-item label="产学研联合" prop="industryUniversityResearch">
-            <span>{{ localFormData.industryUniversityResearch }}</span>
+            <span>{{ filterDict(cacheStore.getDict('industry_university'), localFormData.industryUniversityResearch) }}</span>
           </el-form-item>
         </el-col>
         <el-col :span="12">
           <el-form-item label="开展政府申报" prop="governmentDeclaration">
-            <span>{{ localFormData.governmentDeclaration }}</span>
+            <span>{{ filterDict(cacheStore.getDict('government_declaration'), localFormData.governmentDeclaration) }}</span>
           </el-form-item>
         </el-col>
         <el-col :span="12">
           <el-form-item label="知识产权状况" prop="intellectualProperty">
-            <span>{{ localFormData.intellectualProperty }}</span>
+            <span>{{ filterDict(cacheStore.getDict('intellectual_property'), localFormData.intellectualProperty)}}</span>
           </el-form-item>
         </el-col>
         <el-col :span="6">
@@ -139,32 +134,32 @@
             </fvTable>
           </el-form-item>
         </el-col>
-        <el-col :span="24">
-          <div v-if="data.taskId">
-            <baseTitle title="审核意见"></baseTitle>
-            <el-form-item prop="auditOpinion">
-              <el-input
-                  v-model="localFormData.auditOpinion"
-                  :rows="3"
-                  type="textarea"
-                  placeholder="请输入审核意见"
-              />
-            </el-form-item>
-          </div>
-        </el-col>
+        <!--        <el-col :span="24">-->
+        <!--          <div v-if="data.taskId">-->
+        <!--            <baseTitle title="审核意见"></baseTitle>-->
+        <!--            <el-form-item prop="auditOpinion">-->
+        <!--              <el-input-->
+        <!--                  v-model="localFormData.auditOpinion"-->
+        <!--                  :rows="3"-->
+        <!--                  type="textarea"-->
+        <!--                  placeholder="请输入审核意见"-->
+        <!--              />-->
+        <!--            </el-form-item>-->
+        <!--          </div>-->
+        <!--        </el-col>-->
       </el-row>
       <div class="approval-record">
         <baseTitle title="审批记录"></baseTitle>
         <div class="process">
           <operation-render v-if="processViewer" :operation-list="data.operationList"
                             :state="data.state"/>
-          <process-diagram-viewer  v-if="processViewer" id-name="summaryProcess"/>
+          <process-diagram-viewer v-if="processViewer" id-name="summaryProcess"/>
         </div>
       </div>
-<!--      <div class="oper-page-btn" v-if="data.state === '1' && data.taskId">-->
-<!--        <el-button @click="handleReject(summaryForm)">驳回</el-button>-->
-<!--        <el-button color="#DED0B2" @click="handleAgree">同意</el-button>-->
-<!--      </div>-->
+      <!--      <div class="oper-page-btn" v-if="data.state === '1' && data.taskId">-->
+      <!--        <el-button @click="handleReject(summaryForm)">驳回</el-button>-->
+      <!--        <el-button color="#DED0B2" @click="handleAgree">同意</el-button>-->
+      <!--      </div>-->
     </el-form>
   </div>
 </template>
@@ -173,11 +168,13 @@
 import {downloadFile} from "@/api/project-demand";
 import OperationRender from '@/views/workflow/common/OperationRender.vue'
 import ProcessDiagramViewer from '@/views/workflow/common/ProcessDiagramViewer.vue'
-import {ElMessage, ElNotification} from "element-plus";
-import {agreeTask, rejectTask} from "@/api/project-demand";
 import {useTagsView} from '@/stores/tagsview.js'
+import {getFundOption} from "@/api/special-fund";
+import {useCacheStore} from '@/stores/cache.js'
+import {getSubCompOpt} from "@/api/user/user";
 
 const tagsViewStore = useTagsView()
+const cacheStore = useCacheStore()
 const props = defineProps({
   formData: {
     type: Object,
@@ -234,52 +231,38 @@ const tableConfig = reactive({
   ]
 })
 const router = useRouter()
-const summaryForm = ref()
+const fundOption = ref([])
+const companyOption = ref([])
+const dictName = ref({})
 const rules = reactive({
   auditOpinion: [{required: true, message: '请输入审核意见', trigger: 'blur'}],
 })
-const handleReject = (instance) => {
-  if (!instance) return
-  instance.validate(async (valid) => {
-    if (!valid) return
-    let approve = {
-      taskId: props.data.taskId,
-      auditOpinion: localFormData.value.auditOpinion,
-    }
-    rejectTask(approve).then(res => {
-      ElNotification({
-        title: '提示',
-        message: res.msg,
-        type: res.code === 1000 ? 'success' : 'error'
-      })
-      if (res.code === 1000) {
-        tagsViewStore.delVisitedViews(router.currentRoute.value.path)
-        router.push({
-          name: 'Summary'
-        })
+const filterDict = (data, value) => {
+  if (data === undefined || value === undefined) return;
+  let label=''
+  if (data instanceof Array) {
+    data.find(item =>{
+      if( item.value == value){
+        label= item.label
       }
     })
-  })
-}
-const handleAgree = () => {
-  let approve = {
-    taskId: props.data.taskId,
-    auditOpinion: localFormData.value.auditOpinion,
-    formData: localFormData.value
   }
-  agreeTask(approve).then(res => {
-    ElNotification({
-      title: '提示',
-      message: res.msg,
-      type: res.code === 1000 ? 'success' : 'error'
-    })
-    if (res.code === 1000) {
-      tagsViewStore.delVisitedViews(router.currentRoute.value.path)
-      router.push({
-        name: 'Summary'
-      })
+  return label
+}
+const getFundOptions = async () => {
+  const resFund = await getFundOption()
+  fundOption.value = resFund.data
+  const res = await getSubCompOpt()
+  companyOption.value = res.data
+}
+const changeName = (option, value) => {
+  let name = ''
+  option.forEach(item => {
+    if (item.value == value) {
+      name = item.label
     }
   })
+  return name
 }
 const handleDownload = (row) => {
   downloadFile(row.fileId).then(res => {
@@ -291,11 +274,6 @@ const handleDownload = (row) => {
   })
 }
 
-watch(
-    () => props.formData,
-    (val) => {
-    }
-)
 watch(() => props.processViewer, (newVal) => {
   props.processViewer = newVal
 }, {deep: true})
@@ -304,8 +282,9 @@ watch(() => props.loading, (newVal) => {
 }, {deep: true})
 
 watchEffect(() => {
-  Object.keys(props.formData).length && (localFormData.value = props.formData)
+  return Object.keys(props.formData).length && (localFormData.value = props.formData)
 })
+getFundOptions()
 </script>
 
 <style scoped>