批量添加收款日期，导入报销人员信息功能开发

.env.production

@@ -2,7 +2,7 @@
 ENV = 'production'
 
 #Jeeplus快速开发平台/后台地址
-VUE_APP_SERVER_URL = 'http://192.168.2.7:3000/jeeplus-vue'
+VUE_APP_SERVER_URL = 'http://3081089em4.wicp.vip:36186/jeeplus-vue'
 
 #单点登录设置
 VUE_APP_SSO_LOGIN  = 'false'

src/api/reimbursementSys/reimbursementSysService.js

@@ -17,6 +17,14 @@ export default class reimbursementSys {
     })
   }
 
+  saveGatheringTime (inputForm) {
+    return request({
+      url: `/reimbursement/saveGatheringTime`,
+      method: 'post',
+      data: inputForm
+    })
+  }
+
   updateReimbursementRatio (inputForm) {
     return request({
       url: `/reimbursement/updateReimbursementRatio`,

src/api/reimbursementSys/user/reimbursementUserService.js

@@ -40,4 +40,20 @@ export default class reimbursementSys {
       params: {id: id}
     })
   }
+
+  exportTemplate () {
+    return request({
+      url: '/reimbursementUser/import/template',
+      method: 'get',
+      responseType: 'blob'
+    })
+  }
+
+  importExcel (data) {
+    return request({
+      url: '/reimbursementUser/import',
+      method: 'post',
+      data: data
+    })
+  }
 }

src/views/modules/reimbursementSys/reimbursementGatheringTimeForm.vue

@@ -0,0 +1,92 @@
+<template>
+  <el-dialog
+    :title="title"
+    :close-on-click-modal="false"
+     v-dialogDrag
+    :visible.sync="visible">
+    <el-form size="small" :model="inputForm" ref="inputForm" @keyup.enter.native="doSubmit()"
+             label-width="80px" v-loading="loading" :class="method==='view'?'readonly':''" :disabled="method==='view'" @submit.native.prevent>
+      <el-row :gutter="15">
+
+        <el-col :span="12">
+          <el-form-item label="收款日期" prop="gatheringTime"
+                        :rules="[
+                  {required: true, message:'收款日期不能为空', trigger:'blur'}
+                 ]">
+            <el-date-picker
+              style="width: 100%;"
+              v-model="inputForm.gatheringTime"
+              type="datetime"
+              value-format="yyyy-MM-dd HH:mm:ss"
+              placeholder="选择日期时间">
+            </el-date-picker>
+          </el-form-item>
+        </el-col>
+      </el-row>
+
+    </el-form>
+    <span slot="footer" class="dialog-footer">
+      <el-button size="small" @click="visible = false" icon="el-icon-circle-close">关闭</el-button>
+      <el-button size="small" v-if="method != 'view'" type="primary" @click="doSubmit()" icon="el-icon-circle-check" v-noMoreClick>确定</el-button>
+    </span>
+  </el-dialog>
+</template>
+
+<script>
+  import ReimbursementSys from '@/api/reimbursementSys/reimbursementSysService'
+  export default {
+    data () {
+      return {
+        title: '',
+        method: '',
+        visible: false,
+        loading: false,
+        inputForm: {
+          id: '',
+          name: '',
+          parent: {
+            id: ''
+          },
+          gatheringTime: '' // 业务编码
+        }
+      }
+    },
+    reimbursementSys: null,
+    created () {
+      this.reimbursementSys = new ReimbursementSys()
+    },
+    methods: {
+      init (method, obj) {
+        this.method = method
+        if (method === 'edit') {
+          this.title = '修改收款日期'
+        }
+        this.visible = true
+        this.$nextTick(() => {
+          this.$refs['inputForm'].resetFields()
+          this.inputForm.id = obj.id
+        })
+      },
+      // 表单提交
+      doSubmit () {
+        this.$refs['inputForm'].validate((valid) => {
+          if (valid) {
+            this.loading = true
+            this.reimbursementSys.saveGatheringTime(this.inputForm).then(({data}) => {
+              this.loading = false
+              this.$message({
+                message: '操作成功',
+                type: 'success',
+                duration: 1500
+              })
+              this.visible = false
+              this.$emit('refreshDataList')
+            }).catch(() => {
+              this.loading = false
+            })
+          }
+        })
+      }
+    }
+  }
+</script>

