Merge remote-tracking branch 'origin/master'

src/api/cw/workContract/ContractFileService.js

@@ -0,0 +1,18 @@
+import request from '@/utils/httpRequest'
+
+export default class ContractFileService {
+  save (param) {
+    return request({
+      url: '/contract/contractFile/save',
+      method: 'post',
+      data: param
+    })
+  }
+  updateStatusById (param) {
+    return request({
+      url: '/workContract/workContractFile/updateStatusById',
+      method: 'post',
+      data: param
+    })
+  }
+}

src/api/cw/workContract/ContractInfoService.js

@@ -0,0 +1,39 @@
+import request from '@/utils/httpRequest'
+
+export default class ContractInfoService {
+  list (param) {
+    return request({
+      url: '/contract/registration/list',
+      method: 'get',
+      params: param
+    })
+  }
+  save (param) {
+    return request({
+      url: '/contract/registration/save',
+      method: 'post',
+      data: param
+    })
+  }
+  remove (url) {
+    return request({
+      url: '/contract/registration/remove',
+      method: 'get',
+      params: {id: url}
+    })
+  }
+  findById (id) {
+    return request({
+      url: '/contract/registration/findById',
+      method: 'get',
+      params: {id: id}
+    })
+  }
+  updateStatusById (param) {
+    return request({
+      url: '/contract/registration/updateStatusById',
+      method: 'post',
+      data: param
+    })
+  }
+}

src/views/modules/cw/workContract/ContractFileForm.vue

@@ -0,0 +1,622 @@
+<template>
+  <div>
+    <el-form size="middle" :model="inputForm" ref="inputForm" v-loading="loading" :class="method==='view'?'readonly':''"  :disabled="formReadOnly"
+             label-width="150px">
+
+      <el-row  :gutter="0">
+
+        <el-col :span="12">
+          <el-form-item label="合同编号" prop="contractNo">
+            <el-input maxlength="64" :disabled="true" v-model="inputForm.contractNo" placeholder="自动生成"></el-input>
+          </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item label="合同名称" prop="contractName"
+                        :rules="[{required: true, message: '合同名称不能为空', trigger: 'blur'}
+                 ]">
+            <el-input v-model="inputForm.contractName" :disabled="true" placeholder="请输入合同名称"     clearable></el-input>
+          </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item label="合同状态" prop="contractStatus">
+            <el-input maxlength="64" :disabled="true" v-model="inputForm.contractStatus" placeholder="请输入合同状态"></el-input>
+          </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item label="付款主体" prop="payerSubject"
+                        :rules="[{required: true, message: '付款主体不能为空', trigger: 'blur'}
+                 ]">
+            <el-select :disabled="true" v-model="inputForm.payerSubject" placeholder="请选择付款主体" style="width:100%;">
+              <el-option
+                v-for="item in $dictUtils.getDictList('cw_payment_subject')"
+                :key="item.value"
+                :label="item.label"
+                :value="item.value">
+              </el-option>
+            </el-select>
+          </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item label="付款方式" prop="paymentMethod"
+                        :rules="[{required: true, message: '付款方式不能为空', trigger: 'blur'}
+                 ]">
+            <el-select :disabled="true" v-model="inputForm.paymentMethod" placeholder="请选择付款方式" style="width:100%;">
+              <el-option
+                v-for="item in $dictUtils.getDictList('cw_payment_method')"
+                :key="item.value"
+                :label="item.label"
+                :value="item.value">
+              </el-option>
+            </el-select>
+          </el-form-item>
+        </el-col>
+
+        <el-col :span="12">
+          <el-form-item label="签约日期" prop="signingDate"
+                        :rules="[
+                {required: true, message:'请输入签约日期', trigger:'blur'}
+               ]">
+            <el-date-picker
+              placement="bottom-start"
+              value-format="yyyy-MM-dd"
+              :disabled="true"
+              v-model="inputForm.signingDate"
+              style="width: 100%"
+              placeholder="选择日期">
+            </el-date-picker>
+          </el-form-item>
+        </el-col>
+
+        <el-col :span="12">
+          <el-form-item label="合同金额(元)" prop="contractAmount"
+                        :rules="[
+                  {required: true, message:'请输入合同金额(元)', trigger:'blur'}
+               ]">
+            <el-input maxlength="15" :disabled="true" v-model="inputForm.contractAmount" placeholder="请输入合同金额(元)"
+                      @keyup.native="inputForm.contractAmount = twoDecimalPlaces(inputForm.contractAmount)"
+            ></el-input>
+          </el-form-item>
+        </el-col>
+
+        <el-col :span="12">
+          <el-form-item label="合同实际金额" prop="actualContractAmount"
+                        :rules="[
+                  {required: true, message:'请输入合同实际金额(元)', trigger:'blur'}
+               ]">
+            <el-input maxlength="15" v-model="inputForm.actualContractAmount" placeholder="请输入合同实际金额(元)"
+                      @keyup.native="inputForm.actualContractAmount = twoDecimalPlaces(inputForm.actualContractAmount)"
+            ></el-input>
+          </el-form-item>
+        </el-col>
+
+        <el-col :span="12">
+          <el-form-item label="合同份数" prop="contractNum"
+                        :rules="[{required: true, message: '合同份数', trigger: 'blur'}
+                 ]">
+            <el-input maxlength="64" :disabled="true" v-model="inputForm.contractNum" placeholder="请输入合同份数"></el-input>
+          </el-form-item>
+        </el-col>
+
+        <el-col :span="12">
+          <el-form-item label="付款约定" prop="paymentAgreement">
+            <el-input maxlength="64" :disabled="true" v-model="inputForm.paymentAgreement" placeholder="请输入付款约定"></el-input>
+          </el-form-item>
+        </el-col>
+
+        <el-col :span="12">
+          <el-form-item label="修改次数" prop="changeNum"
+                        :rules="[{required: true, message: '修改次数', trigger: 'blur'}
+                 ]">
+            <el-input maxlength="64" :disabled="true" v-model="inputForm.changeNum" placeholder="请输入修改次数"></el-input>
+          </el-form-item>
+        </el-col>
+
+        <el-col :span="12">
+          <el-form-item label="所属部门" prop="department"
+                        :rules="[{required: true, message: '所属部门', trigger: 'blur'}
+                 ]">
+            <el-input maxlength="64" :disabled="true" v-model="inputForm.department" placeholder="请输入所属部门"></el-input>
+          </el-form-item>
+        </el-col>
+
+        <el-col :span="12">
+          <el-form-item label="委托方联系人" prop="clientContacts"
+                        :rules="[{required: true, message: '委托方联系人', trigger: 'blur'}
+                 ]">
+            <el-input maxlength="100" :disabled="true" v-model="inputForm.clientContacts" placeholder="请输入委托方联系人"></el-input>
+          </el-form-item>
+        </el-col>
+
+        <el-col :span="12">
+          <el-form-item label="委托方联系人电话" prop="clientContactsPhone"
+                        :rules="[{required: true, message: '委托方联系人电话', trigger: 'blur'}
+                 ]">
+            <el-input maxlength="15" :disabled="true" v-model="inputForm.clientContactsPhone" placeholder="请输入委托方联系人电话"
+                      @keyup.native="inputForm.clientContactsPhone = twoDecimalPlaces(inputForm.clientContactsPhone)"
+            ></el-input>
+          </el-form-item>
+        </el-col>
+
+        <el-col :span="12">
+          <el-form-item label="合同归档审批类型" prop="contractApprovalType"
+                        :rules="[{required: true, message: '付款主体不能为空', trigger: 'blur'}
+                 ]">
+            <el-select v-model="inputForm.contractApprovalType" placeholder="请选择" style="width:100%;">
+              <el-option
+                v-for="item in $dictUtils.getDictList('contract_type')"
+                :key="item.value"
+                :label="item.label"
+                :value="item.value">
+              </el-option>
+            </el-select>
+          </el-form-item>
+        </el-col>
+
+        <el-col :span="12">
+          <el-form-item label="创建人" prop="createBy"
+                        :rules="[{required: true, message: '创建人', trigger: 'blur'}
+                 ]">
+            <el-input maxlength="64" :disabled="true" v-model="inputForm.createBy" placeholder="请输入创建人"></el-input>
+          </el-form-item>
+        </el-col>
+
+        <el-col :span="12">
+          <el-form-item label="创建时间" prop="createDate">
+            <el-date-picker
+              placement="bottom-start"
+              value-format="yyyy-MM-dd"
+              v-model="inputForm.createDate"
+              style="width: 100%"
+              :disabled="true"
+              placeholder="选择日期">
+            </el-date-picker>
+          </el-form-item>
+        </el-col>
+
+      </el-row>
+
+      </el-form>
+      <el-image-viewer
+        v-if="showViewer"
+        :on-close="closeViewer"
+        :url-list="[url]"
+        zIndex="9999"/>
+  </div>
+</template>
+
+<script>
+  import ContractInfoService from '@/api/cw/workContract/ContractInfoService'
+  import ContractFileService from '@/api/cw/workContract/ContractFileService'
+  import OSSSerive, {
+    httpRequest,
+    toHref,
+    openWindowOnUrl,
+    handleRemove,
+    fileName
+  } from '@/api/sys/OSSService'
+  import moment from 'moment'
+  import ElImageViewer from 'element-ui/packages/image/src/image-viewer'
+  export default {
+    data () {
+      return {
+        visable: false,
+        gridData: [],
+        radio: 0,
+        tableData: [],
+        dataList: [],
+        dataListNew: [],
+        title: '',
+        method: '',
+        isSubmit: false,
+        visible: false,
+        loading: false,
+        returnForm: {
+          clientId: '',
+          name: '',
+          contractDate: '',
+          effectiveDate: '',
+          closingDate: '',
+          contractType: '',
+          contractAmountType: '',
+          contractAmount: '',
+          contractOpposite: '',
+          fees: '',
+          contractFee: '',
+          describes: '',
+          contractSpecial: '',
+          remarks: '',
+          clientName: '',
+          status: ''
+        },
+        inputForm: {
+          contractNo: '',
+          contractName: '',
+          payerSubject: '',
+          paymentMethod: '',
+          signingDate: '',
+          contractAmount: '',
+          actualContractAmount: '',
+          contractNum: '',
+          contractStatus: '',
+          paymentAgreement: '',
+          changeNum: '',
+          department: '',
+          clientContacts: '',
+          clientContactsPhone: '',
+          contractApprovalType: '',
+          createBy: JSON.parse(localStorage.getItem('user')).name,
+          createId: JSON.parse(localStorage.getItem('user')).id,
+          createDate: ''
+        },
+        filesArra2: [],
+        fileList: [],
+        isFlag: true,
+        showViewer: false, // 显示查看器
+        url: '',
+        rowurl: '',
+        src: '',
+        onedit: false,
+        type: '',
+        loadProgress: 0, // 动态显示进度条
+        progressFlag: false, // 关闭进度条
+        promi: null
+      }
+    },
+    props: {
+      businessId: {
+        type: String,
+        default: ''
+      },
+      formReadOnly: {
+        type: Boolean,
+        default: false
+      }
+    },
+    components: {
+      ElImageViewer
+    },
+    computed: {
+      officeName () {
+        return JSON.parse(localStorage.getItem('user')).officeDTO.name
+      }
+    },
+    ossService: null,
+    // workContractService: null,
+    contractInfoService: null,
+    contractFileService: null,
+    created () {
+      this.ossService = new OSSSerive()
+      // this.workContractService = new WorkContractService()
+      this.contractInfoService = new ContractInfoService()
+      this.contractFileService = new ContractFileService()
+    },
+    mounted () {
+      window.onPreview = this.onPreview
+    },
+    watch: {
+      'businessId': {
+        handler (newVal) {
+          if (this.businessId && this.businessId !== 'false') {
+            this.ossService = new OSSSerive()
+            this.init('edit', this.businessId)
+          } else {
+            // this.$refs.inputForm.resetFields()
+            // this.visible = false
+            // this.showVi = true
+            // this.$refs.uploadComponent.clearUpload()
+            this.init('clean', '')
+          }
+        },
+        immediate: true,
+        deep: false
+      }
+    },
+    methods: {
+      uploadVideoProcess (event, file, fileList) {
+        this.progressFlag = true // 显示进度条
+        this.loadProgress = parseInt(event.percent) // 动态获取文件上传进度
+        if (this.loadProgress >= 100) {
+          this.loadProgress = 100
+          setTimeout(() => { this.progressFlag = false }, 1000) // 一秒后关闭进度条
+        }
+      },
+      async toHref (row) {
+        toHref(row)
+      },
+      onPreview (url) {
+        this.url = url
+        this.showViewer = true
+      },
+      // 关闭查看器
+      closeViewer () {
+        this.url = ''
+        this.showViewer = false
+      },
+      init (method, id) {
+        console.log(method)
+        this.dataList = []
+        this.dataListNew = []
+        this.method = method
+        this.inputForm = {
+          contractNo: '',
+          contractName: '',
+          payerSubject: '',
+          paymentMethod: '',
+          signingDate: '',
+          contractAmount: '',
+          actualContractAmount: '',
+          contractNum: '',
+          contractStatus: '',
+          paymentAgreement: '',
+          changeNum: '',
+          department: this.officeName,
+          clientContacts: '',
+          contractInfoId: '',
+          clientContactsPhone: '',
+          contractApprovalType: '',
+          createBy: JSON.parse(localStorage.getItem('user')).name,
+          createId: JSON.parse(localStorage.getItem('user')).id,
+          createDate: ''
+        }
+        this.inputForm.id = id
+        if (method === 'add') {
+          // this.inputForm.contractAmountType = '1'
+          this.title = `新建合同登记`
+        } else if (method === 'edit') {
+          this.title = '修改合同登记'
+        } else if (method === 'view') {
+          this.inputForm.showVi = false
+          this.title = '查看合同登记'
+        }
+        this.visible = true
+        this.loading = false
+        this.$nextTick(() => {
+          this.$refs.inputForm.resetFields()
+          if (method === 'edit' || method === 'view') { // 修改或者查看
+            this.loading = true
+            this.contractInfoService.findById(this.inputForm.id).then(({data}) => {
+              if (this.commonJS.isEmpty(data.id)) {
+                this.contractFileService.findById(this.inputForm.id).then(({data}) => {
+                  this.contractInfoService.findById(data.contractInfoId).then(({data}) => {
+                    this.saveData(data)
+                    if (this.formReadOnly) {
+                      method = 'view'
+                    }
+                  })
+                })
+              } else {
+                this.saveData(data)
+                if (this.formReadOnly) {
+                  method = 'view'
+                }
+              }
+              this.loading = false
+            })
+          }
+        })
+      },
+      saveData (data) {
+        this.inputForm = this.recover(this.inputForm, data)
+        this.inputForm = JSON.parse(JSON.stringify(this.inputForm))
+      },
+      // 表单提交
+      // 暂存
+      async saveForm (callback) {
+        // 合同登记暂存
+        if (this.status === 'startAndHold' || this.status === 'startAndHoldFiled') {
+          this.loading = true
+          if (this.status === 'startAndHold') {
+            this.inputForm.status = '1'
+          }
+          if (this.status === 'startAndHoldFiled') {
+            this.inputForm.status = '5'
+          }
+          await this.contractInfoService.save(this.inputForm)
+        }
+        // 合同登记归档暂存
+        if (this.status === 'startAndHoldFiled') {
+          this.inputForm.filedType = '1'
+          this.inputForm.contractInfoId = this.businessId
+          this.contractFileService.save(this.inputForm)
+        }
+        this.$refs.inputForm.resetFields()
+        this.loading = false
+        this.businessId = ''
+        callback()
+      },
+      // 送审
+      startForm (callback) {
+        console.log('filedType', this.inputForm.id)
+        let id = this.inputForm.id
+        this.loading = true
+        this.inputForm.status = '5'
+        this.contractInfoService.save(this.inputForm)
+        console.log('inputForm', this.inputForm)
+        this.inputForm.filedType = '2'
+        this.inputForm.contractInfoId = id
+        this.contractFileService.save(this.inputForm).then(({data}) => {
+          console.log('data', data)
+          callback(data.businessTable, data.businessId, this.inputForm)
+          this.$refs.inputForm.resetFields()
+          this.loading = false
+          this.businessId = ''
+        })
+      },
+      // 通过
+      agreeForm (callback) {
+        let id = this.inputForm.id
+        this.loading = true
+        this.inputForm.status = '5'
+        this.contractInfoService.save(this.inputForm)
+        console.log('inputForm', this.inputForm)
+        this.inputForm.filedType = '2'
+        this.inputForm.contractInfoId = id
+        this.contractFileService.save(this.inputForm).then(({data}) => {
+          callback(data.businessTable, data.businessId, this.inputForm)
+          this.$refs.inputForm.resetFields()
+          this.loading = false
+          this.businessId = ''
+        })
+      },
+      close () {
+        this.$refs.inputForm.resetFields()
+        this.inputForm.clientName = ''
+        this.visible = false
+        this.showVi = true
+      },
+      httpRequest (file) {
+        httpRequest(file, fileName(file), 'workContract')
+      },
+      handleRemove () {
+        this.fileList = handleRemove()
+      },
+      changes (file, fileList) {
+        this.dataListNew = []
+        this.dataList.forEach((item) => {
+          this.dataListNew.push(item)
+        })
+        fileList.forEach((item) => {
+          item.createDate = moment(new Date()).format('YYYY-MM-DD HH:mm:ss')
+          item.createBy = this.$store.state.user.name
+          this.dataListNew.push(item)
+        })
+        const isLt2M = file.size / 1024 / 1024 < 300
+        if (isLt2M === false) {
+          this.$message.error('文件大小不能超过 ' + 300 + 'M !')
+          this.fileList = []
+          this.filesArra2 = []
+        }
+      },
+      async showFile (row) {
+        await openWindowOnUrl(row)
+      },
+      // 排序
+      sortChangeHandle (column) {
+        this.orders = []
+        if (column.order != null) {
+          this.orders.push({column: this.$utils.toLine(column.prop), asc: column.order === 'ascending'})
+        }
+        this.refreshList()
+      },
+      deleteMsgById (row, index) {
+        this.dataListNew.splice(index, 1)
+        if (row.id !== null && row.id !== '' && row.id !== undefined) {
+          this.ossService.deleteMsgById(row.id)
+        }
+      },
+      twoDecimalPlaces (num) {
+        let str = num.toString()
+        var len1 = str.substr(0, 1)
+        var len2 = str.substr(1, 1)
+        // eslint-disable-next-line eqeqeq
+        if (str.length > 1 && len1 == 0 && len2 != '.') {
+          str = str.substr(1, 1)
+        }
+        // eslint-disable-next-line eqeqeq
+        if (len1 == '.') {
+          str = ''
+        }
+        // eslint-disable-next-line eqeqeq
+        if (str.indexOf('.') != -1) {
+          var str_ = str.substr(str.indexOf('.') + 1)
+          // eslint-disable-next-line eqeqeq
+          if (str_.indexOf('.') != -1) {
+            str = str.substr(0, str.indexOf('.') + str_.indexOf('.') + 1)
+          }
+          if (str_.length > 2) {
+            this.$message.warning(`金额小数点后只能输入两位，请正确输入！`)
+            return (str = '')
+          }
+        }
+        // eslint-disable-next-line no-useless-escape
+        str = str.replace(/[^\d^\.]+/g, '') // 保留数字和小数点
+        return str
+      },
+      positiveInteger (num) {
+        let str = num.toString()
+        var len1 = str.substr(0, 1)
+        var len2 = str.substr(1, 1)
+        // eslint-disable-next-line eqeqeq
+        if (str.length > 1 && len1 == 0 && len2 != '.') {
+          str = str.substr(1, 1)
+        }
+        // eslint-disable-next-line eqeqeq
+        if (len1 == '.') {
+          str = ''
+        }
+        // eslint-disable-next-line no-useless-escape
+        str = str.replace(/[^\d^]+/g, '') // 保留数字
+        return str
+      },
+      tableRowClassName ({row, rowIndex}) {
+        row.index = rowIndex
+      },
+      handleRadioChange (val) {
+        if (val) {
+          this.radio = val.index
+        }
+      },
+      // 关闭窗口时调用
+      closeXTable () {
+        this.closePop()
+      },
+      rowStyle (event) {
+        return 'cursor:pointer;'
+      },
+      closePop () {
+        this.visable = false
+      },
+      updateStatusById (type) {
+        console.log('type' + type)
+        if (type === 'agree') {
+          this.inputForm.status = '5'
+          this.contractInfoService.updateStatusById(this.inputForm)
+        }
+        // 驳回
+        if (type === 'reject') {
+          this.inputForm.status = '4'
+          this.contractInfoService.updateStatusById(this.inputForm)
+        }
+        if (type === 'reback') {
+          this.inputForm.status = '3'
+          this.contractInfoService.updateStatusById(this.inputForm)
+        }
+      },
+      checkData () {
+        let begin = this.inputForm.effectiveDate
+        let close = this.inputForm.closingDate
+        if (close < begin) {
+          this.$message.warning(`合同终止日期要大于合同开始日期`)
+          this.inputForm.closingDate = ''
+        }
+      }
+    }
+  }
+</script>
+
+<style>
+  .tid_40 .vxe-body--column .vxe-cell{
+    padding: 1px;
+    text-align: center;
+  }
+  .tid_40 .vxe-header--row .col--last{
+    text-align: center;
+  }
+  .tid_45 .vxe-body--column .vxe-cell{
+    padding: 1px;
+    text-align: center;
+  }
+  .tid_45 .vxe-header--row .col--last{
+    text-align: center;
+  }
+</style>
+
+<style scoped>
+  .avatar{
+    height: 100px;
+  }
+  .el-divider__text {
+    font-weight: bold;
+    font-size: 16px;
+  }
+</style>

