计算

src/api/salary.js

@@ -130,3 +130,13 @@ export function getSolutionDetails (data) {
 export function saveSolution (data) {
   return http.post('/performance/solution/save', data)
 }
+
+// 绩效计算 模板
+export function getSalaryCalculateTemplate () {
+  return http.get('/performance/file/tmplate/lists')
+}
+
+// 绩效计算 模板
+export function uploadSalaryCalculateFiles () {
+  return http.upload('/performance/file/upload')
+}

src/views/salary/calculate/index.vue

@@ -1,43 +1,49 @@
 <template>
   <div class="white pa-3">
     <m-card shadow="never" class="content pa-3">
-      <m-form ref="form" :items="items" v-model="query" label-width="300px">
+      <m-form ref="form" :items="formItems" v-model="query" label-width="300px">
         <template v-for="item in items" #[item.prop]>
           <el-upload
             :key="item.prop"
-            ref="upload"
+            :ref="item.prop"
             action="#"
             :limit="1"
-            :on-exceed="() => $message.warning('只能上传一个文件')"
+            :file-list="query[item.prop] ? [query[item.prop]] : []"
+            :on-exceed="(files, fileList) => onExceed(files, fileList, item.prop)"
             :http-request="e => onImport(e, item.prop)"
             :on-remove="() => onRemove(item.prop)"
           >
             <m-button slot="trigger" size="small" type="primary" plain>点击上传</m-button>
-            <!-- <div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div> -->
           </el-upload>
         </template>
+        <el-form-item>
+          <m-button icon="el-icon-check" type="primary" size="small" @click="onSave">提交</m-button>
+          <m-button icon="el-icon-s-promotion" type="primary" size="small">绩效计算</m-button>
+          <m-button icon="el-icon-time" type="primary" size="small">绩效计算历史记录</m-button>
+        </el-form-item>
       </m-form>
-      <div class="buttons">
-        <m-button icon="el-icon-upload" type="primary" size="small">提交</m-button>
-        <m-button icon="el-icon-s-tools" type="primary" size="small">绩效计算</m-button>
-        <m-button icon="el-icon-time" type="primary" size="small">绩效计算历史记录</m-button>
-        </div>
     </m-card>
   </div>
 </template>
 
 <script>
+import {
+  getSalaryCalculateTemplate,
+  uploadSalaryCalculateFiles
+} from '@/api/salary'
 export default {
   name: 'salary-calculate',
   data () {
     return {
       query: {
-        month: null,
-        example1: null,
-        example2: null,
-        example3: null
+        month: null
       },
-      items: [
+      items: []
+    }
+  },
+  computed: {
+    formItems () {
+      return [
         {
           label: '月份',
           prop: 'month',
@@ -49,37 +55,48 @@ export default {
             placeholder: '选择更新月份'
           }
         },
-        {
-          label: '福利待遇数据',
-          prop: 'example1',
-          rules: [
-            { required: true, message: '请上传文件', trigger: 'change' }
-          ]
-        },
-        {
-          label: '全产品-按件计价',
-          prop: 'example2',
-          rules: [
-            { required: true, message: '请上传文件', trigger: 'change' }
-          ]
-        },
-        {
-          label: '管户存款(万元)-按存量与增量金额算收益',
-          prop: 'example3',
-          rules: [
-            { required: true, message: '请上传文件', trigger: 'change' }
-          ]
-        }
+        ...this.items
       ]
     }
   },
+  created () {
+    this.onInit()
+  },
   methods: {
+    async onInit () {
+      try {
+        const { data } = await getSalaryCalculateTemplate()
+        this.items = data.map(e => {
+          this.$set(this.query, e.fileType, null)
+          return {
+            label: e.fileName,
+            prop: e.fileType,
+            rules: [
+              { required: true, message: '请上传文件', trigger: 'change' }
+            ]
+          }
+        })
+      } catch (error) {
+        this.$message.error(error)
+      }
+    },
+    onExceed (files, fileList, ref) {
+      this.query[ref] = files[0]
+    },
     onImport (e, key) {
       this.query[key] = e.file
     },
     onRemove (key) {
       this.query[key] = null
       console.log(this.query)
+    },
+    async onSave () {
+      try {
+        const { data } = await uploadSalaryCalculateFiles()
+        console.log(data)
+      } catch (error) {
+        this.$snackbar.error(error)
+      }
     }
   }
 }
@@ -96,4 +113,10 @@ export default {
   align-items: center;
   justify-content: center;
 }
+::v-deep .el-upload-list__item .el-icon-close {
+    display: inline-block;
+    &::after {
+      content: '移除';
+    }
+}
 </style>