src/views/modules/reimbursementSys/reimbursementInvoiceForm.vue

@@ -68,13 +68,13 @@
           </el-form-item>
         </el-col>
         <el-col :span="12">
-          <el-form-item label="申请人" prop="proposer" :rules="[{max: 50, message: '最大长度不能超过50个字符', trigger: 'blur'}]">
-            <el-input v-model="inputForm.proposer" placeholder="申请人" :disabled="true"></el-input>
+          <el-form-item label="项目经理" prop="proposer" :rules="[{max: 50, message: '最大长度不能超过50个字符', trigger: 'blur'}]">
+            <el-input v-model="inputForm.proposer" placeholder="项目经理" :disabled="true"></el-input>
           </el-form-item>
         </el-col>
         <el-col :span="12">
-          <el-form-item label="合伙人" prop="partner" :rules="[{max: 50, message: '最大长度不能超过50个字符', trigger: 'blur'}]">
-            <el-input v-model="inputForm.partner" placeholder="合伙人" :disabled="true"></el-input>
+          <el-form-item label="部门" prop="partner" :rules="[{max: 50, message: '最大长度不能超过50个字符', trigger: 'blur'}]">
+            <el-input v-model="inputForm.partner" placeholder="部门" :disabled="true"></el-input>
           </el-form-item>
         </el-col>
 

src/views/modules/reimbursementSys/reimbursementList.vue

@@ -33,6 +33,8 @@
 
             <el-button style="margin-left: 10px" v-if="hasPermission('reimbursement:del')" :disabled="$refs.xTree && $refs.xTree.getCheckboxRecords().length === 0" type="danger" size="small" icon="el-icon-delete" @click="del()" plain>删除</el-button>
 
+            <el-button style="margin-left: 10px" v-if="hasPermission('reimbursement:edit')" :disabled="$refs.xTree && $refs.xTree.getCheckboxRecords().length === 0" type="primary" size="small" icon="el-icon-edit" @click="editInvoiceGatheringTime()" plain>批量收款</el-button>
+
           </el-row>
 
         </template>
@@ -76,8 +78,8 @@
           <vxe-column  width="200px" title="购方企业名称" field="firmName" align="center"></vxe-column>
           <vxe-column  width="100px" title="开票日期" field="makeTime" align="center"></vxe-column>
           <vxe-column  width="150px" title="商品名称" field="name" align="center"></vxe-column>
-          <vxe-column  width="100px" title="申请人" field="proposer" align="center"></vxe-column>
-          <vxe-column  width="100px" title="合伙人" field="partner" align="center"></vxe-column>
+          <vxe-column  width="100px" title="项目经理" field="proposer" align="center"></vxe-column>
+          <vxe-column  width="100px" title="部门" field="partner" align="center"></vxe-column>
           <vxe-column  width="100px" title="业务类型" field="businessType" align="center"></vxe-column>
           <vxe-column  width="100px" title="收款日期" field="gatheringTime" align="center"></vxe-column>
 
@@ -110,6 +112,7 @@
     </div>
     <!-- 弹窗, 新增 / 修改 -->
     <reimbursementForm ref="reimbursementForm" @refreshDataList="refreshList"></reimbursementForm>
+    <reimbursementGatheringTimeForm ref="reimbursementGatheringTimeForm" @refreshDataList="refreshList"></reimbursementGatheringTimeForm>
     <reimbursementRatioForm ref="reimbursementRatioForm" @refreshDataList="refreshList"></reimbursementRatioForm>
     <reimbursementBusinessForm ref="reimbursementBusinessForm" @refreshDataList="refreshList"></reimbursementBusinessForm>
     <reimbursementBusinessList ref="reimbursementBusinessList" @refreshDataList="refreshList"></reimbursementBusinessList>
