Files
income_payments_client/src/views/incomePayments/meetManage/AddOrDetailMeet.vue
T

1138 lines
40 KiB
Vue

<template>
<div>
<page-header-title :is-level-one="false" :level-two-title="title"></page-header-title>
<a-card :bordered="false">
<a-spin :spinning="confirmLoading">
<a-form :form="form">
<!-- 会议信息begin-->
<div class="item-title">会议信息</div>
<a-row :gutter="24">
<!--如果是工作组项目的会议维护跳转的 需要隐藏会议类型-->
<!-- 会议拆分不需要会议类型了 需要在调接口的时候传相应的会议类型-->
<!-- <a-col :xxl="8" :xl="12" :sm="24" v-if="isWorkGroupMeetType">-->
<!-- <a-form-item label="会议类型" :labelCol="labelCol" :wrapperCol="wrapperCol">-->
<!-- <j-dict-select-tag style="width: 100%" v-decorator="['meetingType',validatorRules.meetingType]"-->
<!-- @change="changeMeetingType"-->
<!-- :trigger-change="true" dict-code="meeting_type"-->
<!-- placeholder="请选择会议类型"></j-dict-select-tag>-->
<!-- </a-form-item>-->
<!-- </a-col>-->
<a-col :xxl="8" :xl="12" :sm="24">
<a-form-item label="会议名称" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-input placeholder="请输入会议名称"
:maxLength='50'
@change="event => event.target.value = event.target.value.trim()"
v-decorator="['meetingName',validateInviteCode.meetingName]"></a-input>
</a-form-item>
</a-col>
<a-col :xxl="8" :xl="12" :sm="24">
<a-form-item label="召开时间" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-range-picker
@change="changeConvokeTime"
format="YYYY-MM-DD HH:mm:00"
:show-time="{ format: 'HH:mm' }"
v-decorator="['convokeTime',validatorRules.convokeTime]"
:trigger-change="true"
style="width: 100%"/>
</a-form-item>
</a-col>
<a-col :xxl="8" :xl="12" :sm="24" v-if="meetingType === '2' ">
<a-form-item label="标协会议类型" :labelCol="labelCol" :wrapperCol="wrapperCol">
<j-dict-select-tag v-decorator="['tbMeetingType',validatorRules.tbMeetingType]" :trigger-change="true"
style="width: 100%" dict-code="standard_meeting_type"
placeholder="请选择标协会议类型"></j-dict-select-tag>
</a-form-item>
</a-col>
<!--工作组会议才有-->
<a-col :xxl="8" :xl="12" :sm="24">
<a-form-item label="年份" :labelCol="labelCol" :wrapperCol="wrapperCol">
<j-year-date v-decorator="['particularYear',validateInviteCode.particularYear]" placeholder="请选择年份"
style="width: 100%"></j-year-date>
</a-form-item>
</a-col>
<a-col :xxl="8" :xl="12" :sm="24">
<a-form-item label="预计参加人数" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-input placeholder="请输入预计参加人数"
@change="(e) => {e.target.value = e.target.value.replace(/[^0-9]/g,'')}"
:maxLength='50'
v-decorator="[ 'estimatedNumber']"></a-input>
</a-form-item>
</a-col>
<a-col :xxl="8" :xl="12" :sm="24" v-if="meetingType === '2' ">
<a-form-item label="注册签到" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-range-picker
@change="changeSignTime"
format="YYYY-MM-DD HH:mm:00"
:show-time="{ format: 'HH:mm' }"
v-decorator="['signInTime',validatorRules.signInTime]"
:trigger-change="true"
style="width: 100%"/>
</a-form-item>
</a-col>
<a-col :xxl="8" :xl="12" :sm="24">
<a-form-item label="报名截止时间" :labelCol="labelCol" :wrapperCol="wrapperCol">
<j-date placeholder="请选择报名截止时间" style="width: 100%;"
v-decorator="['registerDeadline',validatorRules.registerDeadline]" :trigger-change="true"
date-format="YYYY-MM-DD HH:mm" :show-time="true"/>
</a-form-item>
</a-col>
</a-row>
<a-row>
<a-col :xxl='8' :xl="12" :sm="24">
<a-form-item label="召开地点" :labelCol="labelCol" :wrapperCol="wrapperCol">
<j-area-linkage
type="cascader"
placeholder="请选择省市"
:has-error="hasError"
@change="changeConvoke"
v-decorator="['convokeLocale',validatorRules.convokeLocale]"
></j-area-linkage>
</a-form-item>
</a-col>
<a-col :xxl='8' :xl="12" :sm="24">
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-input placeholder="请输入详细地址"
class="address"
v-decorator="['address',validatorRules.address]"
@change="event => event.target.value = event.target.value.trim()"
:maxLength='50'
></a-input>
</a-form-item>
</a-col>
</a-row>
<a-row :gutter="24">
<a-col :xxl="18" :xl="18" :sm="24">
<a-form-item label="会议内容" :labelCol="remarksLabelCol" :wrapperCol="remarksWrapperCol">
<a-textarea
placeholder="请输入会议内容"
:auto-size="{ minRows: 3, maxRows: 6 }"
v-decorator="['meetingContent',validatorRules.meetingContent]"
:maxLength='200'
@change="e => {e.target.value = (e.target.value + '').trim()}"/>
</a-form-item>
</a-col>
</a-row>
<a-row :gutter="24">
<a-col :xxl="8" :xl="12" :sm="24">
<a-form-item label="会议通知" :labelCol="labelCol" :wrapperCol="wrapperCol">
<j-upload :return-id="true" v-decorator="[ 'meetingFiles',validatorRules.meetingFiles]"></j-upload>
</a-form-item>
</a-col>
</a-row>
<!--会议信息end-->
<!--邀请码begin-->
<!-- 国际研讨会出现-->
<section v-if="meetingType === '3' ">
<div class="item-title">邀请码</div>
<a-row :gutter="24">
<a-col :xxl="8" :xl="12" :sm="24">
<a-form-item label="VIP" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-input placeholder="请输入邀请码"
@change="event => event.target.value = event.target.value.trim()"
:maxLength='50'
v-decorator="['vipInvitationCode',validateInviteCode.invitationCode]"></a-input>
</a-form-item>
</a-col>
<a-col :xxl="8" :xl="12" :sm="24">
<a-form-item label="演讲嘉宾" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-input placeholder="请输入邀请码"
@change="event => event.target.value = event.target.value.trim()"
:maxLength='50'
v-decorator="[ 'speakerInvitationCode',validateInviteCode.invitationCode]"></a-input>
</a-form-item>
</a-col>
<a-col :xxl="8" :xl="12" :sm="24">
<a-form-item label="特邀嘉宾" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-input placeholder="请输入邀请码"
@change="event => event.target.value = event.target.value.trim()"
:maxLength='50'
v-decorator="[ 'guestInvitationCode',validateInviteCode.invitationCode]"></a-input>
</a-form-item>
</a-col>
<a-col :xxl="8" :xl="12" :sm="24">
<a-form-item label="合作伙伴" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-input placeholder="请输入邀请码"
@change="event => event.target.value = event.target.value.trim()"
:maxLength='50'
v-decorator="[ 'cooperativeInvitationCode',validateInviteCode.invitationCode]"></a-input>
</a-form-item>
</a-col>
</a-row>
</section>
<!--邀请码end-->
<!--会议费用begin-->
<div>
<span class="item-title">会议费用</span>
<!-- 工作组会议添加的需求变更-->
<span class="working-group-remind" v-if="isWorkGroupMeetType">不收费请填写0元</span>
</div>
<a-row :gutter="24">
<a-col :xxl="8" :xl="12" :sm="24">
<a-form-item label="会议费用" :labelCol="labelCol" :wrapperCol="{ xs: {span: 24},sm: {span: 16}}">
<a-input placeholder="请输入会议费用"
:maxLength='50'
@change="(e) => {e.target.value = e.target.value.replace(/[^0-9.]/g,'')}"
@blur="addZero"
v-decorator="[ 'meetingCosts',validateInviteCode.meetingCosts]"></a-input>
<span class="yuan">元/人</span>
</a-form-item>
</a-col>
<!-- 标协会议才有 -->
<a-col :xxl="8" :xl="12" :sm="24" v-if="meetingType === '2' ">
<a-form-item label="会议费用(标协会员)" :labelCol="{ xs: {span: 24},sm: {span: 8}}"
:wrapperCol="{ xs: {span: 24},xl:{span:14},sm: {span: 16}}">
<a-input placeholder="请输入会议费用"
:maxLength='50'
@change="(e) => {e.target.value = e.target.value.replace(/[^0-9.]/g,'')}"
@blur="addZero"
v-decorator="[ 'meetingCostsVip',validateInviteCode.meetingCostsVip]"></a-input>
<span class="yuan">元/人</span>
</a-form-item>
</a-col>
<!--收款二维码-->
<a-col :xxl="8" :xl="12" :sm="24" v-if="QRcodeBool">
<a-form-item label="收款二维码" :labelCol="{ xs: {span: 24},sm: {span: 8}}"
:wrapperCol="{ xs: {span: 24},xl:{span:14},sm: {span: 16}}">
<j-image-upload :return-id="true" v-decorator="[ 'paymentQrCode']"></j-image-upload>
</a-form-item>
</a-col>
</a-row>
<!--会议费用end-->
<!--联系方式begin-->
<div class="item-title">联系方式</div>
<a-row :gutter="24">
<a-col :xxl="8" :xl="12" :sm="24">
<a-form-item label="会议负责人" :labelCol="labelCol" :wrapperCol="wrapperCol">
<select-principal placeholder="请选择会议负责人"
@change="selectPerson"
v-decorator="['directorId',validatorRules.directorId]"></select-principal>
</a-form-item>
</a-col>
<a-col :xxl="8" :xl="12" :sm="24">
<a-form-item label="手机号" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-input placeholder="请输入手机号"
disabled
:maxLength='11'
@change="(e) => {e.target.value = e.target.value.replace(/[^0-9]/g,'')}"
v-decorator="['directorPhone']"></a-input>
</a-form-item>
</a-col>
</a-row>
<a-row :gutter="24">
<section>
<a-row :gutter="24" v-for="(item, index) in model.meetingContactsList" :key="index">
<a-col :xxl="8" :xl="10" :md="12">
<a-form-item label="会议联系人" :labelCol="labelCol" :wrapperCol="wrapperCol">
<!-- @change="selectPerson"-->
<!-- 绑定 index 是因为 没法通过 selectMeetingContact 方法 去传递这个索引 只能绑定在组件上 通过change 方法的第二个参数 去获取这个 index 然后去做对应的表单复赋值 -->
<select-principal placeholder="请选择会议联系人"
:index="index"
@change="selectMeetingContact"
v-decorator="['meetingContactsList['+index+'].meetingContactsId']">
</select-principal>
<!-- ,validateInviteCode.meetingContactsId-->
</a-form-item>
</a-col>
<a-col :xxl="8" :xl="10" :md="12">
<a-form-item label="联系人手机号" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-input
@change="(e) => {e.target.value = e.target.value.replace(/[^0-9]/g,'')}"
:maxLength="11"
disabled
v-decorator="['meetingContactsList['+index+'].meetingContactsPhone']"
placeholder="请输入联系人手机号"></a-input>
</a-form-item>
</a-col>
<!-- style="transform: translateX(-130px);"-->
<a-col :xxl="2" :xl="4" :sm="6">
<a-form-item>
<a-button icon="plus" @click="addMeetingContacts"></a-button>
<a-button icon="minus" @click="removeMeetingContacts(index)" style="margin-left: 8px;"></a-button>
</a-form-item>
</a-col>
</a-row>
</section>
</a-row>
<a-row :gutter="24">
<a-col :xxl="8" :xl="12" :sm="24">
<a-form-item label="酒店名称" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-input placeholder="请输入酒店名称"
:maxLength='50'
@change="event => event.target.value = event.target.value.trim()"
v-decorator="['hotelName',validatorRules.hotelName]"></a-input>
</a-form-item>
</a-col>
<!--标协会议才有-->
<a-col :xxl="8" :xl="12" :sm="24">
<a-form-item label="酒店地址" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-input placeholder="请输入酒店地址"
:maxLength='50'
@change="event => event.target.value = event.target.value.trim()"
v-decorator="[ 'hotelAddress',validatorRules.hotelAddress]"></a-input>
</a-form-item>
</a-col>
</a-row>
<!--标协会议-->
<!--变更后所有的会议都有酒店信息管理了-->
<section>
<a-row :gutter="24" v-for="(hotel, index) in model.hotelContactsList" :key="index">
<a-col :xxl="8" :xl="10" :md="12">
<a-form-item label="酒店联系人" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-input
@change="event => event.target.value = event.target.value.trim()"
:maxLength="50"
v-decorator="['hotelContactsList['+index+'].hotelContacts', validatorRules.contactPerson]"
placeholder="请输入酒店联系人"></a-input>
</a-form-item>
</a-col>
<a-col :xxl="8" :xl="10" :md="12">
<a-form-item :wrapperCol="{xl:{span:17}}">
<a-input
@change="(e) => {e.target.value = e.target.value.replace(/[^0-9]/g,'')}"
:maxLength="11"
v-decorator="['hotelContactsList['+index+'].hotelContactsPhone',validateInviteCode.directorPhone]"
placeholder="请输入联系人手机号"></a-input>
</a-form-item>
</a-col>
<a-col :xxl="2" :xl="4" :sm="6" style="transform: translateX(-130px);">
<a-form-item>
<a-button icon="plus" @click="addNew"></a-button>
<a-button icon="minus" @click="remove(index)" style="margin-left: 8px;"></a-button>
</a-form-item>
</a-col>
</a-row>
</section>
<a-row :gutter="24">
<a-col :xxl="18" :xl="18" :sm="24">
<a-form-item label="备注" :labelCol="remarksLabelCol" :wrapperCol="remarksWrapperCol">
<a-textarea
placeholder="请输入备注"
:auto-size="{ minRows: 3, maxRows: 6 }"
v-decorator="['remark']"
:maxLength='200'
@change="e => {e.target.value = (e.target.value + '').trim()}"/>
</a-form-item>
</a-col>
</a-row>
<!--联系方式end-->
<!--通知正文begin-->
<!--只有分标委会议与工作组会议才有-->
<template v-if="meetingType === '1' || meetingType === '5' || meetingType === '6' ">
<div class="item-title">通知文件</div>
<a-row :gutter="24">
<a-col :xxl="18" :xl="18" :sm="24">
<a-form-item label="通知正文" :labelCol="remarksLabelCol" :wrapperCol="remarksWrapperCol">
<a-textarea
placeholder="请输入通知正文"
:auto-size="{ minRows: 3, maxRows: 6 }"
v-decorator="['notice']"
:maxLength='200'
@change="e => {e.target.value = (e.target.value + '').trim()}"/>
<span style="color:#999">仅用于发送邮件使用</span>
</a-form-item>
</a-col>
</a-row>
</template>
<!--通知正文end-->
</a-form>
<div class="footer">
<a-button type="primary" @click="handleOk" class="submit" v-preventclick>保存</a-button>
<a-button @click="handleCancel">取消</a-button>
</div>
</a-spin>
</a-card>
</div>
</template>
<script>
import {getUserInfo, getMeetInfoById} from '@api/incomeMeetingApi'
import {isRepeat} from '@/utils/util'
import {httpAction} from '@api/manage'
import JDictSelectTag from '@comp/dict/JDictSelectTag'
import JYearDate from '@comp/jero/JYearDate'
import JUpload from '@comp/jero/JUpload'
import JDate from '@comp/jero/JDate'
import SelectPrincipal from '@comp/company/SelectPrincipal'
import JAreaLinkage from '@comp/jero/JAreaLinkagePca'
import AreaPca from '@comp/_util/AreaPca'
import moment from 'moment'
import pick from 'lodash.pick'
import meetingValidate from '@views/incomePayments/meetManage/meetingValidate'
import PageHeaderTitle from '@comp/layouts/PageHeaderTitle'
import JImageUpload from '@comp/jero/JImageUpload'
import {checkMeetingName} from '@/utils/validateOnly'
import {addZero} from '@/utils/util'
import {money, phoneReg} from '@/utils/validate'
export default {
name: 'AddOrDetailMeet',
components: {
JDictSelectTag,
JYearDate,
JUpload,
JDate,
SelectPrincipal,
JAreaLinkage,
PageHeaderTitle,
JImageUpload
},
data() {
return {
description: '新增会议',
title: '新增会议',
confirmLoading: false,
visible: false,
form: this.$form.createForm(this),
model: {},
labelCol: {
xxl: {span: 7},
xs: {span: 24},
sm: {span: 6}
},
wrapperCol: {
xxl: {span: 17},
xs: {span: 24},
sm: {span: 18}
},
remarksLabelCol: {
xxl: {span: 3},
xl: {span: 4},
xs: {span: 24},
sm: {span: 3}
},
remarksWrapperCol: {
xxl: {span: 21},
xl: {span: 20},
xs: {span: 24},
sm: {span: 21}
},
// 详细地址
address: '',
validatorRules: meetingValidate,
validateInviteCode: {
invitationCode: {
rules: [
{required: false, validator: this.validateCode}
],
validateTrigger: ['blur']
},
meetingContactsId: {
rules: [
{required: true, validator: this.validateMeetingContact}
],
validateTrigger: ['change']
},
meetingName: {
rules: [
{required: true, validator: this.validaeMeetingName}
],
validateTrigger: ['blur']
},
particularYear: {
rules: [
{required: true, validator: this.validateYear}
],
validateTrigger: ['blur', 'change'],
initialValue: this.$store.getters.currentYear
},
meetingCosts: {
rules: [
{required: true, validator: this.validateMeetingCosts}
],
validateTrigger: ['blur']
},
meetingCostsVip: {
rules: [
{required: true, validator: this.validateMeetingCostsVip}
],
validateTrigger: ['blur']
},
directorPhone: {
rules: [
{required: true, validator: this.validateDirectorPhone}
],
validateTrigger: ['blur']
}
},
userList: [],// 会议联系人下拉框集合
url: {
add: '/meeting/payMeeting/add',
edit: '/meeting/payMeeting/edit'
},
// 召开时间
newConvokeTime: '',
// 注册召开时间
newSignInTime: '',
// 工作组会议列表
workGroupList: [],
// 收费二维码显示
QRcodeBool: true,
// 召开地点border颜色控制
hasError: false,
// 会议类型
meetingType: ''
}
},
computed: {
// 是否从工作组会议维护来的
isWorkGroupMeetType() {
if (this.$route.query.workingGroupProjectId) {
return true
} else {
return false
}
},
// 是否从分标委会议维护来的
isCaseCommitteeId() {
if (this.$route.query.caseCommitteeId) {
return true
} else {
return false
}
},
// 是否从理事会会议维护来的
isCouncilIdId() {
if (this.$route.query.councilId) {
return true
} else {
return false
}
}
},
mounted() {
this.pcaData = new AreaPca()
// 编辑获取会议信息 有id就是编辑走编辑
if (this.$route.query.id) {
getMeetInfoById({id: this.$route.query.id}).then(res => {
if (res.success) {
this.edit(res.result)
}
})
} else {
// 没有id走新增
this.add()
}
},
methods: {
moment,
addZero,
/*
* 新增
* */
add() {
this.edit({})
},
/*
* 编辑
* */
edit(record) {
this.form.resetFields()
this.model = Object.assign({}, record)
let dateFormat = 'YYYY-MM-DD HH:mm:ss'
if (this.model.id) {
this.title = '编辑会议'
// 修改会议类型 控制dom显示 编辑取接口查到的会议类型
this.meetingType = record.meetingType + ''
// 编辑根据接口返回的会议类型获取不同的会议url
this.url = this.createUrlByMeetingType(this.meetingType)
// 判断会议费用是否为 0 缴费二维码显示
if (this.model.meetingCosts === '0.00') {
this.QRcodeBool = false
} else {
this.QRcodeBool = true
}
} else {
this.title = '新增会议'
// 所有的会议都显示酒店联系人
this.model.hotelContactsList = [{
hotelContacts: '',
hotelContactsPhone: ''
}]
// 会议联系人
this.model.meetingContactsList = [{
meetingContactsId: undefined,
meetingContactsPhone: ''
}]
// 新增取路由参数
this.meetingType = this.$route.query.meetingType
// 新增根据路由参数 会议类型更换不同的接口
this.url = this.createUrlByMeetingType(this.meetingType)
}
console.log(this.model)
// 召开时间回显
if (this.model.startTime) {
this.model.convokeTime = [moment(this.model.startTime, dateFormat), moment(this.model.endTime, dateFormat)]
}
// 注册签到时间回显
if (this.model.startSignInTime) {
this.model.signInTime = [moment(this.model.startSignInTime, dateFormat), moment(this.model.endSignInTime, dateFormat)]
}
// 后端需要的召开时间
this.newConvokeTime = [this.model.startTime, this.model.endTime]
// 后端需要的注册签到时间
this.newSignInTime = [this.model.startSignInTime, this.model.endSignInTime]
this.$nextTick(() => {
// 加定时器是因为有可能赋值不成功
setTimeout(() => {
this.form.setFieldsValue(pick(this.model, 'notice', 'hotelContactsList', 'hotelName', 'hotelAddress', 'paymentQrCode', 'meetingName', 'meetingType', 'convokeTime', 'particularYear', 'estimatedNumber', 'meetingFiles', 'registerDeadline', 'meetingContent', 'convokeLocale', 'address', 'meetingCosts', 'directorId', 'remark', 'directorPhone','meetingContactsList')), 200
})
// 如果是标协会议则回显 标协会议的字段
if (this.meetingType === '2') {
console.log('this.model', this.model)
this.form.setFieldsValue(pick(this.model, 'signInTime', 'tbMeetingType', 'meetingCostsVip'))
}
// 如果是工作组会议 赋值工作组
if (this.meetingType === '1') {
this.form.setFieldsValue(pick(this.model, 'workingGroupId'))
}
// 如果是国际研讨会则赋值邀请码
if (this.meetingType === '3') {
this.form.setFieldsValue(pick(this.model, 'vipInvitationCode', 'speakerInvitationCode', 'guestInvitationCode', 'cooperativeInvitationCode'))
}
})
},
/*
* 发布会议
* */
handleOk() {
const that = this
this.form.validateFields((err, values) => {
// 这是设置召开时间不选择的边框颜色为红色
if (err && Object.prototype.hasOwnProperty.call(err, 'convokeLocale')) {
this.hasError = true
}
if (!err) {
that.confirmLoading = true
let httpurl = ''
let method = 'post'
if (that.model.id) {
httpurl = this.url.edit
} else {
httpurl = this.url.add
}
let placeName = values.convokeLocale
const formData = Object.assign(this.model, values, {venue: this.getPcaText(placeName)})
// 如果会议的费用未为0 不能上传缴费凭证
if (values.meetingCosts === '0.00') {
delete formData.paymentQrCode
}
// 添加编辑会议需要增加会议类型
formData.meetingType = this.meetingType
// 如果是工作会议维护跳转的需要加上会议类型为工作组会议和工作组id
if (this.isWorkGroupMeetType) {
formData.meetingType = '1'
formData.workingGroupId = this.$route.query.workingGroupProjectId
}
// 如果是分标委会议需要加上分标委id与会议类型
if (this.isCaseCommitteeId) {
formData.meetingType = '5'
formData.caseCommitteeId = this.$route.query.caseCommitteeId
}
// 如果是理事会会议需要加上理事会id与会议类型
if (this.isCouncilIdId) {
formData.meetingType = '6'
formData.councilId = this.$route.query.councilId
formData.councilName = this.$route.query.connccilName
}
// 转换召开时间
formData.startTime = this.newConvokeTime[0]
formData.endTime = this.newConvokeTime[1]
// 转换注册签到时间
if (values.signInTime) {
formData.startSignInTime = this.newSignInTime[0]
formData.endSignInTime = this.newSignInTime[1]
}
console.log('表单提交数据', formData)
httpAction(httpurl, formData, method).then((res) => {
if (res.success) {
that.$message.success(res.message)
that.confirmLoading = false
that.handleCancel()
} else {
that.$message.warning(res.message)
}
}).finally(() => {
that.confirmLoading = false
})
}
})
},
/*
*
* */
changeConvoke(val) {
if (val) {
this.hasError = false
}
},
/*
* 取消
* */
handleCancel() {
console.log('取消')
this.$router.go(-1)
},
/*
* 监听会议类型变化
* 这个没用了
* */
changeMeetingType(val) {
this.meetingType = val
// 如果是工作组会议就需要查询所有的工作组
if (val === '1') {
this.getWorkSelectList()
}
if (val === '2') {
this.model.hotelContactsList = [{
hotelContacts: '',
hotelContactsPhone: ''
}]
} else {
// eslint-disable-next-line
if (this.model.hasOwnProperty('hotelContactsList')) {
delete this.model.hotelContactsList
}
}
},
/*
* 会议负责人
* */
selectPerson(val) {
getUserInfo({id: val}).then(res => {
if (res.success) {
this.$nextTick(() => {
this.form.setFieldsValue({directorPhone: res.result.phone})
})
}
})
},
/*
* 添加酒店联系人
* */
addNew(index) {
if (this.model.hotelContactsList.length >= 5) {
this.$message.warning('最多添加5个酒店联系人')
return
}
const {form} = this
const obj = {
hotelContacts: '',
hotelContactsPhone: ''
}
const keys = form.getFieldValue('hotelContactsList')
// 增加数据后重新赋值
this.model.hotelContactsList.splice(index + 1, 0, obj)
// keys.splice(index , 0, obj)
this.$nextTick(() => {
form.setFieldsValue({
hotelContactsList: keys
})
})
},
/*
* 删减酒店联系人
* */
remove(k) {
// 如果长度是1的话则不进行删除操作
if (this.model.hotelContactsList.length === 1) {
return
}
const {form} = this
// // can use data-binding to get
const hotelContactsList = form.getFieldValue('hotelContactsList')
// 把循环的dom元素删除
this.model.hotelContactsList.splice(k, 1)
// 把绑定在dom里面的值删除
hotelContactsList.splice(k, 1)
this.$nextTick(() => {
// 重新赋值
form.setFieldsValue({
hotelContactsList: hotelContactsList
})
})
},
/*
* 添加会议联系人
* */
addMeetingContacts(index) {
if (this.model.meetingContactsList.length >= 5) {
this.$message.warning('最多添加5个酒店联系人')
return
}
const {form} = this
const obj = {
meetingContactsId: '',
meetingContactsPhone: ''
}
const keys = form.getFieldValue('meetingContactsList')
// 增加数据后重新赋值
this.model.meetingContactsList.splice(index + 1, 0, obj)
// keys.splice(index , 0, obj)
this.$nextTick(() => {
form.setFieldsValue({
meetingContactsList: keys
})
})
},
/*
* 删除会议联系人
* */
removeMeetingContacts(k) {
// 如果长度是1的话则不进行删除操作
if (this.model.meetingContactsList.length === 1) {
return
}
const {form} = this
// // can use data-binding to get
const meetingContactsList = form.getFieldValue('meetingContactsList')
// 把循环的dom元素删除
this.model.meetingContactsList.splice(k, 1)
// 把绑定在dom里面的值删除
meetingContactsList.splice(k, 1)
this.$nextTick(() => {
// 重新赋值
form.setFieldsValue({
meetingContactsList: meetingContactsList
})
})
},
/**
* 选择会议联系人
* */
selectMeetingContact(val, VNode) {
console.log(val)
console.log(VNode)
if (val) {
// 索引 我不知道怎么去拿这个对应的索引 我只能把这个绑到这个组件上 通过这种方法 去拿索引
let idx = VNode.context.index
// 要设置表单值的数组
const keys = this.form.getFieldValue('meetingContactsList')
getUserInfo({id: val}).then(res => {
if (res.success) {
this.$nextTick(() => {
keys.forEach((item, index) => {
// 为数组索引为index 的赋值
if (index === idx) {
keys.splice(index, 1, {
meetingContactsId: val,
meetingContactsPhone: res.result.phone
})
}
})
this.form.setFieldsValue({meetingContactsList: keys})
})
}
})
}
},
/*
* 召开地点吗转换
* */
getPcaText(code) {
return this.pcaData.getText(code)
},
/*
* 召开时间转化
* */
changeConvokeTime(date, dateString) {
this.newConvokeTime = dateString
},
/*
* 注册签到时间转化
* */
changeSignTime(date, dateString) {
this.newSignInTime = dateString
},
/*
* 根据会议类型返回不同的会议新增与编辑接口
* */
createUrlByMeetingType(meetingType) {
switch (String(meetingType)) {
// 工作组会议
case '1':
return {
add: '/meeting/workGroupMeeting/add',
edit: '/meeting/workGroupMeeting/edit'
}
// 标协会议
case '2':
return {
add: '/meeting/standardsMeeting/add',
edit: '/meeting/standardsMeeting/edit'
}
// 国际研讨会
case '3':
return {
add: '/meeting/internalMeeting/add',
edit: '/meeting/internalMeeting/edit'
}
// 其他会议
case '4':
return {
add: '/meeting/otherMeeting/add',
edit: '/meeting/otherMeeting/edit'
}
// 分标委会议
case '5':
return {
add: '/meeting/committeeMeeting/add',
edit: '/meeting/committeeMeeting/edit'
}
// 理事会会议
case '6':
return {
add: '/meeting/councilMeeting/add',
edit: '/meeting/councilMeeting/edit'
}
}
},
/*
* 校验邀请码
* */
validateCode(rule, value, callback) {
let codeObj = this.form.getFieldsValue(['cooperativeInvitationCode', 'vipInvitationCode', 'speakerInvitationCode', 'guestInvitationCode'])
let codeArr = Object.values(codeObj)
codeArr = codeArr.filter(item => {
return (item !== undefined && item !== '' && item !== null)
})
console.log('codearr', codeArr)
// 校验是否重复
if (value && isRepeat(codeArr)) {
callback('请填写不同的邀请码!')
} else {
callback()
}
},
/*
* 校验会议联系人
* */
validateMeetingContact(rule, value, callback) {
// let meetingContactList = this.form.getFieldValue('meetingContactsList')
// meetingContactList.forEach((item,index) => {
// if ( item.meetingContactsId === value && !item.meetingContactsPhone){
// meetingContactList.splice(index,1)
// }
// })
// let flag = meetingContactList.some(item => {
// return item.meetingContactsId === value
// })
// if (meetingContactList.length === 1) {
// flag = false
// }
if (value === '' || value === undefined || value === null) {
callback('请选择会议联系人')
}else {
callback()
}
// if (value && flag) {
// callback('请选择不同的会议联系人')
// } else {
// callback()
// }
},
/*
* 会议名称唯一校验
* */
validaeMeetingName(rule, value, callback) {
checkMeetingName(value, this.model.id).then(res => {
if (res.success) {
callback()
} else {
callback(res.code === 500 ? '会议名称已存在' : res)
}
})
},
/*
* 年份校验
* */
validateYear(rule, value, callback) {
if (value === undefined || value === '' || value === null) {
callback('请选择年份')
}
const year = new Date().getFullYear()
if (Number(value) < year) {
callback(`请选择${year}年或之后的年份`)
} else {
callback()
}
},
/*
* 会议费用校验
* */
validateMeetingCosts(rule, value, callback) {
if (value === undefined || value === '' || value === null) {
callback('请输入会议费用')
}
if (value && money(value)) {
// 会议费用为 0控制二维码显示隐藏
if (value === '0.00') {
this.QRcodeBool = false
// 如果付款二维码有值 需要清空
if (this.form.getFieldValue('paymentQrCode')) {
this.form.resetFields('paymentQrCode')
}
} else {
this.QRcodeBool = true
}
callback()
} else {
callback('请输入合法的金额数字,最多2位小数,10位整数')
}
},
/*
* 标协会议费用校验
* */
validateMeetingCostsVip(rule, value, callback) {
if (value === undefined || value === '' || value === null) {
callback('请输入会议费用(标协会员)')
}
if (value && money(value)) {
callback()
} else {
callback('请输入合法的金额数字,最多2位小数,10位整数')
}
},
validateDirectorPhone(rule, value, callback) {
if (value && value !== '') {
if (phoneReg(value)) {
// 是否编辑
callback()
} else {
callback('请输入正确的手机号')
}
} else {
callback()
}
}
}
}
</script>
<style scoped lang="less">
@import '~@assets/less/common.less';
/deep/ .ant-card-body {
padding-top: 0;
}
.item-title {
padding-left: 40px;
box-sizing: border-box;
height: 46px;
line-height: 46px;
color: #333;
position: relative;
font-size: 16px;
&::before {
position: absolute;
content: "";
width: 10px;
height: 10px;
border-radius: 50%;
background: #069f99;
top: 50%;
margin-top: -5px;
left: 15px;
}
}
/*会议费用添加的提示语*/
.working-group-remind {
color: red;
margin-left: 10px;
}
/* 新建会议 */
.project-base-info-title {
height: 50px;
line-height: 50px;
color: #666;
.back {
cursor: pointer;
font-size: 20px;
color: #666;
}
.title {
display: inline-block;
margin-left: 14px;
color: #666;
}
}
.line {
height: 1px;
background-color: #cccccc;
margin: 0 -24px;
}
.footer {
text-align: center;
}
.submit {
margin-right: 8px;
}
.yuan {
position: absolute;
right: -40px;
top: -10px;
}
.add-icon {
height: 100%;
margin-right: 10px;
cursor: pointer;
}
.remove-icon {
height: 100%;
cursor: pointer;
}
.address {
transform: translate(4px, -4px);
}
</style>