<template>
|
<GlobalWindow
|
:title="title"
|
:visible.sync="visible"
|
:confirm-working="isWorking"
|
@confirm="confirm"
|
>
|
<el-form :model="form" ref="form" :rules="rules">
|
<el-form-item label="合同名称" prop="name">
|
<el-input v-model="form.name" maxlength="50" show-word-limit placeholder="请输入合同名称" v-trim/>
|
</el-form-item>
|
<el-form-item label="合同对象" prop="companyType" v-if="type !== 2">
|
<el-radio-group v-model="form.companyType" @change="getList">
|
<el-radio :label="0">企业</el-radio>
|
<el-radio :label="1">商户</el-radio>
|
</el-radio-group>
|
</el-form-item>
|
<el-form-item :label="type !== 2 ? '企业/商户名称' : '企业名称'" prop="companyId">
|
<el-select v-model="form.companyId" filterable placeholder="请选择，支持搜索">
|
<el-option
|
v-for="item in nameList"
|
:key="item.id"
|
:label="item.name"
|
:value="item.id">
|
</el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="合同时间" prop="date">
|
<el-date-picker
|
v-model="form.date"
|
type="daterange"
|
@change="changeDate"
|
value-format="yyyy-MM-dd"
|
range-separator="至"
|
start-placeholder="开始日期"
|
end-placeholder="结束日期">
|
</el-date-picker>
|
</el-form-item>
|
<el-form-item label="签章方式" prop="type">
|
<el-radio-group v-model="form.type">
|
<el-radio :label="0">双方签章</el-radio>
|
<el-radio :label="1">仅我方签章</el-radio>
|
</el-radio-group>
|
</el-form-item>
|
<el-form-item label="合同附件" prop="multifile" :rules="[{required:true,message:'请上传方案确认书'}]">
|
<div v-if="visible">
|
<UploadFile @remove="deleFile" :uploadData="{ folder: 'contract', fileType:'.pdf' }" :fileList="fileList" @uploadSuccess="editFanganFile" />
|
</div>
|
</el-form-item>
|
<el-form-item label="备注" prop="remark">
|
<el-input
|
type="textarea"
|
placeholder="请输入备注"
|
v-model="form.remark"
|
maxlength="300"
|
show-word-limit
|
v-trim
|
/>
|
</el-form-item>
|
</el-form>
|
</GlobalWindow>
|
</template>
|
|
<script>
|
import BaseOpera from '@/components/base/BaseOpera'
|
import GlobalWindow from '@/components/common/GlobalWindow'
|
import UploadFile from '@/components/common/UploadFile'
|
import { pageAll } from '@/api/business/company'
|
import { mapState } from 'vuex'
|
export default {
|
name: 'OperaContractWindow',
|
extends: BaseOpera,
|
computed: {
|
...mapState(['userInfo'])
|
},
|
components: { GlobalWindow, UploadFile },
|
data () {
|
const validatorTime = (rule, value, callback) => {
|
if (!this.form.startTime || !this.form.endTime) {
|
return callback(new Error('请选择合同时间'))
|
}
|
callback()
|
}
|
const validatorMultifile = (rule, value, callback) => {
|
if (!this.form.multifile) {
|
return callback(new Error('请上传合同附件'))
|
}
|
callback()
|
}
|
return {
|
// 表单数据
|
form: {
|
id: null,
|
remark: '',
|
name: '',
|
companyType: 0,
|
type: 0,
|
startTime: '',
|
endTime: '',
|
date: [],
|
multifile: null,
|
companyId: ''
|
},
|
fileList: [],
|
// 验证规则
|
rules: {
|
name: [
|
{ required: true, message: '请输入合同名称' }
|
],
|
companyType: [
|
{ required: true, message: '请选择合同对象' }
|
],
|
companyId: [
|
{ required: true, message: '请选择企业/商户名称' }
|
],
|
date: [
|
{ required: true, validator: validatorTime }
|
],
|
multifile: [
|
{ required: true, validator: validatorMultifile }
|
],
|
},
|
nameList: [],
|
list: [],
|
type: null
|
}
|
},
|
created () {
|
this.config({
|
api: '/business/contract',
|
'field.id': 'id'
|
})
|
},
|
methods: {
|
open (title, target, type) {
|
this.title = title
|
this.type = type
|
this.visible = true
|
if (this.userInfo.type === 0) {
|
this.list = [{ label: '企业', id: 0 },{ label: '商户', id: 1 }]
|
} else if (this.userInfo.type === 2) {
|
this.list = [{ label: '企业', id: 0 }]
|
}
|
// 新建
|
if (target == null) {
|
this.$nextTick(() => {
|
this.$refs.form.resetFields()
|
this.form[this.configData['field.id']] = null
|
})
|
this.getList()
|
return
|
}
|
// 编辑
|
this.$nextTick(() => {
|
for (const key in this.form) {
|
this.form[key] = target[key]
|
}
|
})
|
this.getList()
|
},
|
getList() {
|
this.form.companyId = ''
|
pageAll({ type: this.form.companyType })
|
.then(res => {
|
console.log(res)
|
this.nameList = res
|
})
|
},
|
deleFile () {
|
this.form.multifile = null
|
},
|
editFanganFile (data) {
|
console.log(data)
|
this.form.multifile = data
|
},
|
changeDate(e) {
|
if (e) {
|
this.form.startTime = e[0]
|
this.form.endTime = e[1]
|
} else {
|
this.form.startTime = ''
|
this.form.endTime = ''
|
}
|
}
|
}
|
}
|
</script>
|