@@ -122,6 +125,7 @@
 import ReimbursementSys from '@/api/reimbursementSys/reimbursementSysService'
 import XEUtils from 'xe-utils'
 import reimbursementForm from './reimbursementForm'
+import reimbursementGatheringTimeForm from './reimbursementGatheringTimeForm'
 import reimbursementRatioForm from './reimbursementRatioForm'
 import reimbursementInvoiceForm from './reimbursementInvoiceForm'
 import reimbursementBusinessForm from './reimbursementBusinessForm'
@@ -145,6 +149,7 @@ export default {
   },
   components: {
     reimbursementForm,
+    reimbursementGatheringTimeForm,
     reimbursementRatioForm,
     reimbursementInvoiceForm,
     reimbursementBusinessForm
@@ -232,6 +237,13 @@ export default {
     viewBusinessInfo (id) {
       this.$router.push({path: `/reimbursementSys/reimbursementBusinessList`, query: {id: id, title: '业务报销详情'}})
     },
+    // 修改发票收款日期
+    editInvoiceGatheringTime (id) {
+      let ids = id || this.$refs.xTree.getCheckboxRecords().map(item => {
+        return item.id
+      }).join(',')
+      this.$refs.reimbursementGatheringTimeForm.init('edit', {id: ids, parent: {id: '', name: ''}})
+    },
     // 修改发票信息
     editInvoice (id) {
       this.$refs.reimbursementInvoiceForm.init('editInvoice', {id: id, parent: {id: '', name: ''}})

src/views/modules/reimbursementSys/user/reimbursementUserForm.vue

@@ -42,14 +42,23 @@
 
         <el-col :span="12">
           <el-form-item label="日报销额度"  id="reimbursementQuotaDay" prop="reimbursementQuotaDay":rules="[{required: true, max: 10, message:'日报销额度不能为空', trigger:'blur'}]">
-            <el-input v-model="inputForm.reimbursementQuotaDay" class="bg-grey" size="small" placeholder="日报销额度" style="width: 100%;" @keyup.native="inputForm.reimbursementQuotaDay = checkInputs(inputForm.reimbursementQuotaDay)">
+            <el-input v-model="inputForm.reimbursementQuotaDay" @input="calculateReimbursementQuota(inputForm.reimbursementQuotaDay,inputForm.reimbursementAllDay)" class="bg-grey" size="small" placeholder="日报销额度" style="width: 100%;" @keyup.native="inputForm.reimbursementQuotaDay = checkInputs(inputForm.reimbursementQuotaDay)">
                 </el-input>
           </el-form-item>
         </el-col>
 
         <el-col :span="12">
+          <el-form-item label="可报销天数" prop="reimbursementAllDay" :rules="[
+                  {required: true, message:'可报销天数不能为空', trigger:'blur'},
+                  {validator: validator.isNumber, trigger:'blur'}
+                 ]">
+            <el-input-number v-model="inputForm.reimbursementAllDay" placeholder="可报销天数" @input="calculateReimbursementQuota(inputForm.reimbursementQuotaDay,inputForm.reimbursementAllDay)" :step="1"  :min="1" :max="this.yearDate()" style="width: 100%;"  ></el-input-number>
+          </el-form-item>
+        </el-col>
+
+        <el-col :span="12">
           <el-form-item label="年报销额度" prop="reimbursementQuota":rules="[{required: true, max: 10, message:'年报销额度不能为空', trigger:'blur'}]">
-            <el-input v-model="inputForm.reimbursementQuota" class="bg-grey" size="small" placeholder="年报销额度" style="width: 100%;" @keyup.native="inputForm.reimbursementQuota = checkInputs(inputForm.reimbursementQuota)">
+            <el-input v-model="inputForm.reimbursementQuota" class="bg-grey" size="small" placeholder="年报销额度" style="width: 100%;" disabled>
                 </el-input>
           </el-form-item>
         </el-col>
@@ -80,7 +89,8 @@
           userId: '', // 人员id
           year: '', // 年份
           reimbursementQuota: '', // 年报销额度
-          reimbursementQuotaDay: '' // 日报销额度
+          reimbursementQuotaDay: '', // 日报销额度
+          reimbursementAllDay: this.yearDate() // 报销总天数
 
         }
       }
