【修改】迁移管理端报名页面
This commit is contained in:
fengachen
Generated
+20677
-163
File diff suppressed because it is too large
Load Diff
+1
-1
@@ -11,7 +11,7 @@
|
||||
"dependencies": {
|
||||
"ant-design-vue": "^1.7.6",
|
||||
"axios": "^0.21.1",
|
||||
"compression-webpack-plugin": "5.0.1",
|
||||
"compression-webpack-plugin": "^5.0.1",
|
||||
"core-js": "^3.6.5",
|
||||
"dayjs": "^1.10.6",
|
||||
"enquire.js": "^2.1.6",
|
||||
|
||||
@@ -12,7 +12,8 @@ window._CONFIG["casPrefixUrl"] = "http://cas.example.org:8443/cas";
|
||||
// 预览文件地址
|
||||
window._CONFIG["onlinePreviewDomainURL"] = "http://10.0.1.9:9012/onlinePreview";
|
||||
|
||||
// 会议管理报名二维码地址
|
||||
// todo 需要改为企业端的报名地址 --- 本地
|
||||
// 会议管理报名二维码地址 需
|
||||
window._CONFIG['singUpQRCodeURL'] = 'http://10.0.1.9:21825/signupentrance'
|
||||
|
||||
// 路由转发 -会员系统的路由转发前缀
|
||||
|
||||
@@ -12,6 +12,7 @@ window._CONFIG["casPrefixUrl"] = "http://cas.example.org:8443/cas";
|
||||
// 预览文件地址
|
||||
window._CONFIG["onlinePreviewDomainURL"] = "http://139.9.235.66:8012/onlinePreview";
|
||||
|
||||
// todo 需要改为企业端的报名地址 --- 本地 139
|
||||
// 会议管理报名二维码地址
|
||||
window._CONFIG['singUpQRCodeURL'] = 'http://bxxt.hzwlsoft.com:1017/signupentrance'
|
||||
|
||||
|
||||
@@ -12,6 +12,7 @@ window._CONFIG["casPrefixUrl"] = "http://cas.example.org:8443/cas";
|
||||
// 预览文件地址
|
||||
window._CONFIG["onlinePreviewDomainURL"] = "http://cwp.catarc.org.cn:8092/onlinePreview";
|
||||
|
||||
// todo 需要改为企业端的报名地址 --- 客户
|
||||
// 会议管理报名二维码地址
|
||||
window._CONFIG['singUpQRCodeURL'] = 'http://cwp.catarc.org.cn:8066/signupentrance'
|
||||
|
||||
|
||||
@@ -23,6 +23,21 @@ const getCommitteeUnderStudyProject = (param) => getAction('/payResearchProject/
|
||||
const getWorkingGroupUnderStudyProject = (param) => getAction('/payResearchProject/payResearchProject/list', param)
|
||||
// 缴费凭证审核记录
|
||||
const getAuditProofRecords = (param) => getAction('/paymentCheck/payPaymentCheck/amountReceivedSubList', param)
|
||||
// 生成会议二维码
|
||||
const createQcCode = (params) => getAction('/meeting/payMeeting/createBase64',params)
|
||||
// 通过单位名称校验是否标协会员
|
||||
const validateStandard = (params) => getAction('/meeting/internalMeetingSituation/checkMember',params)
|
||||
// 通过联系人id获取联系人信息
|
||||
const getContactsById = (param) => getAction('/company/payContactsManagement/queryByIdMeeting', param)
|
||||
// 通过企业名称获取该企业下的联系人
|
||||
const getContactsByCompany = (params) => getAction('/company/payContactsManagement/queryByCompany', params)
|
||||
// 通过企业名称获取该企业下的联系人无权限接口
|
||||
const getContactsByCompanyNoLimit = (params) => getAction('/company/payContactsManagement/queryByCompanyMeeting', params)
|
||||
// 获取全部用户列表
|
||||
const getAllUserList = (params) => getAction('/sys/user/list', params)
|
||||
// 企业联系人新建重名校验
|
||||
const queryContactByName = (param) => getAction('/company/payContactsManagement/queryByName', param)
|
||||
|
||||
|
||||
export {
|
||||
queryCommonProjectById,
|
||||
@@ -36,5 +51,12 @@ export {
|
||||
getCouncilDetailById,
|
||||
getCommitteeUnderStudyProject,
|
||||
getWorkingGroupUnderStudyProject,
|
||||
getAuditProofRecords
|
||||
getAuditProofRecords,
|
||||
createQcCode,
|
||||
validateStandard,
|
||||
getContactsById,
|
||||
getContactsByCompany,
|
||||
getContactsByCompanyNoLimit,
|
||||
getAllUserList,
|
||||
queryContactByName
|
||||
}
|
||||
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 1.5 MiB |
Binary file not shown.
|
After Width: | Height: | Size: 567 B |
Binary file not shown.
|
After Width: | Height: | Size: 664 B |
@@ -0,0 +1,429 @@
|
||||
<template>
|
||||
<j-modal
|
||||
:title="title"
|
||||
:width="width"
|
||||
:visible="visible"
|
||||
:confirmLoading="confirmLoading"
|
||||
switchFullscreen
|
||||
@ok="handleOk"
|
||||
@cancel="handleCancel"
|
||||
cancelText="关闭">
|
||||
<a-spin :spinning="confirmLoading">
|
||||
<a-form :form="form">
|
||||
<a-row>
|
||||
<a-col :xl="12" :sm="24">
|
||||
<a-form-item label="企业名称" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
||||
<company-select placeholder="请选择企业"
|
||||
v-decorator="['company',validatorRules.company]"
|
||||
:maxLength='50'
|
||||
:is-company-disabled="isCompanyDisabled"
|
||||
:disabled="isCompanyDisabled"
|
||||
@change="companyChange"></company-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :xl="12" :sm="24">
|
||||
<a-form-item label="姓名" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
||||
<a-input placeholder="请输入姓名"
|
||||
v-decorator="['name',validatorRules.name]"
|
||||
:maxLength='50'
|
||||
@change="e => {e.target.value = (e.target.value + '').trim()}"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row>
|
||||
<a-col :xl="12" :sm="24">
|
||||
<a-form-item label="性别" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
||||
<j-dict-select-tag v-decorator="['gender']" :triggerChange="true" placeholder="请选择性别"
|
||||
dictCode="sex"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :xl="12" :sm="24">
|
||||
<a-form-item label="职务" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
||||
<a-input placeholder="请输入职务"
|
||||
v-decorator="['post']"
|
||||
:maxLength='50'
|
||||
@change="e => {e.target.value = (e.target.value + '').trim()}"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row>
|
||||
<a-col :xl="12" :sm="24">
|
||||
<a-form-item label="手机号" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
||||
<a-input placeholder="请输入手机号"
|
||||
v-decorator="['phone',validatorRules.phone]"
|
||||
:maxLength='11'
|
||||
@change="e => {e.target.value = (e.target.value + '').trim()}"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :xl="12" :sm="24">
|
||||
<a-form-item label="邮箱" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
||||
<a-input placeholder="请输入邮箱"
|
||||
v-decorator="['email',validatorRules.email]"
|
||||
:maxLength='50'
|
||||
@change="e => {e.target.value = (e.target.value + '').trim()}"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row>
|
||||
<a-col :xl="12" :sm="24">
|
||||
<a-form-item label="通讯地址" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
||||
<a-input placeholder="请输入通讯地址"
|
||||
:maxLength='50'
|
||||
v-decorator="['contactAddress',validatorRules.contactAddress]"
|
||||
@change="e => {e.target.value = (e.target.value + '').trim()}"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :xl="12" :sm="24">
|
||||
<a-form-item label="邮政编码" :labelCol="labelCol" :wrapperCol="wrapperCol" class="form-item-postcode">
|
||||
<a-input placeholder="请输入邮政编码"
|
||||
:maxLength='6'
|
||||
v-decorator="['postalCode',validatorRules.postalCode]"
|
||||
@change="e => {e.target.value = (e.target.value + '').trim()}"></a-input>
|
||||
<a class="search-postcode" href="https://www.youbianku.com" target="_blank">查询邮编</a>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row>
|
||||
<a-col>
|
||||
<a-form-item label="备注" :labelCol="remarksLabelCol" :wrapperCol="remarksWrapperCol">
|
||||
<a-textarea
|
||||
placeholder="请输入备注"
|
||||
:auto-size="{ minRows: 3, maxRows: 6 }"
|
||||
v-decorator="['remarks']"
|
||||
:maxLength='200'
|
||||
@change="e => {e.target.value = (e.target.value + '').trim()}"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</a-spin>
|
||||
</j-modal>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
import pick from 'lodash.pick'
|
||||
import { httpAction } from '@api/manage'
|
||||
import CompanySelect from '@comp/company/CompanySelect'
|
||||
import {postcode,phoneReg,isEmail} from '@/utils/validate'
|
||||
import {duplicateCheck} from '@api/api'
|
||||
import {queryContactByName} from '@api/incomePaymentsApi'
|
||||
|
||||
export default {
|
||||
name: 'ContactManagementModule',
|
||||
components: { CompanySelect },
|
||||
props: {
|
||||
// 是否可以选择企业 true--不可选；false--可选
|
||||
isCompanyDisabled: {
|
||||
type: Boolean,
|
||||
required: false,
|
||||
default: false
|
||||
},
|
||||
// 已选中的企业信息，只有isCompanyDisabled为true时该属性才能生效
|
||||
selectedCompany: {
|
||||
type: Object,
|
||||
required: false,
|
||||
default: () => {
|
||||
return {}
|
||||
}
|
||||
},
|
||||
// 数据来源，用于给后端接口传值，1--管理端，2--报名
|
||||
dataForm: {
|
||||
type: Number,
|
||||
required: false,
|
||||
default: 1
|
||||
},
|
||||
// 是否报名新增，用于给后端接口传值，1--是，2--否
|
||||
applyAdd: {
|
||||
type: Number,
|
||||
required: false,
|
||||
default: 0
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
title: '操作',
|
||||
width: 800,
|
||||
visible: false,
|
||||
confirmLoading: false,
|
||||
form: this.$form.createForm(this),
|
||||
model: {},
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 6 }
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 18 }
|
||||
},
|
||||
remarksLabelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 3 }
|
||||
},
|
||||
remarksWrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 21 }
|
||||
},
|
||||
url: {
|
||||
add: '/company/payContactsManagement/add',
|
||||
edit: '/company/payContactsManagement/edit'
|
||||
},
|
||||
validatorRules: {
|
||||
company: {
|
||||
rules: [{ required: true, validator: this.checkCompany }],
|
||||
validateTrigger: 'change'
|
||||
},
|
||||
name: {
|
||||
rules: [{ required: true, validator: this.checkName }],
|
||||
validateTrigger: 'blur'
|
||||
},
|
||||
phone: {
|
||||
rules: [{ required: true, validator: this.checkPhone }],
|
||||
validateTrigger: 'blur'
|
||||
},
|
||||
email: {
|
||||
rules: [{ required: true, validator: this.checkMail }],
|
||||
validateTrigger: 'blur'
|
||||
},
|
||||
postalCode: {
|
||||
rules: [{ required: true, validator: this.checkPostcode }],
|
||||
validateTrigger: 'blur'
|
||||
},
|
||||
contactAddress: {
|
||||
rules: [{ required: true, message: '请输入通讯地址' }],
|
||||
validateTrigger: 'blur'
|
||||
}
|
||||
},
|
||||
selectedCompanyId: null // 当前选择企业的id
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
add(limit) {
|
||||
// true 是调用无权限接口
|
||||
if (limit) {
|
||||
this.url.add = '/company/payContactsManagement/addMeeting'
|
||||
} else {
|
||||
this.url.add = '/company/payContactsManagement/add'
|
||||
}
|
||||
this.edit({})
|
||||
if (this.isCompanyDisabled) {
|
||||
let company = {
|
||||
company: this.selectedCompany
|
||||
}
|
||||
this.model = Object.assign({}, company)
|
||||
this.$nextTick(() => {
|
||||
this.form.setFieldsValue(pick(this.model, 'company'))
|
||||
})
|
||||
}
|
||||
},
|
||||
edit(record) {
|
||||
let company = {
|
||||
id: record.companyId,
|
||||
companyName: record.companyName
|
||||
}
|
||||
record.company = company
|
||||
this.form.resetFields()
|
||||
this.model = Object.assign({}, record)
|
||||
this.visible = true
|
||||
this.$nextTick(() => {
|
||||
this.form.setFieldsValue(pick(this.model, 'company', 'name', 'gender', 'post', 'phone', 'email', 'contactAddress', 'postalCode', 'remarks'))
|
||||
})
|
||||
},
|
||||
close() {
|
||||
this.$emit('close')
|
||||
this.visible = false
|
||||
},
|
||||
handleOk() {
|
||||
if (this.confirmLoading) {
|
||||
return
|
||||
}
|
||||
this.confirmLoading = true
|
||||
const that = this
|
||||
// 触发表单验证
|
||||
this.form.validateFields((err, values) => {
|
||||
if (!err) {
|
||||
// 处理企业名称和id等信息
|
||||
values.companyName = values.company.companyName
|
||||
values.companyId = values.company.id
|
||||
if (values.gender === undefined) {
|
||||
values.gender = null
|
||||
}
|
||||
// values.dataSource = this.dataForm
|
||||
// values.signingUp = this.applyAdd
|
||||
let httpurl = ''
|
||||
let method = 'post'
|
||||
if (!this.model.id) {
|
||||
httpurl += this.url.add
|
||||
} else {
|
||||
httpurl += this.url.edit
|
||||
}
|
||||
const formData = Object.assign(this.model, values)
|
||||
console.log('表单提交数据', formData)
|
||||
httpAction(httpurl, formData, method).then((res) => {
|
||||
if (res.success) {
|
||||
that.$message.success(res.message)
|
||||
that.$emit('ok', res.result.id)
|
||||
that.close()
|
||||
} else {
|
||||
that.$message.warning(res.message)
|
||||
}
|
||||
}).finally(() => {
|
||||
setTimeout(() => {
|
||||
this.confirmLoading = false
|
||||
}, 1000)
|
||||
})
|
||||
} else {
|
||||
this.confirmLoading = false
|
||||
}
|
||||
})
|
||||
},
|
||||
handleCancel() {
|
||||
this.close()
|
||||
},
|
||||
/**
|
||||
* 企业修改，获取当前企业的信息，用于联系人姓名验重
|
||||
* @param value
|
||||
*/
|
||||
companyChange(value) {
|
||||
this.selectedCompanyId = value.id
|
||||
},
|
||||
/**
|
||||
* 企业必填校验
|
||||
* @param rules
|
||||
* @param value
|
||||
* @param callback
|
||||
*/
|
||||
checkCompany(rules, value, callback) {
|
||||
console.log('---check---', value)
|
||||
if (value.id && value.companyName) {
|
||||
callback()
|
||||
return
|
||||
}
|
||||
callback('请选择企业')
|
||||
},
|
||||
/**
|
||||
* 联系人姓名重复校验
|
||||
* @param rules
|
||||
* @param value
|
||||
* @param callback
|
||||
*/
|
||||
checkName(rules, value, callback) {
|
||||
let company = this.form.getFieldValue('company')
|
||||
if (!value) {
|
||||
callback('请输入姓名')
|
||||
return
|
||||
}
|
||||
if (!company.id) {
|
||||
callback('请先选择企业再输入姓名')
|
||||
return
|
||||
}
|
||||
// 是否编辑
|
||||
if (this.model.id) {
|
||||
// 编辑前后姓名是否一致，一致则不进行验重
|
||||
if (value === this.model.name) {
|
||||
callback()
|
||||
return
|
||||
}
|
||||
this.selectedCompanyId = this.model.company.id
|
||||
}
|
||||
if (this.isCompanyDisabled) {
|
||||
this.selectedCompanyId = this.selectedCompany.id
|
||||
}
|
||||
let param = {
|
||||
companyId: this.selectedCompanyId,
|
||||
name: value
|
||||
}
|
||||
queryContactByName(param).then(res => {
|
||||
if (res.success) {
|
||||
callback()
|
||||
} else {
|
||||
callback(res.message)
|
||||
}
|
||||
})
|
||||
|
||||
},
|
||||
/**
|
||||
* 手机号校验
|
||||
* @param rules
|
||||
* @param value
|
||||
* @param callback
|
||||
*/
|
||||
checkPhone(rules, value, callback) {
|
||||
if (value) {
|
||||
if (phoneReg(value)) {
|
||||
// 是否编辑
|
||||
if (this.model.id) {
|
||||
// 编辑前后手机号是否一致，一致则不进行验重
|
||||
if (value === this.model.phone) {
|
||||
callback()
|
||||
return
|
||||
}
|
||||
}
|
||||
const param = {
|
||||
confusionCode: 'pay_contacts_management_phone',
|
||||
fieldVal: value,
|
||||
encrypt: 1
|
||||
}
|
||||
// 唯一性校验
|
||||
duplicateCheck(param).then(res => {
|
||||
if (res.success) {
|
||||
callback()
|
||||
} else {
|
||||
callback('手机号已存在')
|
||||
}
|
||||
})
|
||||
return
|
||||
}
|
||||
callback('请输入正确的手机号')
|
||||
}
|
||||
callback('请输入手机号')
|
||||
},
|
||||
/**
|
||||
* 邮箱校验
|
||||
* @param rules
|
||||
* @param value
|
||||
* @param callback
|
||||
*/
|
||||
checkMail(rules, value, callback) {
|
||||
if (value) {
|
||||
if (isEmail(value)) {
|
||||
callback()
|
||||
} else {
|
||||
callback('请输入正确格式的邮箱')
|
||||
}
|
||||
}
|
||||
callback('请输入邮箱')
|
||||
},
|
||||
/**
|
||||
* 邮政编码校验
|
||||
* @param rules
|
||||
* @param value
|
||||
* @param callback
|
||||
*/
|
||||
checkPostcode(rules, value, callback) {
|
||||
if (value) {
|
||||
if (postcode(value)) {
|
||||
callback()
|
||||
} else {
|
||||
callback('请输入正确格式的邮政编码')
|
||||
}
|
||||
}
|
||||
callback('请输入邮政编码')
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.form-item-postcode {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.search-postcode {
|
||||
color: #0090ff;
|
||||
|
||||
&:hover {
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,215 @@
|
||||
<template>
|
||||
<!-- 在点击组件时获取联系人列表-->
|
||||
<div>
|
||||
<a-row>
|
||||
<a-col :span="20">
|
||||
<a-select :value="value"
|
||||
v-bind="$attrs"
|
||||
v-on="$listeners"
|
||||
show-search
|
||||
allowClear
|
||||
option-filter-prop="children"
|
||||
:filter-option="filterOption"
|
||||
@dropdownVisibleChange="handleDropdownOpen">
|
||||
<a-select-option v-for="item in contactsList" :key="item.id" :value="item.id">{{ item.name }}</a-select-option>
|
||||
</a-select>
|
||||
</a-col>
|
||||
<a-col :span="4" class="form-btn">
|
||||
<a-button icon="plus" v-bind="$attrs" @click="addContacts"></a-button>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<contact-management-module ref="contactForm"
|
||||
is-company-disabled
|
||||
:selected-company="selectedCompany"
|
||||
@ok="addContactsOk">
|
||||
</contact-management-module>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import ContactManagementModule from '@comp/company/ContactManagementModule'
|
||||
import {getContactsByCompany,getContactsByCompanyNoLimit} from '@api/incomePaymentsApi'
|
||||
|
||||
export default {
|
||||
name: 'SelectContacts',
|
||||
components: { ContactManagementModule },
|
||||
props: {
|
||||
// 已选中的企业信息
|
||||
selectedCompany: {
|
||||
type: Object,
|
||||
required: false,
|
||||
default: () => {
|
||||
return {}
|
||||
}
|
||||
},
|
||||
// 编辑时回显的数据, 需要id，name两个字段
|
||||
initContacts: {
|
||||
type: Object,
|
||||
required: false,
|
||||
default: () => {
|
||||
return {}
|
||||
}
|
||||
},
|
||||
value: {
|
||||
type: [String, Object],
|
||||
required: false,
|
||||
default: undefined
|
||||
},
|
||||
// 取消时将isCancel设为true，用于重置是否为第一次展开下拉
|
||||
isCancel: {
|
||||
type: Boolean,
|
||||
required: false,
|
||||
default: false
|
||||
},
|
||||
// value的类型
|
||||
valueType: {
|
||||
type: String,
|
||||
required: false,
|
||||
default: 'string'
|
||||
},
|
||||
// 是否调用无权限接口
|
||||
isLimit: {
|
||||
type: Boolean,
|
||||
required: false,
|
||||
default: false
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
contactsList: [], // 该企业下联系人列表
|
||||
isFirstOpen: true, // 编辑状态下是否为第一次打开
|
||||
contactId: this.value
|
||||
}
|
||||
},
|
||||
created() {
|
||||
// this.initContacts = null
|
||||
this.contactsList = []
|
||||
// 编辑 第一次不回显的问题
|
||||
this.getContactsList()
|
||||
},
|
||||
watch: {
|
||||
/**
|
||||
* 选中企业发生变化时重新获取数据
|
||||
*/
|
||||
selectedCompany: {
|
||||
handler() {
|
||||
this.getContactsList()
|
||||
},
|
||||
deep: true
|
||||
},
|
||||
/**
|
||||
* 编辑联系人变化
|
||||
*/
|
||||
initContacts: {
|
||||
handler() {
|
||||
this.isFirstOpen = true
|
||||
},
|
||||
deep: true
|
||||
},
|
||||
isCancel(val) {
|
||||
if (val) {
|
||||
this.isFirstOpen = true
|
||||
// 取消时重新获取联系人列表，将临时联系人信息加入列表中
|
||||
this.getContactsList()
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
/**
|
||||
* 获取联系人数据
|
||||
*/
|
||||
getContactsList() {
|
||||
let params = {}
|
||||
if (this.selectedCompany && this.selectedCompany.id) {
|
||||
params.companyId = this.selectedCompany.id
|
||||
} else {
|
||||
params.companyId = null
|
||||
}
|
||||
// 是否调用无权限接口
|
||||
if (this.isLimit) {
|
||||
// 调用无权限接口
|
||||
return new Promise(resolve => {
|
||||
getContactsByCompanyNoLimit(params).then(res => {
|
||||
this.contactsList = res.result
|
||||
if (this.initContacts && this.initContacts.id) {
|
||||
this.contactsList.push(this.initContacts)
|
||||
}
|
||||
resolve()
|
||||
})
|
||||
})
|
||||
} else {
|
||||
return new Promise(resolve => {
|
||||
getContactsByCompany(params).then(res => {
|
||||
this.contactsList = res.result || []
|
||||
if (this.initContacts && this.initContacts.id) {
|
||||
this.contactsList.push(this.initContacts)
|
||||
}
|
||||
resolve()
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
},
|
||||
/**
|
||||
* 新建联系人
|
||||
*/
|
||||
addContacts() {
|
||||
if (this.selectedCompany && Object.keys(this.selectedCompany).length > 0 && this.selectedCompany.id) {
|
||||
// 传入是否调用无权限接口的参数 去判断
|
||||
this.$refs.contactForm.add(this.isLimit)
|
||||
this.$refs.contactForm.title = '新增'
|
||||
this.$refs.contactForm.disableSubmit = false
|
||||
return
|
||||
}
|
||||
// 调用无权限的提示语修改
|
||||
this.$message.warn('请先选择企业再为该企业新建联系人')
|
||||
},
|
||||
addContactsOk(id) {
|
||||
this.getContactsList().then(() => {
|
||||
if (this.valueType === 'object') {
|
||||
let objContact = this.contactsList.filter(tt => tt.id === id)
|
||||
objContact = objContact[0]
|
||||
objContact.label = objContact.name
|
||||
objContact.key = objContact.id
|
||||
this.$emit('change', objContact)
|
||||
} else {
|
||||
this.$emit('change', id)
|
||||
}
|
||||
this.$emit('ok')
|
||||
})
|
||||
},
|
||||
// 下拉框的搜索
|
||||
filterOption(input, option) {
|
||||
return (
|
||||
option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
|
||||
)
|
||||
},
|
||||
/**
|
||||
* 第一次展开下拉，去掉和初始联系人一样的联系人
|
||||
*/
|
||||
handleDropdownOpen() {
|
||||
if (this.isFirstOpen && this.initContacts && this.initContacts.id) {
|
||||
this.contactsList.forEach((item, index) => {
|
||||
if (item.id === this.initContacts.id) {
|
||||
this.$emit('change', undefined)
|
||||
this.contactsList.splice(index, 1)
|
||||
}
|
||||
})
|
||||
this.isFirstOpen = false
|
||||
}
|
||||
}
|
||||
},
|
||||
model: {
|
||||
prop: 'value',
|
||||
event: 'change'
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.form-btn {
|
||||
padding-top: 1px;
|
||||
padding-left: 8px;
|
||||
margin-bottom: -1px;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,67 @@
|
||||
<template>
|
||||
<a-select :value="value"
|
||||
v-bind="$attrs"
|
||||
v-on="$listeners"
|
||||
show-search
|
||||
allowClear
|
||||
option-filter-prop="children"
|
||||
:filter-option="filterOption">
|
||||
<a-select-option v-for="item in userList" :key="item.id" :value="item.id">
|
||||
{{ `${ item.realname }(${ item.orgCodeTxt })` }}
|
||||
</a-select-option>
|
||||
</a-select>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// import { getAllUserList } from '@api/api'
|
||||
import {getAllUserList} from '@api/incomePaymentsApi'
|
||||
|
||||
export default {
|
||||
name: 'SelectPrincipal',
|
||||
props: {
|
||||
// 绑定值为用户id
|
||||
value: {
|
||||
type: String,
|
||||
required: false,
|
||||
default: undefined
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
userList: [] // 用户列表
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.initUserList()
|
||||
},
|
||||
methods: {
|
||||
/**
|
||||
* 获取所有用户
|
||||
*/
|
||||
initUserList() {
|
||||
getAllUserList().then(res => {
|
||||
if (res.success) {
|
||||
this.userList = res.result
|
||||
} else {
|
||||
this.$message.warn(res.message)
|
||||
}
|
||||
})
|
||||
},
|
||||
// 下拉框的搜索
|
||||
filterOption(input, option) {
|
||||
console.log(option)
|
||||
return (
|
||||
option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
|
||||
)
|
||||
}
|
||||
},
|
||||
model: {
|
||||
prop: 'value',
|
||||
event: 'change'
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
@@ -2,6 +2,7 @@
|
||||
<div>
|
||||
<!--YYYY-MM-DD HH:mm:ss-->
|
||||
<a-date-picker
|
||||
style="width: 100%"
|
||||
v-if="showType === 'time'"
|
||||
dropdownClassName="j-date-picker"
|
||||
:disabled="disabled || readOnly"
|
||||
@@ -16,6 +17,7 @@
|
||||
</a-date-picker>
|
||||
<!--YYYY-MM-DD-->
|
||||
<a-date-picker
|
||||
style="width: 100%"
|
||||
v-if="showType === 'day'"
|
||||
dropdownClassName="j-date-picker"
|
||||
:disabled="disabled || readOnly"
|
||||
@@ -30,6 +32,7 @@
|
||||
</a-date-picker>
|
||||
<!--YYYY-MM-->
|
||||
<a-month-picker
|
||||
style="width: 100%"
|
||||
v-if="showType === 'month'"
|
||||
:placeholder="placeholder"
|
||||
:value="momVal"
|
||||
|
||||
@@ -0,0 +1,539 @@
|
||||
<template>
|
||||
<div :id="containerId" style="position: relative">
|
||||
<a-upload
|
||||
name="file"
|
||||
:action="uploadAction"
|
||||
:headers="headers"
|
||||
:data="{'biz':bizPath}"
|
||||
:fileList="fileList"
|
||||
:beforeUpload="beforeUpload"
|
||||
@change="handleChange"
|
||||
:disabled="disabled"
|
||||
:returnUrl="returnUrl"
|
||||
:listType="complistType"
|
||||
@preview="handlePreview"
|
||||
v-bind="$attrs"
|
||||
v-on="childListeners"
|
||||
:class="{'uploadty-disabled':disabled}">
|
||||
<template>
|
||||
<div v-if="isImageComp">
|
||||
<a-icon type="plus"/>
|
||||
<div class="ant-upload-text">{{ text }}</div>
|
||||
</div>
|
||||
<a-button v-else-if="buttonVisible">
|
||||
<a-icon type="upload"/>
|
||||
{{ text }}
|
||||
</a-button>
|
||||
</template>
|
||||
</a-upload>
|
||||
<!-- :show-upload-list="showUploadList"-->
|
||||
<!-- 增加上传文件的下载和查看的按钮，主要思想是生成相应的元素，用定位的思想定位到原来的文件列表中 -->
|
||||
<template v-if="showOtherIcon">
|
||||
<div class="file-list-html">
|
||||
<template v-for="(item,index) in fileList">
|
||||
<div :key="index" class="file-item" :class="{'show': item.status === 'done'}">
|
||||
<span class="file-item-btn" @click.prevent.stop="myDownload(item)">
|
||||
<a-icon type="download" />
|
||||
下载
|
||||
</span>
|
||||
<span class="file-item-btn" @click.prevent.stop="myPreview(item)">
|
||||
<a-icon type="eye" />
|
||||
查看
|
||||
</span>
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
|
||||
</template>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
import Vue from 'vue'
|
||||
import {ACCESS_TOKEN} from '@/store/mutation-types'
|
||||
import {getFileAccessHttpUrl, downloadFile} from '@/api/manage'
|
||||
import {getFileInfo} from '@/api/api'
|
||||
|
||||
// eslint-disable-next-line no-undef
|
||||
// const Base64 = require('js-base64').Base64
|
||||
|
||||
const FILE_TYPE_ALL = 'all'
|
||||
const FILE_TYPE_IMG = 'image'
|
||||
// const FILE_TYPE_TXT = 'file'
|
||||
const uidGenerator = () => {
|
||||
return '-' + parseInt(Math.random() * 10000 + 1, 10)
|
||||
}
|
||||
export default {
|
||||
name: 'JUpload',
|
||||
data() {
|
||||
return {
|
||||
uploadAction: window._CONFIG['domianURL'] + '/sys/common/upload',
|
||||
headers: {},
|
||||
fileList: [],
|
||||
newFileList: [],
|
||||
uploadGoOn: true,
|
||||
fileTypes: this.fileType
|
||||
}
|
||||
},
|
||||
props: {
|
||||
text: {
|
||||
type: String,
|
||||
required: false,
|
||||
default: '点击上传'
|
||||
},
|
||||
fileType: {
|
||||
type: String,
|
||||
required: false,
|
||||
default: FILE_TYPE_ALL
|
||||
},
|
||||
/*这个属性用于控制文件上传的业务路径*/
|
||||
bizPath: {
|
||||
type: String,
|
||||
required: false,
|
||||
default: 'temp'
|
||||
},
|
||||
value: {
|
||||
type: [String, Array],
|
||||
required: false
|
||||
},
|
||||
// update-begin- --- author:wangshuai ------ date:20190929 ---- for:Jupload组件增加是否能够点击
|
||||
disabled: {
|
||||
type: Boolean,
|
||||
required: false,
|
||||
default: false
|
||||
},
|
||||
// update-end- --- author:wangshuai ------ date:20190929 ---- for:Jupload组件增加是否能够点击
|
||||
//此属性被废弃了
|
||||
triggerChange: {
|
||||
type: Boolean,
|
||||
required: false,
|
||||
default: false
|
||||
},
|
||||
/**
|
||||
* update -- author:lvdandan -- date:20190219 -- for:Jupload组件增加是否返回url，
|
||||
* true：仅返回url
|
||||
* false：返回fileName filePath fileSize
|
||||
*/
|
||||
returnUrl: {
|
||||
type: Boolean,
|
||||
required: false,
|
||||
default: true
|
||||
},
|
||||
/**
|
||||
* 仅返回文件id
|
||||
* true 仅返回文件id
|
||||
* false 返回reurl
|
||||
* */
|
||||
returnId: {
|
||||
type: Boolean,
|
||||
required: false,
|
||||
default: false
|
||||
},
|
||||
number: {
|
||||
type: Number,
|
||||
required: false,
|
||||
default: 0
|
||||
},
|
||||
buttonVisible: {
|
||||
type: Boolean,
|
||||
required: false,
|
||||
default: true
|
||||
},
|
||||
/**
|
||||
* 是否显示下载和查看按钮
|
||||
**/
|
||||
showOtherIcon: {
|
||||
type: Boolean,
|
||||
required: false,
|
||||
default: true
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
value: {
|
||||
immediate: true,
|
||||
handler() {
|
||||
let val = this.value
|
||||
if (val instanceof Array) {
|
||||
if (this.returnUrl) {
|
||||
this.initFileList(val.join(','))
|
||||
} else {
|
||||
this.initFileListArr(val)
|
||||
}
|
||||
} else {
|
||||
this.initFileList(val)
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
//透传给下级组件的事件，需要排除本组件使用的change事件
|
||||
childListeners() {
|
||||
// const vm = this
|
||||
let result = Object.assign({},
|
||||
this.$listeners,
|
||||
)
|
||||
delete result.change
|
||||
return result
|
||||
},
|
||||
isImageComp() {
|
||||
return this.fileType === FILE_TYPE_IMG
|
||||
},
|
||||
complistType() {
|
||||
return this.fileType === FILE_TYPE_IMG ? 'picture-card' : 'text'
|
||||
},
|
||||
},
|
||||
created() {
|
||||
const token = Vue.ls.get(ACCESS_TOKEN)
|
||||
//---------------------------- begin 图片左右换位置 -------------------------------------
|
||||
this.headers = {'X-Access-Token': token}
|
||||
this.containerId = 'container-ty-' + new Date().getTime()
|
||||
//---------------------------- end 图片左右换位置 -------------------------------------
|
||||
},
|
||||
methods: {
|
||||
initFileListArr(val) {
|
||||
if (!val || val.length === 0) {
|
||||
this.fileList = []
|
||||
return
|
||||
}
|
||||
for (let a = 0; a < val.length; a++) {
|
||||
this.fileList.forEach((item) => {
|
||||
if (item.url === val[a]) {
|
||||
item.uid = uidGenerator()
|
||||
item.response.status = 'done'
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
async initFileList(paths) {
|
||||
if (!paths || paths.length === 0) {
|
||||
this.fileList = []
|
||||
return
|
||||
}
|
||||
let arr = paths.split(',')
|
||||
// 返回路径的时候,对路径进行操作,取出所属id
|
||||
if (!this.returnId && arr.length > 0) {
|
||||
const newArr = []
|
||||
arr.map(item => {
|
||||
let itemArr = item.split('/')
|
||||
newArr.push(itemArr[itemArr.length - 1])
|
||||
})
|
||||
arr = newArr
|
||||
}
|
||||
const fileList = []
|
||||
for (let a = 0; a < arr.length; a++) {
|
||||
// 获取每一个文件的信息，组成fileList
|
||||
// 突然想判断现在的fileList 中是否是历史的信息，如果是的话则先进行匹配
|
||||
let isHistory = this.fileList.find(file => file.response.status === 'history' && (file.response.result || {}).id === arr[a])
|
||||
console.log('isHistory===', isHistory)
|
||||
if (isHistory) {
|
||||
fileList.push(isHistory)
|
||||
} else {
|
||||
const fileObj = await this.getFileInfo(arr[a])
|
||||
const url = getFileAccessHttpUrl(arr[a])
|
||||
fileList.push({
|
||||
uid: uidGenerator(),
|
||||
name: (fileObj || {}).fileName,
|
||||
status: 'done',
|
||||
url: url,
|
||||
response: {
|
||||
status: 'history',
|
||||
message: arr[a],
|
||||
result: fileObj
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
this.fileList = [...fileList]
|
||||
this.showOtherIcon && this.actionsClass()
|
||||
},
|
||||
handlePathChange() {
|
||||
let uploadFiles = this.fileList
|
||||
let path = ''
|
||||
// 文件id
|
||||
let fileIds = ''
|
||||
if (!uploadFiles || uploadFiles.length === 0) {
|
||||
path = ''
|
||||
}
|
||||
let arr = []
|
||||
// 如果returnid为true 只返回id
|
||||
if (this.returnId) {
|
||||
for (let a = 0; a < uploadFiles.length; a++) {
|
||||
if (uploadFiles[a].status === 'done') {
|
||||
arr.push(uploadFiles[a].response.result.id)
|
||||
} else {
|
||||
return
|
||||
}
|
||||
}
|
||||
if (arr.length > 0) {
|
||||
fileIds = arr.join(',')
|
||||
}
|
||||
this.$emit('change', fileIds)
|
||||
return
|
||||
}
|
||||
|
||||
for (let a = 0; a < uploadFiles.length; a++) {
|
||||
if (uploadFiles[a].status === 'done') {
|
||||
arr.push(uploadFiles[a].url)
|
||||
} else {
|
||||
return
|
||||
}
|
||||
}
|
||||
if (arr.length > 0) {
|
||||
path = arr.join(',')
|
||||
}
|
||||
this.$emit('change', path)
|
||||
},
|
||||
beforeUpload(file) {
|
||||
this.uploadGoOn = true
|
||||
file.uploadGoOn = true
|
||||
const fileSize = file.size // 上传的文件大小
|
||||
const fileType = file.type // 上传的文件类型
|
||||
if (fileSize > 1024 * 1024 * 50) {
|
||||
this.$message.warning('文件大小限制为50M')
|
||||
this.uploadGoOn = false
|
||||
file.uploadGoOn = false
|
||||
return false
|
||||
}
|
||||
// 不等于全部类型可以上传的时候，对上传的文件进行判断
|
||||
if (this.fileType !== FILE_TYPE_ALL) {
|
||||
// filter(tt => fileType.indexOf(tt) > -1) 判断用户传的文件类型，和要求传的文件类型是否一致
|
||||
// 当上传的图片格式为jpg时，在此组件中，会返回类型为 image/jpeg ElememntUI设计如此 所以需要把用户传下来的jpg强制改成jpeg
|
||||
this.fileTypes = this.fileTypes.replace('jpg', 'jpeg')
|
||||
const arr = this.fileTypes.split(',').filter(tt => fileType.indexOf(tt) > -1)
|
||||
if (arr.length === 0) {
|
||||
this.$message.warning(this.fileTypeErrorMessage || `请上传${this.fileTypes}文件`)
|
||||
this.uploadGoOn = false
|
||||
file.uploadGoOn = false
|
||||
return false
|
||||
}
|
||||
}
|
||||
if (this.fileTypes === FILE_TYPE_IMG) {
|
||||
if (fileType.indexOf('image') < 0) {
|
||||
this.$message.warning('请上传图片')
|
||||
this.uploadGoOn = false
|
||||
file.uploadGoOn = false
|
||||
return false
|
||||
}
|
||||
}
|
||||
// TODO 扩展功能验证文件大小
|
||||
return true
|
||||
},
|
||||
handleChange(info) {
|
||||
if (!info.file.status && this.uploadGoOn === false) {
|
||||
info.fileList.pop()
|
||||
}
|
||||
let fileList = info.fileList
|
||||
if (info.file.status === 'done') {
|
||||
if (this.number > 0) {
|
||||
fileList = fileList.slice(-this.number)
|
||||
}
|
||||
if (info.file.response.success) {
|
||||
fileList = fileList.map((file) => {
|
||||
if (file.response) {
|
||||
// let reUrl = `${file.response.result.id}?token=${Vue.ls.get(ACCESS_TOKEN)}&fullfilename=${file.response.result.fileName}`;
|
||||
file.url = getFileAccessHttpUrl(file.response.result.id)
|
||||
}
|
||||
return file
|
||||
})
|
||||
}else{
|
||||
info.fileList.pop()
|
||||
this.uploadGoOn = false
|
||||
this.$message.warn(info.file.response.message)
|
||||
}
|
||||
//this.$message.success(`${info.file.name} 上传成功!`);
|
||||
} else if (info.file.status === 'error') {
|
||||
this.$message.error(`${info.file.name} 上传失败.`)
|
||||
} else if (info.file.status === 'removed') {
|
||||
this.handleDelete(info.file)
|
||||
}
|
||||
this.fileList = fileList
|
||||
if (info.file.status === 'done' || info.file.status === 'removed') {
|
||||
//returnUrl为true时仅返回文件路径
|
||||
if (this.returnUrl) {
|
||||
this.handlePathChange()
|
||||
} else {
|
||||
//returnUrl为false时返回文件名称、文件路径及文件大小
|
||||
this.newFileList = []
|
||||
for (let a = 0; a < fileList.length; a++) {
|
||||
// update-begin-author:lvdandan date:20200603 for:【TESTA-514】【开源issue】多个文件同时上传时，控制台报错
|
||||
if (fileList[a].status === 'done') {
|
||||
let fileJson = {
|
||||
fileName: fileList[a].name,
|
||||
filePath: fileList[a].url,
|
||||
fileSize: fileList[a].size
|
||||
}
|
||||
this.newFileList.push(fileJson)
|
||||
} else {
|
||||
return
|
||||
}
|
||||
// update-end-author:lvdandan date:20200603 for:【TESTA-514】【开源issue】多个文件同时上传时，控制台报错
|
||||
}
|
||||
this.$emit('change', this.newFileList)
|
||||
}
|
||||
}
|
||||
},
|
||||
handleDelete(file) {
|
||||
//如有需要新增 删除逻辑
|
||||
console.log(file)
|
||||
},
|
||||
handlePreview(file) {
|
||||
if (this.showOtherIcon) {
|
||||
return
|
||||
}
|
||||
// eslint-disable-next-line no-unreachable
|
||||
if (file && file.url) {
|
||||
const fileFullUrl = `${window._CONFIG['domianWebSocketURL']}/sys/common/download/${file.response.result.id}?token=${Vue.ls.get(ACCESS_TOKEN)}&fullfilename=${file.name}`
|
||||
let url = `${window._CONFIG['onlinePreviewDomainURL']}?url=${encodeURIComponent(fileFullUrl)}`
|
||||
// let url = `${window._CONFIG['onlinePreviewDomainURL']}?url=${encodeURIComponent(fileFullUrl)}`
|
||||
window.open(url)
|
||||
}
|
||||
},
|
||||
getFileUrl(fileId) {
|
||||
return `${window._CONFIG['domianURL']}/sys/common/download/${fileId}`
|
||||
},
|
||||
/**
|
||||
* 通过文件的id获取文件的相关信息
|
||||
* @param id
|
||||
*/
|
||||
getFileInfo(id) {
|
||||
return new Promise(resolve => {
|
||||
let result = {}
|
||||
getFileInfo({id: id}).then(res => {
|
||||
if (res.success) {
|
||||
result = res.result
|
||||
}
|
||||
}).finally(() => {
|
||||
resolve(result)
|
||||
})
|
||||
})
|
||||
},
|
||||
// 修改删除按钮的样式，增加文字说明
|
||||
actionsClass(){
|
||||
this.$nextTick(()=>{
|
||||
let content = document.getElementsByClassName('ant-upload-list-item-card-actions')
|
||||
for (let i = 0; i < content.length; i++) {
|
||||
if ( content[i].childNodes.length > 0){
|
||||
// content[i].innerHTML = '<a-icon type="delete" />'
|
||||
content[i].childNodes[0].childNodes[0].innerHTML = ' <svg class="delete-icon" viewBox=\'64 64 896 896\' data-icon=\'delete\' width=\'1em\' height=\'1em\' fill=\'currentColor\'\n' +
|
||||
' aria-hidden=\'true\' focusable=\'false\' className=\'\'>\n' +
|
||||
' <path\n' +
|
||||
' d=\'M360 184h-8c4.4 0 8-3.6 8-8v8h304v-8c0 4.4 3.6 8 8 8h-8v72h72v-80c0-35.3-28.7-64-64-64H352c-35.3 0-64 28.7-64 64v80h72v-72zm504 72H160c-17.7 0-32 14.3-32 32v32c0 4.4 3.6 8 8 8h60.4l24.7 523c1.6 34.1 29.8 61 63.9 61h454c34.2 0 62.3-26.8 63.9-61l24.7-523H888c4.4 0 8-3.6 8-8v-32c0-17.7-14.3-32-32-32zM731.3 840H292.7l-24.2-512h487l-24.2 512z\'></path>\n' +
|
||||
' </svg><span class="delete-span">删除</span>'
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
/**
|
||||
* 单个文件的下载功能
|
||||
* @param file
|
||||
*/
|
||||
myDownload(file) {
|
||||
downloadFile(`sys/common/download/${file.response.result.id}`, file.name)
|
||||
},
|
||||
/**
|
||||
* 单个文件的预览功能
|
||||
* @param file
|
||||
*/
|
||||
myPreview(file) {
|
||||
if (file && file.url) {
|
||||
const fileFullUrl = `${window._CONFIG['domianWebSocketURL']}/sys/common/download/${file.response.result.id}?token=${Vue.ls.get(ACCESS_TOKEN)}&fullfilename=${file.name}`
|
||||
let url = `${window._CONFIG['onlinePreviewDomainURL']}?url=${encodeURIComponent(fileFullUrl)}`
|
||||
// let url = `${window._CONFIG['onlinePreviewDomainURL']}?url=${encodeURIComponent(fileFullUrl)}`
|
||||
window.open(url)
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
},
|
||||
model: {
|
||||
prop: 'value',
|
||||
event: 'change'
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.uploadty-disabled {
|
||||
/deep/.ant-upload-list-item {
|
||||
.anticon-close {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.anticon-delete {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
// 新增的文件操作按钮的样式
|
||||
/deep/.file-list-html{
|
||||
position: absolute!important;
|
||||
top: 45px!important;
|
||||
right: 60px!important;
|
||||
height: auto!important;
|
||||
z-index:2!important;
|
||||
}
|
||||
|
||||
|
||||
/deep/.file-item {
|
||||
height: 30px;
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
transition: opacity 1s;
|
||||
opacity: 0;
|
||||
&.show{
|
||||
opacity: 1;
|
||||
transition: opacity 2s;
|
||||
}
|
||||
& > span {
|
||||
vertical-align: middle;
|
||||
}
|
||||
.file-item-btn {
|
||||
display: inline-block;
|
||||
margin-left: 10px;
|
||||
color: #808080;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// 左侧文件名称的样式
|
||||
/deep/.ant-upload-list-item-name{
|
||||
width: calc(100% - 150px) !important;
|
||||
height: 23px !important;
|
||||
text-align: left;
|
||||
line-height: 23px;
|
||||
padding-right: 10px !important;
|
||||
text-overflow: ellipsis !important;
|
||||
overflow: hidden !important;
|
||||
white-space: nowrap !important;
|
||||
}
|
||||
// 删除按钮的样式
|
||||
/deep/.ant-upload-list-item-card-actions{
|
||||
opacity: 1!important;
|
||||
color: #808080;
|
||||
cursor: pointer!important;
|
||||
}
|
||||
// 删除按钮 样式的修改
|
||||
/deep/.delete-icon,
|
||||
/deep/.delete-span{
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
margin-top: -4px;
|
||||
cursor: pointer!important;
|
||||
color: #808080;
|
||||
}
|
||||
|
||||
// 单显hover隐掉
|
||||
/deep/.ant-upload-list-item-info:hover {
|
||||
background: none !important;
|
||||
;
|
||||
}
|
||||
|
||||
/deep/.ant-upload-list-item-name:hover {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
|
||||
</style>
|
||||
@@ -0,0 +1,393 @@
|
||||
<template>
|
||||
<a-form :form="form">
|
||||
<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">
|
||||
<a-radio-group v-decorator="['checkInHotel']">
|
||||
<a-radio :value="1">是</a-radio>
|
||||
<a-radio :value="0">否</a-radio>
|
||||
</a-radio-group>
|
||||
</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="['arrivalTime']" :trigger-change="true" :disabled-date="disabledStartDate"
|
||||
date-format="YYYY-MM-DD"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
|
||||
<a-col :xxl="8" :xl="12" :sm="24">
|
||||
<a-form-item label="离开时间" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
||||
<j-date placeholder="请选择离开时间" :disabled-date="disabledEndDate" style="width: 100%;"
|
||||
v-decorator="['departureTime']" :trigger-change="true"
|
||||
date-format="YYYY-MM-DD"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<!-- 选择嘉宾和内部企业、缴费方式为打包也不显示-->
|
||||
<!-- 会议费为0不显示 -->
|
||||
<template v-if="!meetingCostBool">
|
||||
<div class="item-title" v-if="identifyType === 2">缴费信息</div>
|
||||
<a-row :gutter="24">
|
||||
<a-col :xxl="8" :xl="12" :sm="24" v-if="identifyType === 2">
|
||||
<a-form-item label="缴费方式" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
||||
<a-radio-group v-decorator="['payMode',validatorRules.payMode]" :disabled="isEditBool"
|
||||
@change="changePayMode">
|
||||
<a-radio :value="1">汇款</a-radio>
|
||||
<a-radio :value="2">现场缴费(仅支持扫码支付)</a-radio>
|
||||
<a-radio :value="3">打包</a-radio>
|
||||
</a-radio-group>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<!-- 选择嘉宾和内部企业、缴费方式为打包也不显示-->
|
||||
<a-col :xxl="8" :xl="12" :sm="24" v-if="identifyType === 2 && !payModeBool ">
|
||||
<a-form-item label="需要发票" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
||||
<j-dict-select-tag style="width: 100%" dict-code="invoice_type"
|
||||
v-decorator="['needInvoice',validatorRules.needInvoice]"
|
||||
:trigger-change="true"
|
||||
@change="changeInvoice"
|
||||
:disabled="isEditBool"
|
||||
placeholder="请选择发票类型"></j-dict-select-tag>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<!-- 选择嘉宾和内部企业、缴费方式为打包也不显示-->
|
||||
<!-- <a-col :xxl="8" :xl="12" :sm="24" v-if="identifyType === 2 && !payModeBool ">-->
|
||||
<!-- <a-form-item label="付款凭证" :labelCol="labelCol" :wrapperCol="wrapperCol">-->
|
||||
<!-- <j-image-upload :disabled="isEditBool" v-decorator="['paymentRecord']" :return-id="true"></j-image-upload>-->
|
||||
<!-- </a-form-item>-->
|
||||
<!-- </a-col>-->
|
||||
<!--缴费方式为线上的需要上传 -->
|
||||
<!-- 暂时注释 2021 10 14 author: fac 需求说是 不在报名和添加参会人的时候去上传 缴费凭证和订单后四位-->
|
||||
<!-- <a-col :xxl="8" :xl="12" :sm="24" v-if="onlinePayModeBool">-->
|
||||
<!-- <a-form-item label="订单号后四位" :labelCol="labelCol" :wrapperCol="wrapperCol">-->
|
||||
<!-- <a-input placeholder="请输入订单号后四位"-->
|
||||
<!-- :maxLength='4'-->
|
||||
<!-- :disabled="isEditBool"-->
|
||||
<!-- @change="(e) => {e.target.value = e.target.value.replace(/[^0-9]/g,'')}"-->
|
||||
<!-- v-decorator="[ 'orderCode',validatorRules.orderCode]"></a-input>-->
|
||||
<!-- </a-form-item>-->
|
||||
<!-- </a-col>-->
|
||||
</a-row>
|
||||
</template>
|
||||
<!-- 其他会议选择嘉宾和内部企业、缴费方式为打包也不显示-->
|
||||
<!-- 会议费为0不显示 -->
|
||||
<template v-if="!meetingCostBool && !needInvoiceBool ">
|
||||
<div class="item-title" v-if="identifyType === 2 && !payModeBool ">邮寄信息</div>
|
||||
<a-row :gutter="24">
|
||||
<a-col :xxl="8" :xl="12" :sm="24" v-if="identifyType === 2 && !payModeBool ">
|
||||
<a-form-item label="邮寄联系人" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
||||
<select-contacts :selected-company="selectedCompany"
|
||||
:init-contacts="selectPostPerson"
|
||||
:disabled="isEditBool"
|
||||
:is-limit="true"
|
||||
placeholder="请选择邮寄联系人"
|
||||
v-decorator="['postContactId',validatorRules.postContactId]"
|
||||
:maxLength='50'
|
||||
@change="changePost"
|
||||
ref="selectMailContacts"
|
||||
@ok="addContactsOk"></select-contacts>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<!-- 选择嘉宾和内部企业、缴费方式为打包也不显示-->
|
||||
<a-col :xxl="8" :xl="12" :sm="24" v-if="identifyType === 2 && !payModeBool ">
|
||||
<a-form-item label="邮寄地址" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
||||
<a-input placeholder="请输入邮寄地址"
|
||||
:maxLength='50'
|
||||
:disabled="isEditBool"
|
||||
v-decorator="[ 'postContactAddress',validatorRules.postContactAddress]"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
|
||||
<a-col :xxl="8" :xl="12" :sm="24" v-if="identifyType === 2 && !payModeBool ">
|
||||
<a-form-item label="邮编" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
||||
<a-input placeholder="请输入邮编"
|
||||
:disabled="isEditBool"
|
||||
@change="(e) => {e.target.value = e.target.value.replace(/[^0-9]/g,'')}" :maxLength="6"
|
||||
v-decorator="[ 'postCode',validatorRules.postCode]"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</template>
|
||||
|
||||
|
||||
</a-form>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import JDate from '@comp/jero/JDate'
|
||||
import SelectContacts from '@comp/company/SelectContacts'
|
||||
import pick from 'lodash.pick'
|
||||
import JDictSelectTag from '@comp/dict/JDictSelectTag'
|
||||
import moment from 'moment'
|
||||
import {getContactsById} from '@api/incomePaymentsApi'
|
||||
|
||||
export default {
|
||||
name: 'OtherMeetingForm',
|
||||
components: {
|
||||
JDate,
|
||||
// JImageUpload,
|
||||
SelectContacts,
|
||||
JDictSelectTag
|
||||
},
|
||||
props: {
|
||||
selectedCompany: {
|
||||
type: Object
|
||||
},
|
||||
// 会议类型
|
||||
meetingType: {
|
||||
type: String,
|
||||
required: false
|
||||
},
|
||||
// 身份类型
|
||||
identifyType: {
|
||||
type: Number,
|
||||
required: false,
|
||||
// 默认为参会人
|
||||
default: 2
|
||||
},
|
||||
// 嘉宾类型
|
||||
guestType: {
|
||||
type: Number,
|
||||
required: false
|
||||
},
|
||||
// 会议费用是否为0
|
||||
meetingCostBool: {
|
||||
type: Boolean,
|
||||
required: false,
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
desription: '其他会议的参会情况的表单',
|
||||
form: this.$form.createForm(this),
|
||||
labelCol: {
|
||||
xs: {span: 24},
|
||||
sm: {span: 6}
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: {span: 24},
|
||||
sm: {span: 18}
|
||||
},
|
||||
remarksLabelCol: {
|
||||
xs: {span: 24},
|
||||
sm: {span: 3}
|
||||
},
|
||||
remarksWrapperCol: {
|
||||
xs: {span: 24},
|
||||
sm: {span: 21}
|
||||
},
|
||||
// 缴费方式为打包
|
||||
payModeBool: true,
|
||||
// 缴费方式为线上缴费
|
||||
onlinePayModeBool: false,
|
||||
// 回显的邮寄联系人
|
||||
selectPostPerson: null,
|
||||
validatorRules: {
|
||||
postContactId: {
|
||||
rules: [{required: true, message: '请选择邮寄联系人'}],
|
||||
validateTrigger: 'change'
|
||||
},
|
||||
payMode: {
|
||||
rules: [{required: true, message: '请选择缴费方式'}],
|
||||
validateTrigger: 'change'
|
||||
},
|
||||
needInvoice: {
|
||||
rules: [{required: true, message: '请选择发票类型'}],
|
||||
validateTrigger: 'change'
|
||||
},
|
||||
orderCode: {
|
||||
rules: [{required: true, message: '请输入订单号后四位'}],
|
||||
validateTrigger: 'blur'
|
||||
},
|
||||
postContactAddress:{
|
||||
rules: [{required: true, message: '请输入邮寄地址'}],
|
||||
validateTrigger: 'blur'
|
||||
},
|
||||
postCode:{
|
||||
rules: [{required: true, message: '请输入邮编'}],
|
||||
validateTrigger: 'blur'
|
||||
},
|
||||
|
||||
},
|
||||
// 是否可编辑
|
||||
isEditBool: false,
|
||||
// 是否需要发票
|
||||
needInvoiceBool: true,
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
// 监听它是因为 当选择参会人并且选择打包 再去切换身份 底下不显示bug
|
||||
identifyType(val) {
|
||||
if (val !== 2) {
|
||||
this.payModeBool = false
|
||||
console.log(val)
|
||||
return val
|
||||
}
|
||||
},
|
||||
meetingCostBool(val){
|
||||
console.log(val)
|
||||
return val
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
moment,
|
||||
handleOk() {
|
||||
this.form.validateFields((err, values) => {
|
||||
if (!err) {
|
||||
this.$emit('formData', values)
|
||||
} else {
|
||||
this.$emit('formData', {stop: true})
|
||||
}
|
||||
})
|
||||
},
|
||||
/*
|
||||
* 清空邮寄联系人 地址 邮编
|
||||
* */
|
||||
clearFormItem() {
|
||||
this.form.resetFields(['postContactId', 'postContactAddress', 'postCode'])
|
||||
},
|
||||
|
||||
/*
|
||||
* 选择了联系人后给邮寄联系人和地址赋值
|
||||
* */
|
||||
setAddressVal(val) {
|
||||
val = Object.assign({}, {postContactId: val.id, postContactAddress: val.contactAddress, postCode: val.postalCode})
|
||||
this.$nextTick(() => {
|
||||
this.form.setFieldsValue(pick(val, 'postContactId', 'postContactAddress', 'postCode'))
|
||||
})
|
||||
},
|
||||
/*
|
||||
* 选择联系人之后地址邮编复制
|
||||
* */
|
||||
changePost(val) {
|
||||
if (val === undefined) {
|
||||
this.clearFormItem()
|
||||
}
|
||||
getContactsById({id: val}).then(res => {
|
||||
if (res.success) {
|
||||
this.setAddressVal(res.result)
|
||||
}
|
||||
})
|
||||
},
|
||||
/*
|
||||
* 离开时间禁用
|
||||
* */
|
||||
disabledEndDate(endValue) {
|
||||
const startValueTemp = this.form.getFieldValue('arrivalTime')
|
||||
const startValue = startValueTemp && moment(startValueTemp, 'YYYY-MM-DD')
|
||||
if (!endValue || !startValue) {
|
||||
return false
|
||||
}
|
||||
return startValue.valueOf() > endValue.valueOf()
|
||||
},
|
||||
/*
|
||||
* 抵达时间禁用
|
||||
* */
|
||||
disabledStartDate(endValue) {
|
||||
const startValueTemp = this.form.getFieldValue('departureTime')
|
||||
const startValue = startValueTemp && moment(startValueTemp, 'YYYY-MM-DD')
|
||||
if (!endValue || !startValue) {
|
||||
return false
|
||||
}
|
||||
return startValue.valueOf() < endValue.valueOf() - 86400000
|
||||
},
|
||||
/*
|
||||
* 缴费方式选择
|
||||
* */
|
||||
changePayMode(e) {
|
||||
if (e.target.value === 3) {
|
||||
this.payModeBool = false
|
||||
} else {
|
||||
this.payModeBool = false
|
||||
}
|
||||
// 缴费方式为线上 要输入订单后四位
|
||||
if (e.target.value === 2) {
|
||||
this.onlinePayModeBool = true
|
||||
} else {
|
||||
this.onlinePayModeBool = false
|
||||
}
|
||||
},
|
||||
/*
|
||||
* 编辑回显值
|
||||
* */
|
||||
setFormVal(record) {
|
||||
this.isEditBool = record.checkResult === 1
|
||||
this.needInvoiceBool = record.needInvoice === 0
|
||||
// 回显邮寄联系人
|
||||
this.selectPostPerson = {
|
||||
id: record.postContactTemporaryId,
|
||||
name: record.postContactName
|
||||
}
|
||||
this.$nextTick(() => {
|
||||
// 身份类型是嘉宾 内部企业只渲染 住店 抵达时间 离开时间
|
||||
this.form.setFieldsValue(pick(record,
|
||||
'checkInHotel',
|
||||
'arrivalTime',
|
||||
'departureTime',
|
||||
'arrivalTime',
|
||||
'departureTime',
|
||||
'postContactId',
|
||||
'postContactAddress',
|
||||
'payMode',
|
||||
'needInvoice',
|
||||
'paymentRecord',
|
||||
'orderCode',
|
||||
'postCode'
|
||||
))
|
||||
})
|
||||
|
||||
|
||||
},
|
||||
/*
|
||||
* 选择发票
|
||||
* */
|
||||
changeInvoice(val) {
|
||||
if (val === '0') {
|
||||
// 不需要发票
|
||||
this.needInvoiceBool = true
|
||||
} else {
|
||||
this.needInvoiceBool = false
|
||||
}
|
||||
},
|
||||
addContactsOk() {
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
@import '~@assets/less/common.less';
|
||||
|
||||
.center {
|
||||
text-align: center;
|
||||
|
||||
.submit {
|
||||
margin-right: 8px;
|
||||
}
|
||||
}
|
||||
|
||||
.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;
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
@@ -0,0 +1,149 @@
|
||||
<template>
|
||||
<a-form :form="form">
|
||||
<!--合作伙伴显示的企业信息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">
|
||||
<j-date placeholder="请选择抵达时间" style="width: 100%;" v-decorator="['arrivalTime']"
|
||||
:trigger-change="true"
|
||||
:disabled-date="disabledArrivalTimeEndDate"
|
||||
show-type="day"
|
||||
date-format="YYYY-MM-DD"/>
|
||||
</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="['departureTime']"
|
||||
:disabled-date="disabledEndDate"
|
||||
:trigger-change="true"
|
||||
show-type="day"
|
||||
date-format="YYYY-MM-DD"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<!--合作伙伴显示的企业信息end-->
|
||||
</a-form>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import JDate from '@comp/jero/JDate'
|
||||
import moment from 'moment'
|
||||
import pick from 'lodash.pick'
|
||||
|
||||
export default {
|
||||
name: 'SeminarPartnerForm',
|
||||
data() {
|
||||
return {
|
||||
desription: '其他会议的参会情况的表单',
|
||||
form: this.$form.createForm(this),
|
||||
labelCol: {
|
||||
xs: {span: 24},
|
||||
sm: {span: 6}
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: {span: 24},
|
||||
sm: {span: 18}
|
||||
},
|
||||
remarksLabelCol: {
|
||||
xs: {span: 24},
|
||||
sm: {span: 3}
|
||||
},
|
||||
remarksWrapperCol: {
|
||||
xs: {span: 24},
|
||||
sm: {span: 21}
|
||||
},
|
||||
selectedCompany: null,
|
||||
}
|
||||
},
|
||||
components: {
|
||||
JDate,
|
||||
},
|
||||
methods:{
|
||||
moment,
|
||||
handleOk() {
|
||||
this.form.validateFields((err, values) => {
|
||||
if (!err) {
|
||||
this.$emit('formData', values)
|
||||
}else {
|
||||
this.$emit('formData', {stop:true})
|
||||
}
|
||||
})
|
||||
},
|
||||
/*
|
||||
* 编辑回显值
|
||||
* */
|
||||
setFormVal(record){
|
||||
// 合作伙伴回显
|
||||
this.$nextTick(() => {
|
||||
this.form.setFieldsValue(pick(record,
|
||||
'arrivalTime',
|
||||
'departureTime'
|
||||
))
|
||||
})
|
||||
|
||||
|
||||
},
|
||||
/*
|
||||
* 离开时间禁用
|
||||
* */
|
||||
disabledEndDate(endValue) {
|
||||
const startValueTemp = this.form.getFieldValue('arrivalTime')
|
||||
const startValue = startValueTemp && moment(startValueTemp ,'YYYY-MM-DD')
|
||||
if (!endValue || !startValue) {
|
||||
return false
|
||||
}
|
||||
return startValue.valueOf() > endValue.valueOf()
|
||||
},
|
||||
/*
|
||||
* 抵达时间禁用
|
||||
* */
|
||||
disabledArrivalTimeEndDate(endValue) {
|
||||
const startValueTemp = this.form.getFieldValue('departureTime')
|
||||
const startValue = startValueTemp && moment(startValueTemp, 'YYYY-MM-DD')
|
||||
if (!endValue || !startValue) {
|
||||
return false
|
||||
}
|
||||
return startValue.valueOf() < endValue.valueOf() - 86400000
|
||||
},
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
@import '~@assets/less/common.less';
|
||||
|
||||
.center {
|
||||
text-align: center;
|
||||
|
||||
.submit {
|
||||
margin-right: 8px;
|
||||
}
|
||||
}
|
||||
|
||||
.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;
|
||||
}
|
||||
}
|
||||
|
||||
</style>>
|
||||
@@ -0,0 +1,569 @@
|
||||
<template>
|
||||
<a-form :form="form">
|
||||
<!--演讲信息begin-->
|
||||
<!-- 特邀嘉宾没有用餐信息-->
|
||||
<template v-if="guestType !== 3 ">
|
||||
<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">
|
||||
<a-input placeholder="请输入演讲题目"
|
||||
:disabled="isEditBool"
|
||||
@change="event => event.target.value = event.target.value.trim()" :maxLength="50"
|
||||
v-decorator="['speechTopic']"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
|
||||
<a-col :xxl="8" :xl="12" :sm="24">
|
||||
<a-form-item label="演讲ppt" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
||||
<j-upload :disabled="isEditBool" v-decorator="['speechPpt']" :return-id="true"></j-upload>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
|
||||
|
||||
<a-col :xxl="8" :xl="12" :sm="24">
|
||||
<a-form-item label="照片" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
||||
<j-image-upload :disabled="isEditBool" v-decorator="['photo']" :return-id="true"></j-image-upload>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
|
||||
</a-row>
|
||||
<a-row :gutter="24">
|
||||
<a-col>
|
||||
<a-form-item label="个人简介" :labelCol="remarksLabelCol" :wrapperCol="remarksWrapperCol">
|
||||
<a-textarea
|
||||
:disabled="isEditBool"
|
||||
placeholder="请输入个人简介"
|
||||
:auto-size="{ minRows: 3, maxRows: 6 }"
|
||||
v-decorator="['profile']"
|
||||
:maxLength='200'
|
||||
@change="e => {e.target.value = (e.target.value + '').trim()}"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
|
||||
</a-row>
|
||||
</template>
|
||||
<!--演讲信息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">
|
||||
<a-radio-group :disabled="isEditBool" v-decorator="['haveMeals',validatorRules.haveMealBools]"
|
||||
@change="selecthaveMealBools">
|
||||
<a-radio :value="1">是</a-radio>
|
||||
<a-radio :value="0">否</a-radio>
|
||||
</a-radio-group>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<!--选择了用餐才会出现-->
|
||||
<a-col :xxl="8" :xl="12" :sm="24" v-if="haveMealBool">
|
||||
<a-form-item label="是否回民" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
||||
<a-radio-group :disabled="isEditBool" v-decorator="['huiPeople',validatorRules.huiPeople]">
|
||||
<a-radio :value="1">是</a-radio>
|
||||
<a-radio :value="0">否</a-radio>
|
||||
</a-radio-group>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<!--用餐信息end-->
|
||||
<!--住店信息begin-->
|
||||
<!-- 特邀嘉宾 演讲嘉宾没有住店信息-->
|
||||
<template v-if="guestType === 1">
|
||||
<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">
|
||||
<a-radio-group :disabled="isEditBool" v-decorator="['checkInHotel',validatorRules.checkinHotel]"
|
||||
@change="changeHotel">
|
||||
<a-radio :value="1">是</a-radio>
|
||||
<a-radio :value="0">否</a-radio>
|
||||
</a-radio-group>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row :gutter="24">
|
||||
<!--入住酒店选择是才显示-->
|
||||
<a-col :xxl="8" :xl="12" :sm="24" v-if="inHotelBool">
|
||||
<a-form-item label="入住酒店时间" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
||||
<j-date :disabled="isEditBool" v-decorator="['inHotelTime',validatorRules.inHotelTime]" :trigger-change="true" show-type="day" :disabled-date="disabledStartDate"
|
||||
placeholder="请选择入住酒店时间"></j-date>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :xxl="8" :xl="12" :sm="24" v-if="inHotelBool">
|
||||
<a-form-item label="离店时间" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
||||
<j-date :disabled="isEditBool" :disabled-date="disabledEndDate" :trigger-change="true" show-type="day"
|
||||
v-decorator="['outHotelTime',validatorRules.outHotelTime]" placeholder="请选择离店时间"></j-date>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :xxl="8" :xl="12" :sm="24" v-if="inHotelBool">
|
||||
<a-form-item label="房型" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
||||
<a-input :disabled="isEditBool" @change="event => event.target.value = event.target.value.trim()"
|
||||
:maxLength="50"
|
||||
v-decorator="['roomLayout',validatorRules.roomLayout]"
|
||||
placeholder="请输入房型"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</template>
|
||||
<!--住店信息end-->
|
||||
<!--VIP行程信息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">
|
||||
<a-radio-group :disabled="isEditBool" v-decorator="['pickUp',validatorRules.pickUp]" @change="changePickup">
|
||||
<a-radio :value="1">是</a-radio>
|
||||
<a-radio :value="0">否</a-radio>
|
||||
</a-radio-group>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row :gutter="24">
|
||||
<a-col :xxl="8" :xl="12" :sm="24" v-if="pickUpBool">
|
||||
<a-form-item label="抵达时间" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
||||
<j-date :disabled="isEditBool" placeholder="请选择抵达时间" style="width: 100%;" v-decorator="['arrivalTime',validatorRules.arrivalTime]"
|
||||
:trigger-change="true"
|
||||
:disabled-date="disabledArrivalTimeEndDate"
|
||||
show-type="day"
|
||||
date-format="YYYY-MM-DD"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
|
||||
<a-col :xxl="8" :xl="12" :sm="24" v-if="pickUpBool">
|
||||
<a-form-item label="到达站" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
||||
<a-input :disabled="isEditBool" placeholder="请输入到达站"
|
||||
@change="event => event.target.value = event.target.value.trim()" :maxLength="50"
|
||||
v-decorator="[ 'destination',validatorRules.destination]"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
|
||||
<a-col :xxl="8" :xl="12" :sm="24" v-if="pickUpBool">
|
||||
<a-form-item label="到达班次" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
||||
<a-input :disabled="isEditBool" placeholder="请输入到达班次"
|
||||
@change="event => event.target.value = event.target.value.trim()" :maxLength="50"
|
||||
v-decorator="[ 'arrivalShift',validatorRules.arrivalShift]"></a-input>
|
||||
</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">
|
||||
<a-radio-group :disabled="isEditBool" v-decorator="['deliveryStation',validatorRules.deliveryStation]"
|
||||
@change="changeSend">
|
||||
<a-radio :value="1">是</a-radio>
|
||||
<a-radio :value="0">否</a-radio>
|
||||
</a-radio-group>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row :gutter="24">
|
||||
<!--送站选择是才显示-->
|
||||
<a-col :xxl="8" :xl="12" :sm="24" v-if="sendBool">
|
||||
<a-form-item label="离开时间" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
||||
<j-date :disabled="isEditBool" placeholder="请选择离开时间" style="width: 100%;" v-decorator="['departureTime',validatorRules.departureTime]"
|
||||
:trigger-change="true"
|
||||
:disabled-date="disabledDepartureTimeEndDate"
|
||||
show-type="day"
|
||||
date-format="YYYY-MM-DD"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
|
||||
<a-col :xxl="8" :xl="12" :sm="24" v-if="sendBool">
|
||||
<a-form-item label="离开站" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
||||
<a-input :disabled="isEditBool" placeholder="请输入离开站"
|
||||
@change="event => event.target.value = event.target.value.trim()" :maxLength="50"
|
||||
v-decorator="[ 'departureStation',validatorRules.departureStation]"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
|
||||
|
||||
<a-col :xxl="8" :xl="12" :sm="24" v-if="sendBool">
|
||||
<a-form-item label="离开班次" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
||||
<a-input :disabled="isEditBool" placeholder="请输入离开班次"
|
||||
@change="event => event.target.value = event.target.value.trim()" :maxLength="50"
|
||||
v-decorator="[ 'departureShift',validatorRules.departureShift]"></a-input>
|
||||
</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">
|
||||
<a-input placeholder="请输入同行人"
|
||||
:maxLength='50'
|
||||
:disabled="isEditBool"
|
||||
@change="event => event.target.value = event.target.value.trim()"
|
||||
v-decorator="[ 'peer']"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
|
||||
</a-row>
|
||||
<!--特邀嘉宾没有备注-->
|
||||
<a-row v-if="guestType!== 3" :gutter="24" style="transform: translateX(-4px)">
|
||||
<a-col>
|
||||
<a-form-item label="备注" :labelCol="remarksLabelCol" :wrapperCol="remarksWrapperCol">
|
||||
<a-textarea
|
||||
:disabled="isEditBool"
|
||||
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>
|
||||
<!--VIP行程信息end-->
|
||||
</a-form>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import JDate from '@comp/jero/JDate'
|
||||
import JImageUpload from '@comp/jero/JImageUpload'
|
||||
import JUpload from '@comp/signUpForm/JUpload'
|
||||
import moment from 'moment'
|
||||
import pick from 'lodash.pick'
|
||||
|
||||
export default {
|
||||
name: 'SeminarVipForm',
|
||||
data() {
|
||||
return {
|
||||
desription: '其他会议的参会情况的表单',
|
||||
form: this.$form.createForm(this),
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 6 }
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 18 }
|
||||
},
|
||||
remarksLabelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 6 },
|
||||
xxl: { span: 2 },
|
||||
xl: { span: 3 }
|
||||
},
|
||||
remarksWrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 18 },
|
||||
xxl: { span: 22 },
|
||||
xl: { span: 21 }
|
||||
},
|
||||
selectedCompany: null,
|
||||
// 是否用餐
|
||||
haveMealBool: false,
|
||||
// 是否入住酒店
|
||||
inHotelBool: false,
|
||||
// 是否送站
|
||||
sendBool: false,
|
||||
// 是否接站
|
||||
pickUpBool: false,
|
||||
// 是否可编辑
|
||||
isEditBool: false,
|
||||
validatorRules: {
|
||||
haveMealBools: {
|
||||
rules: [{ required: true, message: '请选择是否用餐' }],
|
||||
validateTrigger: 'change'
|
||||
},
|
||||
huiPeople: {
|
||||
rules: [{ required: true, message: '请选择是否回民' }],
|
||||
validateTrigger: 'change'
|
||||
},
|
||||
checkinHotel: {
|
||||
rules: [{ required: true, message: '请选择是否住酒店' }],
|
||||
validateTrigger: 'change'
|
||||
},
|
||||
inHotelTime:{
|
||||
rules: [{ required: true, message: '请选择入住酒店时间' }],
|
||||
validateTrigger: 'change'
|
||||
},
|
||||
outHotelTime:{
|
||||
rules: [{ required: true, message: '请选择离店时间' }],
|
||||
validateTrigger: 'change'
|
||||
},
|
||||
roomLayout:{
|
||||
rules: [{ required: true, message: '请输入房型' }],
|
||||
validateTrigger: 'blur'
|
||||
},
|
||||
pickUp: {
|
||||
rules: [{ required: true, message: '请选择是否需要接站' }],
|
||||
validateTrigger: 'change'
|
||||
},
|
||||
departureTime:{
|
||||
rules: [{ required: true, message: '请选择离开时间' }],
|
||||
validateTrigger: 'change'
|
||||
},
|
||||
departureStation:{
|
||||
rules: [{ required: true, message: '请输入离开站' }],
|
||||
validateTrigger: 'blur'
|
||||
},
|
||||
arrivalShift:{
|
||||
rules: [{ required: true, message: '请输入到达班次' }],
|
||||
validateTrigger: 'blur'
|
||||
},
|
||||
deliveryStation: {
|
||||
rules: [{ required: true, message: '请选择是否需要送站' }],
|
||||
validateTrigger: 'change'
|
||||
},
|
||||
arrivalTime:{
|
||||
rules: [{ required: true, message: '请选择抵达时间' }],
|
||||
validateTrigger: 'change'
|
||||
},
|
||||
destination:{
|
||||
rules: [{ required: true, message: '请输入到达站' }],
|
||||
validateTrigger: 'blur'
|
||||
},
|
||||
departureShift:{
|
||||
rules: [{ required: true, message: '请输入离开班次' }],
|
||||
validateTrigger: 'blur'
|
||||
},
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
},
|
||||
props: {
|
||||
// 会议类型
|
||||
meetingType: {
|
||||
type: String,
|
||||
required: false
|
||||
},
|
||||
// 身份类型
|
||||
identifyType: {
|
||||
type: Number,
|
||||
required: false,
|
||||
// 默认为参会人
|
||||
default: 2
|
||||
},
|
||||
// 嘉宾类型
|
||||
guestType: {
|
||||
type: Number,
|
||||
required: false
|
||||
}
|
||||
},
|
||||
components: {
|
||||
JDate,
|
||||
JImageUpload,
|
||||
JUpload
|
||||
},
|
||||
methods: {
|
||||
moment,
|
||||
handleOk() {
|
||||
this.form.validateFields((err, values) => {
|
||||
if (!err) {
|
||||
this.$emit('formData', values)
|
||||
} else {
|
||||
this.$emit('formData', { stop: true })
|
||||
}
|
||||
})
|
||||
},
|
||||
/*
|
||||
* 选择是否用餐
|
||||
* */
|
||||
selecthaveMealBools(e) {
|
||||
if (e.target.value === 1) {
|
||||
this.haveMealBool = true
|
||||
} else {
|
||||
this.haveMealBool = false
|
||||
}
|
||||
},
|
||||
/*
|
||||
* 选择是否入住酒店
|
||||
* */
|
||||
changeHotel(e) {
|
||||
if (e.target.value === 1) {
|
||||
this.inHotelBool = true
|
||||
} else {
|
||||
this.inHotelBool = false
|
||||
}
|
||||
},
|
||||
/*
|
||||
* 选择是否送站
|
||||
* */
|
||||
changeSend(e) {
|
||||
if (e.target.value === 1) {
|
||||
this.sendBool = true
|
||||
} else {
|
||||
this.sendBool = false
|
||||
}
|
||||
},
|
||||
/*
|
||||
* 选择是否接站
|
||||
* */
|
||||
changePickup(e) {
|
||||
if (e.target.value === 1) {
|
||||
this.pickUpBool = true
|
||||
} else {
|
||||
this.pickUpBool = false
|
||||
}
|
||||
},
|
||||
/*
|
||||
* 离开酒店时间禁用
|
||||
* */
|
||||
disabledEndDate(endValue) {
|
||||
const startValueTemp = this.form.getFieldValue('inHotelTime')
|
||||
const startValue = startValueTemp && moment(startValueTemp, 'YYYY-MM-DD')
|
||||
if (!endValue || !startValue) {
|
||||
return false
|
||||
}
|
||||
return startValue.valueOf() > endValue.valueOf()
|
||||
},
|
||||
/*
|
||||
* 入住酒店时间禁用
|
||||
* */
|
||||
disabledStartDate(endValue){
|
||||
const startValueTemp = this.form.getFieldValue('outHotelTime')
|
||||
const startValue = startValueTemp && moment(startValueTemp, 'YYYY-MM-DD')
|
||||
if (!endValue || !startValue) {
|
||||
return false
|
||||
}
|
||||
return startValue.valueOf() < endValue.valueOf() - 86400000
|
||||
},
|
||||
/*
|
||||
* 离开时间禁用
|
||||
* */
|
||||
disabledDepartureTimeEndDate(endValue) {
|
||||
const startValueTemp = this.form.getFieldValue('arrivalTime')
|
||||
const startValue = startValueTemp && moment(startValueTemp, 'YYYY-MM-DD')
|
||||
if (!endValue || !startValue) {
|
||||
return false
|
||||
}
|
||||
return startValue.valueOf() > endValue.valueOf()
|
||||
},
|
||||
/*
|
||||
* 抵达时间禁用
|
||||
* */
|
||||
disabledArrivalTimeEndDate(endValue) {
|
||||
const startValueTemp = this.form.getFieldValue('departureTime')
|
||||
const startValue = startValueTemp && moment(startValueTemp, 'YYYY-MM-DD')
|
||||
if (!endValue || !startValue) {
|
||||
return false
|
||||
}
|
||||
return startValue.valueOf() < endValue.valueOf() - 86400000
|
||||
},
|
||||
/*
|
||||
* 编辑回显值
|
||||
* */
|
||||
setFormVal(record) {
|
||||
// 回显邮寄联系人
|
||||
this.isEditBool = record.checkResult === 1
|
||||
// this.selectPostPerson = {
|
||||
// id:record.postContactTemporaryId,
|
||||
// name:record.postContactName
|
||||
// }
|
||||
// 是否用餐的显示
|
||||
if (record.haveMeals === 1) {
|
||||
this.haveMealBool = true
|
||||
this.$nextTick(() => {
|
||||
// 是否回民回显
|
||||
this.form.setFieldsValue(pick(record,
|
||||
'huiPeople'
|
||||
))
|
||||
})
|
||||
} else if (record.haveMeals === 0) {
|
||||
this.haveMealBool = false
|
||||
}
|
||||
// 是否住酒店
|
||||
if (record.checkInHotel === 1) {
|
||||
this.inHotelBool = true
|
||||
// 入住酒店回显 离店时间回显 房型回显
|
||||
this.$nextTick(() => {
|
||||
// 身份类型是嘉宾 内部企业只渲染 住店 抵达时间 离开时间
|
||||
this.form.setFieldsValue(pick(record,
|
||||
'inHotelTime',
|
||||
'outHotelTime',
|
||||
'roomLayout'
|
||||
))
|
||||
})
|
||||
} else if (record.checkInHotel === 0) {
|
||||
this.inHotelBool = false
|
||||
}
|
||||
// 是否接站
|
||||
if (record.pickUp === 1) {
|
||||
this.pickUpBool = true
|
||||
// 抵达时间 到达站 到达班次
|
||||
this.$nextTick(() => {
|
||||
// 身份类型是嘉宾 内部企业只渲染 住店 抵达时间 离开时间
|
||||
this.form.setFieldsValue(pick(record,
|
||||
'arrivalTime',
|
||||
'destination',
|
||||
'arrivalShift'
|
||||
))
|
||||
})
|
||||
} else if (record.pickUp === 0) {
|
||||
this.pickUpBool = false
|
||||
}
|
||||
// 是否送站
|
||||
if (record.deliveryStation === 1) {
|
||||
this.sendBool = true
|
||||
this.$nextTick(() => {
|
||||
// 离开时间 离开站 离开班次
|
||||
this.form.setFieldsValue(pick(record,
|
||||
'departureTime',
|
||||
'departureStation',
|
||||
'departureShift'
|
||||
))
|
||||
})
|
||||
} else if (record.pickUp === 0) {
|
||||
this.sendBool = false
|
||||
}
|
||||
console.log(record, 'record')
|
||||
this.$nextTick(() => {
|
||||
// 身份类型是嘉宾 内部企业只渲染 住店 抵达时间 离开时间
|
||||
this.form.setFieldsValue(pick(record,
|
||||
'speechTopic',
|
||||
'speechPpt',
|
||||
'photo',
|
||||
'profile',
|
||||
'haveMeals',
|
||||
'checkInHotel',
|
||||
'pickUp',
|
||||
'deliveryStation',
|
||||
'peer',
|
||||
'remark'
|
||||
))
|
||||
})
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
@import '~@assets/less/common.less';
|
||||
|
||||
.center {
|
||||
text-align: center;
|
||||
|
||||
.submit {
|
||||
margin-right: 8px;
|
||||
}
|
||||
}
|
||||
|
||||
.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;
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
@@ -1,5 +1,7 @@
|
||||
/* eslint-disable */
|
||||
import { UserLayout, TabLayout } from '@/components/layouts'
|
||||
import SignUpEntrance from "@views/signUp/SignUpEntrance"
|
||||
import SignUpPage from "@views/signUp/SignUpPage"
|
||||
|
||||
/**
|
||||
* 走菜单，走权限控制
|
||||
@@ -52,7 +54,17 @@ export const constantRouterMap = [
|
||||
component: () => import(/* webpackChunkName: "user" */ '@/views/user/alteration/Alteration')
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
{
|
||||
path: "/signUpEntrance",
|
||||
component: SignUpEntrance,
|
||||
hidden: true,
|
||||
},
|
||||
{
|
||||
path: "/signUpPage",
|
||||
component: SignUpPage,
|
||||
hidden: true,
|
||||
},
|
||||
]
|
||||
|
||||
/**
|
||||
|
||||
+1
-1
@@ -9,7 +9,7 @@ import { generateIndexRouter } from '@/utils/util'
|
||||
|
||||
NProgress.configure({ showSpinner: false }) // NProgress Configuration
|
||||
|
||||
const whiteList = ['/user/login', '/user/register', '/user/register-result', '/user/alteration'] // no redirect whitelist
|
||||
const whiteList = ['/user/login', '/user/register', '/user/register-result', '/user/alteration','/signupentrance','/signUpPage'] // no redirect whitelist
|
||||
|
||||
const ThirdLoginFunc = (token) => {
|
||||
return new Promise(resolve => {
|
||||
|
||||
@@ -0,0 +1,321 @@
|
||||
<template>
|
||||
<div>
|
||||
<!--头部begin-->
|
||||
<header class="header">
|
||||
<img src="../../assets/signUpImg/bg.png" class="header-img">
|
||||
<div class="meeting-name">{{ currentMeetingInfo.meetingName }}</div>
|
||||
</header>
|
||||
<!--头部end-->
|
||||
<!--内容begin-->
|
||||
<section class="content">
|
||||
<div class="main-content">
|
||||
<section class="main-content-title">
|
||||
{{ currentMeetingInfo.meetingName }}
|
||||
</section>
|
||||
<section class="main-content-info">
|
||||
<a-row :gutter="24">
|
||||
<a-col :span="12">
|
||||
<label>会议类型：</label>
|
||||
<span>{{ initMeetingType(currentMeetingInfo.meetingType) }}</span>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
<label>会议费用：</label>
|
||||
<span>{{ meetingMoney }}</span>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row :gutter="24">
|
||||
<a-col :span="12">
|
||||
<label>负责人：</label>
|
||||
<span>{{ currentMeetingInfo.directorName }} {{currentMeetingInfo.directorPhone}}</span>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
<label>报名截止时间：</label>
|
||||
<span>{{ currentMeetingInfo.registerDeadline }}</span>
|
||||
</a-col>
|
||||
<!-- <a-col :span="12">-->
|
||||
<!-- <label>预计参加人数：</label>-->
|
||||
<!-- <span>{{ currentMeetingInfo.estimatedNumber }}</span>-->
|
||||
<!-- </a-col>-->
|
||||
</a-row>
|
||||
<a-row :gutter="24">
|
||||
<a-col :span="12">
|
||||
<label>召开时间：</label>
|
||||
<span>{{ holdtime }}</span>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
<label>会议内容：</label>
|
||||
<span>{{ currentMeetingInfo.meetingContent }}</span>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row :gutter="24">
|
||||
<a-col :span="12">
|
||||
<label>备注：</label>
|
||||
<span>{{ currentMeetingInfo.remark }}</span>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row :gutter="24">
|
||||
|
||||
<a-col :span="12" style="display: flex">
|
||||
<label>会议通知：</label>
|
||||
<preview-file :file-id="currentMeetingInfo.meetingFiles"
|
||||
v-if="currentMeetingInfo.meetingFiles"></preview-file>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row>
|
||||
<label>会议报名：</label>
|
||||
</a-row>
|
||||
<a-row>
|
||||
<img :src="singUpQRCode" class="qr-code"/>
|
||||
</a-row>
|
||||
<a-button type="primary" style="margin-left: 19px;" @click="toSingUpPage" v-if="!invalidationBool && urlHaveIdBool">立即报名
|
||||
</a-button>
|
||||
</section>
|
||||
</div>
|
||||
</section>
|
||||
<!--内容end-->
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import PreviewFile from '@comp/jero/PreviewFile'
|
||||
import {createQcCode} from '@api/incomePaymentsApi'
|
||||
import {getMeetInfoById} from '@api/incomePaymentsApi'
|
||||
|
||||
export default {
|
||||
name: 'SignUpEntrance',
|
||||
components: {
|
||||
PreviewFile
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
description: '报名入口',
|
||||
// 报名二维码
|
||||
singUpQRCode: '',
|
||||
// 会议详情
|
||||
currentMeetingInfo: {},
|
||||
// 会议费用
|
||||
meetingMoney: '',
|
||||
// 召开时间
|
||||
holdtime: '',
|
||||
// 召开地点
|
||||
holdAddress: '',
|
||||
// 会议id
|
||||
meetingId: '',
|
||||
// 当前时间是否超过报名截止时间
|
||||
invalidationBool: false,
|
||||
// url是否有id参数
|
||||
urlHaveIdBool:false,
|
||||
}
|
||||
},
|
||||
created() {
|
||||
// 获取会议id
|
||||
let id = this.GetQueryString('id')
|
||||
this.urlHaveIdBool = id ? true :false
|
||||
this.meetingId = id
|
||||
document.title = '报名入口'
|
||||
if (id) {
|
||||
this.getMeetingInfo(id)
|
||||
}
|
||||
},
|
||||
async mounted() {
|
||||
this.singUpQRCode = await this.generateQRCode(this.signUpHerfUrl)
|
||||
},
|
||||
computed:{
|
||||
// 报名链接
|
||||
signUpHerfUrl() {
|
||||
return `${ window._CONFIG['singUpQRCodeURL'] }?id=${this.meetingId}`
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
/*
|
||||
* 生成二维码
|
||||
* */
|
||||
generateQRCode(params) {
|
||||
return new Promise(resolve => {
|
||||
let code = ''
|
||||
createQcCode({contact: params}).then(res => {
|
||||
if (res.success) {
|
||||
code = res.result
|
||||
} else {
|
||||
console.error('生成二维码失败')
|
||||
}
|
||||
}).finally(() => {
|
||||
resolve(code)
|
||||
})
|
||||
})
|
||||
},
|
||||
/*
|
||||
* 立即报名
|
||||
* */
|
||||
toSingUpPage() {
|
||||
this.$router.push({
|
||||
path: '/signUpPage',
|
||||
query: {
|
||||
id: this.meetingId
|
||||
}
|
||||
})
|
||||
},
|
||||
/*
|
||||
* 获取会议详情
|
||||
* */
|
||||
getMeetingInfo(params) {
|
||||
getMeetInfoById({id: params}).then(res => {
|
||||
if (res.success) {
|
||||
this.currentMeetingInfo = res.result
|
||||
// true超过了 false 未超过
|
||||
this.invalidationBool = this.compareCurrentTime(res.result.registerDeadline)
|
||||
if (this.invalidationBool) {
|
||||
this.$notification.error({
|
||||
message: '系统提示',
|
||||
description: '当前会议超出报名时间,不可报名！'
|
||||
})
|
||||
}
|
||||
// 初始化会议费用
|
||||
if (this.currentMeetingInfo.meetingCostsVip) {
|
||||
this.meetingMoney = `普通会员(${this.currentMeetingInfo.meetingCosts}/人) 标协会员(${this.currentMeetingInfo.meetingCostsVip}/人)`
|
||||
} else {
|
||||
this.meetingMoney = ` ${this.currentMeetingInfo.meetingCosts}/人`
|
||||
}
|
||||
// 初始化召开时间
|
||||
if (this.currentMeetingInfo.startTime) {
|
||||
this.holdtime = this.currentMeetingInfo.startTime + '~' + this.currentMeetingInfo.endTime
|
||||
}
|
||||
// 初始化召开地点
|
||||
if (this.currentMeetingInfo.venue) {
|
||||
this.holdAddress = this.currentMeetingInfo.venue + '/' + this.currentMeetingInfo.address
|
||||
}
|
||||
} else {
|
||||
this.urlHaveIdBool = false
|
||||
}
|
||||
})
|
||||
},
|
||||
/*
|
||||
* 当前时间是否超过会议报名时间
|
||||
* */
|
||||
compareCurrentTime(time) {
|
||||
let date = new Date()
|
||||
let compareTime = new Date(time)
|
||||
if (date.getTime() > compareTime.getTime()) {
|
||||
return true
|
||||
} else {
|
||||
return false
|
||||
}
|
||||
},
|
||||
/*
|
||||
* 会议类型
|
||||
* */
|
||||
initMeetingType(val) {
|
||||
if (val) {
|
||||
switch (val) {
|
||||
case '1':
|
||||
return '工作组会议'
|
||||
case '2':
|
||||
switch (this.currentMeetingInfo.tbMeetingType + '') {
|
||||
case '1':
|
||||
return '标协会议-标准宣贯'
|
||||
case '2':
|
||||
return '标协会议-培训会'
|
||||
case '3':
|
||||
return '标协会议-信息交流会'
|
||||
}
|
||||
break
|
||||
case '3':
|
||||
return '国际研讨会'
|
||||
case '4':
|
||||
return '其他会议'
|
||||
case '5':
|
||||
return '分标委会议'
|
||||
case '6':
|
||||
return '理事会会议'
|
||||
}
|
||||
} else {
|
||||
return ''
|
||||
}
|
||||
},
|
||||
/**
|
||||
* 获取url的参数
|
||||
* @param name要获取的参数名
|
||||
* */
|
||||
GetQueryString(name) {
|
||||
var reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)')
|
||||
var r = window.location.search.substr(1).match(reg)
|
||||
if (r != null) return unescape(r[2])
|
||||
return null
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.header {
|
||||
text-align: center;
|
||||
position: relative;
|
||||
user-select: none;
|
||||
-webkit-user-seletct: none;
|
||||
-moz-user-seletct: none;
|
||||
-ms-user-seletct: none;
|
||||
|
||||
.header-img {
|
||||
width: 100%;
|
||||
min-width: 1200px;
|
||||
height: 450px;
|
||||
}
|
||||
|
||||
.meeting-name {
|
||||
width: 80%;
|
||||
min-width: 1200px;
|
||||
position: absolute;
|
||||
font-family: PingFang SC, PingFang SC-Bold;
|
||||
font-weight: 700;
|
||||
letter-spacing: 2px;
|
||||
color: #fff;
|
||||
font-size: 42px;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
}
|
||||
}
|
||||
|
||||
.content {
|
||||
user-select: none;
|
||||
background: rgba(240, 242, 245);
|
||||
|
||||
.main-content {
|
||||
min-height: calc(100vh - 450px);
|
||||
margin: 0 auto;
|
||||
padding: 20px;
|
||||
box-sizing: border-box;
|
||||
width: 80%;
|
||||
min-width: 1200px;
|
||||
background: #fff;
|
||||
font-family: PingFang SC, PingFang SC-Medium;
|
||||
|
||||
&-title {
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
background: rgba(8, 182, 175, .1);
|
||||
color: #333;
|
||||
font-family: PingFang SC, PingFang SC-Medium;
|
||||
letter-spacing: 1px;
|
||||
font-weight: 500;
|
||||
font-size: 18px;
|
||||
height: 50px;
|
||||
line-height: 50px;
|
||||
}
|
||||
|
||||
&-info {
|
||||
padding: 20px 20px 0 20px;
|
||||
box-sizing: border-box;
|
||||
font-size: 16px;
|
||||
color: #555;
|
||||
line-height: 2.1;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.qr-code {
|
||||
width: 140px;
|
||||
height: 140px;
|
||||
}
|
||||
|
||||
</style>
|
||||
@@ -0,0 +1,841 @@
|
||||
<template>
|
||||
<div>
|
||||
<!--头部begin-->
|
||||
<header class="header">
|
||||
<img src="../../assets/signUpImg/bg.png" class="header-img">
|
||||
<div class="meeting-name">{{ currentMeetingInfo.meetingName }}</div>
|
||||
</header>
|
||||
<!--头部end-->
|
||||
<!--内容begin-->
|
||||
<section class="content">
|
||||
<div class="main-content">
|
||||
<section class="main-content-title">
|
||||
<img src="../../assets/signUpImg/meetingInfo.png"/> 会议信息
|
||||
</section>
|
||||
<section class="main-content-info">
|
||||
<a-row :gutter="24">
|
||||
<a-col :span="12">
|
||||
<label>会议名称：</label>
|
||||
<span>{{ currentMeetingInfo.meetingName }}</span>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
<label>年份：</label>
|
||||
<span>{{ currentMeetingInfo.particularYear }}</span>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row :gutter="24">
|
||||
<a-col :span="12">
|
||||
<label>会议类型：</label>
|
||||
<span>{{ initMeetingType(currentMeetingInfo.meetingType) }}</span>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
<label>会议费用：</label>
|
||||
<span>{{ meetingMoney }}</span>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row :gutter="24">
|
||||
<a-col :span="12">
|
||||
<label>负责人：</label>
|
||||
<span>{{ currentMeetingInfo.directorName }}({{ currentMeetingInfo.directorPhone }})</span>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
<label>召开地点：</label>
|
||||
<span>{{ holdAddress }}</span>
|
||||
</a-col>
|
||||
<!-- <a-col :span="12">-->
|
||||
<!-- <label>预计参加人数：</label>-->
|
||||
<!-- <span>{{ currentMeetingInfo.estimatedNumber }}</span>-->
|
||||
<!-- </a-col>-->
|
||||
</a-row>
|
||||
<a-row :gutter="24">
|
||||
<a-col :span="12">
|
||||
<label>召开时间：</label>
|
||||
<span>{{ holdtime }}</span>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
<label>会议内容：</label>
|
||||
<span>{{ currentMeetingInfo.meetingContent }}</span>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row :gutter="24">
|
||||
<a-col :span="12">
|
||||
<label>报名截止时间：</label>
|
||||
<span>{{ currentMeetingInfo.registerDeadline }}</span>
|
||||
</a-col>
|
||||
<a-col :span="12" style="display: flex">
|
||||
<label>会议通知：</label>
|
||||
<preview-file :file-id="currentMeetingInfo.meetingFiles"
|
||||
v-if="currentMeetingInfo.meetingFiles"></preview-file>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row type="flex" v-if="currentMeetingInfo.meetingCosts !== '0.00' ">
|
||||
<label>收费二维码：</label>
|
||||
<j-image-upload :return-id="true" v-if="currentMeetingInfo.paymentQrCode"
|
||||
v-model="currentMeetingInfo.paymentQrCode" disabled></j-image-upload>
|
||||
</a-row>
|
||||
<a-row>
|
||||
<a-col :span="24">
|
||||
<label>备注：</label>
|
||||
<span>{{ currentMeetingInfo.remark }}</span>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</section>
|
||||
<section class="main-content-title mt-10">
|
||||
<img src="../../assets/signUpImg/signUpInfo.png"/> 报名信息
|
||||
</section>
|
||||
<template v-if="urlHaveIdBool">
|
||||
<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">
|
||||
<a-form-item label="参会企业" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
||||
<company-select @change="changeCompany" v-decorator="['companyId',validatorRules.companyId]"
|
||||
placeholder="请选择参会企业"
|
||||
:is-limit="true"
|
||||
:maxLength='50'>
|
||||
</company-select>
|
||||
<span class="color-red">若没有您要选择的企业,请您添加企业信息(发票抬头)</span>
|
||||
</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">
|
||||
<select-contacts :selected-company="selectedCompany"
|
||||
placeholder="请选择参会人"
|
||||
:is-limit="true"
|
||||
v-decorator="['companyContactId',validatorRules.companyContactId]"
|
||||
:maxLength='50'
|
||||
@change="changeContact"
|
||||
ref="selectMailContacts"
|
||||
@ok="addContactsOk"></select-contacts>
|
||||
</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='11'
|
||||
disabled
|
||||
v-decorator="['phone',validatorRules.phone]"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<!--非国际研讨会-->
|
||||
<a-col :xxl="8" :xl="12" :sm="24" v-if="meetingType !== '3' ">
|
||||
<a-form-item label="身份" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
||||
<a-radio-group v-decorator="['identity',validatorRules.identify]" @change="changeIdentify">
|
||||
<a-radio :value="1">嘉宾</a-radio>
|
||||
<a-radio :value="2">参会人</a-radio>
|
||||
<a-radio :value="3">内部企业</a-radio>
|
||||
</a-radio-group>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :xxl="8" :xl="12" :sm="24" v-if="meetingType === '3' ">
|
||||
<a-form-item label="是否有邀请码" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
||||
<a-radio-group v-decorator="['inviteCode',validatorRules.inviteCode]" @change="changeInviteCode">
|
||||
<a-radio :value="1">是</a-radio>
|
||||
<a-radio :value="0">否</a-radio>
|
||||
</a-radio-group>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
|
||||
<!--邀请码选择是出现填写邀请码 否选择身份-->
|
||||
<a-col :xxl="8" :xl="12" :sm="24" v-if="meetingType === '3' && identityBool ">
|
||||
<a-form-item label="身份" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
||||
<a-radio-group v-decorator="['identity',validatorRules.identify]" @change="changeIdentify">
|
||||
<a-radio :value="2">参会人</a-radio>
|
||||
<a-radio :value="3">内部企业</a-radio>
|
||||
</a-radio-group>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
|
||||
<a-col :xxl="8" :xl="12" :sm="24" v-if="inviteCodeBool">
|
||||
<a-form-item label="邀请码" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
||||
<a-input placeholder="请输入邀请码"
|
||||
:maxLength='50'
|
||||
@change="event => event.target.value = event.target.value.trim()"
|
||||
@blur="validateCode"
|
||||
v-decorator="[ 'code',
|
||||
validatorRules.code]"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<!--邀请码选择是才出现-->
|
||||
<a-row :gutter="24" class="center" v-if="inviteCodeBool">
|
||||
<a-button @click="nextSetp" type="primary">下一步</a-button>
|
||||
</a-row>
|
||||
<!--个人信息end-->
|
||||
<!--除开国际研讨会的其他会议的显示-->
|
||||
<template v-if="meetingType !== '3' ">
|
||||
<other-meeting-form ref="formother" :selected-company="selectedCompany"
|
||||
:meeting-cost-bool="meetingCostBool"
|
||||
:identify-type="identifyType" @formData="getFormData"
|
||||
@isPack="isPack"></other-meeting-form>
|
||||
</template>
|
||||
|
||||
<!--国际研讨会参会人与内部企业的显示 默认不展示 -->
|
||||
<template v-if="meetingType === '3' && identifyType !== 1 && identifyType !== null ">
|
||||
<other-meeting-form ref="formother" :meeting-type="meetingType" :selected-company="selectedCompany"
|
||||
:meeting-cost-bool="meetingCostBool"
|
||||
:identify-type="identifyType" @formData="getFormData"></other-meeting-form>
|
||||
</template>
|
||||
<!-- 国际研讨会身份选择嘉宾 并且是VIP-->
|
||||
<template v-if="identifyType === 1 && guestType === 1">
|
||||
<seminar-vip-form ref="seminarVipForm" @formData="getFormData" :identify-type="identifyType"
|
||||
:guest-type="guestType"></seminar-vip-form>
|
||||
</template>
|
||||
<!-- 国际研讨会身份选择嘉宾 并且是演讲嘉宾-->
|
||||
<template v-if="identifyType === 1 && guestType === 2">
|
||||
<seminar-vip-form ref="seminarVipForm" @formData="getFormData"
|
||||
:guest-type="guestType"></seminar-vip-form>
|
||||
</template>
|
||||
<!-- 国际研讨会身份选择嘉宾 并且是特邀嘉宾-->
|
||||
<template v-if="identifyType === 1 && guestType === 3">
|
||||
<seminar-vip-form ref="seminarVipForm" @formData="getFormData"
|
||||
:guest-type="guestType"></seminar-vip-form>
|
||||
</template>
|
||||
<!-- 国际研讨会身份选择嘉宾 并且是合作伙伴-->
|
||||
<template v-if="identifyType === 1 && guestType === 4">
|
||||
<seminar-partner-form ref="seminarPartnerForm" @formData="getFormData"></seminar-partner-form>
|
||||
</template>
|
||||
<section class="meetingCost">
|
||||
费用合计：{{ meetingCostSum }} 元
|
||||
</section>
|
||||
<div class="action">
|
||||
<a-button class="submit" type="primary" @click="handleOk" v-preventclick>确定</a-button>
|
||||
<a-button @click="handleCancel">取消</a-button>
|
||||
</div>
|
||||
</a-form>
|
||||
</a-spin>
|
||||
</template>
|
||||
</div>
|
||||
</section>
|
||||
<!--内容end-->
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {getMeetInfoById,validateStandard} from '@api/incomePaymentsApi'
|
||||
import SelectContacts from '@comp/company/SelectContacts'
|
||||
import CompanySelect from '@comp/company/CompanySelect'
|
||||
import {httpAction} from '@api/manage'
|
||||
import pick from 'lodash.pick'
|
||||
import JImageUpload from '@comp/jero/JImageUpload'
|
||||
import PreviewFile from '@comp/jero/PreviewFile'
|
||||
import {getContactsById} from '@api/incomePaymentsApi'
|
||||
import OtherMeetingForm from '@comp/signUpForm/OtherMeetingForm'
|
||||
import SeminarVipForm from '@comp/signUpForm/SeminarVipForm'
|
||||
import SeminarPartnerForm from '@comp/signUpForm/SeminarPartnerForm'
|
||||
|
||||
|
||||
export default {
|
||||
name: 'SignUpPage',
|
||||
components: {
|
||||
SelectContacts,
|
||||
SeminarPartnerForm,
|
||||
// JDictSelectTag,
|
||||
OtherMeetingForm,
|
||||
SeminarVipForm,
|
||||
PreviewFile,
|
||||
JImageUpload,
|
||||
CompanySelect
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
description: '报名入口',
|
||||
// 报名二维码
|
||||
singUpQRCode: '',
|
||||
// 会议详情
|
||||
currentMeetingInfo: {},
|
||||
// 会议费用
|
||||
meetingMoney: '',
|
||||
// 召开时间
|
||||
holdtime: '',
|
||||
// 召开地点
|
||||
holdAddress: '',
|
||||
confirmLoading: false,
|
||||
form: this.$form.createForm(this),
|
||||
formData: {},
|
||||
model: {},
|
||||
labelCol: {
|
||||
xs: {span: 24},
|
||||
sm: {span: 6}
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: {span: 24},
|
||||
sm: {span: 18}
|
||||
},
|
||||
remarksLabelCol: {
|
||||
xs: {span: 24},
|
||||
sm: {span: 3}
|
||||
},
|
||||
remarksWrapperCol: {
|
||||
xs: {span: 24},
|
||||
sm: {span: 21}
|
||||
},
|
||||
validatorRules: {
|
||||
companyId: {
|
||||
rules: [{required: true, message: '请选择参会企业'}],
|
||||
validateTrigger: 'change'
|
||||
},
|
||||
inviteCode: {
|
||||
rules: [{required: true, message: '请选择是否有邀请码'}],
|
||||
validateTrigger: 'change'
|
||||
},
|
||||
code: {
|
||||
rules: [{required: true, message: '请输入邀请码'}],
|
||||
validateTrigger: 'blur'
|
||||
},
|
||||
companyContactId: {
|
||||
rules: [{required: true, message: '请选择参会人'}],
|
||||
validateTrigger: 'change'
|
||||
},
|
||||
phone: {
|
||||
rules: [{required: true, message: '请输入手机号'}],
|
||||
validateTrigger: 'blur'
|
||||
},
|
||||
identify: {
|
||||
rules: [{required: true, message: '请选择身份'}],
|
||||
validateTrigger: 'change'
|
||||
},
|
||||
guestType: {
|
||||
rules: [{required: true, message: '请选择嘉宾类型'}],
|
||||
validateTrigger: 'change'
|
||||
}
|
||||
},
|
||||
// 身份类型
|
||||
identifyType: null,
|
||||
// 嘉宾类型
|
||||
guestType: null,
|
||||
selectedCompany: null,
|
||||
// 会议类型
|
||||
meetingType: '',
|
||||
// 会议id
|
||||
meetingId: '',
|
||||
// 会议费用合计
|
||||
meetingCostSum: '',
|
||||
// 会议费用是否为0
|
||||
meetingCostBool: false,
|
||||
// 是否有邀请码
|
||||
inviteCodeBool: false,
|
||||
// 邀请码错误状态
|
||||
codeErrorBool: true,
|
||||
// 是否是打包
|
||||
isPackBool: false,
|
||||
// 国际研讨会身份的控制
|
||||
identityBool: false,
|
||||
// 是否是标协成员
|
||||
isStandardBool: false,
|
||||
// url是否有id字段 默认没有
|
||||
urlHaveIdBool: false,
|
||||
url: {
|
||||
add: '/meeting/payMeetingSituation/signUp'
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
document.title = '会议报名'
|
||||
// 获取会议id
|
||||
let id = this.GetQueryString('id')
|
||||
this.urlHaveIdBool = id ? true : false
|
||||
this.meetingId = id
|
||||
if (id) {
|
||||
this.getMeetingInfo(id)
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
/*
|
||||
* 获取会议详情
|
||||
* */
|
||||
getMeetingInfo(params) {
|
||||
// 增加点注释 提交代码
|
||||
getMeetInfoById({id: params}).then(res => {
|
||||
if (res.success) {
|
||||
this.currentMeetingInfo = res.result
|
||||
this.meetingType = this.currentMeetingInfo.meetingType
|
||||
// 初始化会议费用
|
||||
if (this.currentMeetingInfo.meetingCostsVip) {
|
||||
this.meetingMoney = `普通会员(${this.currentMeetingInfo.meetingCosts}/人) 标协会员(${this.currentMeetingInfo.meetingCostsVip}/人)`
|
||||
// 费用合计
|
||||
this.meetingCostSum = this.currentMeetingInfo.meetingCosts
|
||||
} else {
|
||||
this.meetingMoney = `${this.currentMeetingInfo.meetingCosts}/人`
|
||||
// 费用合计
|
||||
this.meetingCostSum = this.currentMeetingInfo.meetingCosts
|
||||
}
|
||||
// 初始化召开时间
|
||||
if (this.currentMeetingInfo.startTime) {
|
||||
this.holdtime = this.currentMeetingInfo.startTime + '~' + this.currentMeetingInfo.endTime
|
||||
}
|
||||
// 初始化召开地点
|
||||
if (this.currentMeetingInfo.venue) {
|
||||
this.holdAddress = this.currentMeetingInfo.venue + '/' + this.currentMeetingInfo.address
|
||||
}
|
||||
// 计算会议费用 会议费用为0 报名信息不显示邮寄信息与缴费信息 标协会议
|
||||
if (this.currentMeetingInfo.meetingType === '2' && this.currentMeetingInfo.meetingCostsVip) {
|
||||
// 标协会员的费用
|
||||
let vipCost = this.currentMeetingInfo.meetingCostsVip
|
||||
// 判断标协会员的费用是否是0
|
||||
let flagVip = vipCost === 0 || vipCost === '0.00'
|
||||
let cost = this.currentMeetingInfo.meetingCosts
|
||||
// 判断普通会员的费用是否是0
|
||||
let flag = cost === 0 || cost === '0.00'
|
||||
if (flag && flagVip) {
|
||||
// 说明会议费用为0
|
||||
this.meetingCostBool = true
|
||||
} else {
|
||||
this.meetingCostBool = false
|
||||
}
|
||||
// 其他会议值判断一个费用
|
||||
} else if (this.currentMeetingInfo.meetingCosts) {
|
||||
// 判断其他会议
|
||||
let cost = this.currentMeetingInfo.meetingCosts
|
||||
// 判断普通会员的费用是否是0
|
||||
let flag = cost === 0 || cost === '0.00'
|
||||
if (flag) {
|
||||
this.meetingCostBool = true
|
||||
} else {
|
||||
this.meetingCostBool = false
|
||||
}
|
||||
}
|
||||
} else {
|
||||
this.urlHaveIdBool = false
|
||||
}
|
||||
})
|
||||
},
|
||||
/*
|
||||
* 会议类型
|
||||
* */
|
||||
initMeetingType(val) {
|
||||
if (val) {
|
||||
switch (val) {
|
||||
case '1':
|
||||
return '工作组会议'
|
||||
case '2':
|
||||
switch (this.currentMeetingInfo.tbMeetingType + '') {
|
||||
case '1':
|
||||
return '标协会议-标准宣贯'
|
||||
case '2':
|
||||
return '标协会议-培训会'
|
||||
case '3':
|
||||
return '标协会议-信息交流会'
|
||||
}
|
||||
break
|
||||
case '3':
|
||||
return '国际研讨会'
|
||||
case '4':
|
||||
return '其他会议'
|
||||
case '5':
|
||||
return '分标委会议'
|
||||
case '6':
|
||||
return '理事会会议'
|
||||
}
|
||||
} else {
|
||||
return ''
|
||||
}
|
||||
},
|
||||
/**
|
||||
* 获取url的参数
|
||||
* @param name要获取的参数名
|
||||
* */
|
||||
GetQueryString(name) {
|
||||
let reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)')
|
||||
let r = window.location.search.substr(1).match(reg)
|
||||
if (r != null) return unescape(r[2])
|
||||
return null
|
||||
},
|
||||
// 是否打包 打包会议费用为
|
||||
/*
|
||||
* 确定
|
||||
* */
|
||||
handleOk() {
|
||||
const that = this
|
||||
// 其他会议的表单验证
|
||||
if (this.$refs.formother !== undefined) {
|
||||
this.$refs.formother.handleOk()
|
||||
}
|
||||
// 国际研讨会 VIP 演讲嘉宾 特邀嘉宾 的表单验证
|
||||
if (this.$refs.seminarVipForm !== undefined) {
|
||||
this.$refs.seminarVipForm.handleOk()
|
||||
}
|
||||
// 国际研讨会的合作伙伴的表单验证
|
||||
if (this.$refs.seminarPartnerForm !== undefined) {
|
||||
this.$refs.seminarPartnerForm.handleOk()
|
||||
}
|
||||
if (this.formData.stop) {
|
||||
return
|
||||
}
|
||||
this.form.validateFields((err, values) => {
|
||||
if (!err) {
|
||||
// 判断邀请码是否错误 需要判断会议类型 以及 是否有邀请码
|
||||
if (this.codeErrorBool && this.currentMeetingInfo.meetingType === '3' && this.inviteCodeBool) {
|
||||
this.$message.error('邀请码填写错误')
|
||||
return
|
||||
}
|
||||
this.confirmLoading = true
|
||||
let submitData = Object.assign({}, values, this.formData)
|
||||
submitData.companyId = values.companyId.id
|
||||
// 会议id
|
||||
submitData.meetingId = this.meetingId
|
||||
// 会议类型
|
||||
submitData.meetingType = this.meetingType
|
||||
// 身份
|
||||
submitData.identity = values.identity || this.identifyType
|
||||
// 嘉宾类型
|
||||
submitData.guestType = values.guestType || this.guestType
|
||||
// 会议费用为0 参数设置需要发票为0
|
||||
if(this.meetingCostSum === '0.00' ){
|
||||
submitData.needInvoice = 0
|
||||
}
|
||||
console.log(submitData)
|
||||
let url = this.url.add
|
||||
let method = 'post'
|
||||
httpAction(url, submitData, method).then(res => {
|
||||
if (res.success) {
|
||||
that.$emit('ok')
|
||||
|
||||
// that.$message.success(res.message)
|
||||
that.$notification.success({
|
||||
message: '报名成功',
|
||||
})
|
||||
setTimeout(() => {
|
||||
that.handleCancel()
|
||||
},500)
|
||||
that.confirmLoading = false
|
||||
} else {
|
||||
that.$message.warn(res.message)
|
||||
}
|
||||
}).finally(() => {
|
||||
that.confirmLoading = false
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
/*
|
||||
* 获取表单的值
|
||||
* */
|
||||
getFormData(value) {
|
||||
this.formData = Object.assign({}, value)
|
||||
},
|
||||
/*
|
||||
* 改变身份
|
||||
* */
|
||||
changeIdentify(e) {
|
||||
this.identifyType = e.target.value
|
||||
// 切换身份清除上次选择的值
|
||||
if (e.target.value !== 1) {
|
||||
this.guestType = null
|
||||
}
|
||||
// 当前会议是国际研讨会 并且选择身份是内部企业的会议费用为0
|
||||
if(e.target.value === 3 && this.currentMeetingInfo.meetingType === '3' ){
|
||||
this.meetingCostSum = '0.00'
|
||||
}else {
|
||||
this.meetingCostSum = this.currentMeetingInfo.meetingCosts
|
||||
}
|
||||
// 当前会议不是国际研讨会议 身份选择嘉宾和 内部企业的会议费用为0
|
||||
if(e.target.value !== 2 && this.currentMeetingInfo.meetingType !== '3' ){
|
||||
this.meetingCostSum = '0.00'
|
||||
}else {
|
||||
// 会议是标协会议的话 需要判断企业是否是标协会员的企业
|
||||
if(this.currentMeetingInfo.meetingType === '2' && this.isStandardBool){
|
||||
this.meetingCostSum = this.currentMeetingInfo.meetingCostsVip
|
||||
}else if(this.currentMeetingInfo.meetingType === '2'){
|
||||
this.meetingCostSum = this.currentMeetingInfo.meetingCosts
|
||||
}
|
||||
|
||||
}
|
||||
},
|
||||
/*
|
||||
* 选择嘉宾类型
|
||||
* */
|
||||
changeGuestType(e) {
|
||||
this.guestType = e.target.value
|
||||
},
|
||||
/*
|
||||
* 选择参会企业
|
||||
* */
|
||||
changeCompany(value) {
|
||||
this.selectedCompany = value
|
||||
// 通过企业名称判断当前参会人
|
||||
if (this.currentMeetingInfo.meetingType + '' === '2') {
|
||||
validateStandard({companyName: this.selectedCompany.companyName}).then(res => {
|
||||
this.isStandardBool = res.result
|
||||
if (this.isStandardBool) {
|
||||
this.meetingCostSum = this.currentMeetingInfo.meetingCostsVip
|
||||
}else {
|
||||
this.meetingCostSum = this.currentMeetingInfo.meetingCosts
|
||||
}
|
||||
})
|
||||
}
|
||||
// 选择企业清空 姓名 手机号
|
||||
this.form.resetFields(['companyContactId', 'phone'])
|
||||
if (this.$refs.formother) {
|
||||
this.$refs.formother.clearFormItem()
|
||||
}
|
||||
|
||||
},
|
||||
/*
|
||||
* 选择联系人获取信息
|
||||
* */
|
||||
changeContact(val) {
|
||||
// 监听删除联系人的时候 清除对应的表单赋值
|
||||
if(val === undefined){
|
||||
this.form.resetFields(['phone'])
|
||||
}
|
||||
const that = this
|
||||
// 通过id查询联系人信息
|
||||
getContactsById({id: val}).then(res => {
|
||||
const model = Object.assign({}, res.result)
|
||||
// 设置手机 邮箱 职务
|
||||
if (res.success) {
|
||||
that.form.setFieldsValue(pick(model, 'phone'))
|
||||
}
|
||||
// 设置邮寄联系人和地址
|
||||
if (this.$refs.formother !== undefined) {
|
||||
this.$refs.formother.setAddressVal(res.result)
|
||||
}
|
||||
})
|
||||
},
|
||||
/*
|
||||
* 是否有邀请码
|
||||
* */
|
||||
changeInviteCode(e) {
|
||||
if (e.target.value === 1) {
|
||||
// 选择是说明身份是嘉宾
|
||||
this.identifyType = 1
|
||||
this.inviteCodeBool = true
|
||||
this.identityBool = false
|
||||
} else if (e.target.value === 0) {
|
||||
this.inviteCodeBool = false
|
||||
this.identityBool = true
|
||||
// 选的否 身份置空
|
||||
this.identifyType = null
|
||||
// 嘉宾类型置空
|
||||
this.guestType = null
|
||||
this.$nextTick(() => {
|
||||
if (this.$refs.formother) {
|
||||
this.$refs.formother.isLimitBool = true
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
/*
|
||||
* 取消
|
||||
* */
|
||||
handleCancel() {
|
||||
this.$router.go(-1)
|
||||
},
|
||||
/*
|
||||
* 下一步
|
||||
* */
|
||||
nextSetp() {
|
||||
this.form.validateFields(['code'],(err) => {
|
||||
if(!err){
|
||||
// 获取邀请码
|
||||
let code = this.form.getFieldValue('code')
|
||||
switch (code) {
|
||||
// 合作伙伴
|
||||
case this.currentMeetingInfo.cooperativeInvitationCode:
|
||||
this.identifyType = 1
|
||||
this.guestType = 4
|
||||
break
|
||||
// 演讲嘉宾
|
||||
case this.currentMeetingInfo.speakerInvitationCode:
|
||||
this.identifyType = 1
|
||||
this.guestType = 2
|
||||
break
|
||||
// 特邀嘉宾
|
||||
case this.currentMeetingInfo.guestInvitationCode:
|
||||
this.identifyType = 1
|
||||
this.guestType = 3
|
||||
break
|
||||
// vip
|
||||
case this.currentMeetingInfo.vipInvitationCode:
|
||||
this.identifyType = 1
|
||||
this.guestType = 1
|
||||
break
|
||||
default :
|
||||
this.guestType = null
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
|
||||
|
||||
},
|
||||
/*
|
||||
* 校验邀请码是否正确 给出提示
|
||||
* */
|
||||
validateCode() {
|
||||
let code = this.form.getFieldValue('code')
|
||||
if(code === undefined || code === ''){
|
||||
return
|
||||
}
|
||||
let flag = false
|
||||
switch (code) {
|
||||
// 合作伙伴
|
||||
case this.currentMeetingInfo.cooperativeInvitationCode:
|
||||
flag = true
|
||||
break
|
||||
// 演讲嘉宾
|
||||
case this.currentMeetingInfo.speakerInvitationCode:
|
||||
flag = true
|
||||
break
|
||||
// 特邀嘉宾
|
||||
case this.currentMeetingInfo.guestInvitationCode:
|
||||
flag = true
|
||||
break
|
||||
// vip
|
||||
case this.currentMeetingInfo.vipInvitationCode:
|
||||
flag = true
|
||||
break
|
||||
default :
|
||||
flag = false
|
||||
}
|
||||
// 保存错误状态
|
||||
this.codeErrorBool = !flag
|
||||
// 判断guestType 是否等于 null
|
||||
if (!flag) {
|
||||
// 错误
|
||||
this.$message.warn('邀请码填写错误')
|
||||
this.guestType = null
|
||||
this.meetingCostSum = this.currentMeetingInfo.meetingCosts
|
||||
} else {
|
||||
this.$message.success('邀请码填写正确')
|
||||
this.meetingCostSum = '0.00'
|
||||
}
|
||||
},
|
||||
addContactsOk() {
|
||||
this.$refs.selectContacts.getContactsList()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.header {
|
||||
text-align: center;
|
||||
position: relative;
|
||||
user-select: none;
|
||||
|
||||
.header-img {
|
||||
width: 100%;
|
||||
min-width: 1200px;
|
||||
height: 450px;
|
||||
}
|
||||
|
||||
.meeting-name {
|
||||
width: 80%;
|
||||
min-width: 1200px;
|
||||
position: absolute;
|
||||
font-family: PingFang SC, PingFang SC-Bold;
|
||||
font-weight: 700;
|
||||
letter-spacing: 2px;
|
||||
color: #fff;
|
||||
font-size: 42px;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
}
|
||||
}
|
||||
|
||||
.content {
|
||||
user-select: none;
|
||||
background: rgba(240, 242, 245);
|
||||
|
||||
.main-content {
|
||||
min-height: calc(100vh - 450px);
|
||||
margin: 0 auto;
|
||||
padding: 20px;
|
||||
box-sizing: border-box;
|
||||
width: 80%;
|
||||
min-width: 1200px;
|
||||
background: #fff;
|
||||
font-family: PingFang SC, PingFang SC-Medium;
|
||||
|
||||
&-title {
|
||||
text-align: left;
|
||||
padding-left: 20px;
|
||||
width: 100%;
|
||||
background: rgba(8, 182, 175, .1);
|
||||
color: #333;
|
||||
font-family: PingFang SC, PingFang SC-Medium;
|
||||
letter-spacing: 1px;
|
||||
font-weight: bold;
|
||||
font-size: 18px;
|
||||
height: 50px;
|
||||
line-height: 50px;
|
||||
}
|
||||
|
||||
&-info {
|
||||
padding: 20px 20px 0 20px;
|
||||
box-sizing: border-box;
|
||||
font-size: 16px;
|
||||
color: #555;
|
||||
line-height: 2.1;
|
||||
}
|
||||
}
|
||||
}
|
||||
.color-red {
|
||||
color: red;
|
||||
}
|
||||
.qr-code {
|
||||
width: 140px;
|
||||
height: 140px;
|
||||
}
|
||||
|
||||
.mt-10 {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.action {
|
||||
text-align: right;
|
||||
|
||||
.submit {
|
||||
margin-right: 8px;
|
||||
}
|
||||
}
|
||||
|
||||
.meetingCost {
|
||||
text-align: right;
|
||||
padding-right: 20px;
|
||||
width: 100%;
|
||||
background: #F7F7F7;
|
||||
color: #333;
|
||||
font-family: PingFang SC, PingFang SC-Medium;
|
||||
font-weight: bold;
|
||||
font-size: 18px;
|
||||
height: 50px;
|
||||
line-height: 50px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.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;
|
||||
}
|
||||
}
|
||||
|
||||
.center {
|
||||
text-align: center;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
</style>
|
||||
+1
-1
@@ -98,7 +98,7 @@ module.exports = {
|
||||
// 会员系统的路由转发
|
||||
'/memberApi': {
|
||||
// target: 'http://localhost:9000', //请求本地 jero-boot后台项目
|
||||
target: 'http://localhost:8080', //请求本地 jero-boot后台项目
|
||||
target: 'http://localhost:8081', //请求本地 jero-boot后台项目
|
||||
ws: false,
|
||||
changeOrigin: true,
|
||||
pathRewrite: {
|
||||
|
||||
Reference in New Issue
Block a user