add 标准化活动

This commit is contained in:
赵霄
2023-11-06 20:25:44 +08:00
parent 340e52b56f
commit 03f6b5dae5
18 changed files with 1864 additions and 27 deletions
+13 -1
View File
@@ -11,6 +11,14 @@ const deleteAnswer = (params) => postAction('/laws/library/lawsProblemLibrary/de
// 标准化活动-树形图
const queryTreeList = (params) => getAction('/laws/standardization/lawsStandardization/queryTreeList', params)
// 标准化活动-新增
const addNode = (params) => postAction('/laws/standardization/lawsStandardization/add', params)
// 标准化活动-编辑
const editNode = (params) => postAction('/laws/standardization/lawsStandardization/edit', params)
// 标准化活动-通过id查询
const queryById = (params) => getAction('/laws/standardization/lawsStandardization/queryById', params)
// 标准化活动-通过id查询表格信息
const queryTableDataById = (params) => getAction('/laws/standardization/lawsStandardization/queryDetailById', params)
export {
getQuizById,
@@ -19,5 +27,9 @@ export {
deleteAnswer,
// 标准化活动
queryTreeList
queryTreeList,
addNode,
editNode,
queryById,
queryTableDataById
}
+26 -1
View File
@@ -2,7 +2,32 @@ module.exports = {
// 标准化活动
standardizationActivity: {
nodeName: '节点名称', // 节点名称
currentNode: '当前节点'
currentNode: '当前节点',
conferenceStatisticsList: '会议统计列表',
pleaseSelectNode: '请选择一个节点',
parentNode: '上级节点',
nodeTypes: '节点类型',
standardizationWorkArea: '标准化工作领域',
contactPersonContactInformation: '联络人联系方式',
unit: '单位',
phone: '电话',
groupParticipation: '集团参与情况',
paymentInfo: '支付信息',
attendanceRecord: '参会记录',
addContactInformation: '添加联系方式',
addParticipation: '添加参与情况',
addPaymentInfo: '添加支付信息',
addAttendanceRecord: '添加参会记录',
order: '我司在工作组排名顺序',
ourPersonnel: '我司人员',
data: '资料',
cost: '费用',
year: '年份',
plan: '计划内',
paymentMethod: '缴费方式',
expenseReimbursement: '费用列支',
meetingMaterial: '会议资料',
pleaseEnterCorrectPhone: '请输入正确格式的电话'
},
// 问答库
questionAnswer: {
+16 -13
View File
@@ -72,7 +72,7 @@ export default {
nodeWidth: {
type: Number,
required: false,
default: 300
default: 400
},
// 节点高度
nodeHeight: {
@@ -99,7 +99,6 @@ export default {
watch: {
mapData: {
handler () {
console.log(this.mapData)
this.data = JSON.parse(JSON.stringify(this.mapData))
if (this.loadEnd && this.data.id) {
this.initMindMap()
@@ -126,7 +125,6 @@ export default {
}
G6.registerNode('tree-node', {
drawShape: (cfg, group) => {
console.log('自定义节点了',cfg)
const nodeColorIndex = cfg.depth % NODE_COLOR.length
const nodeStyle = NODE_COLOR[nodeColorIndex]
// 节点整体的内容
@@ -155,12 +153,12 @@ export default {
})
// 文本的部分
let textContent = cfg.name || ''
if (textContent.length > 40) {
textContent = textContent.slice(0, 20) + '\n' + textContent.slice(20, 40) + '\n' + textContent.slice(40)
} else if (textContent.length > 20) {
textContent = textContent.slice(0, 20) + '\n' + textContent.slice(20)
}
let textContent = (cfg.num || '') + ' ' + (cfg.name || '')
// if (textContent.length > 40) {
// textContent = textContent.slice(0, 20) + '\n' + textContent.slice(20, 40) + '\n' + textContent.slice(40)
// } else if (textContent.length > 20) {
// textContent = textContent.slice(0, 20) + '\n' + textContent.slice(20)
// }
group.addShape('text', {
attrs: {
text: textContent,
@@ -199,7 +197,6 @@ export default {
return nodeContainer
},
setState (name, value, item) {
console.log(name, value)
const group = item.getContainer()
const nodeDom = group.get('children')
const nodeBox = nodeDom[1]
@@ -255,9 +252,9 @@ export default {
}
}
})
G6.Util.traverseTree(this.data, (item) => {
item.id = item[this.mapDataKeyField]
})
// G6.Util.traverseTree(this.data, (item) => {
// item.id = item[this.mapDataKeyField]
// })
this.graph.data(this.data)
this.graph.render()
this.graph.fitView()
@@ -288,6 +285,12 @@ export default {
this.selectedNodeId = item._cfg.id
this.graph.refreshItem(item._cfg.id)
this.graph.layout()
// 选中抛出节点信息,取消选中抛出一个空对象
if (item.getModel().selected) {
this.$emit('select', item._cfg.model)
} else {
this.$emit('select', {})
}
},
/**
* 查询,定位高亮
-1
View File
@@ -475,7 +475,6 @@ export default {
rules[res.dbFieldName] = rule
}
})
console.log(rules)
this.rules = rules
this.isFormInline = true
this.confirmLoading = false
@@ -310,6 +310,7 @@ export default {
}
this.$emit('nameChange', this.dataSourceRight.map(item => item.realname + '(' + item.username + ')').join(','))
this.$emit('change', this.selectedRowKeys.join(','))
this.$emit('listChange', this.dataSourceRight)
this.close()
},
handleCancel () {
+10 -1
View File
@@ -17,7 +17,12 @@
{{ $t('userSelect.select') }}
</a-button>
</div>
<user-select-modal v-bind="$attrs" :nameStr="nameStr" ref="selectModal" @change="selectChange" @nameChange="nameChange"></user-select-modal>
<user-select-modal v-bind="$attrs"
:nameStr="nameStr"
ref="selectModal"
@change="selectChange"
@nameChange="nameChange"
@listChange="listChange" />
</div>
</template>
@@ -82,6 +87,9 @@ export default {
nameChange (value) {
this.checkedValue = value
this.$emit('nameChange', value, this.filedName)
},
listChange (list) {
this.$emit('listChange', list)
}
},
model: {
@@ -103,6 +111,7 @@ export default {
resize: none;
width: calc(100% - 70px);
}
// 因为需要加title,所以不能把鼠标事件去掉
/deep/ .ant-input-disabled {
background: #fff;
+8
View File
@@ -164,3 +164,11 @@ export const StandardProperty = {
admittance: { text: '准入性', value: 'SN001' },
recommendation: { text: '推荐性', value: 'SN002' }
}
// 标准化活动类型
export const StandardizedActivityType = new EsEnums({
rootNode: { text: '根节点', value: '1' },
secondLevelBidCommittee: { text: '分标委', value: '2' },
workingTeam: { text: '工作组', value: '3' },
fourLevelBiddingCommittee: { text: '分标委', value: '4' }
})
+12 -2
View File
@@ -1,9 +1,10 @@
/**
* 邮箱
* @param {*} s
* 之前的正则 /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/
*/
export function isEmail (s) {
return /^([a-zA-Z0-9._-])+@([a-zA-Z0-9_-])+((.[a-zA-Z0-9_-]{2,3}){1,2})$/.test(s)
export function isEmail(s) {
return /^\w[-\w.+]*@([A-Za-z0-9][-A-Za-z0-9]+\.)+[A-Za-z]{2,14}/.test(s)
}
/**
@@ -29,3 +30,12 @@ export function isPhone (s) {
export function isURL (s) {
return /^http[s]?:\/\/.*/.test(s)
}
/**
* 手机号或座机号
*
* /^((13[0-9])|(14[579])|(15([0-3]|[5-9]))|(17[0135678])|(18[0-9])|(19[8|9])|(16[6]))\d{8}$/
* */
export function phoneReg(s) {
return /(^[1][3,4,5,6,7,8,9][0-9]{9}$)|(^0\d{2,3}-?\d{7,8}$)/.test(s)
}
@@ -8,13 +8,29 @@
<template v-slot:customIcon>
<i class="iconfont icon-nav_apartment page-icon" />
</template>
<template v-slot:titleRightCustom>
<!--新增-->
<a-button type="primary" ghost icon="plus" @click="handleAdd">{{ $t('newlyAdded') }}</a-button>
<!--编辑-->
<a-button type="primary" ghost icon="edit" @click="handleEdit">{{ $t('edit') }}</a-button>
<!--查看-->
<a-button type="primary" ghost icon="eye" @click="handleDetail">{{ $t('view') }}</a-button>
<!--会议统计列表-->
<a-button type="primary" ghost icon="eye">{{
$t('businessSupport.standardizationActivity.conferenceStatisticsList')
}}
</a-button>
</template>
<div class="table-page-search-wrapper search-box" :class="{'search-box-shadow': showSearch}">
<a-form layout="inline" @keyup.enter.native="searchQuery">
<a-row :gutter="24">
<a-col :md="16" :sm="8">
<!-- 节点名称-->
<a-form-item :label="$t('businessSupport.standardizationActivity.nodeName')">
<a-input v-model="nodeName" @input="handleSearch" />
<a-input v-model="nodeName"
:placeholder="$t('pleaseEnter') + $t('businessSupport.standardizationActivity.nodeName')"
@input="handleSearch" />
</a-form-item>
</a-col>
<a-col :md="8" :sm="8">
@@ -44,7 +60,10 @@
</template>
</div>
<!--思维导图部分-->
<mind-map ref="mindMap" dom-id="mountNode" :map-data="data" map-data-key-field="name"></mind-map>
<mind-map ref="mindMap" dom-id="mountNode" :map-data="data" map-data-key-field="name" @select="handleSelectNode" />
<!--新增/编辑-->
<standardization-activity-drawer ref="modalForm" @ok="modalFormOk" />
</internal-detail-page>
</template>
@@ -52,10 +71,11 @@
import MindMap from '../../../components/MindMap.vue'
import InternalDetailPage from '../../../components/InternalDetailPage'
import { queryTreeList } from '../../../api/businessSupport'
import StandardizationActivityDrawer from './modules/StandardizationActivityDrawer'
export default {
name: 'StandardizationActivityPage',
components: { InternalDetailPage, MindMap },
components: { InternalDetailPage, MindMap, StandardizationActivityDrawer },
data () {
return {
nodeName: '',
@@ -64,7 +84,9 @@ export default {
data: {},
currentNodeName: '',
showSearch: false,
loading: false
loading: false,
selectedNodeId: null, // 选中节点的信息
selectedNode: {}
}
},
created () {
@@ -91,9 +113,6 @@ export default {
return
}
this.nodeNameList = this.defaultNodeNameList.filter(tt => tt.name.toLowerCase().indexOf(this.nodeName.toLowerCase()) !== -1)
},
handleChange () {
},
searchReset () {
@@ -106,7 +125,7 @@ export default {
},
treeToArr (data, pid = null, res) {
data.forEach(item => {
res.push({ name: item.name, id: item.name })
res.push(item)
if (item.children && item.children.length !== 0) {
this.treeToArr(item.children, item.id, res)
}
@@ -158,6 +177,42 @@ export default {
},
handleSearchNode (node) {
this.$refs.mindMap.searchNode(node.id)
},
/**
* 选中/取消选中节点
* @param node
*/
handleSelectNode (node) {
this.selectedNodeId = node.id
this.selectedNode = Object.assign({}, node || {})
},
modalFormOk () {
this.loadData()
},
handleAdd () {
// 需要先选中一个节点
if (!this.selectedNodeId) {
this.$message.warning(this.$t('businessSupport.standardizationActivity.pleaseSelectNode'))
return
}
this.$refs.modalForm.add({ pid: this.selectedNodeId, pName: this.selectedNode.name, level: this.selectedNode.level + 1 })
},
handleEdit () {
// 需要先选中一个节点
if (!this.selectedNodeId) {
this.$message.warning(this.$t('businessSupport.standardizationActivity.pleaseSelectNode'))
return
}
this.$refs.modalForm.edit(this.selectedNodeId)
},
handleDetail () {
console.log(this.selectedNodeId)
// 需要先选中一个节点
if (!this.selectedNodeId) {
this.$message.warning(this.$t('businessSupport.standardizationActivity.pleaseSelectNode'))
return
}
this.$refs.modalForm.view(this.selectedNodeId)
}
}
}
@@ -255,4 +310,14 @@ export default {
right: 0;
bottom: 0;
}
.custom-operate {
.ant-btn {
margin-left: 12px;
}
.ant-btn:first-child {
margin-left: 0;
}
}
</style>
@@ -0,0 +1,182 @@
<template>
<j-modal
:title="title"
:width="width"
:visible="visible"
:maskClosable="false"
:confirmLoading="confirmLoading"
:ok-text="$t('preservation')"
:cancel-text="$t('cancel')"
@ok="handleOk"
@cancel="handleCancel">
<a-form :form="form">
<!--联络人-->
<a-form-item :labelCol="labelCol"
:wrapperCol="wrapperCol"
:label="$t('system.contact.contactPerson')">
<a-input :placeholder="$t('pleaseEnter') + $t('system.contact.contactPerson')"
@change="event => event.target.value = event.target.value.trim()"
:maxLength="50"
v-decorator="['liaison', validatorRules.liaison]" />
</a-form-item>
<!--单位-->
<a-form-item :labelCol="labelCol"
:wrapperCol="wrapperCol"
:label="$t('businessSupport.standardizationActivity.unit')">
<a-input :placeholder="$t('pleaseEnter') + $t('businessSupport.standardizationActivity.unit')"
@change="event => event.target.value = event.target.value.trim()"
:maxLength="50"
v-decorator="['unit', validatorRules.unit]" />
</a-form-item>
<!--电话-->
<a-form-item :labelCol="labelCol"
:wrapperCol="wrapperCol"
:label="$t('businessSupport.standardizationActivity.phone')">
<a-input :placeholder="$t('pleaseEnter') + $t('businessSupport.standardizationActivity.phone')"
@change="event => event.target.value = event.target.value.trim()"
:maxLength="50"
v-decorator="['phone', validatorRules.phone]" />
</a-form-item>
<!--邮箱-->
<a-form-item :labelCol="labelCol"
:wrapperCol="wrapperCol"
:label="$t('user.mailbox')">
<a-input :placeholder="$t('pleaseEnter') + $t('user.mailbox')"
@change="event => event.target.value = event.target.value.trim()"
:maxLength="50"
v-decorator="['mailbox', validatorRules.mailbox]" />
</a-form-item>
</a-form>
</j-modal>
</template>
<script>
import { phoneReg, isEmail } from '../../../../utils/validate'
export default {
name: 'ContactModal',
data () {
return {
title: this.$t('businessSupport.standardizationActivity.addContactInformation'),
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: {
// 联络人
liaison: {
rules: [{
required: true,
message: this.$t('pleaseEnter') + this.$t('system.contact.contactPerson')
}],
validateTrigger: 'blur'
},
// 单位
unit: {
rules: [{
required: true,
message: this.$t('pleaseEnter') + this.$t('businessSupport.standardizationActivity.unit')
}],
validateTrigger: 'blur'
},
// 电话
phone: {
rules: [{
required: true, validator: this.checkPhone
}],
validateTrigger: 'blur'
},
// 邮箱
mailbox: {
rules: [{
required: true, validator: this.checkEmail
}],
validateTrigger: 'blur'
}
}
}
},
methods: {
add () {
this.visible = true
},
view (record) {
this.visible = true
this.model = Object.assign({}, record)
this.disabled = true
this.$nextTick(() => {
this.form.setFieldsValue(this.model)
})
},
handleOk () {
this.form.validateFields((errors, values) => {
if (!errors) {
const formData = Object.assign({}, values)
this.$emit('ok', formData)
this.close()
}
})
},
handleCancel () {
this.close()
},
close () {
this.visible = false
this.model = {}
this.form.resetFields()
},
/**
* 校验电话
* @param rule
* @param value
* @param callback
*/
checkPhone (rule, value, callback) {
if (!value) {
// 请输入电话
callback(new Error(this.$t('pleaseEnter') + this.$t('businessSupport.standardizationActivity.phone')))
return
}
if (phoneReg(value)) {
callback()
return
}
// 请输入正确格式的电话
callback(new Error(this.$t('businessSupport.standardizationActivity.pleaseEnterCorrectPhone')))
},
/**
* 校验邮箱
* @param rule
* @param value
* @param callback
*/
checkEmail (rule, value, callback) {
if (!value) {
callback(new Error(this.$t('pleaseEnter') + this.$t('user.mailbox')))
return
}
if (isEmail(value)) {
callback()
return
}
callback(this.$t('user.enterMailboxCorrect'))
}
}
}
</script>
<style scoped lang="less">
</style>
@@ -0,0 +1,231 @@
<template>
<j-modal
:title="title"
:width="width"
:visible="visible"
:maskClosable="false"
:confirmLoading="confirmLoading"
:ok-text="$t('preservation')"
:cancel-text="$t('cancel')"
@ok="handleOk"
@cancel="handleCancel">
<a-form :form="form">
<!--我司在工作组排名顺序-->
<a-form-item :labelCol="labelCol"
:wrapperCol="wrapperCol"
:label="$t('businessSupport.standardizationActivity.order')">
<a-input :placeholder="$t('pleaseEnter') + $t('businessSupport.standardizationActivity.order')"
@change="event => event.target.value = event.target.value.trim()"
:maxLength="50"
v-decorator="['sort', validatorRules.sort]" />
</a-form-item>
<!--我司人员-->
<a-form-item :labelCol="labelCol"
:wrapperCol="wrapperCol"
:label="$t('businessSupport.standardizationActivity.ourPersonnel')">
<user-selection :placeholder="$t('pleaseSelect') + $t('businessSupport.standardizationActivity.ourPersonnel')"
type="radio"
v-decorator="['personnel', validatorRules.personnel]"
@listChange="handleUserChange" />
</a-form-item>
<!--工号-->
<a-form-item :labelCol="labelCol"
:wrapperCol="wrapperCol"
:label="$t('user.workNo')">
<a-input :placeholder="$t('pleaseEnter') + $t('user.workNo')"
@change="event => event.target.value = event.target.value.trim()"
:maxLength="50"
disabled
v-decorator="['jobNum', validatorRules.jobNum]" />
</a-form-item>
<!--单位-->
<a-form-item :labelCol="labelCol"
:wrapperCol="wrapperCol"
:label="$t('businessSupport.standardizationActivity.unit')">
<a-input :placeholder="$t('pleaseEnter') + $t('businessSupport.standardizationActivity.unit')"
@change="event => event.target.value = event.target.value.trim()"
:maxLength="50"
v-decorator="['unit', validatorRules.unit]" />
</a-form-item>
<!--部门-->
<a-form-item :labelCol="labelCol"
:wrapperCol="wrapperCol"
:label="$t('department')">
<a-input :placeholder="$t('pleaseEnter') + $t('department')"
@change="event => event.target.value = event.target.value.trim()"
:maxLength="50"
v-decorator="['department', validatorRules.department]" />
</a-form-item>
<!--电话-->
<a-form-item :labelCol="labelCol"
:wrapperCol="wrapperCol"
:label="$t('businessSupport.standardizationActivity.phone')">
<a-input :placeholder="$t('pleaseEnter') + $t('businessSupport.standardizationActivity.phone')"
@change="event => event.target.value = event.target.value.trim()"
:maxLength="50"
v-decorator="['phone', validatorRules.phone]" />
</a-form-item>
<!--邮箱-->
<a-form-item :labelCol="labelCol"
:wrapperCol="wrapperCol"
:label="$t('user.mailbox')">
<a-input :placeholder="$t('pleaseEnter') + $t('user.mailbox')"
@change="event => event.target.value = event.target.value.trim()"
:maxLength="50"
v-decorator="['mailbox', validatorRules.mailbox]" />
</a-form-item>
<!--身份-->
<a-form-item :labelCol="labelCol"
:wrapperCol="wrapperCol"
:label="$t('user.identity')">
<a-input :placeholder="$t('pleaseEnter') + $t('user.identity')"
@change="event => event.target.value = event.target.value.trim()"
:maxLength="50"
v-decorator="['identity', validatorRules.identity]" />
</a-form-item>
</a-form>
</j-modal>
</template>
<script>
import UserSelection from '../../../../components/selection/UserSelection'
import { isEmail, phoneReg } from '../../../../utils/validate'
export default {
name: 'GroupModal',
components: { UserSelection },
data () {
return {
title: this.$t('businessSupport.standardizationActivity.addParticipation'),
width: 800,
visible: false,
confirmLoading: false,
model: {},
form: this.$form.createForm(this),
labelCol: {
xs: { span: 24 },
sm: { span: 6 }
},
wrapperCol: {
xs: { span: 24 },
sm: { span: 18 }
},
validatorRules: {
// 我司在工作组排名顺序
sort: {
rules: [{ required: true, message: this.$t('pleaseEnter') + this.$t('businessSupport.standardizationActivity.order') }],
validateTrigger: 'blur'
},
// 我司人员
personnel: {
rules: [{ required: true, message: this.$t('pleaseEnter') + this.$t('businessSupport.standardizationActivity.ourPersonnel') }],
validateTrigger: 'change'
},
// 工号
jobNum: {
rules: [{ required: true, message: this.$t('pleaseEnter') + this.$t('user.workNo') }],
validateTrigger: 'blur'
},
// 单位
unit: {
rules: [{ required: true, message: this.$t('pleaseEnter') + this.$t('businessSupport.standardizationActivity.unit') }],
validateTrigger: 'blur'
},
// 部门
department: {
rules: [{ required: true, message: this.$t('pleaseEnter') + this.$t('department') }],
validateTrigger: 'blur'
},
// 电话
phone: { rules: [{ required: true, validator: this.checkPhone }], validateTrigger: 'blur' },
// 邮箱
mailbox: { rules: [{ required: true, validator: this.checkEmail }], validateTrigger: 'blur' },
// 身份
identity: {
rules: [{ required: true, message: this.$t('pleaseEnter') + this.$t('user.identity') }],
validateTrigger: 'blur'
}
},
disabled: false
}
},
methods: {
add () {
this.visible = true
},
view (record) {
this.visible = true
this.model = Object.assign({}, record)
this.disabled = true
this.$nextTick(() => {
this.form.setFieldsValue(this.model)
})
},
handleOk () {
this.form.validateFields((errors, values) => {
if (!errors) {
const formData = Object.assign({}, values)
this.$emit('ok', formData)
this.close()
}
})
},
handleCancel () {
this.close()
},
close () {
this.visible = false
this.model = {}
this.form.resetFields()
},
handleUserChange (list) {
const data = list[0] || {}
const obj = {
jobNum: data.username, // 工号
mailbox: data.email // 邮箱
}
this.form.setFieldsValue(obj)
},
/**
* 校验电话
* @param rule
* @param value
* @param callback
*/
checkPhone (rule, value, callback) {
if (!value) {
// 请输入电话
callback(new Error(this.$t('pleaseEnter') + this.$t('businessSupport.standardizationActivity.phone')))
return
}
if (phoneReg(value)) {
callback()
return
}
// 请输入正确格式的电话
callback(new Error(this.$t('businessSupport.standardizationActivity.pleaseEnterCorrectPhone')))
},
/**
* 校验邮箱
* @param rule
* @param value
* @param callback
*/
checkEmail (rule, value, callback) {
if (!value) {
callback(new Error(this.$t('pleaseEnter') + this.$t('user.mailbox')))
return
}
if (isEmail(value)) {
callback()
return
}
callback(this.$t('user.enterMailboxCorrect'))
}
}
}
</script>
<style scoped lang="less">
</style>
@@ -0,0 +1,127 @@
<template>
<j-modal
:title="title"
:width="width"
:visible="visible"
:maskClosable="false"
:confirmLoading="confirmLoading"
:ok-text="$t('preservation')"
:cancel-text="$t('cancel')"
@ok="handleOk"
@cancel="handleCancel">
<a-form :form="form">
<!--参会日期-->
<a-form-item :labelCol="labelCol"
:wrapperCol="wrapperCol"
:label="$t('workCenter.postMeetingManageProcess.attendanceDate')">
<j-date :placeholder="$t('pleaseSelect') + $t('workCenter.postMeetingManageProcess.attendanceDate')"
show-type="day"
date-format="YYYY-MM-DD"
v-decorator="['participationTime', validatorRules.participationTime]" />
</a-form-item>
<!--会议名称-->
<a-form-item :labelCol="labelCol"
:wrapperCol="wrapperCol"
:label="$t('workCenter.postMeetingManageProcess.meetingName')">
<a-input :placeholder="$t('pleaseEnter') + $t('workCenter.postMeetingManageProcess.meetingName')"
@change="event => event.target.value = event.target.value.trim()"
:maxLength="50"
v-decorator="['name', validatorRules.name]" />
</a-form-item>
<!--参会人员-->
<a-form-item :labelCol="labelCol"
:wrapperCol="wrapperCol"
:label="$t('workCenter.enStandardRevision.conferee')">
<user-selection :placeholder="$t('pleaseSelect') + $t('workCenter.enStandardRevision.conferee')"
v-decorator="['personnel', validatorRules.personnel]" />
</a-form-item>
</a-form>
</j-modal>
</template>
<script>
import UserSelection from '../../../../components/selection/UserSelection'
export default {
name: 'MeetingModal',
components: { UserSelection },
data () {
return {
title: this.$t('businessSupport.standardizationActivity.attendanceRecord'),
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: {
// 参会日期
participationTime: {
rules: [{
required: true,
message: this.$t('pleaseSelect') + this.$t('workCenter.postMeetingManageProcess.attendanceDate')
}],
validateTrigger: 'change'
},
// 会议名称
name: {
rules: [{
required: true,
message: this.$t('pleaseEnter') + this.$t('workCenter.postMeetingManageProcess.meetingName')
}],
validateTrigger: 'blur'
},
// 参会人员
personnel: {
rules: [{
required: true,
message: this.$t('pleaseSelect') + this.$t('workCenter.enStandardRevision.conferee')
}],
validateTrigger: 'change'
}
}
}
},
methods: {
add () {
this.visible = true
},
view (record) {
this.visible = true
this.model = Object.assign({}, record)
this.disabled = true
this.$nextTick(() => {
this.form.setFieldsValue(this.model)
})
},
handleOk () {
this.form.validateFields((errors, values) => {
if (!errors) {
const formData = Object.assign({}, values)
this.$emit('ok', formData)
this.close()
}
})
},
handleCancel () {
this.close()
},
close () {
this.visible = false
this.model = {}
this.form.resetFields()
}
}
}
</script>
<style scoped lang="less">
</style>
@@ -0,0 +1,179 @@
<template>
<j-modal
:title="title"
:width="width"
:visible="visible"
:maskClosable="false"
:confirmLoading="confirmLoading"
:ok-text="$t('preservation')"
:cancel-text="$t('cancel')"
@ok="handleOk"
@cancel="handleCancel">
<a-form :form="form">
<!--费用-->
<a-form-item :labelCol="labelCol"
:wrapperCol="wrapperCol"
:label="$t('businessSupport.standardizationActivity.cost')">
<a-input :placeholder="$t('pleaseEnter') + $t('businessSupport.standardizationActivity.cost')"
@change="event => event.target.value = event.target.value.trim()"
:maxLength="50"
v-decorator="['fee', validatorRules.fee]" />
</a-form-item>
<!--年份-->
<a-form-item :labelCol="labelCol"
:wrapperCol="wrapperCol"
:label="$t('businessSupport.standardizationActivity.year')">
<j-date :placeholder="$t('pleaseSelect') + $t('businessSupport.standardizationActivity.year')"
show-type="year"
date-format="YYYY"
v-decorator="['year', validatorRules.year]" />
</a-form-item>
<!--状态-->
<a-form-item :labelCol="labelCol"
:wrapperCol="wrapperCol"
:label="$t('status')">
<j-dict-select-tag
v-decorator="['state', validatorRules.state]"
:placeholder="$t('pleaseSelect') + $t('status')"
:type="'select'"
:triggerChange="false"
dictCode="split_status" />
</a-form-item>
<!--计划内-->
<a-form-item :labelCol="labelCol"
:wrapperCol="wrapperCol"
:label="$t('businessSupport.standardizationActivity.plan')">
<a-input :placeholder="$t('pleaseEnter') + $t('businessSupport.standardizationActivity.plan')"
@change="event => event.target.value = event.target.value.trim()"
:maxLength="50"
v-decorator="['plan', validatorRules.plan]" />
</a-form-item>
<!--缴费方式-->
<a-form-item :labelCol="labelCol"
:wrapperCol="wrapperCol"
:label="$t('businessSupport.standardizationActivity.paymentMethod')">
<a-input :placeholder="$t('pleaseEnter') + $t('businessSupport.standardizationActivity.paymentMethod')"
@change="event => event.target.value = event.target.value.trim()"
:maxLength="50"
v-decorator="['pay', validatorRules.pay]" />
</a-form-item>
<!--费用列支-->
<a-form-item :labelCol="labelCol"
:wrapperCol="wrapperCol"
:label="$t('businessSupport.standardizationActivity.expenseReimbursement')">
<a-input :placeholder="$t('pleaseEnter') + $t('businessSupport.standardizationActivity.expenseReimbursement')"
@change="event => event.target.value = event.target.value.trim()"
:maxLength="50"
v-decorator="['feeListing', validatorRules.feeListing]" />
</a-form-item>
</a-form>
</j-modal>
</template>
<script>
export default {
name: 'PaymentModal',
data () {
return {
title: this.$t('businessSupport.standardizationActivity.paymentInfo'),
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: {
// 费用
fee: {
rules: [{
required: true,
message: this.$t('pleaseEnter') + this.$t('businessSupport.standardizationActivity.cost')
}],
validateTrigger: 'blur'
},
// 年份
year: {
rules: [{
required: true,
message: this.$t('pleaseSelect') + this.$t('businessSupport.standardizationActivity.year')
}],
validateTrigger: 'change'
},
// 状态
state: {
rules: [{
required: true,
message: this.$t('pleaseSelect') + this.$t('status')
}],
validateTrigger: 'change'
},
// 计划内
plan: {
rules: [{
required: true,
message: this.$t('pleaseEnter') + this.$t('businessSupport.standardizationActivity.plan')
}],
validateTrigger: 'blur'
},
// 缴费方式
pay: {
rules: [{
required: true,
message: this.$t('pleaseEnter') + this.$t('businessSupport.standardizationActivity.paymentMethod')
}],
validateTrigger: 'blur'
},
// 费用列支
feeListing: {
rules: [{
required: true,
message: this.$t('pleaseEnter') + this.$t('businessSupport.standardizationActivity.expenseReimbursement')
}],
validateTrigger: 'blur'
},
}
}
},
methods: {
add () {
this.visible = true
},
view (record) {
this.visible = true
this.model = Object.assign({}, record)
this.disabled = true
this.$nextTick(() => {
this.form.setFieldsValue(this.model)
})
},
handleOk () {
this.form.validateFields((errors, values) => {
if (!errors) {
const formData = Object.assign({}, values)
this.$emit('ok', formData)
this.close()
}
})
},
handleCancel () {
this.close()
},
close () {
this.visible = false
this.model = {}
this.form.resetFields()
}
}
}
</script>
<style scoped lang="less">
</style>
@@ -0,0 +1,341 @@
<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>
@@ -0,0 +1,120 @@
<template>
<div>
<div class="table-operator" v-if="!disabled">
<a-button type="primary" ghost icon="plus" @click="handleAdd">
{{ $t('businessSupport.standardizationActivity.addContactInformation') }}
</a-button>
<!--删除-->
<a-button type="primary" icon="delete" ghost @click="handleDelete">{{ $t('delete') }}</a-button>
</div>
<j-table :scroll="{x: '100%'}"
:pagination="false"
:rowKey="(record,index)=>{return index}"
:columns="columns"
:dataSource="realDataSource"
:row-selection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }">
</j-table>
<!--新增弹框-->
<contact-modal ref="formModal" @ok="formModalOk" />
</div>
</template>
<script>
import JTable from '../../../../components/jero/JTable'
import ContactModal from '../modules/ContactModal'
export default {
name: 'ContactTable',
components: { ContactModal, JTable },
props: {
// 数据
dataSource: {
type: Array,
required: false,
default: () => {
return []
}
},
disabled: {
type: Boolean,
required: false,
default: false
}
},
data () {
return {
columns: [
// 联络人
{
title: this.$t('system.contact.contactPerson'),
width: 150,
dataIndex: 'liaison'
},
// 单位
{
title: this.$t('businessSupport.standardizationActivity.unit'),
width: 150,
dataIndex: 'unit'
},
// 电话
{
title: this.$t('businessSupport.standardizationActivity.phone'),
width: 150,
dataIndex: 'phone'
},
// 邮箱
{
title: this.$t('user.mailbox'),
width: 150,
dataIndex: 'mailbox'
}
],
selectedRowKeys: [],
realDataSource: []
}
},
watch: {
dataSource: {
handler (val) {
this.realDataSource = JSON.parse(JSON.stringify(val))
},
immediate: true,
deep: true
}
},
methods: {
// 添加
handleAdd () {
this.$refs.formModal.add()
},
// 删除
handleDelete () {
this.$confirm({
title: this.$t('confirmDeletion'),
content: this.$t('areYouSure'),
onOk: () => {
const data = JSON.parse(JSON.stringify(this.realDataSource))
this.selectedRowKeys.forEach(index => {
data[index] = null
})
this.selectedRowKeys = []
this.realDataSource = data.filter(tt => !!tt)
this.$emit('ok', this.realDataSource)
}
})
},
onSelectChange (selectedRowKeys) {
this.selectedRowKeys = selectedRowKeys
},
formModalOk (lineData) {
this.realDataSource.push(lineData)
this.$emit('ok', this.realDataSource)
}
}
}
</script>
<style scoped lang="less">
</style>
@@ -0,0 +1,189 @@
<template>
<div>
<div class="table-operator" v-if="!disabled">
<a-button type="primary" ghost icon="plus" @click="handleAdd">
{{ $t('businessSupport.standardizationActivity.addParticipation') }}
</a-button>
<!--删除-->
<a-button type="primary" icon="delete" ghost @click="handleDelete">{{ $t('delete') }}</a-button>
</div>
<j-table :scroll="{x: '100%'}"
:pagination="false"
:rowKey="(record,index)=>{return index}"
:columns="columns"
:dataSource="realDataSource"
:row-selection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }">
<template v-slot:file="{text, record, index}">
<a-button type="primary"
class="button-text"
@click="clickButtonToUpload(text, index, 'feeData')">
{{
(text === 'null' || text === '' || text === null || text === undefined) ? $t('uploadFile.clickUpload') : $t('uploadFile.viewUploadedFiles')
}}
</a-button>
</template>
</j-table>
<!--新增弹框-->
<group-modal ref="formModal" @ok="formModalOk" />
<!--文件上传-->
<upload-file ref="uploadFile" @change="uploadFileChange" :return-url="false" :disabled="disabled" />
</div>
</template>
<script>
import JTable from '../../../../components/jero/JTable'
import GroupModal from '../modules/GroupModal'
import ContactModal from '../modules/ContactModal'
import UploadFile from '../../../../components/UploadFile'
export default {
name: 'GroupTable',
components: { UploadFile, ContactModal, JTable, GroupModal },
props: {
// 数据
dataSource: {
type: Array,
required: false,
default: () => {
return []
}
},
disabled: {
type: Boolean,
required: false,
default: false
}
},
data () {
return {
columns: [
// 我司在工作组排名顺序
{
title: this.$t('businessSupport.standardizationActivity.order'),
width: 200,
dataIndex: 'sort'
},
// 我司人员
{
title: this.$t('businessSupport.standardizationActivity.ourPersonnel'),
width: 150,
dataIndex: 'personnel'
},
// 工号
{
title: this.$t('user.workNo'),
width: 150,
dataIndex: 'jobNum'
},
// 单位
{
title: this.$t('businessSupport.standardizationActivity.unit'),
width: 150,
dataIndex: 'unit'
},
// 部门
{
title: this.$t('department'),
width: 150,
dataIndex: 'department'
},
// 电话
{
title: this.$t('businessSupport.standardizationActivity.phone'),
width: 150,
dataIndex: 'phone'
},
// 邮箱
{
title: this.$t('user.mailbox'),
width: 150,
dataIndex: 'mailbox'
},
// 身份
{
title: this.$t('user.identity'),
width: 150,
dataIndex: 'identity'
},
// 资料
{
title: this.$t('businessSupport.standardizationActivity.data'),
width: 150,
dataIndex: 'feeData',
scopedSlots: { customRender: 'file' }
}
],
selectedRowKeys: [],
realDataSource: [],
uploadTable: {}
}
},
watch: {
dataSource: {
handler (val) {
this.realDataSource = JSON.parse(JSON.stringify(val))
},
immediate: true,
deep: true
}
},
methods: {
// 添加
handleAdd () {
this.$refs.formModal.add()
},
// 删除
handleDelete () {
this.$confirm({
title: this.$t('confirmDeletion'),
content: this.$t('areYouSure'),
onOk: () => {
const data = JSON.parse(JSON.stringify(this.realDataSource))
this.selectedRowKeys.forEach(index => {
data[index] = null
})
this.selectedRowKeys = []
this.realDataSource = data.filter(tt => !!tt)
this.$emit('ok', this.realDataSource)
}
})
},
onSelectChange (selectedRowKeys) {
this.selectedRowKeys = selectedRowKeys
},
formModalOk (lineData) {
this.realDataSource.push(lineData)
this.$emit('ok', this.realDataSource)
},
// 点击点击上传按钮
clickButtonToUpload (fileIds, index, dbFieldName) {
this.$refs.uploadFile.open(fileIds)
this.uploadTable = { index, dbFieldName }
},
// 文件上传改变后的回调
uploadFileChange (data) {
console.log(data)
const attIdList = []
if (data && data.length > 0) {
data.map(item => {
attIdList.push(item.id)
})
}
/** 赋值给当前对应的表单文件 */
this.$set(this.realDataSource[this.uploadTable.index], this.uploadTable.dbFieldName, attIdList.join(','))
this.$emit('ok', this.realDataSource)
}
}
}
</script>
<style scoped lang="less">
@import '~@assets/less/common.less';
.button-text {
width: 100%;
}
</style>
@@ -0,0 +1,159 @@
<template>
<div>
<div class="table-operator" v-if="!disabled">
<a-button type="primary" ghost icon="plus" @click="handleAdd">
{{ $t('businessSupport.standardizationActivity.addAttendanceRecord') }}
</a-button>
<!--删除-->
<a-button type="primary" icon="delete" ghost @click="handleDelete">{{ $t('delete') }}</a-button>
</div>
<j-table :scroll="{x: '100%'}"
:pagination="false"
:rowKey="(record,index)=>{return index}"
:columns="columns"
:dataSource="realDataSource"
:row-selection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }">
<template v-slot:file="{text, record, index}">
<a-button type="primary"
class="button-text"
@click="clickButtonToUpload(text, index, 'feeData')">
{{
(text === 'null' || text === '' || text === null || text === undefined) ? $t('uploadFile.clickUpload') : $t('uploadFile.viewUploadedFiles')
}}
</a-button>
</template>
</j-table>
<!--新增弹框-->
<meeting-modal ref="formModal" @ok="formModalOk" />
<!--文件上传-->
<upload-file ref="uploadFile" @change="uploadFileChange" :return-url="false" :disabled="disabled" />
</div>
</template>
<script>
import UploadFile from '../../../../components/UploadFile'
import JTable from '../../../../components/jero/JTable'
import MeetingModal from '../modules/MeetingModal'
export default {
name: 'MeetingTable',
components: { MeetingModal, JTable, UploadFile },
props: {
// 数据
dataSource: {
type: Array,
required: false,
default: () => {
return []
}
},
disabled: {
type: Boolean,
required: false,
default: false
}
},
data () {
return {
columns: [
// 参会日期
{
title: this.$t('workCenter.postMeetingManageProcess.attendanceDate'),
width: 150,
dataIndex: 'participationTime'
},
// 会议名称
{
title: this.$t('workCenter.postMeetingManageProcess.meetingName'),
width: 150,
dataIndex: 'name'
},
// 参会人员
{
title: this.$t('workCenter.enStandardRevision.conferee'),
width: 150,
dataIndex: 'personnel'
},
// 会议资料
{
title: this.$t('businessSupport.standardizationActivity.meetingMaterial'),
width: 150,
dataIndex: 'meetingData',
scopedSlots: { customRender: 'file' }
}
],
selectedRowKeys: [],
realDataSource: [],
uploadTable: {}
}
},
watch: {
dataSource: {
handler (val) {
this.realDataSource = JSON.parse(JSON.stringify(val))
},
immediate: true,
deep: true
}
},
methods: {
// 添加
handleAdd () {
this.$refs.formModal.add()
},
// 删除
handleDelete () {
this.$confirm({
title: this.$t('confirmDeletion'),
content: this.$t('areYouSure'),
onOk: () => {
const data = JSON.parse(JSON.stringify(this.realDataSource))
this.selectedRowKeys.forEach(index => {
data[index] = null
})
this.selectedRowKeys = []
this.realDataSource = data.filter(tt => !!tt)
this.$emit('ok', this.realDataSource)
}
})
},
onSelectChange (selectedRowKeys) {
this.selectedRowKeys = selectedRowKeys
},
formModalOk (lineData) {
this.realDataSource.push(lineData)
this.$emit('ok', this.realDataSource)
},
// 点击点击上传按钮
clickButtonToUpload (fileIds, index, dbFieldName) {
this.$refs.uploadFile.open(fileIds)
this.uploadTable = { index, dbFieldName }
},
// 文件上传改变后的回调
uploadFileChange (data) {
console.log(data)
const attIdList = []
if (data && data.length > 0) {
data.map(item => {
attIdList.push(item.id)
})
}
/** 赋值给当前对应的表单文件 */
this.$set(this.realDataSource[this.uploadTable.index], this.uploadTable.dbFieldName, attIdList.join(','))
this.$emit('ok', this.realDataSource)
}
}
}
</script>
<style scoped lang="less">
@import '~@assets/less/common.less';
.button-text {
width: 100%;
}
</style>
@@ -0,0 +1,177 @@
<template>
<div>
<div class="table-operator" v-if="!disabled">
<a-button type="primary" ghost icon="plus" @click="handleAdd">
{{ $t('businessSupport.standardizationActivity.addPaymentInfo') }}
</a-button>
<!--删除-->
<a-button type="primary" icon="delete" ghost @click="handleDelete">{{ $t('delete') }}</a-button>
</div>
<j-table :scroll="{x: '100%'}"
:pagination="false"
:rowKey="(record,index)=>{return index}"
:columns="columns"
:dataSource="realDataSource"
:row-selection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }">
<template v-slot:file="{text, record, index}">
<a-button type="primary"
class="button-text"
@click="clickButtonToUpload(text, index, 'feeData')">
{{
(text === 'null' || text === '' || text === null || text === undefined) ? $t('uploadFile.clickUpload') : $t('uploadFile.viewUploadedFiles')
}}
</a-button>
</template>
</j-table>
<!--新增弹框-->
<payment-modal ref="formModal" @ok="formModalOk" />
<!--文件上传-->
<upload-file ref="uploadFile" @change="uploadFileChange" :return-url="false" :disabled="disabled" />
</div>
</template>
<script>
import UploadFile from '../../../../components/UploadFile'
import JTable from '../../../../components/jero/JTable'
import PaymentModal from '../modules/PaymentModal'
export default {
name: 'PaymentTable',
components: { PaymentModal, JTable, UploadFile },
props: {
// 数据
dataSource: {
type: Array,
required: false,
default: () => {
return []
}
},
disabled: {
type: Boolean,
required: false,
default: false
}
},
data () {
return {
columns: [
// 费用
{
title: this.$t('businessSupport.standardizationActivity.cost'),
width: 150,
dataIndex: 'fee'
},
// 年份
{
title: this.$t('businessSupport.standardizationActivity.year'),
width: 150,
dataIndex: 'year'
},
// 状态
{
title: this.$t('status'),
width: 150,
dataIndex: 'state'
},
// 计划内
{
title: this.$t('businessSupport.standardizationActivity.plan'),
width: 150,
dataIndex: 'plan'
},
// 缴费方式
{
title: this.$t('businessSupport.standardizationActivity.paymentMethod'),
width: 150,
dataIndex: 'pay'
},
// 费用列支
{
title: this.$t('businessSupport.standardizationActivity.expenseReimbursement'),
width: 150,
dataIndex: 'feeListing'
},
// 资料
{
title: this.$t('businessSupport.standardizationActivity.data'),
width: 150,
dataIndex: 'feeData',
scopedSlots: { customRender: 'file' }
}
],
selectedRowKeys: [],
realDataSource: [],
uploadTable: {}
}
},
watch: {
dataSource: {
handler (val) {
this.realDataSource = JSON.parse(JSON.stringify(val))
},
immediate: true,
deep: true
}
},
methods: {
// 添加
handleAdd () {
this.$refs.formModal.add()
},
// 删除
handleDelete () {
this.$confirm({
title: this.$t('confirmDeletion'),
content: this.$t('areYouSure'),
onOk: () => {
const data = JSON.parse(JSON.stringify(this.realDataSource))
this.selectedRowKeys.forEach(index => {
data[index] = null
})
this.selectedRowKeys = []
this.realDataSource = data.filter(tt => !!tt)
this.$emit('ok', this.realDataSource)
}
})
},
onSelectChange (selectedRowKeys) {
this.selectedRowKeys = selectedRowKeys
},
formModalOk (lineData) {
this.realDataSource.push(lineData)
this.$emit('ok', this.realDataSource)
},
// 点击点击上传按钮
clickButtonToUpload (fileIds, index, dbFieldName) {
this.$refs.uploadFile.open(fileIds)
this.uploadTable = { index, dbFieldName }
},
// 文件上传改变后的回调
uploadFileChange (data) {
console.log(data)
const attIdList = []
if (data && data.length > 0) {
data.map(item => {
attIdList.push(item.id)
})
}
/** 赋值给当前对应的表单文件 */
this.$set(this.realDataSource[this.uploadTable.index], this.uploadTable.dbFieldName, attIdList.join(','))
this.$emit('ok', this.realDataSource)
}
}
}
</script>
<style scoped lang="less">
@import '~@assets/less/common.less';
.button-text {
width: 100%;
}
</style>