Merge pull request 'feat : 项目立项申请页面初始化' (#177) from dj into master

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

src/components/FileUpload.vue

@@ -6,10 +6,11 @@
              with-credentials
              :multiple="maxSize > 0"
              :data="uploadParams"
-             :show-file-list="false"
+             :show-file-list="showFileList"
              :auto-upload="true"
              :before-upload="beforeUpload"
              :on-success="handleUploadSuccess"
+             :on-error="uploadError"
   >
     <el-button color="#DED0B2" :loading="loading">上传文件</el-button>
   </el-upload>
@@ -37,6 +38,10 @@ const props = defineProps({
   maxSize: {
     type: Number,
     default: 30
+  },
+  showFileList: {
+    type: Boolean,
+    default: false
   }
 })
 
@@ -77,6 +82,10 @@ const handleUploadSuccess = (res, file) => {
   fileList.value.push(data)
   emit("getFile", fileList.value)
 }
+const uploadError=(err)=>{
+  loading.value = false
+  ElMessage.error("上传失败，请稍后再试！")
+}
 
 </script>
 

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

@@ -33,10 +33,12 @@
       </div>
     </el-form>
     <baseTitle title="征集说明"></baseTitle>
-    <Tinymce image-url="/notice/file" file-url="/notice/file" v-model:value="formData.collectExplain" height="300" v-if="showTinymce"/>
+    <Tinymce image-url="/notice/file" file-url="/notice/file" v-model:value="formData.collectExplain" height="300"
+             v-if="showTinymce"/>
     <baseTitle title="申请文件"></baseTitle>
     <file-upload @getFile="getFile"/>
-    <fvTable style="width: 100%;max-height: 200px" v-if="showTable" :tableConfig="tableConfig" :data="formData.fileList" :isSettingCol="false" :pagination="false">
+    <fvTable style="width: 100%;max-height: 200px" v-if="showTable" :tableConfig="tableConfig" :data="formData.fileList"
+             :isSettingCol="false" :pagination="false">
       <template #empty>
         <el-empty :image-size="90" description="暂无数据" style="padding: 0"/>
       </template>
@@ -136,27 +138,27 @@ const tableConfig = reactive({
         return (
             <div>
               <a style="cursor: pointer;font-size: 14px;color: #2a99ff;" href={row.url}>下载</a>
-              <el-button type="primary" size="large" link onClick={() => beforeRemove(row)}>删除</el-button>
+              <el-button type="primary" size="large" link onClick={() => handleDelete(row)}>删除</el-button>
             </div>
         )
       }
     }
   ]
 })