src/views/modules/cw/workContract/ContractNameForm.vue

@@ -0,0 +1,573 @@
+<template>
+  <div>
+    <el-dialog
+      :title="title"
+      :close-on-click-modal="false"
+      v-dialogDrag
+      width="1200px"
+      @close="close(),closeXTable()"
+      @keyup.enter.native="doSubmit"
+      :visible.sync="visible">
+        <el-form size="middle" :model="inputForm" ref="inputForm" v-loading="loading" :class="method==='view'?'readonly':''"  :disabled="method==='view'"
+           label-width="150px">
+
+          <el-row  :gutter="0">
+            <el-col :span="12">
+              <el-form-item label="合同编号" prop="contractNo"
+                            :rules="[{required: true, message: '合同编号不能为空', trigger: 'blur'}
+                 ]">
+                <el-input maxlength="64" :disabled="true" v-model="inputForm.contractNo" placeholder="自动生成"></el-input>
+              </el-form-item>
+            </el-col>
+
+            <el-col :span="12">
+              <el-form-item label="合同名称" prop="contractName"
+                            :rules="[{required: true, message: '合同名称不能为空', trigger: 'blur'}
+                 ]">
+                <el-input v-model="inputForm.contractName" placeholder="请输入合同名称"     clearable></el-input>
+              </el-form-item>
+            </el-col>
+
+          </el-row>
+
+          <el-row  :gutter="15">
+
+            <el-col :span="12">
+              <el-form-item label="合同状态" prop="contractStatus"
+                            :rules="[{required: true, message: '合同状态不能为空', trigger: 'blur'}
+                 ]">
+                <el-input maxlength="64" v-model="inputForm.contractStatus" :disabled="true" placeholder="请输入合同状态"></el-input>
+              </el-form-item>
+            </el-col>
+
+            <el-col :span="12">
+              <el-form-item label="付款主体" prop="payerSubject"
+                            :rules="[{required: true, message: '付款主体不能为空', trigger: 'blur'}
+                 ]">
+                <el-select v-model="inputForm.payerSubject" placeholder="请选择付款主体" style="width:100%;">
+                  <el-option
+                    v-for="item in $dictUtils.getDictList('cw_payment_subject')"
+                    :key="item.value"
+                    :label="item.label"
+                    :value="item.value">
+                  </el-option>
+                </el-select>
+              </el-form-item>
+            </el-col>
+
+            <el-col :span="12">
+              <el-form-item label="付款方式" prop="paymentMethod"
+                            :rules="[{required: true, message: '付款方式不能为空', trigger: 'blur'}
+                 ]">
+                <el-select v-model="inputForm.paymentMethod" placeholder="请选择付款方式" style="width:100%;">
+                  <el-option
+                    v-for="item in $dictUtils.getDictList('cw_payment_method')"
+                    :key="item.value"
+                    :label="item.label"
+                    :value="item.value">
+                  </el-option>
+                </el-select>
+              </el-form-item>
+            </el-col>
+
+            <el-col :span="12">
+              <el-form-item label="签约日期" prop="signingDate"
+                            :rules="[
+                {required: true, message:'请输入签约日期', trigger:'blur'}
+               ]">
+                <el-date-picker
+                  placement="bottom-start"
+                  value-format="yyyy-MM-dd"
+                  v-model="inputForm.signingDate"
+                  style="width: 100%"
+                  placeholder="选择日期">
+                </el-date-picker>
+              </el-form-item>
+            </el-col>
+
+            <el-col :span="12">
+              <el-form-item label="合同金额(元)" prop="contractAmount"
+                            :rules="[
+                  {required: true, message:'请输入合同金额(元)', trigger:'blur'}
+               ]">
+                <el-input maxlength="15" v-model="inputForm.contractAmount" placeholder="请输入合同金额(元)"
+                          @keyup.native="inputForm.contractAmount = twoDecimalPlaces(inputForm.contractAmount)"
+                ></el-input>
+              </el-form-item>
+            </el-col>
+
+            <el-col :span="12">
+              <el-form-item label="合同实际金额" prop="actualContractAmount">
+                <el-input maxlength="64" :disabled="true" v-model="inputForm.actualContractAmount" ></el-input>
+              </el-form-item>
+            </el-col>
+
+            <el-col :span="12">
+              <el-form-item label="合同份数" prop="contractNum"
+                            :rules="[{required: true, message: '合同份数', trigger: 'blur'}
+                 ]">
+                <el-input maxlength="64" v-model="inputForm.contractNum" placeholder="请输入合同份数"></el-input>
+              </el-form-item>
+            </el-col>
+
+            <el-col :span="12">
+              <el-form-item label="付款约定" prop="paymentAgreement">
+                <el-input maxlength="64" v-model="inputForm.paymentAgreement" placeholder="请输入付款约定"></el-input>
+              </el-form-item>
+            </el-col>
+
+            <el-col :span="12">
+              <el-form-item label="修改次数" prop="changeNum"
+                            :rules="[{required: true, message: '修改次数', trigger: 'blur'}
+                 ]">
+                <el-input maxlength="64" :disabled="true" v-model="inputForm.changeNum" placeholder="请输入修改次数"></el-input>
+              </el-form-item>
+            </el-col>
+
+            <el-col :span="12">
+              <el-form-item label="所属部门" prop="department"
+                            :rules="[{required: true, message: '所属部门', trigger: 'blur'}
+                 ]">
+                <el-input maxlength="64" v-model="inputForm.department" placeholder="请输入所属部门"></el-input>
+              </el-form-item>
+            </el-col>
+
+            <el-col :span="12">
+              <el-form-item label="委托方联系人" prop="clientContacts"
+                            :rules="[{required: true, message: '委托方联系人', trigger: 'blur'}
+                 ]">
+                <el-input maxlength="100" v-model="inputForm.clientContacts" placeholder="请输入委托方联系人"></el-input>
+              </el-form-item>
+            </el-col>
+
+            <el-col :span="12">
+              <el-form-item label="委托方联系人电话" prop="clientContactsPhone"
+                            :rules="[{required: true, message: '委托方联系人电话', trigger: 'blur'}
+                 ]">
+                <el-input maxlength="15" v-model="inputForm.clientContactsPhone" placeholder="请输入委托方联系人电话"
+                          @keyup.native="inputForm.clientContactsPhone = twoDecimalPlaces(inputForm.clientContactsPhone)"
+                ></el-input>
+              </el-form-item>
+            </el-col>
+
+          </el-row>
+
+          <el-col :span="12">
+            <el-form-item label="合同归档审批类型" prop="contractApprovalType">
+              <el-select :disabled="true" v-model="inputForm.contractApprovalType" placeholder="请选择" style="width:100%;">
+                <el-option
+                  v-for="item in $dictUtils.getDictList('contract_type')"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value">
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+
+          <el-col :span="12">
+            <el-form-item label="创建人" prop="createBy"
+                          :rules="[{required: true, message: '创建人', trigger: 'blur'}
+                 ]">
+              <el-input maxlength="64" :disabled="true" v-model="inputForm.createBy" placeholder="请输入创建人"></el-input>
+            </el-form-item>
+          </el-col>
+
+          <el-col :span="12">
+            <el-form-item label="创建时间" prop="createDate">
+              <el-date-picker
+                placement="bottom-start"
+                value-format="yyyy-MM-dd"
+                v-model="inputForm.createDate"
+                style="width: 100%"
+                :disabled="true"
+                placeholder="选择日期">
+              </el-date-picker>
+            </el-form-item>
+          </el-col>
+
+          </el-form>
+
+      <el-image-viewer
+        v-if="showViewer"
+        :on-close="closeViewer"
+        :url-list="[url]"
+        zIndex="9999"/>
+      <span slot="footer" class="dialog-footer">
+      <el-button size="small" @click="close(),closeXTable()" icon="el-icon-circle-close">关闭</el-button>
+      <el-button size="small" type="primary" v-if="method != 'view'" @click="doSubmit()" icon="el-icon-circle-check" v-noMoreClick >确定</el-button>
+    </span>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+  import ContractInfoService from '@/api/cw/workContract/ContractInfoService'
+  import WorkClientService from '@/api/sys/WorkClientService'
+  import WorkClientSelect from '@/components/workClientInfoSelect'
+  import OSSSerive, {
+    httpRequest,
+    toHref,
+    openWindowOnUrl,
+    handleRemove,
+    fileName
+  } from '@/api/sys/OSSService'
+  import moment from 'moment'
+  import ElImageViewer from 'element-ui/packages/image/src/image-viewer'
+  export default {
+    data () {
+      return {
+        visable: false,
+        gridData: [],
+        radio: 0,
+        tableData: [],
+        dataList: [],
+        dataListNew: [],
+        title: '',
+        method: '',
+        isSubmit: false,
+        visible: false,
+        loading: false,
+        returnForm: {
+          clientId: '',
+          name: '',
+          contractDate: '',
+          effectiveDate: '',
+          closingDate: '',
+          contractType: '',
+          contractAmountType: '',
+          contractAmount: '',
+          contractOpposite: '',
+          contractFees: [],
+          contractFee: '',
+          describes: '',
+          contractSpecial: '',
+          remarks: '',
+          clientName: '',
+          permissionFlag: '',
+          showVi: true,
+          workAttachmentList: []
+        },
+        inputForm: {
+          contractNo: '',
+          contractName: '',
+          payerSubject: '',
+          paymentMethod: '',
+          signingDate: '',
+          contractAmount: '',
+          actualContractAmount: '',
+          contractNum: '',
+          contractStatus: '',
+          paymentAgreement: '',
+          changeNum: '',
+          department: '',
+          clientContacts: '',
+          clientContactsPhone: '',
+          contractApprovalType: '',
+          createBy: '',
+          createDate: ''
+        },
+        filesArra2: [],
+        fileList: [],
+        isFlag: true,
+        showViewer: false, // 显示查看器
+        url: '',
+        rowurl: '',
+        src: '',
+        showVi: true,
+        onedit: false,
+        type: '',
+        loadProgress: 0, // 动态显示进度条
+        progressFlag: false // 关闭进度条
+      }
+    },
+    components: {
+      ElImageViewer,
+      WorkClientSelect
+    },
+    ossService: null,
+    contractInfoService: null,
+    workClientService: null,
+    created () {
+      this.ossService = new OSSSerive()
+      this.contractInfoService = new ContractInfoService()
+      this.workClientService = new WorkClientService()
+    },
+    mounted () {
+      window.onPreview = this.onPreview
+    },
+    methods: {
+      uploadVideoProcess (event, file, fileList) {
+        this.progressFlag = true // 显示进度条
+        this.loadProgress = parseInt(event.percent) // 动态获取文件上传进度
+        if (this.loadProgress >= 100) {
+          this.loadProgress = 100
+          setTimeout(() => { this.progressFlag = false }, 1000) // 一秒后关闭进度条
+        }
+      },
+      async toHref (row) {
+        toHref(row)
+      },
+      onPreview (url) {
+        this.url = url
+        this.showViewer = true
+      },
+      // 关闭查看器
+      closeViewer () {
+        this.url = ''
+        this.showViewer = false
+      },
+      init (method, id) {
+        this.dataList = []
+        this.dataListNew = []
+        this.method = method
+        this.inputForm = {
+          contractNo: '',
+          contractName: '',
+          payerSubject: '',
+          paymentMethod: '',
+          signingDate: '',
+          contractAmount: '',
+          actualContractAmount: '',
+          contractNum: '',
+          contractStatus: '',
+          paymentAgreement: '',
+          changeNum: '',
+          department: '',
+          clientContacts: '',
+          clientContactsPhone: '',
+          contractApprovalType: '',
+          createBy: '',
+          createDate: ''
+        }
+        this.inputForm.id = id
+        if (method === 'add') {
+          this.inputForm.contractAmountType = '1'
+          this.title = `新建合同登记`
+        } else if (method === 'edit') {
+          this.title = '修改合同登记'
+        } else if (method === 'view') {
+          this.inputForm.showVi = false
+          this.title = '查看合同登记'
+        }
+        this.visible = true
+        this.loading = false
+        this.$nextTick(() => {
+          // this.$refs.upload.clearFiles()
+          this.$refs.inputForm.resetFields()
+          if (method === 'edit' || method === 'view') { // 修改或者查看
+            this.loading = true
+            this.contractInfoService.findById(this.inputForm.id).then(({data}) => {
+              this.inputForm = this.recover(this.inputForm, data)
+              const f = []
+              if (data.fees !== null && data.fees !== undefined && data.fees !== '') {
+                data.fees.split(',').forEach(item => {
+                  if (item !== null && item !== undefined && item !== '') {
+                    f.push(item)
+                  }
+                })
+              }
+              this.inputForm.contractFees = f
+            })
+          }
+          this.loading = false
+        })
+      },
+      // 表单提交
+      doSubmit () {
+        if (this.progressFlag === true) {
+          this.$message.warning('文件正在上传中,请稍等')
+          return
+        }
+        this.$refs['inputForm'].validate((valid) => {
+          if (valid) {
+            this.loading = true
+            this.dataListNew.forEach((item) => {
+              if (item.id === null || item.id === undefined || item.id === '') {
+                item.url = item.raw.url
+              }
+              item.attachmentFlag = 'workContract'
+              item.fileSize = item.size
+              item.attachmentName = item.name
+              this.inputForm.workAttachmentList.push(item)
+            })
+
+            this.contractInfoService.save(this.inputForm).then(({data}) => {
+              this.close()
+              this.$message.success(data.msg)
+              this.$emit('refreshDataList')
+              this.loading = false
+            }).catch(() => {
+              this.loading = false
+            })
+          }
+        })
+      },
+      close () {
+        this.$refs.inputForm.resetFields()
+        this.visible = false
+        this.inputForm.showVi = true
+      },
+      httpRequest (file) {
+        httpRequest(file, fileName(file), 'workContract')
+      },
+      handleRemove () {
+        this.fileList = handleRemove()
+      },
+      changes (file, fileList) {
+        this.dataListNew = []
+        this.dataList.forEach((item) => {
+          this.dataListNew.push(item)
+        })
+        fileList.forEach((item) => {
+          item.createDate = moment(new Date()).format('YYYY-MM-DD HH:mm:ss')
+          item.createBy = this.$store.state.user.name
+          this.dataListNew.push(item)
+        })
+        const isLt2M = file.size / 1024 / 1024 < 300
+        if (isLt2M === false) {
+          this.$message.error('文件大小不能超过 ' + 300 + 'M !')
+          this.fileList = []
+          this.filesArra2 = []
+        }
+      },
+      async showFile (row) {
+        await openWindowOnUrl(row)
+      },
+      // 排序
+      sortChangeHandle (column) {
+        this.orders = []
+        if (column.order != null) {
+          this.orders.push({column: this.$utils.toLine(column.prop), asc: column.order === 'ascending'})
+        }
+        this.refreshList()
+      },
+      deleteMsgById (row, index) {
+        this.dataListNew.splice(index, 1)
+        if (row.id !== null && row.id !== '' && row.id !== undefined) {
+          this.ossService.deleteMsgById(row.id)
+        }
+      },
+      twoDecimalPlaces (num) {
+        let str = num.toString()
+        var len1 = str.substr(0, 1)
+        var len2 = str.substr(1, 1)
+        // eslint-disable-next-line eqeqeq
+        if (str.length > 1 && len1 == 0 && len2 != '.') {
+          str = str.substr(1, 1)
+        }
+        // eslint-disable-next-line eqeqeq
+        if (len1 == '.') {
+          str = ''
+        }
+        // eslint-disable-next-line eqeqeq
+        if (str.indexOf('.') != -1) {
+          var str_ = str.substr(str.indexOf('.') + 1)
+          // eslint-disable-next-line eqeqeq
+          if (str_.indexOf('.') != -1) {
+            str = str.substr(0, str.indexOf('.') + str_.indexOf('.') + 1)
+          }
+          if (str_.length > 2) {
+            this.$message.warning(`金额小数点后只能输入两位，请正确输入！`)
+            return (str = '')
+          }
+        }
+        // eslint-disable-next-line no-useless-escape
+        str = str.replace(/[^\d^\.]+/g, '') // 保留数字和小数点
+        return str
+      },
+      tableRowClassName ({row, rowIndex}) {
+        row.index = rowIndex
+      },
+      handleRadioChange (val) {
+        if (val) {
+          this.radio = val.index
+        }
+      },
+      // 关闭窗口时调用
+      closeXTable () {
+        this.closePop()
+      },
+      rowStyle (event) {
+        return 'cursor:pointer;'
+      },
+      async rowClick (event) {
+        let id = this.gridData[event.rowIndex].companyid
+        await this.workClientService.enterpriseTicketInfo(id).then((data) => {
+          this.inputForm.clientName = data.data.ENTNAME
+          this.inputForm.clientId = data.data.COMPANYID
+        })
+        this.visable = false
+      },
+      async getPopTable () {
+        let name = this.inputForm.clientName
+        if (name !== null && name !== undefined && name !== '') {
+          await this.workClientService.enterpriseSearchByName(name).then(({data}) => {
+            this.gridData = data.data.items
+          })
+        }
+        this.$refs.pops.updatePopper()
+      },
+      closePop () {
+        this.visable = false
+      },
+      changeContractFee () {
+        let fee = ''
+        let fees = this.inputForm.contractFees
+        if (fees.length > 0) {
+          fees.forEach(i => {
+            if (i === '1') {
+              i = '计价格(2002)1980号文下浮%'
+            }
+            if (i === '2') {
+              i = '苏价服(2014)383号文下浮%'
+            }
+            if (i === '3') {
+              i = '标段 元/标段'
+            }
+            if (i === '4') {
+              i = '其他'
+            }
+            fee = fee + ';' + i
+            this.inputForm.contractFee = fee.substring(1, fee.length)
+          })
+        }
+      },
+      checkData () {
+        let begin = this.inputForm.effectiveDate
+        let close = this.inputForm.closingDate
+        if (close < begin) {
+          this.$message.warning(`合同终止日期异常，请重新选择`)
+          this.inputForm.closingDate = ''
+        }
+      }
+    }
+  }
+</script>
+
+<style>
+  .tid_40 .vxe-body--column .vxe-cell{
+    padding: 1px;
+    text-align: center;
+  }
+  .tid_40 .vxe-header--row .col--last{
+    text-align: center;
+  }
+  .tid_45 .vxe-body--column .vxe-cell{
+    padding: 1px;
+    text-align: center;
+  }
+  .tid_45 .vxe-header--row .col--last{
+    text-align: center;
+  }
+</style>
+
+<style scoped>
+  .avatar{
+    height: 100px;
+  }
+  .el-divider__text {
+    font-weight: bold;
+    font-size: 16px;
+  }
+</style>

