341 lines
12 KiB
Vue
341 lines
12 KiB
Vue
<template>
|
|
<a-drawer
|
|
:title="title"
|
|
:width="width"
|
|
placement="right"
|
|
:closable="true"
|
|
@close="handleCancel"
|
|
:visible="visible"
|
|
:maskClosable="false"
|
|
class="custom-drawer-style">
|
|
|
|
<div class="custom-drawer-style-scroll">
|
|
<a-spin :spinning="confirmLoading">
|
|
<!--基础信息-->
|
|
<div class="header-text">{{ $t('basicInformation') }}</div>
|
|
<a-form :form="form">
|
|
<!--上级节点-->
|
|
<a-form-item :labelCol="labelCol"
|
|
:wrapperCol="wrapperCol"
|
|
:label="$t('businessSupport.standardizationActivity.parentNode')">
|
|
<a-input :placeholder="$t('pleaseEnter') + $t('businessSupport.standardizationActivity.parentNode')"
|
|
@change="event => event.target.value = event.target.value.trim()"
|
|
:maxLength="50"
|
|
disabled
|
|
v-decorator="['pName', validatorRules.pName]" />
|
|
</a-form-item>
|
|
<!--节点类型-->
|
|
<a-form-item :labelCol="labelCol"
|
|
:wrapperCol="wrapperCol"
|
|
:label="$t('businessSupport.standardizationActivity.nodeTypes')">
|
|
<a-input :placeholder="$t('pleaseEnter') + $t('businessSupport.standardizationActivity.nodeTypes')"
|
|
@change="event => event.target.value = event.target.value.trim()"
|
|
:maxLength="50"
|
|
disabled
|
|
v-decorator="['standardizationType', validatorRules.standardizationType]" />
|
|
</a-form-item>
|
|
<!--编号-->
|
|
<a-form-item :labelCol="labelCol"
|
|
:wrapperCol="wrapperCol"
|
|
:label="$t('number')">
|
|
<a-input :placeholder="$t('pleaseEnter') + $t('number')"
|
|
@change="event => event.target.value = event.target.value.trim()"
|
|
:maxLength="50"
|
|
:disabled="disabled"
|
|
v-decorator="['num', validatorRules.num]" />
|
|
</a-form-item>
|
|
<!--名称-->
|
|
<a-form-item :labelCol="labelCol"
|
|
:wrapperCol="wrapperCol"
|
|
:label="$t('name')">
|
|
<a-input :placeholder="$t('pleaseEnter') + $t('name')"
|
|
@change="event => event.target.value = event.target.value.trim()"
|
|
:maxLength="50"
|
|
:disabled="disabled"
|
|
v-decorator="['name', validatorRules.name]" />
|
|
</a-form-item>
|
|
<!--标准化工作领域-->
|
|
<a-form-item :labelCol="labelCol"
|
|
:wrapperCol="wrapperCol"
|
|
:label="$t('businessSupport.standardizationActivity.standardizationWorkArea')">
|
|
<a-input :placeholder="$t('pleaseEnter') + $t('businessSupport.standardizationActivity.standardizationWorkArea')"
|
|
@change="event => event.target.value = event.target.value.trim()"
|
|
:maxLength="50"
|
|
:disabled="disabled"
|
|
v-decorator="['workingArea', validatorRules.workingArea]" />
|
|
</a-form-item>
|
|
<!--备注-->
|
|
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" :label="$t('remarks')">
|
|
<a-textarea :placeholder="$t('pleaseEnter') + $t('remarks')"
|
|
:maxLength="500"
|
|
:rows="4"
|
|
:disabled="disabled"
|
|
v-decorator="['notes', validatorRules.notes]" />
|
|
</a-form-item>
|
|
</a-form>
|
|
|
|
<!--联络人联系方式-->
|
|
<div class="header-text">{{ $t('businessSupport.standardizationActivity.contactPersonContactInformation') }}</div>
|
|
<contact-table :data-source="contactDataSource" :disabled="disabled" @ok="contactModalOk" />
|
|
|
|
<!--集团参与情况-->
|
|
<div class="header-text">{{ $t('businessSupport.standardizationActivity.groupParticipation') }}</div>
|
|
<group-table :data-source="groupDataSource" :disabled="disabled" @ok="groupModalOk" />
|
|
|
|
<!--支付信息-->
|
|
<div class="header-text">{{ $t('businessSupport.standardizationActivity.paymentInfo') }}</div>
|
|
<payment-table :data-source="paymentDataSource" :disabled="disabled" @ok="paymentModalOk" />
|
|
|
|
<!--参会记录-->
|
|
<div class="header-text">{{ $t('businessSupport.standardizationActivity.attendanceRecord') }}</div>
|
|
<meeting-table :data-source="meetingDataSource" :disabled="disabled" @ok="meetingModalOk" />
|
|
</a-spin>
|
|
</div>
|
|
|
|
<div class="custom-drawer-style-bottom-btn">
|
|
<a-button type="primary" class="footer-btn-save" @click="handleOk">{{ $t('preservation') }}</a-button>
|
|
<a-button @click="handleCancel">{{ $t('cancel') }}</a-button>
|
|
</div>
|
|
|
|
</a-drawer>
|
|
</template>
|
|
|
|
<script>
|
|
import { StandardizedActivityType } from '../../../../enums/commonEnums'
|
|
import JTable from '../../../../components/jero/JTable'
|
|
import ContactModal from './ContactModal'
|
|
import GroupModal from './GroupModal'
|
|
import PaymentModal from './PaymentModal'
|
|
import MeetingModal from './MeetingModal'
|
|
import { addNode, editNode, queryTableDataById } from '../../../../api/businessSupport'
|
|
import ContactTable from '../tables/ContactTable'
|
|
import GroupTable from '../tables/GroupTable'
|
|
import PaymentTable from '../tables/PaymentTable'
|
|
import MeetingTable from '../tables/MeetingTable'
|
|
|
|
export default {
|
|
name: 'StandardizationActivityDrawer',
|
|
components: {
|
|
JTable,
|
|
ContactModal,
|
|
GroupModal,
|
|
PaymentModal,
|
|
MeetingModal,
|
|
ContactTable,
|
|
GroupTable,
|
|
PaymentTable,
|
|
MeetingTable
|
|
},
|
|
data () {
|
|
return {
|
|
title: this.$t('newlyAdded'),
|
|
width: 800,
|
|
visible: false,
|
|
confirmLoading: false,
|
|
model: {},
|
|
form: this.$form.createForm(this),
|
|
labelCol: {
|
|
xs: { span: 24 },
|
|
sm: { span: 4 }
|
|
},
|
|
wrapperCol: {
|
|
xs: { span: 24 },
|
|
sm: { span: 20 }
|
|
},
|
|
validatorRules: {
|
|
// 上级节点
|
|
pName: {
|
|
rules: [{
|
|
required: false,
|
|
message: this.$t('pleaseEnter') + this.$t('businessSupport.standardizationActivity.parentNode')
|
|
}],
|
|
validateTrigger: 'blur'
|
|
},
|
|
// 节点类型
|
|
standardizationType: {
|
|
rules: [{
|
|
required: false,
|
|
message: this.$t('pleaseEnter') + this.$t('businessSupport.standardizationActivity.nodeTypes')
|
|
}],
|
|
validateTrigger: 'blur'
|
|
},
|
|
// 编号
|
|
num: {
|
|
rules: [{
|
|
required: true,
|
|
message: this.$t('pleaseEnter') + this.$t('number')
|
|
}],
|
|
validateTrigger: 'blur'
|
|
},
|
|
// 名称
|
|
name: {
|
|
rules: [{
|
|
required: true,
|
|
message: this.$t('pleaseEnter') + this.$t('name')
|
|
}],
|
|
validateTrigger: 'blur'
|
|
},
|
|
// 标准化工作领域
|
|
workingArea: {
|
|
rules: [{
|
|
required: true,
|
|
message: this.$t('pleaseEnter') + this.$t('businessSupport.standardizationActivity.standardizationWorkArea')
|
|
}],
|
|
validateTrigger: 'blur'
|
|
},
|
|
// 备注
|
|
notes: {
|
|
rules: [{
|
|
required: false,
|
|
message: this.$t('pleaseEnter') + this.$t('remarks')
|
|
}]
|
|
}
|
|
},
|
|
// 联络人联系方式表格
|
|
contactDataSource: [],
|
|
// 集团参与情况
|
|
groupDataSource: [],
|
|
// 支付信息
|
|
paymentDataSource: [],
|
|
// 参会记录
|
|
meetingDataSource: [],
|
|
uploadTable: {}, // 上传文件
|
|
disabled: false
|
|
}
|
|
},
|
|
methods: {
|
|
add (record) {
|
|
this.title = this.$t('newlyAdded')
|
|
this.visible = true
|
|
record.standardizationType = StandardizedActivityType.nameOfIndex(record.level + 1 + '')
|
|
this.model = Object.assign({}, record)
|
|
this.$nextTick(() => {
|
|
this.form.setFieldsValue(this.model)
|
|
})
|
|
},
|
|
edit (id) {
|
|
this.visible = true
|
|
this.getDetailData(id)
|
|
},
|
|
view (id) {
|
|
this.visible = true
|
|
this.disabled = true
|
|
this.getDetailData(id)
|
|
},
|
|
getDetailData (id) {
|
|
this.confirmLoading = true
|
|
// 获取详情数据
|
|
queryTableDataById({ id }).then(res => {
|
|
if (res.success) {
|
|
const result = res.result || {}
|
|
this.model = Object.assign({}, result.lawsStandardization || {})
|
|
this.$nextTick(() => {
|
|
this.form.setFieldsValue(this.model)
|
|
})
|
|
// 联络人联系方式
|
|
this.contactDataSource = result.standardizationLiaisonList
|
|
// 集团参与情况
|
|
this.groupDataSource = result.standardizationGroupList
|
|
// 支付信息
|
|
this.paymentDataSource = result.standardizationPayments
|
|
// 参会记录
|
|
this.meetingDataSource = result.standardizationMeetings
|
|
} else {
|
|
this.$message.warning(res.message)
|
|
}
|
|
}).finally(() => {
|
|
this.confirmLoading = false
|
|
})
|
|
},
|
|
handleOk () {
|
|
this.form.validateFields((errors, values) => {
|
|
if (!errors) {
|
|
const formData = Object.assign(this.model, values)
|
|
// 联络人联系方式
|
|
formData.standardizationLiaisonList = this.contactDataSource
|
|
// 集团参与情况
|
|
formData.standardizationGroupList = this.groupDataSource
|
|
// 支付记录
|
|
formData.standardizationPayments = this.paymentDataSource
|
|
// 参会记录
|
|
formData.standardizationMeetings = this.meetingDataSource
|
|
this.confirmLoading = true
|
|
let submitFunc
|
|
if (this.model.id) {
|
|
submitFunc = editNode
|
|
} else {
|
|
submitFunc = addNode
|
|
}
|
|
submitFunc(formData).then(res => {
|
|
if (res.success) {
|
|
this.$message.success(res.message)
|
|
this.$emit('ok')
|
|
this.close()
|
|
} else {
|
|
this.$message.warning(res.message)
|
|
}
|
|
}).finally(() => {
|
|
this.confirmLoading = false
|
|
})
|
|
}
|
|
})
|
|
},
|
|
handleCancel () {
|
|
this.close()
|
|
},
|
|
close () {
|
|
this.visible = false
|
|
this.form.resetFields()
|
|
this.model = {}
|
|
},
|
|
// 添加参会记录
|
|
handleAddMeeting () {
|
|
this.$refs.meetingModal.add()
|
|
},
|
|
// 删除参会记录
|
|
handleDeleteMeeting () {
|
|
this.$confirm({
|
|
title: this.$t('confirmDeletion'),
|
|
content: this.$t('areYouSure'),
|
|
onOk: () => {
|
|
const data = JSON.parse(JSON.stringify(this.meetingDataSource))
|
|
this.meetingSelectedRowKeys.forEach(index => {
|
|
data[index] = null
|
|
})
|
|
this.meetingSelectedRowKeys = []
|
|
this.meetingDataSource = data.filter(tt => !!tt)
|
|
}
|
|
})
|
|
},
|
|
onMeetingSelectChange (selectedRowKeys) {
|
|
this.meetingSelectedRowKeys = selectedRowKeys
|
|
},
|
|
contactModalOk (data) {
|
|
this.contactDataSource = JSON.parse(JSON.stringify(data))
|
|
},
|
|
groupModalOk (data) {
|
|
this.groupDataSource = JSON.parse(JSON.stringify(data))
|
|
},
|
|
paymentModalOk (data) {
|
|
this.paymentDataSource = JSON.parse(JSON.stringify(data))
|
|
},
|
|
meetingModalOk (data) {
|
|
this.meetingDataSource = JSON.parse(JSON.stringify(data))
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped lang="less">
|
|
@import '~@assets/less/common.less';
|
|
|
|
.header-text {
|
|
margin-top: 30px;
|
|
margin-bottom: 15px;
|
|
}
|
|
|
|
.header-text:first-child {
|
|
margin-top: 0;
|
|
}
|
|
|
|
</style> |