-const compositeParam=(item)=>{
+const compositeParam = (item) => {
-    return  {
+  return {
-      fileId: item.id,
+    fileId: item.id,
-      size: item.size,
+    size: item.size,
-      originalFileName: item.originalFilename,
+    originalFileName: item.originalFilename,
-      fileType: item.fileType,
+    fileType: item.fileType,
-      url: item.url,
+    url: item.url,
-      processNodeTag: null,
+    processNodeTag: null,
-      tag: formData.value.collectType,
+    tag: formData.value.collectType,
-      userId: authStore.userinfo.userId
+    userId: authStore.userinfo.userId
-    }
+  }
 }
 const getFile = (val) => {
-  console.log('上传文件',val)
+  console.log('上传文件', val)
   showTable.value = false
   nextTick(() => {
     showTable.value = true
@@ -165,14 +167,14 @@ const getFile = (val) => {
   let newFileArray = []
   if (route.query.isAdd === undefined) {
     val.forEach(item => {
-      fileObj =compositeParam(item)
+      fileObj = compositeParam(item)
       newFileArray.push(fileObj)
       formData.value.fileList.push(fileObj)
     })
     fileList.value = formData.value.fileList
   } else {
     val.forEach(item => {
-      fileObj =compositeParam(item)
+      fileObj = compositeParam(item)
       newFileArray.push(fileObj)
     })
     formData.value.fileList = newFileArray
@@ -241,7 +243,6 @@ const handleResubmit = () => {
 const getDetailInfo = async () => {
   getFormInfo(route.query.id).then(res => {
     if (res.code === 1000) {
-      console.log(res)
       ElMessage.success(res.msg)
       formData.value = res.data
       showTinymce.value = false
@@ -257,26 +258,23 @@ const getDetailInfo = async () => {
 const handleBack = () => {
   history.back()
 }
-const beforeRemove = (row) => {
+const handleDelete = (row) => {
   ElMessageBox.confirm(`确认删除名称为${row.originalFileName}的表格吗?`, '系统提示', {
     confirmButtonText: '确定',
     cancelButtonText: '取消',
     type: 'warning'
   }).then(() => {
-    handleRemove(row)
+    deleteFile(row.fileId).then(res => {
+      if (res.code === 1000) {
+        ElMessage.success("删除成功");
+        fileList.value.splice(fileList.value.findIndex((item) => item.id === row.id), 1);
+      }
+    });
   }).catch(() => {
     ElMessage.warning("用户取消删除! ");
   })
 }
 
-const handleRemove = (row) => {
-  deleteFile(row.fileId).then(res => {
-    if (res.code === 1000) {
-      ElMessage.success("删除成功");
-      fileList.value.splice(fileList.value.findIndex((item) => item.id === row.id), 1);
-    }
-  });
-};
 onMounted(async () => {
   loading.value = true
   await init()
@@ -292,9 +290,10 @@ onMounted(async () => {
 </script>
 
 <style lang="scss" scoped>
-:deep(.el-empty__description){
+:deep(.el-empty__description) {
   margin-top: 0;
 }
+
 .add-block {
   //display: flex;
   //justify-content: space-between;

src/views/project-management/initiation/apply.vue

@@ -1,23 +1,136 @@
 <template>
   <div class="apply-block">
     <el-form :model="formData" ref="applyForm" label-width="auto" :rules="rules">
-      <baseTitle title="项目立项-申请"></baseTitle>
+      <baseTitle title="项目立项申请"></baseTitle>
       <el-row>
         <el-col :span="12">
           <el-form-item label="前置流程">
             <el-input v-model="formData.requirementName" clearable></el-input>
           </el-form-item>
         </el-col>
+        <el-col :span="24">
+          <el-form-item label="项目立项附件" prop="attachment">
+            <file-upload @getFile="getAttachment" :showFileList="true"/>
+          </el-form-item>
+        </el-col>
+        <el-col :span="24">
+          <el-form-item label="其他文件">
+            <el-card style="width: 100%">
+              <file-upload @getFile="getOtherFile" :showFileList="true"/>
+              <fvTable style="width: 100%;max-height: 250px" v-if="showTable" :tableConfig="tableConfig"
+                       :data="otherFileList" :isSettingCol="false" :pagination="false">
+                <template #empty>
+                  <el-empty :image-size="90" description="暂无数据" style="padding: 0"/>
+                </template>
+              </fvTable>
+            </el-card>
+          </el-form-item>
+        </el-col>
       </el-row>
     </el-form>
+    <div class="oper-page-btn">
+      <el-button color="#DED0B2" @click="handleSubmit(applyForm)">提交</el-button>
+    </div>
   </div>
 </template>
 
 <script setup lang="jsx">
+import FileUpload from "@/components/FileUpload.vue";
+
 const formData = ref({})
 const rules = reactive({
-  auditOpinion: [{required: true, message: '请输入审核意见', trigger: 'blur'}],
+  attachment: [{required: true, message: '请上传项目立项附件', trigger: 'blur'}],
 })
+const fileList = ref(null)
+const applyForm = ref()
+const showTable = ref(true)
+const otherFileList = ref([])
+const tableConfig = 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',
+      currentRender: ({row, index}) => {
+        return (
+            <div>
+              <a style="cursor: pointer;font-size: 14px;color: #2a99ff;" href={row.url}>下载</a>
+              <el-button type="primary" size="large" link onClick={() => beforeRemove(row)}>删除</el-button>
+            </div>
+        )
+      }
+    }
+  ]
+})
+
+const compositeParam = (item) => {
+  return {
+    fileId: item.id,
+    size: item.size,
+    originalFileName: item.originalFilename,
+    fileType: item.fileType,
+    url: item.url,
+    processNodeTag: null,
+    tag: formData.value.collectType
+  }
+}
+const getAttachment = (val) => {
+  console.log('上传文件', val)
+  showTable.value = false
+  nextTick(() => {
+    showTable.value = true
+  })
+  let fileObj = {}
+  let newFileArray = []
+  if (route.query.isAdd === undefined) {
+    val.forEach(item => {
+      fileObj = compositeParam(item)
+      newFileArray.push(fileObj)
+      formData.value.fileList.push(fileObj)
+    })
+    fileList.value = formData.value.fileList
+  } else {
+    val.forEach(item => {
+      fileObj = compositeParam(item)
+      newFileArray.push(fileObj)
+    })
+    formData.value.fileList = newFileArray
+    fileList.value = newFileArray
+  }
+}
+const getOtherFile = () => {
+
+}
+const handleSubmit = (instance) => {
+  if (!instance) return
+  instance.validate(async (valid) => {
+    if (!valid) return
+
+  })
+}
 </script>
 
 <style scoped>