src/views/modules/cw/workContract/ContractRegistration.vue

@@ -0,0 +1,601 @@
+<template>
+  <div class="page">
+    <el-form size="small" :inline="true" class="query-form" ref="searchForm" :model="searchForm" @keyup.enter.native="refreshList()" @submit.native.prevent>
+      <!-- 搜索框-->
+      <el-form-item label="合同编号" prop="contractNo">
+        <el-input size="small" v-model="searchForm.contractNo" placeholder="请输入客户名称" clearable></el-input>
+      </el-form-item>
+
+      <el-form-item label="合同名称" prop="contractName">
+        <el-input size="small" v-model="searchForm.contractName" placeholder="请输入合同名称" clearable></el-input>
+      </el-form-item>
+
+      <el-form-item label="合同金额" prop="contractAmounts">
+        <InputNumber :disabled="false" :precision="num" v-model="searchForm.contractAmounts"></InputNumber>
+      </el-form-item>
+
+      <el-form-item label="签约时间" prop="contractDates">
+        <el-date-picker
+          placement="bottom-start"
+          v-model="searchForm.contractDates"
+          type="datetimerange"
+          range-separator="至"
+          start-placeholder="开始日期"
+          end-placeholder="结束日期">
+        </el-date-picker>
+      </el-form-item>
+
+      <el-form-item label="创建人" prop="createBy">
+        <SelectUserTree
+          ref="companyTree"
+          :props="{
+                  value: 'id',             // ID字段名
+                  label: 'name',         // 显示名称
+                  children: 'children'    // 子级字段名
+                }"
+          :url="`/sys/user/treeUserDataAllOffice?type=2`"
+          :value="searchForm.createBy"
+          :clearable="true"
+          :accordion="true"
+          @getValue="(value) => {searchForm.createBy=value}"/>
+      </el-form-item>
+
+      <el-form-item label="所属部门" prop="department">
+        <el-input size="small" v-model="searchForm.department" placeholder="请输入所属部门" clearable></el-input>
+      </el-form-item>
+
+      <el-form-item label="状态" prop="status">
+        <el-select v-model="searchForm.status" placeholder="请选择" style="width:100%;">
+          <el-option
+            v-for="item in $dictUtils.getDictList('cw_status')"
+            :key="item.value"
+            :label="item.label"
+            :value="item.value">
+          </el-option>
+        </el-select>
+      </el-form-item>
+
+      <el-form-item label="归档状态" prop="filedType">
+        <el-select v-model="searchForm.filedType" placeholder="请选择" style="width:100%;">
+          <el-option
+            v-for="item in $dictUtils.getDictList('filed_type')"
+            :key="item.value"
+            :label="item.label"
+            :value="item.value">
+          </el-option>
+        </el-select>
+      </el-form-item>
+
+      <el-form-item>
+        <el-button type="primary" @click="refreshList()" size="small" icon="el-icon-search">查询</el-button>
+        <el-button @click="resetSearch()" size="small" icon="el-icon-refresh-right">重置</el-button>
+      </el-form-item>
+    </el-form>
+
+    <div class="bg-white top">
+      <vxe-toolbar :refresh="{query: refreshList}" import export print custom>
+        <template #buttons>
+          <el-button v-if="hasPermission('sys:project:add')" type="primary" size="small" icon="el-icon-plus" @click="add()">新建</el-button>
+          <el-button v-if="hasPermission('sys:project:del')" type="danger"   size="small" icon="el-icon-delete" @click="del()" plain>删除</el-button>
+        </template>
+      </vxe-toolbar>
+      <div style="height: calc(100% - 80px);">
+        <vxe-table
+          border="inner"
+          auto-resize
+          resizable
+          height="auto"
+          :loading="loading"
+          size="small"
+          ref="workContractTable"
+          show-header-overflow
+          show-overflow
+          highlight-hover-row
+          :menu-config="{}"
+          :print-config="{}"
+          @sort-change="sortChangeHandle"
+          :sort-config="{remote:true}"
+          :data="dataList"
+          :checkbox-config="{}">
+          <vxe-column type="seq" width="60" title="序号"></vxe-column>
+          <vxe-column type="checkbox" width="40px"></vxe-column>
+
+          <vxe-column width="200px" title="合同编号" field="contractNo"></vxe-column>
+          <vxe-column width="200px" title="合同名称" field="contractName">
+            <template slot-scope="scope">
+              <el-link  type="primary" :underline="false" v-if="hasPermission('cw:workContract:edit')" @click="view(scope.row.id)">{{scope.row.contractName}}</el-link>
+              <el-link  type="primary" :underline="false" v-else-if="hasPermission('cw:workContract:view')" @click="view(scope.row.id)">{{scope.row.contractName}}</el-link>
+              <span v-else>{{scope.row.contractName}}</span>
+            </template>
+          </vxe-column>
+          <vxe-column width="200px" title="签约日期" field="signingDate"></vxe-column>
+          <vxe-column width="200px" title="合同金额(元)" field="contractAmount"></vxe-column>
+          <vxe-column width="200px" title="所属部门" field="department"></vxe-column>
+          <vxe-column width="200px" title="创建人" field="createBy"></vxe-column>
+          <vxe-column width="200px" title="创建日期" field="createDate"></vxe-column>
+          <vxe-column width="200px" title="状态" field="status">
+            <template slot-scope="scope">
+              <el-button  type="text" @click="detail(scope.row)" :type="$dictUtils.getDictLabel('cw_status_flag', scope.row.status, '-')" effect="dark" size="mini">{{$dictUtils.getDictLabel("cw_status", scope.row.status, '-')}} </el-button>
+            </template>
+          </vxe-column>
+          <vxe-column width="200px" title="归档状态" field="filedType">
+            <template slot-scope="scope">
+              <el-button  type="text" @click="detailFiled(scope.row)" :type="$dictUtils.getDictLabel('filed_type_status', scope.row.filedType, '-')" effect="dark" size="mini">{{$dictUtils.getDictLabel("filed_type", scope.row.filedType, '未归档')}} </el-button>
+            </template>
+          </vxe-column>
+
+
+          <vxe-column title="操作" width="200px" fixed="right" align="center">
+            <template  slot-scope="scope">
+              <el-button v-if="hasPermission('cw:workContract:view')" type="text" size="small" @click="view(scope.row.id)">查看</el-button>
+              <el-button v-if="hasPermission('cw:workContract:edit') && scope.row.status !== '2' && scope.row.status !== '5' && scope.row.createId === create" type="text" size="small" @click="edit(scope.row)">修改</el-button>
+              <el-button v-if="hasPermission('cw:workContract:edit') && scope.row.status === '5' && isAdmin" type="text" size="small" @click="editForm(scope.row.id)">修改</el-button>
+              <el-button v-if="hasPermission('cw:workContract:del') && (scope.row.status === '1' || scope.row.status === '3' || scope.row.status === '4')  && scope.row.createId === create" type="text" size="small" @click="del(scope.row.id)">删除</el-button>
+              <el-button v-if="hasPermission('cw:workContract:back') && scope.row.status === '2'" type="text" size="small" @click="reback(scope.row)">撤回</el-button>
+              <el-button v-if="hasPermission('cw:workContract:filed') && scope.row.status === '5' && scope.row.createId === create && (scope.row.filedType === '0' || scope.row.filedType === undefined)" type="text" size="small" @click="filed(scope.row.id)">归档</el-button>
+              <!--归档暂存修改-->
+              <el-button v-if="hasPermission('cw:workContract:filed') && scope.row.status === '5' && scope.row.createId === create && scope.row.filedType === '1'" type="text" size="small" @click="filed(scope.row.id)">修改</el-button>
+              <!--归档撤回驳回修改-->
+              <el-button v-if="hasPermission('cw:workContract:filed') && scope.row.status === '5' && scope.row.createId === create && (scope.row.filedType === '3' || scope.row.filedType === '4')" type="text" size="small" @click="filedAndClose(scope.row.id)">修改</el-button>
+              <!--归档撤回-->
+              <el-button v-if="hasPermission('cw:workContract:back') && scope.row.status === '5' && scope.row.filedType === '2'" type="text"  size="small" @click="rebackFiled(scope.row)">撤回</el-button>
+              </template>
+          </vxe-column>
+        </vxe-table>
+        <vxe-pager
+          background
+          size="small"
+          :current-page="tablePage.currentPage"
+          :page-size="tablePage.pageSize"
+          :total="tablePage.total"
+          :page-sizes="[10, 20, 100, 1000, {label: '全量数据', value: 1000000}]"
+          :layouts="['PrevPage', 'JumpNumber', 'NextPage', 'FullJump', 'Sizes', 'Total']"
+          @page-change="currentChangeHandle">
+        </vxe-pager>
+      </div>
+    </div>
+    <!-- 弹窗, 新增 / 修改 -->
+    <ContractNameForm ref="contractNameForm" @refreshDataList="refreshList"></ContractNameForm>
+    <WorkClientForm ref="workClientForm" @refreshDataList="refreshList"></WorkClientForm>
+    <WorkContractBorrowMessageForm ref="workContractBorrowMessageForm" @refreshDataList="refreshList"></WorkContractBorrowMessageForm>
+  </div>
+</template>
+
+<script>
+  import InputNumber from './InputNumber.vue'
+  import ContractNameForm from './ContractNameForm'
+  import WorkClientForm from '../../sys/workClient/WorkClientForm'
+  import WorkContractBorrowMessageForm from './WorkContractBorrowMessageForm'
+  // import WorkContractService from '@/api/sys/WorkContractService'
+  import ContractInfoService from '../../../../api/cw/workContract/ContractInfoService'
+  import WorkContractFileService from '@/api/sys/WorkContractFileService'
+  import WorkContractBorrowService from '@/api/sys/WorkContractBorrowService'
+  import SelectUserTree from '@/views/modules/utils/treeUserSelect'
+  import TaskService from '@/api/flowable/TaskService'
+  import ProcessService from '@/api/flowable/ProcessService'
+  import pick from 'lodash.pick'
+  import UserService from '@/api/sys/UserService'
+  export default {
+    data () {
+      return {
+        visible: false,
+        num: 0,
+        searchForm: {
+          contractNo: '',
+          contractName: '',
+          contractAmount: '',
+          contractDates: [],
+          type: '',
+          filedType: '',
+          contractAmounts: [],
+          createBy: '',
+          createId: '',
+          department: '',
+          status: '',
+          procInsId: '',
+          processDefinitionId: ''
+        },
+        dataList: [],
+        tablePage: {
+          total: 0,
+          currentPage: 1,
+          pageSize: 10,
+          orders: []
+        },
+        processDefinitionId: '',
+        procDefKey: '',
+        loading: false,
+        create: '',
+        isAdmin: false
+      }
+    },
+    // workContractService: null,
+    contractInfoService: null,
+    workContractFileService: null,
+    workContractBorrowService: null,
+    taskService: null,
+    processService: null,
+    userService: null,
+    created () {
+      // this.workContractService = new WorkContractService()
+      this.contractInfoService = new ContractInfoService()
+      this.workContractFileService = new WorkContractFileService()
+      this.workContractBorrowService = new WorkContractBorrowService()
+      this.taskService = new TaskService()
+      this.processService = new ProcessService()
+      this.userService = new UserService()
+    },
+    components: {
+      InputNumber,
+      ContractNameForm,
+      WorkClientForm,
+      WorkContractBorrowMessageForm,
+      SelectUserTree
+    },
+    activated () {
+      this.is()
+      this.refreshList()
+    },
+    computed: {
+      userName () {
+        return JSON.parse(localStorage.getItem('user')).name
+      },
+      user () {
+        this.create = JSON.parse(localStorage.getItem('user')).id
+        console.log('createId', this.create)
+        return JSON.parse(localStorage.getItem('user'))
+      }
+    },
+
+    methods: {
+      // 获取数据列表
+      refreshList () {
+        console.log('user', this.user)
+        this.loading = true
+        this.contractInfoService.list({
+          'current': this.tablePage.currentPage,
+          'size': this.tablePage.pageSize,
+          'orders': this.tablePage.orders,
+          'itemType': '1',
+          ...this.searchForm
+        }).then(({data}) => {
+          this.dataList = data.records
+          this.tablePage.total = data.total
+          this.loading = false
+        })
+        this.processService.getByName('财务-合同登记').then(({data}) => {
+          if (!this.commonJS.isEmpty(data.id)) {
+            this.processDefinitionId = data.id
+            this.procDefKey = data.key
+          }
+        })
+      },
+      // 当前页
+      currentChangeHandle ({currentPage, pageSize}) {
+        this.tablePage.currentPage = currentPage
+        this.tablePage.pageSize = pageSize
+        this.refreshList()
+      },
+      // 排序
+      sortChangeHandle (column) {
+        this.tablePage.orders = []
+        if (column.order != null) {
+          this.tablePage.orders.push({column: this.$utils.toLine(column.property), asc: column.order === 'asc'})
+        }
+        this.refreshList()
+      },
+      // 新增
+      add () {
+        this.start()
+      },
+      // 详情
+      detail (row) {
+        // eslint-disable-next-line eqeqeq
+        if (!this.commonJS.isEmpty(row.status) && row.status != '1') {
+          this.taskService.getTaskDef({
+            procInsId: row.procInsId,
+            procDefId: row.processDefinitionId
+          }).then(({data}) => {
+            this.$router.push({
+              path: '/flowable/task/TaskFormDetail',
+              query: {
+                readOnly: true,
+                title: '流程详情',
+                formTitle: '流程详情',
+                businessId: row.id,
+                ...pick(data, 'formType', 'formUrl', 'procDefKey', 'taskDefKey', 'procInsId', 'procDefId', 'taskId', 'status', 'title', 'businessId')}
+            })
+          })
+        }
+      },
+      // 修改
+      edit (row) {
+        if (row.status === '3' || row.status === '4') {
+          this.editWithClose(row)
+        } else {
+          this.editWithHold(row)
+        }
+      },
+      // 管理员修改
+      editForm (id) {
+        id = id || this.$refs.workClientTable.getCheckboxRecords().map(item => {
+          return item.id
+        })[0]
+        this.$refs.contractNameForm.init('edit', id)
+      },
+      // 查看
+      view (id) {
+        this.$refs.contractNameForm.init('view', id)
+      },
+      // 客户信息查看
+      viewInfo (id) {
+        this.$refs.workClientForm.init('view', id)
+      },
+      // 删除
+      del (id) {
+        let ids = id || this.$refs.workContractTable.getCheckboxRecords().map(item => {
+          return item.id
+        }).join(',')
+        this.$confirm(`确定删除所选项吗?`, '提示', {
+          confirmButtonText: '确定',
+          cancelButtonText: '取消',
+          type: 'warning'
+        }).then(() => {
+          this.loading = true
+          this.contractInfoService.remove(ids).then(({data}) => {
+            this.$message.success(data)
+            this.refreshList()
+            this.loading = false
+          })
+        })
+      },
+      resetSearch () {
+        this.$refs.searchForm.resetFields()
+        this.refreshList()
+      },
+      start () {
+        // 读取流程表单
+        let tabTitle = `发起流程【财务-合同登记】`
+        let processTitle = `${this.userName} 在 ${this.moment(new Date()).format('YYYY-MM-DD HH:mm')} 发起了 [财务-合同登记]`
+        this.taskService.getTaskDef({ procDefId: this.processDefinitionId,
+          status: 'startAndHold'}).then((data) => {
+            this.$router.push({
+              path: '/flowable/task/TaskForm',
+              query: {
+                procDefId: this.processDefinitionId,
+                procDefKey: this.procDefKey,
+                status: 'startAndHold',
+                title: tabTitle,
+                formType: data.data.formType,
+                formUrl: data.data.formUrl,
+                formTitle: processTitle,
+                businessId: 'false',
+                isShow: false,
+                routePath: '/cw/workContract/ContractRegistration'
+              }
+            })
+          })
+      },
+      editWithHold (row) {
+        // 读取流程表单
+        let tabTitle = `发起流程【财务-合同登记】`
+        let processTitle = `${this.userName} 在 ${this.moment(new Date()).format('YYYY-MM-DD HH:mm')} 发起了 [财务-合同登记]`
+        this.taskService.getTaskDef({ procDefId: this.processDefinitionId,
+          businessId: row.id,
+          businessTable: 'cw_work_contract_info',
+          status: 'startAndHold'}).then((data) => {
+            this.$router.push({
+              path: '/flowable/task/TaskForm',
+              query: {
+                procDefId: this.processDefinitionId,
+                procDefKey: this.procDefKey,
+                status: 'startAndHold',
+                title: tabTitle,
+                formType: data.data.formType,
+                formUrl: data.data.formUrl,
+                formTitle: processTitle,
+                businessTable: 'cw_work_contract_info',
+                businessId: row.id,
+                isShow: false,
+                routePath: '/cw/workContract/ContractRegistration'
+              }
+            })
+          })
+      },
+      editWithClose (row) {
+        // 读取流程表单
+        let tabTitle = `发起流程【财务-合同登记】`
+        let processTitle = `${this.userName} 在 ${this.moment(new Date()).format('YYYY-MM-DD HH:mm')} 发起了 [财务-合同登记]`
+        this.taskService.getTaskDef({ procDefId: this.processDefinitionId,
+          businessId: row.id,
+          businessTable: 'work_contract_info',
+          status: 'startAndClose'
+        }).then((data) => {
+          this.$router.push({
+            path: '/flowable/task/TaskForm',
+            query: {
+              procDefId: this.processDefinitionId,
+              procDefKey: this.procDefKey,
+              status: 'startAndClose',
+              title: tabTitle,
+              formType: data.data.formType,
+              formUrl: data.data.formUrl,
+              formTitle: processTitle,
+              businessTable: 'work_contract_info',
+              businessId: row.id,
+              isShow: false,
+              routePath: '/cw/workContract/ContractRegistration'
+            }
+          })
+        })
+      },
+      reback (row) {
+        console.log('row', row.procInsId)
+        this.$confirm(`确定撤回流程吗?`, '提示', {
+          confirmButtonText: '确定',
+          cancelButtonText: '取消',
+          type: 'warning'
+        }).then(() => {
+          this.processService.revokeProcIns(row.procInsId).then(({data}) => {
+            console.log('updateStatusById')
+            let form = {status: '3', id: row.id}
+            this.updateStatusById(form, 'reback')
+            this.$message.success(data)
+            this.refreshList()
+          })
+        })
+      },
+      rebackFiled (row) {
+        this.$confirm(`确定撤回流程吗?`, '提示', {
+          confirmButtonText: '确定',
+          cancelButtonText: '取消',
+          taskId: row.taskFiledId,
+          type: 'warning'
+        }).then(() => {
+          this.taskService.backNodes(row.taskFiledId).then(({data}) => {
+            let backNodes = data
+            if (backNodes.length > 0) {
+              let backTaskDefKey = backNodes[0].taskDefKey
+              this.taskService.back({
+                taskId: row.taskFiledId,
+                backTaskDefKey: backTaskDefKey,
+                isShow: false,
+                ...this.auditForm
+              }).then(({data}) => {
+                this.updateStatusById(row, 'rebackFiled')
+                this.$message.success('回退成功')
+              })
+            }
+          })
+        })
+      },
+      updateStatusById (row, type) {
+        console.log('updateStatusByIdupdateStatusById')
+        console.log(type)
+        if (type === 'agree') {
+          row.status = '5'
+          this.contractInfoService.updateStatusById(row)
+        }
+        if (type === 'reject') {
+          row.status = '4'
+          this.contractInfoService.updateStatusById(row)
+        }
+        if (type === 'reback') {
+          row.status = '3'
+          this.contractInfoService.updateStatusById(row)
+        }
+        if (type === 'rebackFiled') {
+          row.filedType = '3'
+          this.workContractFileService.updateStatusById(row)
+        }
+        if (type === 'rebackBorrow') {
+          row.borrowType = '0'
+          this.workContractBorrowService.updateStatusByContractInfoId(row).then(() => {
+            this.workContractBorrowService.deleteById(row.id)
+          })
+        }
+        if (type === 'retureBorrow') {
+          row.borrowType = '0'
+          this.workContractBorrowService.updateStatusByContractInfoId(row).then(() => {
+            row.type = 'reture'
+            row.borrowType = '5'
+            this.workContractBorrowService.updateMessageStatusById(row)
+          })
+        }
+      },
+      is () {
+        this.userService.is().then(({data}) => {
+          this.isAdmin = data
+        })
+      },
+      // 归档
+      filed (id) {
+        this.processService.getByName('财务-合同登记归档').then(({data}) => {
+          if (!this.commonJS.isEmpty(data.id)) {
+            console.log('data', data)
+            // 读取流程表单
+            let tabTitle = `发起流程【财务-合同登记归档】`
+            let processTitle = `${this.userName} 在 ${this.moment(new Date()).format('YYYY-MM-DD HH:mm')} 发起了 [财务-合同登记归档]`
+            this.taskService.getTaskDef({ procDefId: data.id,
+              businessId: id,
+              businessTable: 'cw_work_contract_file',
+              status: 'startAndHoldFiled'}).then((reture) => {
+                this.$router.push({
+                  path: '/flowable/task/TaskForm',
+                  query: {
+                    procDefId: data.id,
+                    procDefKey: data.key,
+                    status: 'startAndHoldFiled',
+                    title: tabTitle,
+                    formType: reture.data.formType,
+                    formUrl: reture.data.formUrl,
+                    formTitle: processTitle,
+                    businessTable: 'cw_work_contract_file',
+                    businessId: id,
+                    isShow: false,
+                    routePath: '/cw/workContract/ContractRegistration'
+                  }
+                })
+              })
+          }
+        })
+      },
+      // 归档
+      filedAndClose (id) {
+        this.processService.getByName('财务-合同登记归档').then(({data}) => {
+          if (!this.commonJS.isEmpty(data.id)) {
+            console.log('data', data)
+            // 读取流程表单
+            let tabTitle = `发起流程【财务-合同登记归档】`
+            let processTitle = `${this.userName} 在 ${this.moment(new Date()).format('YYYY-MM-DD HH:mm')} 发起了 [财务-合同登记归档]`
+            this.taskService.getTaskDef({ procDefId: data.id,
+              businessId: id,
+              businessTable: 'cw_work_contract_file',
+              status: 'startAndCloseFiled'}).then((reture) => {
+                this.$router.push({
+                  path: '/flowable/task/TaskForm',
+                  query: {
+                    procDefId: data.id,
+                    procDefKey: data.key,
+                    status: 'startAndCloseFiled',
+                    title: tabTitle,
+                    formType: reture.data.formType,
+                    formUrl: reture.data.formUrl,
+                    formTitle: processTitle,
+                    businessTable: 'cw_work_contract_file',
+                    businessId: id,
+                    isShow: false,
+                    routePath: '/cw/workContract/ContractRegistration'
+                  }
+                })
+              })
+          }
+        })
+      },
+      // 归档详情
+      detailFiled (row) {
+        if (row.filedType !== '4') {
+          this.workContractFileService.findByContractInfoId(row.id).then(({data}) => {
+            if (!this.commonJS.isEmpty(data.id)) {
+              console.log('data', data)
+              this.taskService.getTaskDef({
+                procInsId: data.procInsId,
+                procDefId: data.processDefinitionId
+              }).then(({data}) => {
+                this.$router.push({
+                  path: '/flowable/task/TaskFormDetail',
+                  query: {
+                    readOnly: true,
+                    title: '归档流程详情',
+                    formTitle: '归档流程详情',
+                    businessId: row.id,
+                    ...pick(data, 'formType', 'formUrl', 'procDefKey', 'taskDefKey', 'procInsId', 'procDefId', 'taskId', 'status', 'title', 'businessId')}
+                })
+              })
+            }
+          })
+        }
+      }
+    }
+  }
+</script>

