You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
416 lines
13 KiB
416 lines
13 KiB
<template>
|
|
<el-form ref="form" :model="form" :rules="rules" label-width="110px" :disabled="form.signId != undefined && !form.signEdit">
|
|
<el-row>
|
|
<el-col :span="12">
|
|
<el-form-item label="学员姓名">
|
|
<el-input v-model="form.name" disabled />
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-form-item label="学员联系方式">
|
|
<el-input v-model="form.phone" disabled />
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-form-item label="线索来源">
|
|
<el-select v-model="form.source" disabled>
|
|
<el-option v-for="dict in options.sourceOptions" :key="dict.dictValue" :label="dict.dictLabel" :value="dict.dictValue" />
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-form-item label="是否全款" prop="state">
|
|
<el-radio-group v-model="form.state">
|
|
<el-radio :label="true">全款</el-radio>
|
|
<el-radio :label="false">非全款</el-radio>
|
|
</el-radio-group>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-form-item label="成交日期" prop="dealDate">
|
|
<el-date-picker v-model="form.dealDate" :picker-options="dateControl" value-format="yyyy-MM-dd" format="yyyy-MM-dd" type="date" />
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-form-item label="报名价格(元)" prop="signPrice">
|
|
<el-input v-model="form.signPrice" placeholder="学员报名时需要交纳总共的钱" @blur="priceChange" />
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-form-item label="报名驾校" prop="signSchool">
|
|
<el-select v-model="form.signSchool" filterable placeholder="请选择" @change="schoolChange">
|
|
<el-option v-for="dict in schoolOptions" :key="dict.dictValue" :label="dict.dictLabel" :value="dict.dictValue" />
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-form-item label="报名场地" prop="signPlace">
|
|
<el-select v-model="form.signPlace" filterable placeholder="请选择" @change="placeChange">
|
|
<el-option v-for="dict in options.placeInfo.filter(item =>item.deptId === form.signSchool)" :key="dict.placeId" :label="dict.name" :value="dict.placeId" />
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-form-item label="报名班型" prop="signClass">
|
|
<el-select v-model="form.signClass" filterable placeholder="请选择" @change="priceChange">
|
|
<el-option v-for="dict in classTypeOptions.filter(item =>((!item.placeId && item.deptId === form.signSchool) || item.placeId === form.signPlace))" :key="dict.typeId" :label="`${dict.licenseType}-${dict.typeName}`" :value="dict.typeId" />
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-form-item label="对接人" prop="schoolPeople">
|
|
<el-input v-model="form.schoolPeople" />
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-form-item label="驾校支付" prop="schoolPay">
|
|
<el-input v-model="form.schoolPay" type="number" placeholder="请输入驾校支付金额" disabled />
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-form-item label="驾考宝典款" prop="alipay">
|
|
<el-input v-model="form.alipay" placeholder="请输入驾考宝典款金额" />
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-form-item label="额外支出" prop="extraPayType">
|
|
<el-select v-model="form.extraPayTypes" filterable placeholder="请选择" multiple clearable>
|
|
<el-option v-for="dict in extraPayTypeOptions" :key="dict.dictValue" :label="dict.dictLabel" :value="dict.dictValue" />
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-form-item label="额外支出金额" prop="extraPay">
|
|
<el-input v-model="form.extraPay" placeholder="请输入额外支出金额" />
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-form-item label="归属人员" prop="followUser">
|
|
<el-select v-model="form.followUser" multiple placeholder="请选择" clearable :disabled="true">
|
|
<el-option v-for="dict in options.userOptions" :key="dict.id" :label="dict.name" :value="dict.id" />
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-form-item label="所属区域" prop="area">
|
|
<el-select v-model="form.area" placeholder="请选择" clearable>
|
|
<el-option v-for="dict in areaOptions" :key="dict.dictValue" :label="dict.dictLabel" :value="dict.dictValue" />
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col v-if="admin" :span="12">
|
|
<el-form-item label="佣金明细" prop="commission">
|
|
<el-select v-model="form.commission" placeholder="请选择" clearable>
|
|
<el-option v-for="dict in commissionOptions" :key="dict.dictValue" :label="dict.dictLabel" :value="dict.dictValue" />
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="24">
|
|
<el-form-item label="备注" prop="memo">
|
|
<el-input v-model="form.memo" type="textarea" :rows="2" />
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
<el-row>
|
|
<el-form-item label="凭据" prop="evidence">
|
|
<el-upload action="#" class="evidence-uploader" :http-request="handleUploadFile" accept="image/*" :show-file-list="false" multiple>
|
|
<i class="el-icon-plus evidence-uploader-icon" />
|
|
</el-upload>
|
|
<div v-for="(item, index) in form.fileList" :key="index" class="pr dib">
|
|
<el-image class="image-list-item" fit="contain" :src="preUrl + item" :preview-src-list="form.fileList.map(url => preUrl + url)" lazy />
|
|
<i class="el-icon-close btn-close" @click="handleRemoveImage(index,item)" />
|
|
</div>
|
|
</el-form-item>
|
|
</el-row>
|
|
|
|
<el-row v-if="checkRecord && checkRecord.length > 0">
|
|
<el-col :span="24">
|
|
<el-form-item label="审核记录">
|
|
<el-timeline style="max-height:260px;overflow-y:auto;">
|
|
<el-timeline-item v-for="item in checkRecord" :key="item.record" :timestamp="item.operateTime" placement="top" style="padding:5px !important;">
|
|
<el-card>
|
|
<span style="display:block;font-weight: bold; font-size:13px;">用户 {{ item.operateUserName }}</span>
|
|
<span style="display:block;padding-left: 10px; font-size:13px;" v-html="item.centent" />
|
|
</el-card>
|
|
</el-timeline-item>
|
|
</el-timeline>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
</el-form>
|
|
</template>
|
|
|
|
<script>
|
|
import { validateMoney } from '@/utils/validate'
|
|
import {
|
|
getSchools,
|
|
getClassTypeInfo,
|
|
uploadEvidence,
|
|
deleteFile,
|
|
} from '@/api/tool/common'
|
|
import { getCheckRecord } from '@/api/zs/sign'
|
|
export default {
|
|
name: 'SignForm',
|
|
model: {
|
|
prop: 'info',
|
|
event: 'update',
|
|
},
|
|
props: {
|
|
info: {
|
|
type: Object,
|
|
default: () => { },
|
|
},
|
|
options: {
|
|
type: Object,
|
|
default: () => ({
|
|
userOptions: [],
|
|
sourceOptions: [],
|
|
placeInfo: [],
|
|
}),
|
|
},
|
|
},
|
|
data() {
|
|
return {
|
|
admin: JSON.parse(localStorage.getItem('admin')),
|
|
preUrl: process.env.VUE_APP_BASE_API,
|
|
form: JSON.parse(JSON.stringify(this.info)),
|
|
rules: {
|
|
area: {
|
|
required: true,
|
|
message: '所属区域不为空',
|
|
trigger: 'blur',
|
|
},
|
|
dealDate: {
|
|
required: true,
|
|
message: '成交时间不为空',
|
|
trigger: 'blur,change',
|
|
},
|
|
state: {
|
|
required: true,
|
|
message: '是否权限必选',
|
|
trigger: 'blur,change',
|
|
},
|
|
followUser: {
|
|
required: true,
|
|
message: '归属人员不为空',
|
|
trigger: 'blur,change',
|
|
},
|
|
signSchool: {
|
|
required: true,
|
|
message: '报名驾校不为空',
|
|
trigger: 'blur,change',
|
|
},
|
|
signPlace: {
|
|
required: true,
|
|
message: '报名场地不为空',
|
|
trigger: 'blur,change',
|
|
},
|
|
signClass: {
|
|
required: true,
|
|
message: '报名班型不为空',
|
|
trigger: 'blur,change',
|
|
},
|
|
dealState: {
|
|
required: true,
|
|
message: '结算情况不为空',
|
|
trigger: 'blur,change',
|
|
},
|
|
signPrice: {
|
|
required: true,
|
|
validator: validateMoney,
|
|
trigger: 'blur',
|
|
},
|
|
},
|
|
schoolOptions: [],
|
|
placeOptions: [],
|
|
classTypeOptions: [],
|
|
areaOptions: [],
|
|
commissionOptions: [],
|
|
extraPayTypeOptions: [],
|
|
dateControl: undefined,
|
|
checkRecord: [],
|
|
}
|
|
},
|
|
watch: {
|
|
form: {
|
|
handler(val) {
|
|
this.$emit('update', val)
|
|
},
|
|
deep: true,
|
|
immediate: true,
|
|
},
|
|
},
|
|
created() {
|
|
if (!this.form.fileList) {
|
|
this.$set(this.form, 'fileList', [])
|
|
}
|
|
this.initData()
|
|
},
|
|
methods: {
|
|
initData() {
|
|
// 佣金明细
|
|
this.getDicts('dm_commission').then((response) => {
|
|
this.commissionOptions = response.data
|
|
})
|
|
// 额外支出类型
|
|
this.getDicts('dm_extra_pay').then((response) => {
|
|
this.extraPayTypeOptions = response.data
|
|
})
|
|
// 所属区域
|
|
this.getDicts('dm_area').then((response) => {
|
|
this.areaOptions = response.data
|
|
})
|
|
// 驾校
|
|
getSchools().then((resp) => {
|
|
this.schoolOptions = resp.data
|
|
})
|
|
// 班型
|
|
getClassTypeInfo({ status: '0' }).then((resp) => {
|
|
this.classTypeOptions = resp.data
|
|
})
|
|
// 审核记录
|
|
this.form.signId &&
|
|
getCheckRecord({
|
|
signId: this.form.signId,
|
|
type: 1,
|
|
}).then((resp) => {
|
|
this.checkRecord = resp.data
|
|
})
|
|
// 未登记并且非管理员,添加日期规则
|
|
if (!this.form.signId) {
|
|
let start = new Date()
|
|
// 取1号
|
|
start.setDate(1)
|
|
// 5号之前可操作上个月,注意跨年
|
|
if (new Date().getDate() < 5) {
|
|
if (start.getMonth() > 0) {
|
|
start.setMonth(start.getMonth() - 1)
|
|
} else {
|
|
start.setFullYear(start.getFullYear() - 1)
|
|
start.setMonth(11)
|
|
}
|
|
}
|
|
// 因为new Date()出来的时间戳,包含时分秒,判断日期时需要减一天
|
|
start = start.getTime() - 24 * 60 * 60 * 1000
|
|
this.dateControl = {
|
|
disabledDate: (time) => {
|
|
return time.getTime() < start || time.getTime() > new Date()
|
|
},
|
|
}
|
|
}
|
|
},
|
|
validate() {
|
|
return this.$refs.form.validate()
|
|
},
|
|
// 驾校change事件
|
|
schoolChange() {
|
|
this.$set(this.form, 'signPlace', undefined)
|
|
this.$set(this.form, 'signClass', undefined)
|
|
},
|
|
placeChange() {
|
|
this.$set(this.form, 'signClass', undefined)
|
|
this.$set(
|
|
this.form,
|
|
'schoolPeople',
|
|
this.options.placeInfo.find(
|
|
(item) => item.placeId === this.form.signPlace
|
|
).contact
|
|
)
|
|
this.$set(
|
|
this.form,
|
|
'area',
|
|
this.options.placeInfo.find(
|
|
(item) => item.placeId === this.form.signPlace
|
|
).area
|
|
)
|
|
// this.form.schoolPeople = this.options.placeInfo.find(
|
|
// (item) => item.placeId === this.form.signPlace
|
|
// ).contact
|
|
},
|
|
async handleUploadFile(data) {
|
|
if (data.file) {
|
|
const size = data.file.size
|
|
const limitSize = 20 * 1024 * 1024 // 20M大小限制
|
|
if (size < limitSize) {
|
|
const formData = new FormData()
|
|
formData.append('file', data.file)
|
|
const resp = await uploadEvidence(formData)
|
|
if (resp.code === 200) {
|
|
this.form.fileList.push(resp.data)
|
|
}
|
|
} else {
|
|
this.msgInfo('文件过大')
|
|
}
|
|
}
|
|
},
|
|
handleRemoveImage(index, item) {
|
|
deleteFile(item).then((resp) => {
|
|
if (resp && resp.data)
|
|
// 最好先通过接口删除服务器图片
|
|
this.form.fileList.splice(index, 1)
|
|
})
|
|
},
|
|
priceChange() {
|
|
//计算驾校支付款 报名价格-班型底价
|
|
if (this.form.signClass && this.form.signPrice) {
|
|
let minprice
|
|
this.classTypeOptions.some((item) => {
|
|
if (item.typeId == this.form.signClass) {
|
|
minprice = item.minPrice
|
|
return item
|
|
}
|
|
})
|
|
if (minprice) {
|
|
this.$set(this.form, 'schoolPay', this.form.signPrice - minprice)
|
|
}
|
|
} else {
|
|
this.$set(this.form, 'schoolPay', undefined)
|
|
}
|
|
},
|
|
},
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.el-row {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
}
|
|
.evidence-uploader {
|
|
display: inline-block;
|
|
.el-upload {
|
|
border: 1px dashed #d9d9d9;
|
|
border-radius: 6px;
|
|
cursor: pointer;
|
|
position: relative;
|
|
overflow: hidden;
|
|
|
|
&:hover {
|
|
border-color: #409eff;
|
|
}
|
|
.evidence-uploader-icon {
|
|
font-size: 28px;
|
|
color: #8c939d;
|
|
width: 100px;
|
|
height: 100px;
|
|
line-height: 100px;
|
|
text-align: center;
|
|
}
|
|
}
|
|
}
|
|
.image-list-item {
|
|
height: 100px;
|
|
img {
|
|
width: auto;
|
|
}
|
|
}
|
|
|
|
.btn-close {
|
|
position: absolute;
|
|
right: 0;
|
|
top: 0;
|
|
padding: 2px;
|
|
font-size: 20px;
|
|
background: #f2f6fc;
|
|
}
|
|
</style>
|
|
|