Merge pull request 'fix : 优化流程图样式及位置' (#413) from dd into master

Reviewed-on: http://git.feashow.cn/clay/mosr-web/pulls/413

src/assets/styles/index.scss

@@ -556,7 +556,7 @@ html, body, #app, .el-container, .el-aside, .el-main {
   .approval-title {
     display: flex;
     align-items: center;
-    justify-content: space-between;
+    //justify-content: space-between;
 
     .diagram {
       display: flex;
@@ -564,6 +564,7 @@ html, body, #app, .el-container, .el-aside, .el-main {
       float: right;
 
       .base-title {
+        margin-left: 10px;
         margin-right: 10px;
       }
 

src/components/AttachmentUpload.vue

@@ -1,8 +1,8 @@
 <template>
-  <el-form :model="formData" ref="applyForm" label-width="auto" :rules="rules" label-position="top">
+  <el-form :model="formData" ref="applyForm"  :rules="rules" :label-position="labelPosition">
     <el-row>
       <el-col :span="24">
-        <el-form-item :label="label" prop="attachment">
+        <el-form-item :label="label" prop="attachment" label-width="125">
           <template v-if="preview&&JSON.stringify(singleFile) !== '{}'&&JSON.stringify(singleFile)!=='null'">
             <el-button type="primary" link @click="handleDownload(singleFile)" style="font-size: 16px">
               {{ singleFile ? singleFile?.originalFileName : formData.singleFile?.originalFileName }}
@@ -12,22 +12,29 @@
           </template>
           <template
               v-else-if="!preview||JSON.stringify(singleFile) == '{}'||singleFile==null||formData.singleFile==null">
-            <file-upload @getFile="getAttachment" :showFileList="showFileList" :multiple="false" :maxSize="1"
+            <file-upload @getFile="getAttachment"  :multiple="false" :maxSize="1"  :showFileList="showFileList" @delete="deleteAttachment"
-                         :disabled="isSingleFile" @delete="deleteAttachment"/>
+                         :disabled="isSingleFile" />
+<!--           -->
+<!--            <fvTable style="width: 100%;max-height: 80px;" v-if="showSingleTable" :tableConfig="singleTableConfig"-->
+<!--                     :data="singleFileList" :isSettingCol="false" :pagination="false">-->
+<!--              <template #empty>-->
+<!--                <el-empty :image-size="90" description="暂无数据" style="padding: 0"/>-->
+<!--              </template>-->
+<!--            </fvTable>-->
           </template>
         </el-form-item>
       </el-col>
       <el-col :span="24">
-        <el-form-item label="其他文件">
+        <el-form-item label="其他文件" label-width="125">
-          <el-card style="width: 100%;box-shadow: none">
+          <file-upload @getFile="getOtherFile"/>
-            <file-upload @getFile="getOtherFile"/>
+<!--          <el-card style="width: 100%;box-shadow: none">-->
             <fvTable style="width: 100%;max-height: 300px;" v-if="showTable" :tableConfig="tableConfig"
                      :data="allFileList" :isSettingCol="false" :pagination="false">
               <template #empty>
                 <el-empty :image-size="90" description="暂无数据" style="padding: 0"/>
               </template>
             </fvTable>
-          </el-card>
+<!--          </el-card>-->
         </el-form-item>
       </el-col>
     </el-row>
@@ -50,12 +57,20 @@ const props = defineProps({
   },
   showTable: {
     type: Boolean,
-    default: true
+    default: false
+  },
+  showSingleTable: {
+    type: Boolean,
+    default: false
   },
   preview: {
     type: Boolean,
     default: false
   },
+  singleList: {
+    type: Array,
+    default: []
+  },
   otherFileList: {
     type: Array,
     default: []
@@ -63,6 +78,10 @@ const props = defineProps({
   formData: {
     type: Object,
     default: {}
+  },
+  labelPosition: {
+    type: String,
+    default:''
   }
 })
 const emit = defineEmits(["getAttachment", "getOtherFile"])
@@ -128,6 +147,68 @@ const tableConfig = reactive({
     }
   ]
 })
+const singleTableConfig = reactive({
+  columns: [
+    {
+      prop: 'index',
+      type: 'index',
+      label: '序号',
+      align: 'center',
+      width: '80',
+    },
+    {
+      prop: 'originalFileName',
+      label: '文件名',
+      align: 'center',
+    },
+    {
+      prop: 'tag',
+      label: '标签',
+      align: 'center'
+    },
+    {
+      prop: 'size',
+      label: '文件大小',
+      align: 'center',
+      currentRender: ({row, index}) => (parseInt(row.size / 1024) + 'KB')
+    },
+    {
+      prop: 'oper',
+      label: '操作',
+      align: 'center',
+      showOverflowTooltip: false,
+      currentRender: ({row, index}) => {
+        let btn = []
+        btn.push({label: '下载', func: () => handleDownload(row), type: 'primary'})
+        // if (row.newFile) {
+        //   btn.push({label: '删除', func: () => handleDelete(row), type: 'primary'})
+        // }
+        return (
+            <div style={{width: '100%'}}>
+              {
+                btn.map(item => (
+                    <el-button
+                        type={item.type}
+                        onClick={() => item.func()}
+                        link
+                    >
+                      {item.label}
+                    </el-button>
+                ))
+              }
+              {
+                row.newFile || props.preview || !props.preview ?
+                    <popover-delete name={row.originalFileName} type={'文件'} btnType={'danger'}
+                        // perm={['']}
+                                    onDelete={() => handleSingleDelete(row)}/>
+                    : ''
+              }
+            </div>
+        )
+      }
+    }
+  ]
+})
 const rules = reactive({
   attachment: [{required: true, message: '请上传附件', trigger: ['blur', 'change']}],
 })
@@ -135,9 +216,16 @@ const applyForm = ref()
 const singleFile = ref(props.formData.singleFile)
 const isSingleFile = ref(false)
 const allFileList = ref([])
+const singleFileList = ref([])
+if(props.formData.fileList !== null && props.formData.fileList.length > 0){
+  allFileList.value = props.formData.fileList
+}
 watch(() => props.showTable, (newVal) => {
   props.showTable = newVal
 }, {deep: true})
+watch(() => props.showSingleTable, (newVal) => {
+  props.showSingleTable = newVal
+}, {deep: true})
 watch(() => props.formData.fileList, (newVal) => {
   // console.log('newVal-fileList', newVal)
   if (props.preview) {
@@ -160,6 +248,10 @@ watch(() => props.otherFileList, (newVal) => {
     allFileList.value = newVal
   }
 }, {deep: true})
+watch(() => props.singleList, (newVal) => {
+  // console.log('singleFile', newVal)
+  singleFileList.value = newVal
+}, {deep: true})
 watch(() => props.formData.singleFile, (newVal) => {
   // console.log('singleFile', newVal)
   singleFile.value = newVal
@@ -167,7 +259,7 @@ watch(() => props.formData.singleFile, (newVal) => {
 watch(() => isSingleFile.value, (newVal) => {
   isSingleFile.value = newVal
 }, {deep: true})
-const handleDelete = (row) => {
+const handleDelete = (row,type) => {
   deleteFile(row.fileId).then(res => {
     ElNotification({
       title: '提示',
@@ -175,11 +267,20 @@ const handleDelete = (row) => {
       type: res.code === 1000 ? 'success' : 'error'
     })
     if (res.code === 1000) {
-      allFileList.value.splice(allFileList.value.findIndex((item) => item.id === row.fileId), 1);
+      if(type==='single'){
+        singleFileList.value.splice(singleFileList.value.findIndex((item) => item.id === row.fileId), 1);
+        isSingleFile.value = false
+      }else {
+        allFileList.value.splice(allFileList.value.findIndex((item) => item.id === row.fileId), 1);
+      }
     }
   });
 }
+const handleSingleDelete = (row) => {
+ handleDelete(row,'single')
+}
 const getAttachment = (val) => {
+  console.log('getAttachment',val)
   isSingleFile.value = true
   emit('getAttachment', val)
 }

src/components/DetailComponent/ApprovalDetail.vue

@@ -24,7 +24,7 @@
           <div class="base-title">流程图</div>
           <el-switch
               v-model="changeDiagram"
-              style="--el-switch-on-color: #13ce66; --el-switch-off-color:#BEA266"
+              style="--el-switch-on-color:#BEA266 ; --el-switch-off-color:#cecdcd"
           />
         </div>
       </div>

src/components/DetailComponent/CollectionDetail.vue

@@ -69,7 +69,7 @@
             <div class="base-title">流程图</div>
             <el-switch
                 v-model="changeDiagram"
-                style="--el-switch-on-color: #13ce66; --el-switch-off-color:#BEA266"
+                style="--el-switch-on-color:#BEA266; --el-switch-off-color:#cecdcd"
             />
           </div>
         </div>

src/components/DetailComponent/ProjectApply.vue

@@ -29,7 +29,7 @@
             <div class="base-title">流程图</div>
             <el-switch
                 v-model="changeDiagram"
-                style="--el-switch-on-color: #13ce66; --el-switch-off-color:#BEA266"
+                style="--el-switch-on-color:#BEA266 ; --el-switch-off-color:#cecdcd"
             />
           </div>
         </div>
@@ -414,7 +414,6 @@ const init = async () => {
 watchEffect(() => {
   return Object.keys(props.formData).length && (localFormData.value = props.formData)
 })
-
 onMounted(async () => {
   await init()
 })

src/components/DetailComponent/SpecialFundDetail.vue

@@ -70,7 +70,7 @@
             <div class="base-title">流程图</div>
             <el-switch
                 v-model="changeDiagram"
-                style="--el-switch-on-color: #13ce66; --el-switch-off-color:#BEA266"
+                style="--el-switch-on-color:#BEA266 ; --el-switch-off-color:#cecdcd"
             />
           </div>
         </div>

src/components/DetailComponent/SummaryDetail.vue

@@ -166,7 +166,7 @@
             <div class="base-title">流程图</div>
             <el-switch
                 v-model="changeDiagram"
-                style="--el-switch-on-color: #13ce66; --el-switch-off-color:#BEA266"
+                style="--el-switch-on-color:#BEA266 ; --el-switch-off-color:#cecdcd"
             />
           </div>
         </div>

src/views/expense-management/share/add.vue

@@ -118,7 +118,7 @@
           <div class="base-title">流程图</div>
           <el-switch
               v-model="changeDiagram"
-              style="--el-switch-on-color: #13ce66; --el-switch-off-color:#BEA266;margin-left: 10px"
+              style="--el-switch-on-color:#BEA266 ; --el-switch-off-color:#cecdcd"
           />
         </div>
       </div>

src/views/expense-management/share/detail.vue

@@ -39,7 +39,7 @@
         <div class="base-title">流程图</div>
         <el-switch
             v-model="changeDiagram"
-            style="--el-switch-on-color: #13ce66; --el-switch-off-color:#BEA266"
+            style="--el-switch-on-color:#BEA266 ; --el-switch-off-color:#cecdcd"
         />
       </div>
     </div>

src/views/expense-management/share/moblieDetail/index.vue

@@ -40,7 +40,7 @@
         <div class="base-title">流程图</div>
         <el-switch
             v-model="changeDiagram"
-            style="--el-switch-on-color: #13ce66; --el-switch-off-color:#BEA266"
+            style="--el-switch-on-color:#BEA266 ; --el-switch-off-color:#cecdcd"
         />
       </div>
     </div>

src/views/project-demand/requirement/add.vue

@@ -90,7 +90,7 @@
         <div class="base-title">流程图</div>
         <el-switch
             v-model="changeDiagram"
-            style="--el-switch-on-color: #13ce66; --el-switch-off-color:#BEA266;margin-left: 10px"
+            style="--el-switch-on-color:#BEA266 ; --el-switch-off-color:#cecdcd;margin-left: 10px"
         />
       </div>
       <process-diagram-viewer mode="view" v-if="processDiagramViewer&&changeDiagram"/>
@@ -160,7 +160,7 @@ const form = ref(null)
 const expendClass = ref()
 const fileList = ref([])
 const loading = ref(false)
-const showTable = ref(true)
+const showTable = ref(false)
 const processStore = useProcessStore()
 const processInstanceData = ref()
 const formPermMap = ref(new Map());
@@ -451,6 +451,7 @@ const handleDelete = (row) => {
     })
     if (res.code === 1000) {
       formData.value.fileList.splice(formData.value.fileList.findIndex((item) => item.id === row.fileId), 1);
+      showTable.value = formData.value.fileList.length !== 0;
     }
   });
 }

src/views/project-demand/requirement/moblieDetail/CollectionDetailMoblie.vue

@@ -68,7 +68,7 @@
             <div class="base-title">流程图</div>
             <el-switch
                 v-model="changeDiagram"
-                style="--el-switch-on-color: #13ce66; --el-switch-off-color:#BEA266"
+                style="--el-switch-on-color:#BEA266; --el-switch-off-color:#cecdcd"
             />
           </div>
         </div>

src/views/project-demand/summary/add.vue

@@ -4,7 +4,7 @@
     <el-form :model="formData" ref="summaryForm" :rules="rules">
       <el-row gutter="15">
         <el-col :span="8">
-          <el-form-item label="项目名称" prop="projectName" label-width="105">
+          <el-form-item label="项目名称" prop="projectName" label-width="125">
             <el-input v-model="formData.projectName" placeholder="请输入项目名称" clearable></el-input>
           </el-form-item>
         </el-col>
@@ -40,7 +40,7 @@
           </el-form-item>
         </el-col>
         <el-col :span="8">
-          <el-form-item label="项目类型" prop="projectType" label-width="105">
+          <el-form-item label="项目类型" prop="projectType" label-width="125">
             <el-select v-model="formData.projectType" placeholder="请选择项目类型" clearable filterable>
               <el-option
                   v-for="item in cacheStore.getDict('project_type')"
@@ -76,7 +76,7 @@
           </el-form-item>
         </el-col>
         <el-col :span="8">
-          <el-form-item label="项目影响" prop="projectImpact" label-width="105">
+          <el-form-item label="项目影响" prop="projectImpact" label-width="125">
             <el-select v-model="formData.projectImpact" placeholder="请选择项目影响" clearable filterable>
               <el-option
                   v-for="item in cacheStore.getDict('project_impact')"
@@ -112,7 +112,7 @@
           </el-form-item>
         </el-col>
         <el-col :span="6">
-          <el-form-item label="产学研联合" prop="industryUniversityResearch" label-width="105">
+          <el-form-item label="产学研联合" prop="industryUniversityResearch" label-width="125">
             <el-radio-group v-model="formData.industryUniversityResearch">
               <el-radio v-for="item in cacheStore.getDict('industry_university')"
                         :key="item.value"
@@ -156,8 +156,8 @@
             </el-select>
           </el-form-item>
         </el-col>
-        <el-col :span="8">
+        <el-col :span="8" style="margin-bottom: -18px">
-          <el-form-item label="知识产权状况" prop="intellectualProperty">
+          <el-form-item label="知识产权状况" prop="intellectualProperty" label-width="125">
             <el-select v-model="formData.intellectualProperty" placeholder="请选择知识产权状况" clearable filterable>
               <el-option
                   v-for="item in cacheStore.getDict('intellectual_property')"
@@ -168,7 +168,7 @@
             </el-select>
           </el-form-item>
         </el-col>
-        <el-col :span="16">
+        <el-col :span="16" style="margin-bottom: -18px">
           <el-form-item label="预期成果形式" prop="resultForm" label-width="145">
             <el-select v-model="formData.resultForm" placeholder="请选择预期成果形式" clearable filterable>
               <el-option
@@ -184,7 +184,7 @@
           <baseTitle title="预期知识产权"></baseTitle>
         </el-col>
         <el-col :span="8">
-          <el-form-item label="发明专利(项)" prop="inventionPatent" label-width="107">
+          <el-form-item label="发明专利(项)" prop="inventionPatent" label-width="125">
             <el-input-number v-model="formData.inventionPatent" placeholder="请输入发明专利" :controls="false"/>
           </el-form-item>
         </el-col>
@@ -199,7 +199,7 @@
           </el-form-item>
         </el-col>
         <el-col :span="8">
-          <el-form-item label="著作权(项)" prop="copyright" label-width="107">
+          <el-form-item label="著作权(项)" prop="copyright" label-width="125">
             <el-input-number v-model="formData.copyright" placeholder="请输入著作权" :controls="false"/>
           </el-form-item>
         </el-col>
@@ -219,13 +219,13 @@
           </el-form-item>
         </el-col>
         <el-col :span="24">
-          <el-form-item label="现有业务描述" prop="serviceDescription" label-width="107">
+          <el-form-item label="现有业务描述" prop="serviceDescription" label-width="125">
             <el-input v-model="formData.serviceDescription" placeholder="请输入现有业务描述" rows="4" type="textarea"
                       clearable></el-input>
           </el-form-item>
         </el-col>
         <el-col :span="24">
-          <el-form-item label="研发项目关键内容描述" prop="contentDescription" label-width="107">
+          <el-form-item label="研发项目关键内容描述" prop="contentDescription" label-width="125">
             <el-input v-model="formData.contentDescription" placeholder="请输入研发项目关键内容描述" rows="4" type="textarea"
                       clearable></el-input>
           </el-form-item>
@@ -233,7 +233,7 @@
       </el-row>
     </el-form>
     <AttachmentUpload ref="attachment" label="需求申请书附件" :showTable="showTable" :otherFileList="otherFileList"
-                      @getAttachment="getAttachment"
+                      @getAttachment="getAttachment" :singleList="singleList" :showSingleTable="showSingleTable"
                       @getOtherFile="getOtherFile" :showFileList="true" :formData="formData"
                       :preview="name === 'Summary/edit'"/>
     <div class="approval-record">
@@ -241,7 +241,7 @@
         <div class="base-title">流程图</div>
         <el-switch
             v-model="changeDiagram"
-            style="--el-switch-on-color: #13ce66; --el-switch-off-color:#BEA266;margin-left: 10px"
+            style="--el-switch-on-color:#BEA266; --el-switch-off-color:#cecdcd;margin-left: 10px"
         />
       </div>
       <process-diagram-viewer mode="view" v-if="processDiagramViewer&&changeDiagram"/>
@@ -281,8 +281,10 @@ const companyOption = ref([])
 const summaryForm = ref()
 const deploymentId = ref()
 const specialFundOption = ref([])
-const showTable = ref(true)
+const showTable = ref(false)
+const showSingleTable = ref(false)
 const otherFileList = ref([])
+const singleList = ref([])
 const formData = ref({
   isSpecialFund: false,
   industryUniversityResearch: '0',
@@ -363,7 +365,12 @@ const compositeParam = (item, type) => {
 
 const getAttachment = (val) => {
   // console.log('上传文件getAttachment', val)
+  showSingleTable.value=false
   formData.value.singleFile = compositeParam(val)
+  singleList.value.push( compositeParam(val))
+  nextTick(() => {
+    showSingleTable.value = true
+  })
 }
 const getOtherFile = (val) => {
   // console.log('上传文件getOtherFile', val)
@@ -374,6 +381,12 @@ const getOtherFile = (val) => {
     showTable.value = true
   })
 }
+watch(() => otherFileList.value, (newVal) => {
+  showTable.value = newVal.length !== 0;
+}, {deep: true})
+watch(() => singleList.value, (newVal) => {
+  showSingleTable.value = newVal.length !== 0;
+}, {deep: true})
 const getFileParam = (item) => {
   if (item === undefined) return;
   return {

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

@@ -17,7 +17,7 @@
         <div class="base-title">流程图</div>
         <el-switch
             v-model="changeDiagram"
-            style="--el-switch-on-color: #13ce66; --el-switch-off-color:#BEA266;margin-left: 10px"
+            style="--el-switch-on-color:#BEA266; --el-switch-off-color:#cecdcd;margin-left: 10px"
         />
       </div>
       <process-diagram-viewer mode="view" v-if="processDiagramViewer&&changeDiagram"/>

src/views/project-management/mobledetail/ApprovalDetailMoblie.vue

@@ -29,7 +29,7 @@
           <div class="base-title">流程图</div>
           <el-switch
               v-model="changeDiagram"
-              style="--el-switch-on-color: #13ce66; --el-switch-off-color:#BEA266"
+              style="--el-switch-on-color:#BEA266; --el-switch-off-color:#cecdcd"
           />
         </div>
       </div>

src/views/project-management/mobledetail/CollectionDetailMoblie.vue

@@ -68,7 +68,7 @@
             <div class="base-title">流程图</div>
             <el-switch
                 v-model="changeDiagram"
-                style="--el-switch-on-color: #13ce66; --el-switch-off-color:#BEA266"
+                style="--el-switch-on-color:#BEA266; --el-switch-off-color:#cecdcd"
             />
           </div>
         </div>

src/views/project-management/mobledetail/ProjectApplyMoblie.vue

@@ -17,7 +17,7 @@
     </el-form>
     <AttachmentUpload ref="attachment" :label="getTitleName(title)+'附件'" :showTable="showTable"
                       :otherFileList="otherFileList"
-                      @getAttachment="getAttachment"
+                      @getAttachment="getAttachment" :labelPosition="'top'"
                       @getOtherFile="getOtherFile" :showFileList="true" :formData="localFormData"
                       :preview="mode == 'resubmit'"/>
     <div>
@@ -29,7 +29,7 @@
             <div class="base-title">流程图</div>
             <el-switch
                 v-model="changeDiagram"
-                style="--el-switch-on-color: #13ce66; --el-switch-off-color:#BEA266"
+                style="--el-switch-on-color:#BEA266; --el-switch-off-color:#cecdcd"
             />
           </div>
         </div>

src/views/project-management/mobledetail/ShareDetailMobile.vue

@@ -40,7 +40,7 @@
         <div class="base-title">流程图</div>
         <el-switch
             v-model="changeDiagram"
-            style="--el-switch-on-color: #13ce66; --el-switch-off-color:#BEA266"
+            style="--el-switch-on-color:#BEA266; --el-switch-off-color:#cecdcd"
         />
       </div>
     </div>

src/views/project-management/mobledetail/SpecialFundDetailMobile.vue

@@ -73,7 +73,7 @@
             <div class="base-title">流程图</div>
             <el-switch
                 v-model="changeDiagram"
-                style="--el-switch-on-color: #13ce66; --el-switch-off-color:#BEA266"
+                style="--el-switch-on-color:#BEA266; --el-switch-off-color:#cecdcd"
             />
           </div>
         </div>

src/views/project-management/mobledetail/SummaryDetailMoblie.vue

@@ -162,7 +162,7 @@
             <div class="base-title">流程图</div>
             <el-switch
                 v-model="changeDiagram"
-                style="--el-switch-on-color: #13ce66; --el-switch-off-color:#BEA266"
+                style="--el-switch-on-color:#BEA266; --el-switch-off-color:#cecdcd"
             />
           </div>
         </div>

src/views/project-management/phaseDetailMoblie/ApprovalDetailMoblie.vue

@@ -29,7 +29,7 @@
           <div class="base-title">流程图</div>
           <el-switch
               v-model="changeDiagram"
-              style="--el-switch-on-color: #13ce66; --el-switch-off-color:#BEA266"
+              style="--el-switch-on-color:#BEA266; --el-switch-off-color:#cecdcd"
           />
         </div>
       </div>

src/views/special-fund/add.vue

@@ -31,7 +31,7 @@
         <div class="base-title">流程图</div>
         <el-switch
             v-model="changeDiagram"
-            style="--el-switch-on-color: #13ce66; --el-switch-off-color:#BEA266;margin-left: 10px"
+            style="--el-switch-on-color:#BEA266 ; --el-switch-off-color:#cecdcd;margin-left: 10px"
         />
       </div>
       <process-diagram-viewer mode="view" v-if="processDiagramViewer&&changeDiagram"/>