src/views/modules/cw/workContract/ContractRegistrationForm.vue

@@ -0,0 +1,598 @@
+<template>
+  <div>
+    <el-form size="middle" :model="inputForm" ref="inputForm" v-loading="loading" :class="method==='view'?'readonly':''"  :disabled="formReadOnly"
+             label-width="150px">
+
+      <el-row  :gutter="0">
+
+        <el-col :span="12">
+          <el-form-item label="合同编号" prop="contractNo">
+            <el-input maxlength="64" :disabled="true" v-model="inputForm.contractNo" placeholder="自动生成"></el-input>
+          </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item label="合同名称" prop="contractName"
+                        :rules="[{required: true, message: '合同名称不能为空', trigger: 'blur'}
+                 ]">
+            <el-input v-model="inputForm.contractName" placeholder="请输入合同名称"     clearable></el-input>
+          </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item label="合同状态" prop="contractStatus">
+            <el-input maxlength="64" v-model="inputForm.contractStatus" :disabled="true" placeholder="请输入合同状态"></el-input>
+          </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item label="付款主体" prop="payerSubject"
+                        :rules="[{required: true, message: '付款主体不能为空', trigger: 'blur'}
+                 ]">
+            <el-select v-model="inputForm.payerSubject" placeholder="请选择付款主体" style="width:100%;">
+              <el-option
+                v-for="item in $dictUtils.getDictList('cw_payment_subject')"
+                :key="item.value"
+                :label="item.label"
+                :value="item.value">
+              </el-option>
+            </el-select>
+          </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item label="付款方式" prop="paymentMethod"
+                        :rules="[{required: true, message: '付款方式不能为空', trigger: 'blur'}
+                 ]">
+            <el-select v-model="inputForm.paymentMethod" placeholder="请选择付款方式" style="width:100%;">
+              <el-option
+                v-for="item in $dictUtils.getDictList('cw_payment_method')"
+                :key="item.value"
+                :label="item.label"
+                :value="item.value">
+              </el-option>
+            </el-select>
+          </el-form-item>
+        </el-col>
+
+        <el-col :span="12">
+          <el-form-item label="签约日期" prop="signingDate"
+                        :rules="[
+                {required: true, message:'请输入签约日期', trigger:'blur'}
+               ]">
+            <el-date-picker
+              placement="bottom-start"
+              value-format="yyyy-MM-dd"
+              v-model="inputForm.signingDate"
+              style="width: 100%"
+              placeholder="选择日期">
+            </el-date-picker>
+          </el-form-item>
+        </el-col>
+
+        <el-col :span="12">
+          <el-form-item label="合同金额(元)" prop="contractAmount"
+                        :rules="[
+                  {required: true, message:'请输入合同金额(元)', trigger:'blur'}
+               ]">
+            <el-input maxlength="15" v-model="inputForm.contractAmount" placeholder="请输入合同金额(元)"
+                      @keyup.native="inputForm.contractAmount = twoDecimalPlaces(inputForm.contractAmount)"
+            ></el-input>
+          </el-form-item>
+        </el-col>
+
+        <el-col :span="12">
+          <el-form-item label="合同实际金额" prop="actualContractAmount">
+            <el-input maxlength="64" :disabled="true" v-model="inputForm.actualContractAmount" ></el-input>
+          </el-form-item>
+        </el-col>
+
+        <el-col :span="12">
+          <el-form-item label="合同份数" prop="contractNum"
+                        :rules="[{required: true, message: '合同份数', trigger: 'blur'}
+                 ]">
+            <el-input maxlength="64" v-model="inputForm.contractNum" placeholder="请输入合同份数"></el-input>
+          </el-form-item>
+        </el-col>
+
+        <el-col :span="12">
+          <el-form-item label="付款约定" prop="paymentAgreement">
+            <el-input maxlength="64" v-model="inputForm.paymentAgreement" placeholder="请输入付款约定"></el-input>
+          </el-form-item>
+        </el-col>
+
+        <el-col :span="12">
+          <el-form-item label="修改次数" prop="changeNum"
+                        :rules="[{required: true, message: '修改次数', trigger: 'blur'}
+                 ]">
+            <el-input maxlength="64" :disabled="true" v-model="inputForm.changeNum" placeholder="请输入修改次数"></el-input>
+          </el-form-item>
+        </el-col>
+
+        <el-col :span="12">
+          <el-form-item label="所属部门" prop="department"
+                        :rules="[{required: true, message: '所属部门', trigger: 'blur'}
+                 ]">
+            <el-input maxlength="64" v-model="inputForm.department" placeholder="请输入所属部门"></el-input>
+          </el-form-item>
+        </el-col>
+
+        <el-col :span="12">
+          <el-form-item label="委托方联系人" prop="clientContacts"
+                        :rules="[{required: true, message: '委托方联系人', trigger: 'blur'}
+                 ]">
+            <el-input maxlength="100" v-model="inputForm.clientContacts" placeholder="请输入委托方联系人"></el-input>
+          </el-form-item>
+        </el-col>
+
+        <el-col :span="12">
+          <el-form-item label="委托方联系人电话" prop="clientContactsPhone"
+                        :rules="[{required: true, message: '委托方联系人电话', trigger: 'blur'}
+                 ]">
+            <el-input maxlength="15" v-model="inputForm.clientContactsPhone" placeholder="请输入委托方联系人电话"
+                      @keyup.native="inputForm.clientContactsPhone = twoDecimalPlaces(inputForm.clientContactsPhone)"
+            ></el-input>
+          </el-form-item>
+        </el-col>
+
+        <el-col :span="12">
+          <el-form-item label="合同归档审批类型" prop="contractApprovalType">
+            <el-select :disabled="true" v-model="inputForm.contractApprovalType" placeholder="请选择" style="width:100%;">
+              <el-option
+                v-for="item in $dictUtils.getDictList('contract_type')"
+                :key="item.value"
+                :label="item.label"
+                :value="item.value">
+              </el-option>
+            </el-select>
+          </el-form-item>
+        </el-col>
+
+        <el-col :span="12">
+          <el-form-item label="创建人" prop="createBy"
+                        :rules="[{required: true, message: '创建人', trigger: 'blur'}
+                 ]">
+            <el-input maxlength="64" :disabled="true" v-model="inputForm.createBy" placeholder="请输入创建人"></el-input>
+          </el-form-item>
+        </el-col>
+
+        <el-col :span="12">
+          <el-form-item label="创建时间" prop="createDate">
+            <el-date-picker
+              placement="bottom-start"
+              value-format="yyyy-MM-dd"
+              v-model="inputForm.createDate"
+              style="width: 100%"
+              :disabled="true"
+              placeholder="选择日期">
+            </el-date-picker>
+          </el-form-item>
+        </el-col>
+
+      </el-row>
+
+      </el-form>
+      <el-image-viewer
+        v-if="showViewer"
+        :on-close="closeViewer"
+        :url-list="[url]"
+        zIndex="9999"/>
+  </div>
+</template>
+
+<script>
+  // import WorkContractService from '@/api/sys/WorkContractService'
+  import ContractInfoService from '@/api/cw/workContract/ContractInfoService'
+  import OSSSerive, {
+    httpRequest,
+    toHref,
+    openWindowOnUrl,
+    handleRemove,
+    fileName
+  } from '@/api/sys/OSSService'
+  import moment from 'moment'
+  import ElImageViewer from 'element-ui/packages/image/src/image-viewer'
+  export default {
+    data () {
+      return {
+        visable: false,
+        gridData: [],
+        radio: 0,
+        tableData: [],
+        dataList: [],
+        dataListNew: [],
+        title: '',
+        method: '',
+        isSubmit: false,
+        visible: false,
+        loading: false,
+        returnForm: {
+          clientId: '',
+          name: '',
+          contractDate: '',
+          effectiveDate: '',
+          closingDate: '',
+          contractType: '',
+          contractAmountType: '',
+          contractAmount: '',
+          contractOpposite: '',
+          contractFees: [],
+          fees: '',
+          contractFee: '',
+          describes: '',
+          contractSpecial: '',
+          remarks: '',
+          clientName: '',
+          workAttachmentList: [],
+          status: ''
+        },
+        inputForm: {
+          contractNo: '',
+          contractName: '',
+          payerSubject: '',
+          paymentMethod: '',
+          signingDate: '',
+          contractAmount: '',
+          actualContractAmount: '',
+          contractNum: '',
+          contractStatus: '',
+          paymentAgreement: '',
+          changeNum: '',
+          department: '',
+          clientContacts: '',
+          clientContactsPhone: '',
+          contractApprovalType: '',
+          createBy: JSON.parse(localStorage.getItem('user')).name,
+          createId: JSON.parse(localStorage.getItem('user')).id,
+          createDate: ''
+        },
+        filesArra2: [],
+        fileList: [],
+        isFlag: true,
+        showViewer: false, // 显示查看器
+        url: '',
+        rowurl: '',
+        src: '',
+        onedit: false,
+        type: '',
+        loadProgress: 0, // 动态显示进度条
+        progressFlag: false, // 关闭进度条
+        promi: null
+      }
+    },
+    props: {
+      businessId: {
+        type: String,
+        default: ''
+      },
+      formReadOnly: {
+        type: Boolean,
+        default: false
+      }
+    },
+    components: {
+      ElImageViewer
+    },
+    computed: {
+      officeName () {
+        return JSON.parse(localStorage.getItem('user')).officeDTO.name
+      }
+    },
+    ossService: null,
+    contractInfoService: null,
+    created () {
+      this.ossService = new OSSSerive()
+      this.contractInfoService = new ContractInfoService()
+    },
+    mounted () {
+      window.onPreview = this.onPreview
+    },
+    watch: {
+      'businessId': {
+        handler (newVal) {
+          if (this.businessId && this.businessId !== 'false') {
+            this.ossService = new OSSSerive()
+            this.init('edit', this.businessId)
+          } else {
+            // this.$refs.inputForm.resetFields()
+            // this.visible = false
+            // this.showVi = true
+            // this.$refs.uploadComponent.clearUpload()
+            this.init('clean', '')
+          }
+        },
+        immediate: true,
+        deep: false
+      }
+    },
+    methods: {
+      uploadVideoProcess (event, file, fileList) {
+        this.progressFlag = true // 显示进度条
+        this.loadProgress = parseInt(event.percent) // 动态获取文件上传进度
+        if (this.loadProgress >= 100) {
+          this.loadProgress = 100
+          setTimeout(() => { this.progressFlag = false }, 1000) // 一秒后关闭进度条
+        }
+      },
+      async toHref (row) {
+        toHref(row)
+      },
+      onPreview (url) {
+        this.url = url
+        this.showViewer = true
+      },
+      // 关闭查看器
+      closeViewer () {
+        this.url = ''
+        this.showViewer = false
+      },
+      init (method, id) {
+        console.log(method)
+        this.dataList = []
+        this.dataListNew = []
+        this.method = method
+        this.inputForm = {
+          contractNo: '',
+          contractName: '',
+          payerSubject: '',
+          paymentMethod: '',
+          signingDate: '',
+          contractAmount: '',
+          actualContractAmount: '',
+          contractNum: '2',
+          contractStatus: '新创建',
+          paymentAgreement: '',
+          changeNum: '0',
+          department: this.officeName,
+          clientContacts: '',
+          clientContactsPhone: '',
+          contractApprovalType: '',
+          createBy: JSON.parse(localStorage.getItem('user')).name,
+          createId: JSON.parse(localStorage.getItem('user')).id,
+          createDate: ''
+        }
+        this.inputForm.id = id
+        if (method === 'add') {
+          // this.inputForm.contractAmountType = '1'
+          this.title = `新建合同登记`
+        } else if (method === 'edit') {
+          this.title = '修改合同登记'
+        } else if (method === 'view') {
+          this.inputForm.showVi = false
+          this.title = '查看合同登记'
+        }
+        this.visible = true
+        this.loading = false
+        this.$nextTick(() => {
+          this.$refs.inputForm.resetFields()
+          if (method === 'edit' || method === 'view') { // 修改或者查看
+            this.loading = true
+            this.contractInfoService.findById(this.inputForm.id).then(({data}) => {
+              this.inputForm = this.recover(this.inputForm, data)
+              const f = []
+              if (data.fees !== null && data.fees !== undefined && data.fees !== '') {
+                data.fees.split(',').forEach(item => {
+                  if (item !== null && item !== undefined && item !== '') {
+                    f.push(item)
+                  }
+                })
+              }
+              this.inputForm.contractFees = f
+              if (this.formReadOnly) {
+                method = 'view'
+              }
+              this.loading = false
+            })
+          }
+        })
+      },
+
+      // 表单提交
+      // 暂存
+      async saveForm (callback) {
+        this.loading = true
+        this.inputForm.status = '1'
+        await this.contractInfoService.save(this.inputForm).then(({data}) => {
+          callback()
+          this.$refs.inputForm.resetFields()
+          this.loading = false
+        }).catch(() => {
+          this.$refs.inputForm.resetFields()
+          this.loading = false
+        })
+      },
+      // 送审
+      startForm (callback) {
+        this.$refs['inputForm'].validate(async (valid) => {
+          if (valid) {
+            this.loading = true
+            this.inputForm.status = '2'
+            // this.inputForm.fees = this.inputForm.contractFees.join(',')
+            await this.contractInfoService.save(this.inputForm).then(({data}) => {
+              console.log('data', data)
+              callback(data.businessTable, data.businessId, this.inputForm)
+              this.$refs.inputForm.resetFields()
+              this.loading = false
+            }).catch(() => {
+              this.$refs.inputForm.resetFields()
+              this.loading = false
+            })
+          }
+        })
+      },
+      // 通过
+      agreeForm (callback) {
+        this.$refs['inputForm'].validate(async (valid) => {
+          if (valid) {
+            this.loading = true
+            this.inputForm.status = '2'
+            // this.inputForm.fees = this.inputForm.contractFees.join(',')
+            await this.contractInfoService.save(this.inputForm).then(({data}) => {
+              callback(data.businessTable, data.businessId, this.inputForm)
+              this.$refs.inputForm.resetFields()
+              this.loading = false
+            }).catch(() => {
+              this.$refs.inputForm.resetFields()
+              this.loading = false
+            })
+          }
+        })
+      },
+      close () {
+        this.$refs.inputForm.resetFields()
+        this.inputForm.clientName = ''
+        this.visible = false
+        this.showVi = true
+      },
+      httpRequest (file) {
+        httpRequest(file, fileName(file), 'workContract')
+      },
+      handleRemove () {
+        this.fileList = handleRemove()
+      },
+      changes (file, fileList) {
+        this.dataListNew = []
+        this.dataList.forEach((item) => {
+          this.dataListNew.push(item)
+        })
+        fileList.forEach((item) => {
+          item.createDate = moment(new Date()).format('YYYY-MM-DD HH:mm:ss')
+          item.createBy = this.$store.state.user.name
+          this.dataListNew.push(item)
+        })
+        const isLt2M = file.size / 1024 / 1024 < 300
+        if (isLt2M === false) {
+          this.$message.error('文件大小不能超过 ' + 300 + 'M !')
+          this.fileList = []
+          this.filesArra2 = []
+        }
+      },
+      async showFile (row) {
+        await openWindowOnUrl(row)
+      },
+      // 排序
+      sortChangeHandle (column) {
+        this.orders = []
+        if (column.order != null) {
+          this.orders.push({column: this.$utils.toLine(column.prop), asc: column.order === 'ascending'})
+        }
+        this.refreshList()
+      },
+      deleteMsgById (row, index) {
+        this.dataListNew.splice(index, 1)
+        if (row.id !== null && row.id !== '' && row.id !== undefined) {
+          this.ossService.deleteMsgById(row.id)
+        }
+      },
+      twoDecimalPlaces (num) {
+        let str = num.toString()
+        var len1 = str.substr(0, 1)
+        var len2 = str.substr(1, 1)
+        // eslint-disable-next-line eqeqeq
+        if (str.length > 1 && len1 == 0 && len2 != '.') {
+          str = str.substr(1, 1)
+        }
+        // eslint-disable-next-line eqeqeq
+        if (len1 == '.') {
+          str = ''
+        }
+        // eslint-disable-next-line eqeqeq
+        if (str.indexOf('.') != -1) {
+          var str_ = str.substr(str.indexOf('.') + 1)
+          // eslint-disable-next-line eqeqeq
+          if (str_.indexOf('.') != -1) {
+            str = str.substr(0, str.indexOf('.') + str_.indexOf('.') + 1)
+          }
+          if (str_.length > 2) {
+            this.$message.warning(`金额小数点后只能输入两位，请正确输入！`)
+            return (str = '')
+          }
+        }
+        // eslint-disable-next-line no-useless-escape
+        str = str.replace(/[^\d^\.]+/g, '') // 保留数字和小数点
+        return str
+      },
+      positiveInteger (num) {
+        let str = num.toString()
+        var len1 = str.substr(0, 1)
+        var len2 = str.substr(1, 1)
+        // eslint-disable-next-line eqeqeq
+        if (str.length > 1 && len1 == 0 && len2 != '.') {
+          str = str.substr(1, 1)
+        }
+        // eslint-disable-next-line eqeqeq
+        if (len1 == '.') {
+          str = ''
+        }
+        // eslint-disable-next-line no-useless-escape
+        str = str.replace(/[^\d^]+/g, '') // 保留数字
+        return str
+      },
+      tableRowClassName ({row, rowIndex}) {
+        row.index = rowIndex
+      },
+      handleRadioChange (val) {
+        if (val) {
+          this.radio = val.index
+        }
+      },
+      // 关闭窗口时调用
+      closeXTable () {
+        this.closePop()
+      },
+      rowStyle (event) {
+        return 'cursor:pointer;'
+      },
+      closePop () {
+        this.visable = false
+      },
+      updateStatusById (type) {
+        console.log('type' + type)
+        if (type === 'agree') {
+          this.inputForm.status = '5'
+          this.contractInfoService.updateStatusById(this.inputForm)
+        }
+        // 驳回
+        if (type === 'reject') {
+          this.inputForm.status = '4'
+          this.contractInfoService.updateStatusById(this.inputForm)
+        }
+        if (type === 'reback') {
+          this.inputForm.status = '3'
+          this.contractInfoService.updateStatusById(this.inputForm)
+        }
+      },
+      checkData () {
+        let begin = this.inputForm.effectiveDate
+        let close = this.inputForm.closingDate
+        if (close < begin) {
+          this.$message.warning(`合同终止日期要大于合同开始日期`)
+          this.inputForm.closingDate = ''
+        }
+      }
+    }
+  }
+</script>
+
+<style>
+  .tid_40 .vxe-body--column .vxe-cell{
+    padding: 1px;
+    text-align: center;
+  }
+  .tid_40 .vxe-header--row .col--last{
+    text-align: center;
+  }
+  .tid_45 .vxe-body--column .vxe-cell{
+    padding: 1px;
+    text-align: center;
+  }
+  .tid_45 .vxe-header--row .col--last{
+    text-align: center;
+  }
+</style>
+
+<style scoped>
+  .avatar{
+    height: 100px;
+  }
+  .el-divider__text {
+    font-weight: bold;
+    font-size: 16px;
+  }
+</style>