@@ -123,6 +133,17 @@
         str = str.replace(/[^\d^\.]+/g, '') // 保留数字和小数点
         return str
       },
+      calculateReimbursementQuota (reimbursementQuotaDay, reimbursementAllDay) {
+        if (reimbursementQuotaDay && reimbursementAllDay) {
+          if (!isNaN(reimbursementQuotaDay) && !isNaN(reimbursementAllDay)) {
+            this.inputForm.reimbursementQuota = (reimbursementQuotaDay * reimbursementAllDay).toString()
+          } else {
+            this.inputForm.reimbursementQuota = ''
+          }
+        } else {
+          this.inputForm.reimbursementQuota = ''
+        }
+      },
       init (method, obj) {
         this.method = method
         this.inputForm.id = obj
@@ -164,6 +185,16 @@
             })
           }
         })
+      },
+      yearDate: function () {
+        // eslint-disable-next-line no-unused-vars,one-var
+        var year = new Date().getFullYear(), s = 0, d // 获取当前年
+        for (var i = 1; i < 13; i++) {
+          d = new Date(year, i, 0) // 获取某一个月的天数
+          s += d.getDate()
+        }
+        s = s - 11 // 11代表一年有11天的国假
+        return s
       }
     }
   }

src/views/modules/reimbursementSys/user/reimbursementUserList.vue

@@ -32,11 +32,12 @@
       </el-form-item>
     </el-form>
     <div class="bg-white top">
-      <vxe-toolbar :refresh="{query: refreshList}" export print custom>
+      <vxe-toolbar  :refresh="{query: refreshList}" import export  print resizable custom>
         <template #buttons>
           <el-row>
             <el-button v-if="hasPermission('reimbursementUser:add')" type="primary" icon="el-icon-plus" size="small" @click="add()">新增</el-button>
             <el-button v-if="hasPermission('reimbursementUser:del')" type="danger"   size="small" icon="el-icon-delete" @click="del()" :disabled="$refs.reimbursementUserTable && $refs.reimbursementUserTable.getCheckboxRecords().length === 0" plain>删除</el-button>
+            <el-button v-if="hasPermission('sys:user:import')"  type="default" @click="downloadTpl()" size="small">下载模板</el-button>
           </el-row>
         </template>
       </vxe-toolbar>
@@ -54,7 +55,10 @@
           highlight-hover-row
           :menu-config="{}"
           :print-config="{}"
-          :import-config="{}"
+          :import-config="{
+                    importMethod: importMethod,
+                    types: ['xls', 'xlsx'],
+                    remote: true}"
           :export-config="{}"
           @sort-change="sortChangeHandle"
           :sort-config="{remote:true}"
@@ -170,6 +174,26 @@ export default {
       }
       this.refreshList()
     },
+    // 自定义服务端导入
+    importMethod ({ file }) {
+      // 处理表单
+      const formBody = new FormData()
+      formBody.append('file', file)
+      this.reimbursementUser.importExcel(formBody).then(result => {
+        this.$message.success(result.data)
+      })
+    },
+    // 下载模板
+    downloadTpl () {
+      this.reimbursementUser.exportTemplate().then((res) => {
+        // 将二进制流文件写入excel表，以下为重要步骤
+        this.$utils.downloadExcel(res.data, '报销人员导入模板')
+      }).catch(function (err) {
+        if (err.response) {
+          console.log(err.response)
+        }
+      })
+    },
     // 新增
     add () {
       this.$refs.reimbursementUserForm.init('add', {id: '', parent: {id: '', name: ''}})