src/views/modules/cw/workContract/InputNumber.vue

@@ -0,0 +1,202 @@
+<template>
+  <div>
+    <div class="input-number-range" :class="{ 'is-disabled': disabled }">
+      <div class="flex">
+        <div class="from">
+          <el-input
+            ref="input_from"
+            oninput="value=value.replace(/[^\d]/g,'')"
+            v-model="userInputForm"
+            :disabled="disabled"
+            placeholder="最小值"
+            @blur="handleBlurFrom"
+            @focus="handleFocusFrom"
+            @input="handleInputFrom"
+            @change="handleInputChangeFrom"
+          ></el-input>
+        </div>
+        <div class="center">
+          <span>至</span>
+        </div>
+        <div class="to">
+          <el-input
+            ref="input_to"
+            oninput="value=value.replace(/[^\d]/g,'')"
+            v-model="userInputTo"
+            :disabled="disabled"
+            placeholder="最大值"
+            @blur="handleBlurTo"
+            @focus="handleFocusTo"
+            @input="handleInputTo"
+            @change="handleInputChangeTo"
+          ></el-input>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+  export default {
+    name: 'InputNumber',
+
+    props: {
+      // 初始化范围
+      value: { required: true },
+
+      // 是否禁用
+      disabled: {
+        type: Boolean,
+        default: false
+      },
+
+      // 精度参数
+      precision: {
+        type: Number,
+        default: 0,
+        validator (val) {
+          return val >= 0 && val === parseInt(val, 10)
+        }
+      }
+    },
+
+    data () {
+      return {
+        userInputForm: null,
+        userInputTo: null
+      }
+    },
+
+    watch: {
+      value: {
+        immediate: true,
+        handler (value) {
+          /** 初始化范围 */
+          if (value instanceof Array && this.precision !== undefined) {
+            this.userInputForm = typeof value[0] === 'number' ? value[0] : null
+            this.userInputTo = typeof value[1] === 'number' ? value[1] : null
+          }
+        }
+      }
+    },
+
+    methods: {
+      // 根据精度保留数字
+      toPrecision (num, precision) {
+        if (precision === undefined) precision = 0
+        return parseFloat(
+          Math.round(num * Math.pow(10, precision)) / Math.pow(10, precision)
+        )
+      },
+
+      handleBlurFrom (event) {
+        this.$emit('blurfrom', event)
+      },
+
+      handleFocusFrom (event) {
+        this.$emit('focusfrom', event)
+      },
+
+      handleBlurTo (event) {
+        this.$emit('blurto', event)
+      },
+
+      handleFocusTo (event) {
+        this.$emit('focusto', event)
+      },
+
+      handleInputFrom (value) {
+        this.$emit('inputfrom', value)
+      },
+
+      handleInputTo (value) {
+        this.$emit('inputto', value)
+      },
+
+      // from输入框change事件
+      handleInputChangeFrom (value) {
+        // 如果是非数字空返回null
+        if (isNaN(value) || value === '') {
+          this.$emit('input', [null, this.userInputTo])
+          this.$emit('changefrom', this.userInputForm)
+          return
+        }
+
+        // 初始化数字精度
+        this.userInputForm = this.setPrecisionValue(value)
+
+        // 如果from > to 将from值替换成to
+        if (typeof this.userInputTo === 'number') {
+          this.userInputForm =
+            parseFloat(this.userInputForm) <= parseFloat(this.userInputTo)
+              ? this.userInputForm
+              : this.userInputTo
+        }
+        this.$emit('input', [this.userInputForm, this.userInputTo])
+        this.$emit('changefrom', this.userInputForm)
+      },
+
+      // to输入框change事件
+      handleInputChangeTo (value) {
+        // 如果是非数字空返回null
+        if (isNaN(value) || value === '') {
+          this.$emit('input', [this.userInputForm, null])
+          this.$emit('changefrom', this.userInputTo)
+          return
+        }
+
+        // 初始化数字精度
+        this.userInputTo = this.setPrecisionValue(value)
+
+        // 如果to < tfrom 将to值替换成from
+        if (typeof this.userInputForm === 'number') {
+          this.userInputTo =
+            parseFloat(this.userInputTo) >= parseFloat(this.userInputForm)
+              ? this.userInputTo
+              : this.userInputForm
+        }
+        this.$emit('input', [this.userInputForm, this.userInputTo])
+        this.$emit('changeto', this.userInputTo)
+      },
+
+      // 设置成精度数字
+      setPrecisionValue (value) {
+        if (this.precision !== undefined) {
+          const val = this.toPrecision(value, this.precision)
+          return val
+        }
+        return null
+      }
+    }
+  }
+</script>
+<style lang="scss" scoped>
+  // 取消element原有的input框样式
+  ::v-deep .el-input--mini .el-input__inner {
+    border: 0px;
+    margin: 0;
+    padding: 0 15px;
+    background-color: transparent;
+  }
+  .input-number-range {
+    background-color: #fff;
+    /*border: 1px solid #dcdfe6;*/
+    border-radius: 4px;
+  }
+  .flex {
+    display: flex;
+    flex-direction: row;
+    width: 100%;
+    justify-content: center;
+    align-items: center;
+    .center {
+      margin-top: 1px;
+    }
+  }
+  .is-disabled {
+    background-color: #eef0f6;
+    border-color: #e4e7ed;
+    color: #c0c4cc;
+    cursor: not-allowed;
+  }
+</style>

src/views/modules/cw/workContract/WorkContractBorrowMessageForm.vue

@@ -0,0 +1,89 @@
+<template>
+  <el-dialog
+    :title="title"
+    :close-on-click-modal="false"
+    v-dialogDrag
+    width="1200px"
+    @close="close()"
+    :visible.sync="visible">
+  <div class="page">
+      <el-form size="small" :inline="true" @submit.native.prevent>
+        <div style="height: calc(100% - 80px);">
+            <vxe-table
+                border="inner"
+                auto-resize
+                resizable
+                height="500px"
+                :loading="loading"
+                size="small"
+                ref="workClientTable"
+                show-header-overflow
+                show-overflow
+                highlight-hover-row
+                :menu-config="{}"
+                :print-config="{}"
+                :sort-config="{remote:true}"
+                :data="dataList"
+                :checkbox-config="{}">
+
+                <vxe-column width="300px" title="合同名称" field="name"></vxe-column>
+                <vxe-column width="100px" title="借用人" field="borrowName" ></vxe-column>
+                <vxe-column width="100px" title="借用状态" field="borrowType" >
+                  <template slot-scope="scope">
+                    {{ $dictUtils.getDictLabel("borrow_type", scope.row.borrowType, '-') }}
+                  </template>
+                </vxe-column>
+                <vxe-column width="200px" title="借用时间" field="borrowData" ></vxe-column>
+                <vxe-column width="200px" title="大概归还时间" field="borrowRetData" ></vxe-column>
+                <vxe-column width="200px" title="实际归还时间" field="retData">
+                  <template slot-scope="scope">
+                    {{getRetData(scope.row.retData)}}
+                  </template>
+                </vxe-column>
+
+            </vxe-table>
+        </div>
+      </el-form>
+  </div>
+  </el-dialog>
+</template>
+
+<script>
+  import WorkContractBorrowService from '@/api/sys/WorkContractBorrowService'
+  export default {
+    data () {
+      return {
+        title: '',
+        visible: false,
+        loading: false,
+        dataList: []
+      }
+    },
+    workContractBorrowService: null,
+    created () {
+      this.workContractBorrowService = new WorkContractBorrowService()
+    },
+    methods: {
+      // 获取数据列表
+      findList (id) {
+        this.loading = true
+        this.visible = true
+        this.title = '合同借用详情'
+        this.workContractBorrowService.findMessageList(id).then(({data}) => {
+          this.dataList = data
+          this.loading = false
+        })
+      },
+      close () {
+        this.visible = false
+        this.dataList = []
+      },
+      getRetData (value) {
+        if (value) {
+          return value
+        }
+        return '--'
+      }
+    }
+  }
+</script>

src/views/modules/cw/workContract/WorkContractList.vue

@@ -0,0 +1,692 @@
+<template>
+  <div class="page">
+      <el-form size="small" :inline="true" class="query-form" ref="searchForm" :model="searchForm" @keyup.enter.native="refreshList()" @submit.native.prevent>
+       <!-- 搜索框-->
+       <el-form-item label="客户名称" prop="clientName">
+              <el-input size="small" v-model="searchForm.clientName" placeholder="请输入客户名称" clearable></el-input>
+       </el-form-item>
+
+        <el-form-item label="合同名称" prop="name">
+          <el-input size="small" v-model="searchForm.name" placeholder="请输入合同名称" clearable></el-input>
+        </el-form-item>
+
+        <el-form-item label="签订日期" prop="contractDates">
+          <el-date-picker
+            placement="bottom-start"
+            v-model="searchForm.contractDates"
+            type="datetimerange"
+            range-separator="至"
+            start-placeholder="开始日期"
+            end-placeholder="结束日期">
+          </el-date-picker>
+        </el-form-item>
+
+        <el-form-item label="合同状态" prop="status">
+          <el-select v-model="searchForm.status" placeholder="请选择" style="width:100%;">
+            <el-option
+              v-for="item in $dictUtils.getDictList('approval_type')"
+              :key="item.value"
+              :label="item.label"
+              :value="item.value">
+            </el-option>
+          </el-select>
+        </el-form-item>
+
+        <el-form-item label="归档状态" prop="filedType">
+          <el-select v-model="searchForm.filedType" placeholder="请选择" style="width:100%;">
+            <el-option
+              v-for="item in $dictUtils.getDictList('filed_type')"
+              :key="item.value"
+              :label="item.label"
+              :value="item.value">
+            </el-option>
+          </el-select>
+        </el-form-item>
+
+        <el-form-item label="合同金额" prop="contractAmounts">
+          <InputNumber :disabled="false" :precision="num" v-model="searchForm.contractAmounts"></InputNumber>
+        </el-form-item>
+
+        <el-form-item label="创建人" prop="createBy">
+          <SelectUserTree
+            ref="companyTree"
+            :props="{
+                  value: 'id',             // ID字段名
+                  label: 'name',         // 显示名称
+                  children: 'children'    // 子级字段名
+                }"
+            :url="`/sys/user/treeUserDataAllOffice?type=2`"
+            :value="searchForm.createBy"
+            :clearable="true"
+            :accordion="true"
+            @getValue="(value) => {searchForm.createBy=value}"/>
+        </el-form-item>
+
+        <el-form-item>
+          <el-button type="primary" @click="refreshList()" size="small" icon="el-icon-search">查询</el-button>
+          <el-button @click="resetSearch()" size="small" icon="el-icon-refresh-right">重置</el-button>
+        </el-form-item>
+      </el-form>
+
+     <div class="bg-white top">
+        <vxe-toolbar :refresh="{query: refreshList}" import export print custom>
+          <template #buttons>
+            <el-button v-if="hasPermission('sys:project:add')" type="primary" size="small" icon="el-icon-plus" @click="add()">新建</el-button>
+            <el-button v-if="hasPermission('sys:project:del')" type="danger"   size="small" icon="el-icon-delete" @click="del()" plain>删除</el-button>
+          </template>
+        </vxe-toolbar>
+        <div style="height: calc(100% - 80px);">
+            <vxe-table
+                border="inner"
+                auto-resize
+                resizable
+                height="auto"
+                :loading="loading"
+                size="small"
+                ref="workContractTable"
+                show-header-overflow
+                show-overflow
+                highlight-hover-row
+                :menu-config="{}"
+                :print-config="{}"
+                @sort-change="sortChangeHandle"
+                :sort-config="{remote:true}"
+                :data="dataList"
+                :checkbox-config="{}">
+                <vxe-column type="seq" width="60" title="序号"></vxe-column>
+                <vxe-column type="checkbox" width="40px"></vxe-column>
+
+                <vxe-column width="200px" title="合同编号" field="no"></vxe-column>
+                <vxe-column width="200px" title="合同名称" field="name">
+                  <template slot-scope="scope">
+                    <el-link  type="primary" :underline="false" v-if="hasPermission('sys:workContract:edit')" @click="view(scope.row.id)">{{scope.row.name}}</el-link>
+                    <el-link  type="primary" :underline="false" v-else-if="hasPermission('sys:workContract:view')" @click="view(scope.row.id)">{{scope.row.name}}</el-link>
+                    <span v-else>{{scope.row.name}}</span>
+                  </template>
+                </vxe-column>
+                <vxe-column width="100px" title="案卷号" field="filedNo" >
+                  <template slot-scope="scope">
+                    <el-link  type="primary" :underline="false" v-if="hasPermission('sys:workContract:edit')" @click="view(scope.row.id)">{{scope.row.filedNo}}</el-link>
+                    <el-link  type="primary" :underline="false" v-else-if="hasPermission('sys:workContract:view')" @click="view(scope.row.id)">{{scope.row.filedNo}}</el-link>
+                    <span v-else>{{scope.row.filedNo}}</span>
+                  </template>
+                </vxe-column>
+                <vxe-column width="200px" title="客户名称" field="clientName" >
+                  <template slot-scope="scope">
+                    <el-link  type="primary" :underline="false" v-if="hasPermission('sys:work_client:edit')" @click="viewInfo(scope.row.clientId)">{{scope.row.clientName}}</el-link>
+                    <el-link  type="primary" :underline="false" v-else-if="hasPermission('sys:work_client:view')" @click="viewInfo(scope.row.clientId)">{{scope.row.clientName}}</el-link>
+                    <span v-else>{{scope.row.clientName}}</span>
+                  </template>
+                </vxe-column>
+                <vxe-column width="100px" title="合同金额(元)" field="contractAmount"></vxe-column>
+                <vxe-column width="100px" title="创建人" field="createBy"></vxe-column>
+                <vxe-column width="150px" title="签订日期" field="contractDate"></vxe-column>
+                <vxe-column  width="120px" title="登记状态" field="status" >
+                  <template slot-scope="scope">
+                    <el-button  type="text" @click="detail(scope.row)" :type="$dictUtils.getDictLabel('approval_type_status', scope.row.status, '-')" effect="dark" size="mini">{{$dictUtils.getDictLabel("approval_type", scope.row.status, '-')}} </el-button>
+                  </template>
+                </vxe-column>
+                <vxe-column width="100px"  title="归档状态" field="filedType" >
+                  <template slot-scope="scope">
+                    <el-button  type="text" @click="detailFiled(scope.row)" :type="$dictUtils.getDictLabel('filed_type_status', scope.row.filedType, '-')" effect="dark" size="mini">{{$dictUtils.getDictLabel("filed_type", scope.row.filedType, '未归档')}} </el-button>
+                  </template>
+                </vxe-column>
+                <vxe-column width="100px"  title="借用状态" field="borrowType" >
+                  <template slot-scope="scope">
+                    <el-button  type="text" @click="detailBorrow(scope.row)" :type="$dictUtils.getDictLabel('borrow_type_status', scope.row.borrowType, '-')" effect="dark" size="mini">{{$dictUtils.getDictLabel("borrow_type", scope.row.borrowType, '未借用')}} </el-button>
+                  </template>
+                </vxe-column>
+
+                <vxe-column title="操作" width="200px" fixed="right" align="center">
+                    <template  slot-scope="scope">
+                      <el-button v-if="hasPermission('sys:workContract:view')" type="text" size="small" @click="view(scope.row.id)">查看</el-button>
+                      <el-button v-if="hasPermission('sys:workContract:edit') && scope.row.status !== '2' && scope.row.status !== '5' && scope.row.createId === create" type="text" size="small" @click="edit(scope.row)">修改</el-button>
+                      <el-button v-if="hasPermission('sys:workContract:edit') && scope.row.status === '5' && isAdmin" type="text" size="small" @click="editForm(scope.row.id)">修改</el-button>
+                      <el-button v-if="hasPermission('sys:workContract:del') && (scope.row.status === '1' || scope.row.status === '3' || scope.row.status === '4')  && scope.row.createId === create" type="text" size="small" @click="del(scope.row.id)">删除</el-button>
+                      <el-button v-if="hasPermission('sys:workContract:back') && scope.row.status === '2'" type="text" size="small" @click="reback(scope.row)">撤回</el-button>
+                      <el-button v-if="hasPermission('sys:workContract:filed') && scope.row.status === '5' && scope.row.createId === create && (scope.row.filedType === '0' || scope.row.filedType === undefined)" type="text" size="small" @click="filed(scope.row.id)">归档</el-button>
+                      <!--归档暂存修改-->
+                      <el-button v-if="hasPermission('sys:workContract:filed') && scope.row.status === '5' && scope.row.createId === create && scope.row.filedType === '1'" type="text" size="small" @click="filed(scope.row.id)">修改</el-button>
+                      <!--归档撤回驳回修改-->
+                      <el-button v-if="hasPermission('sys:workContract:filed') && scope.row.status === '5' && scope.row.createId === create && (scope.row.filedType === '3' || scope.row.filedType === '4')" type="text" size="small" @click="filedAndClose(scope.row.id)">修改</el-button>
+                      <!--归档撤回-->
+                      <el-button v-if="hasPermission('sys:workContract:back') && scope.row.status === '5' && scope.row.filedType === '2'" type="text"  size="small" @click="rebackFiled(scope.row)">撤回</el-button>
+                      <!--合同借用-->
+                      <el-button v-if="hasPermission('sys:workContract:borrow') && scope.row.status === '5' && scope.row.filedType === '5' && (scope.row.borrowType === undefined || scope.row.borrowType === '0' || scope.row.borrowType === '1')" type="text" size="small" @click="borrow(scope.row.id)">借用</el-button>
+                      <!--借用撤回-->
+                      <el-button v-if="hasPermission('sys:workContract:back') && scope.row.status === '5' && scope.row.filedType === '5' && scope.row.borrowType === '2'" type="text" size="small" @click="rebackBorrow(scope.row)">撤回</el-button>
+                      <!--借用归还-->
+                      <el-button v-if="hasPermission('sys:workContract:reture') && scope.row.status === '5' && scope.row.filedType === '5' && scope.row.borrowType === '5'" type="text" size="small" @click="retureBorrow(scope.row)">归还合同</el-button>
+                    </template>
+                </vxe-column>
+            </vxe-table>
+          <vxe-pager
+            background
+            size="small"
+            :current-page="tablePage.currentPage"
+            :page-size="tablePage.pageSize"
+            :total="tablePage.total"
+            :page-sizes="[10, 20, 100, 1000, {label: '全量数据', value: 1000000}]"
+            :layouts="['PrevPage', 'JumpNumber', 'NextPage', 'FullJump', 'Sizes', 'Total']"
+            @page-change="currentChangeHandle">
+          </vxe-pager>
+        </div>
+     </div>
+        <!-- 弹窗, 新增 / 修改 -->
+    <ContractNameForm ref="contractNameForm" @refreshDataList="refreshList"></ContractNameForm>
+    <WorkClientForm ref="workClientForm" @refreshDataList="refreshList"></WorkClientForm>
+    <WorkContractBorrowMessageForm ref="workContractBorrowMessageForm" @refreshDataList="refreshList"></WorkContractBorrowMessageForm>
+  </div>
+</template>
+
+<script>
+  import InputNumber from './InputNumber.vue'
+  import ContractNameForm from './ContractNameForm'
+  import WorkClientForm from '../../sys/workClient/WorkClientForm'
+  import WorkContractBorrowMessageForm from './WorkContractBorrowMessageForm'
+  import WorkContractService from '@/api/sys/WorkContractService'
+  import WorkContractFileService from '@/api/sys/WorkContractFileService'
+  import WorkContractBorrowService from '@/api/sys/WorkContractBorrowService'
+  import SelectUserTree from '@/views/modules/utils/treeUserSelect'
+  import TaskService from '@/api/flowable/TaskService'
+  import ProcessService from '@/api/flowable/ProcessService'
+  import pick from 'lodash.pick'
+  import UserService from '@/api/sys/UserService'
+  export default {
+    data () {
+      return {
+        visible: false,
+        num: 0,
+        searchForm: {
+          clientName: '',
+          name: '',
+          contractDates: [],
+          type: '',
+          filedType: '',
+          contractAmounts: [],
+          createBy: '',
+          procInsId: '',
+          processDefinitionId: ''
+        },
+        dataList: [],
+        tablePage: {
+          total: 0,
+          currentPage: 1,
+          pageSize: 10,
+          orders: []
+        },
+        processDefinitionId: '',
+        procDefKey: '',
+        loading: false,
+        create: '',
+        isAdmin: false
+      }
+    },
+    workContractService: null,
+    workContractFileService: null,
+    workContractBorrowService: null,
+    taskService: null,
+    processService: null,
+    userService: null,
+    created () {
+      this.workContractService = new WorkContractService()
+      this.workContractFileService = new WorkContractFileService()
+      this.workContractBorrowService = new WorkContractBorrowService()
+      this.taskService = new TaskService()
+      this.processService = new ProcessService()
+      this.userService = new UserService()
+    },
+    components: {
+      InputNumber,
+      ContractNameForm,
+      WorkClientForm,
+      WorkContractBorrowMessageForm,
+      SelectUserTree
+    },
+    activated () {
+      this.is()
+      this.refreshList()
+    },
+    computed: {
+      userName () {
+        return JSON.parse(localStorage.getItem('user')).name
+      },
+      user () {
+        this.create = JSON.parse(localStorage.getItem('user')).id
+        console.log('createId', this.create)
+        return JSON.parse(localStorage.getItem('user'))
+      }
+    },
+
+    methods: {
+      // 获取数据列表
+      refreshList () {
+        console.log('user', this.user)
+        this.loading = true
+        this.workContractService.list({
+          'current': this.tablePage.currentPage,
+          'size': this.tablePage.pageSize,
+          'orders': this.tablePage.orders,
+          'itemType': '1',
+          ...this.searchForm
+        }).then(({data}) => {
+          this.dataList = data.records
+          this.tablePage.total = data.total
+          this.loading = false
+        })
+        this.processService.getByName('合同登记新建').then(({data}) => {
+          if (!this.commonJS.isEmpty(data.id)) {
+            this.processDefinitionId = data.id
+            this.procDefKey = data.key
+          }
+        })
+      },
+      // 当前页
+      currentChangeHandle ({currentPage, pageSize}) {
+        this.tablePage.currentPage = currentPage
+        this.tablePage.pageSize = pageSize
+        this.refreshList()
+      },
+      // 排序
+      sortChangeHandle (column) {
+        this.tablePage.orders = []
+        if (column.order != null) {
+          this.tablePage.orders.push({column: this.$utils.toLine(column.property), asc: column.order === 'asc'})
+        }
+        this.refreshList()
+      },
+      // 新增
+      add () {
+        this.start()
+      },
+      // 详情
+      detail (row) {
+        // eslint-disable-next-line eqeqeq
+        if (!this.commonJS.isEmpty(row.status) && row.status != '1') {
+          this.taskService.getTaskDef({
+            procInsId: row.procInsId,
+            procDefId: row.processDefinitionId
+          }).then(({data}) => {
+            this.$router.push({
+              path: '/flowable/task/TaskFormDetail',
+              query: {
+                readOnly: true,
+                title: '流程详情',
+                formTitle: '流程详情',
+                businessId: row.id,
+                ...pick(data, 'formType', 'formUrl', 'procDefKey', 'taskDefKey', 'procInsId', 'procDefId', 'taskId', 'status', 'title', 'businessId')}
+            })
+          })
+        }
+      },
+      // 修改
+      edit (row) {
+        if (row.status === '3' || row.status === '4') {
+          this.editWithClose(row)
+        } else {
+          this.editWithHold(row)
+        }
+      },
+      // 管理员修改
+      editForm (id) {
+        id = id || this.$refs.workClientTable.getCheckboxRecords().map(item => {
+          return item.id
+        })[0]
+        this.$refs.contractNameForm.init('edit', id)
+      },
+      // 查看
+      view (id) {
+        this.$refs.contractNameForm.init('view', id)
+      },
+      // 客户信息查看
+      viewInfo (id) {
+        this.$refs.workClientForm.init('view', id)
+      },
+      // 删除
+      del (id) {
+        let ids = id || this.$refs.workContractTable.getCheckboxRecords().map(item => {
+          return item.id
+        }).join(',')
+        this.$confirm(`确定删除所选项吗?`, '提示', {
+          confirmButtonText: '确定',
+          cancelButtonText: '取消',
+          type: 'warning'
+        }).then(() => {
+          this.loading = true
+          this.workContractService.remove(ids).then(({data}) => {
+            this.$message.success(data)
+            this.refreshList()
+            this.loading = false
+          })
+        })
+      },
+      resetSearch () {
+        this.$refs.searchForm.resetFields()
+        this.refreshList()
+      },
+      start () {
+        // 读取流程表单
+        let tabTitle = `发起流程【合同登记新建】`
+        let processTitle = `${this.userName} 在 ${this.moment(new Date()).format('YYYY-MM-DD HH:mm')} 发起了 [合同登记新建]`
+        this.taskService.getTaskDef({ procDefId: this.processDefinitionId,
+          status: 'startAndHold'}).then((data) => {
+            this.$router.push({
+              path: '/flowable/task/TaskForm',
+              query: {
+                procDefId: this.processDefinitionId,
+                procDefKey: this.procDefKey,
+                status: 'startAndHold',
+                title: tabTitle,
+                formType: data.data.formType,
+                formUrl: data.data.formUrl,
+                formTitle: processTitle,
+                businessId: 'false',
+                isShow: false,
+                routePath: '/sys/workContract/WorkContractList'
+              }
+            })
+          })
+      },
+      editWithHold (row) {
+        // 读取流程表单
+        let tabTitle = `发起流程【合同登记新建】`
+        let processTitle = `${this.userName} 在 ${this.moment(new Date()).format('YYYY-MM-DD HH:mm')} 发起了 [合同登记新建]`
+        this.taskService.getTaskDef({ procDefId: this.processDefinitionId,
+          businessId: row.id,
+          businessTable: 'work_contract_info',
+          status: 'startAndHold'}).then((data) => {
+            this.$router.push({
+              path: '/flowable/task/TaskForm',
+              query: {
+                procDefId: this.processDefinitionId,
+                procDefKey: this.procDefKey,
+                status: 'startAndHold',
+                title: tabTitle,
+                formType: data.data.formType,
+                formUrl: data.data.formUrl,
+                formTitle: processTitle,
+                businessTable: 'work_contract_info',
+                businessId: row.id,
+                isShow: false,
+                routePath: '/sys/workContract/WorkContractList'
+              }
+            })
+          })
+      },
+      editWithClose (row) {
+        // 读取流程表单
+        let tabTitle = `发起流程【合同登记新建】`
+        let processTitle = `${this.userName} 在 ${this.moment(new Date()).format('YYYY-MM-DD HH:mm')} 发起了 [合同登记新建]`
+        this.taskService.getTaskDef({ procDefId: this.processDefinitionId,
+          businessId: row.id,
+          businessTable: 'work_contract_info',
+          status: 'startAndClose'
+        }).then((data) => {
+          this.$router.push({
+            path: '/flowable/task/TaskForm',
+            query: {
+              procDefId: this.processDefinitionId,
+              procDefKey: this.procDefKey,
+              status: 'startAndClose',
+              title: tabTitle,
+              formType: data.data.formType,
+              formUrl: data.data.formUrl,
+              formTitle: processTitle,
+              businessTable: 'work_contract_info',
+              businessId: row.id,
+              isShow: false,
+              routePath: '/sys/workContract/WorkContractList'
+            }
+          })
+        })
+      },
+      reback (row) {
+        this.$confirm(`确定撤回流程吗?`, '提示', {
+          confirmButtonText: '确定',
+          cancelButtonText: '取消',
+          taskId: row.procInsId,
+          type: 'warning'
+        }).then(() => {
+          this.taskService.backNodes(row.taskId).then(({data}) => {
+            let backNodes = data
+            if (backNodes.length > 0) {
+              let backTaskDefKey = backNodes[0].taskDefKey
+              this.taskService.back({
+                taskId: row.taskId,
+                backTaskDefKey: backTaskDefKey,
+                isShow: false,
+                ...this.auditForm
+              }).then(({data}) => {
+                this.updateStatusById(row, 'reback')
+                this.$message.success('回退成功')
+              })
+            }
+          })
+        })
+      },
+      rebackFiled (row) {
+        this.$confirm(`确定撤回流程吗?`, '提示', {
+          confirmButtonText: '确定',
+          cancelButtonText: '取消',
+          taskId: row.taskFiledId,
+          type: 'warning'
+        }).then(() => {
+          console.log('datas', row.taskFiledId)
+          this.taskService.backNodes(row.taskFiledId).then(({data}) => {
+            let backNodes = data
+            if (backNodes.length > 0) {
+              let backTaskDefKey = backNodes[0].taskDefKey
+              this.taskService.back({
+                taskId: row.taskFiledId,
+                backTaskDefKey: backTaskDefKey,
+                isShow: false,
+                ...this.auditForm
+              }).then(({data}) => {
+                this.updateStatusById(row, 'rebackFiled')
+                this.$message.success('回退成功')
+              })
+            }
+          })
+        })
+      },
+      updateStatusById (row, type) {
+        if (type === 'agree') {
+          row.status = '5'
+          this.workContractService.updateStatusById(row)
+        }
+        if (type === 'reject') {
+          row.status = '4'
+          this.workContractService.updateStatusById(row)
+        }
+        if (type === 'reback') {
+          row.status = '3'
+          this.workContractService.updateStatusById(row)
+        }
+        if (type === 'rebackFiled') {
+          row.filedType = '3'
+          this.workContractFileService.updateStatusById(row)
+        }
+        if (type === 'rebackBorrow') {
+          row.borrowType = '0'
+          this.workContractBorrowService.updateStatusByContractInfoId(row).then(() => {
+            this.workContractBorrowService.deleteById(row.id)
+          })
+        }
+        if (type === 'retureBorrow') {
+          row.borrowType = '0'
+          this.workContractBorrowService.updateStatusByContractInfoId(row).then(() => {
+            row.type = 'reture'
+            row.borrowType = '5'
+            this.workContractBorrowService.updateMessageStatusById(row)
+          })
+        }
+      },
+      is () {
+        this.userService.is().then(({data}) => {
+          this.isAdmin = data
+        })
+      },
+      // 归档
+      filed (id) {
+        this.processService.getByName('合同登记归档').then(({data}) => {
+          if (!this.commonJS.isEmpty(data.id)) {
+            console.log('data', data)
+            // 读取流程表单
+            let tabTitle = `发起流程【合同登记归档】`
+            let processTitle = `${this.userName} 在 ${this.moment(new Date()).format('YYYY-MM-DD HH:mm')} 发起了 [合同登记归档]`
+            this.taskService.getTaskDef({ procDefId: data.id,
+              businessId: id,
+              businessTable: 'work_contract_file',
+              status: 'startAndHoldFiled'}).then((reture) => {
+                this.$router.push({
+                  path: '/flowable/task/TaskForm',
+                  query: {
+                    procDefId: data.id,
+                    procDefKey: data.key,
+                    status: 'startAndHoldFiled',
+                    title: tabTitle,
+                    formType: reture.data.formType,
+                    formUrl: reture.data.formUrl,
+                    formTitle: processTitle,
+                    businessTable: 'work_contract_file',
+                    businessId: id,
+                    isShow: false,
+                    routePath: '/sys/workContract/WorkContractList'
+                  }
+                })
+              })
+          }
+        })
+      },
+      // 归档
+      filedAndClose (id) {
+        this.processService.getByName('合同登记归档').then(({data}) => {
+          if (!this.commonJS.isEmpty(data.id)) {
+            console.log('data', data)
+            // 读取流程表单
+            let tabTitle = `发起流程【合同登记归档】`
+            let processTitle = `${this.userName} 在 ${this.moment(new Date()).format('YYYY-MM-DD HH:mm')} 发起了 [合同登记归档]`
+            this.taskService.getTaskDef({ procDefId: data.id,
+              businessId: id,
+              businessTable: 'work_contract_file',
+              status: 'startAndCloseFiled'}).then((reture) => {
+                this.$router.push({
+                  path: '/flowable/task/TaskForm',
+                  query: {
+                    procDefId: data.id,
+                    procDefKey: data.key,
+                    status: 'startAndCloseFiled',
+                    title: tabTitle,
+                    formType: reture.data.formType,
+                    formUrl: reture.data.formUrl,
+                    formTitle: processTitle,
+                    businessTable: 'work_contract_file',
+                    businessId: id,
+                    isShow: false,
+                    routePath: '/sys/workContract/WorkContractList'
+                  }
+                })
+              })
+          }
+        })
+      },
+      // 归档详情
+      detailFiled (row) {
+        if (row.filedType !== '4') {
+          this.workContractFileService.findByContractInfoId(row.id).then(({data}) => {
+            if (!this.commonJS.isEmpty(data.id)) {
+              console.log('data', data)
+              this.taskService.getTaskDef({
+                procInsId: data.procInsId,
+                procDefId: data.processDefinitionId
+              }).then(({data}) => {
+                this.$router.push({
+                  path: '/flowable/task/TaskFormDetail',
+                  query: {
+                    readOnly: true,
+                    title: '归档流程详情',
+                    formTitle: '归档流程详情',
+                    businessId: row.id,
+                    ...pick(data, 'formType', 'formUrl', 'procDefKey', 'taskDefKey', 'procInsId', 'procDefId', 'taskId', 'status', 'title', 'businessId')}
+                })
+              })
+            }
+          })
+        }
+      },
+      // 借用
+      borrow (id) {
+        this.processService.getByName('合同登记借用').then(({data}) => {
+          if (!this.commonJS.isEmpty(data.id)) {
+            console.log('data', data)
+            // 读取流程表单
+            let tabTitle = `发起流程【合同登记借用】`
+            let processTitle = `${this.userName} 在 ${this.moment(new Date()).format('YYYY-MM-DD HH:mm')} 发起了 [合同登记借用]`
+            this.taskService.getTaskDef({ procDefId: data.id,
+              businessId: id,
+              businessTable: 'work_contract_borrow',
+              status: 'startAndCloseBorrow'}).then((reture) => {
+                this.$router.push({
+                  path: '/flowable/task/TaskForm',
+                  query: {
+                    procDefId: data.id,
+                    procDefKey: data.key,
+                    status: 'startAndCloseBorrow',
+                    title: tabTitle,
+                    formType: reture.data.formType,
+                    formUrl: reture.data.formUrl,
+                    formTitle: processTitle,
+                    businessTable: 'work_contract_borrow',
+                    businessId: id,
+                    isShow: false,
+                    routePath: '/sys/workContract/WorkContractList'
+                  }
+                })
+              })
+          }
+        })
+      },
+      // 借用详情
+      detailBorrow (row) {
+        this.$refs.workContractBorrowMessageForm.findList(row.id)
+      },
+      // 借用撤回
+      rebackBorrow (row) {
+        this.$confirm(`确定撤回流程吗?`, '提示', {
+          confirmButtonText: '确定',
+          cancelButtonText: '取消',
+          taskId: row.taskBorrowId,
+          type: 'warning'
+        }).then(() => {
+          console.log('datas', row.taskBorrowId)
+          this.taskService.backNodes(row.taskBorrowId).then(({data}) => {
+            let backNodes = data
+            if (backNodes.length > 0) {
+              let backTaskDefKey = backNodes[0].taskDefKey
+              this.taskService.back({
+                taskId: row.taskBorrowId,
+                backTaskDefKey: backTaskDefKey,
+                isShow: false,
+                ...this.auditForm
+              }).then(({data}) => {
+                this.updateStatusById(row, 'rebackBorrow')
+                this.$message.success('回退成功')
+              })
+            }
+          })
+        })
+      },
+      // 归还合同
+      retureBorrow (row) {
+        this.$confirm(`确定归还合同吗?`, '提示', {
+          confirmButtonText: '确定',
+          cancelButtonText: '取消',
+          type: 'warning'
+        }).then(() => {
+          this.updateStatusById(row, 'retureBorrow')
+          this.refreshList()
+        })
+      }
+    }
+  }
+</script>