270 lines
8.7 KiB
Vue
270 lines
8.7 KiB
Vue
<template>
|
||
<div>
|
||
<base-info-form ref="baseInfoForm" v-bind="$attrs" disabled></base-info-form>
|
||
<!-- 标准文本 -->
|
||
<div class="box-title-text form-flex-item">
|
||
<div class="title-text">
|
||
<span class="title-text-text" :title="$t('workCenter.enStandardRevision.standardText')">
|
||
{{ $t('workCenter.enStandardRevision.standardText') }}
|
||
</span>
|
||
</div>
|
||
<a-form-model-item class="item-model">
|
||
<div class="online-edit-wrapper">
|
||
<p>{{ $t('enterpriseStandard') }}</p>
|
||
<a-button type="primary" @click="onlineEditView">{{ $t('view') }}</a-button>
|
||
</div>
|
||
</a-form-model-item>
|
||
</div>
|
||
|
||
<div>
|
||
<j-table
|
||
:can-drag="true"
|
||
:scroll="{x: '100%'}"
|
||
ref="table"
|
||
rowKey="id"
|
||
:columns="columns"
|
||
:dataSource="dataSource"
|
||
:pagination="ipagination"
|
||
:loading="loading"
|
||
@change="handleTableChange">
|
||
|
||
<!-- 操作栏 -->
|
||
<div slot="action" slot-scope="{record}" class="action-span-cell">
|
||
<a @click="handleEdit(record)" class="table-ope-btn" :disabled="disabled">{{ $t('edit') }}</a>
|
||
<a-divider type="vertical" />
|
||
<a @click="handleDelete(record.id)" class="table-ope-btn" :disabled="disabled">{{ $t('delete') }}</a>
|
||
</div>
|
||
|
||
</j-table>
|
||
</div>
|
||
|
||
<a-form-model :model="formInline" class="form-add" :rules="rules" ref="ruleForm">
|
||
<div class="form-flex-box">
|
||
<!-- 部门联络人主管级领导 -->
|
||
<!-- 人员是固定的，通过联络人管理维护后自动带出该领导审批，给该领导自动发送待办，人员离职后，管理员给转办待办任务 -->
|
||
<div class="box-title-text form-flex-item form-flex-item-half">
|
||
<div class="title-text title-text-long">
|
||
<span class="required">*</span>
|
||
<span class="title-text-text" :title="$t('workCenter.enStandardRevision.departLiaisonLeader')">
|
||
{{ $t('workCenter.enStandardRevision.departLiaisonLeader') }}
|
||
</span>
|
||
</div>
|
||
<a-form-model-item class="item-model" prop="contactUserLeader">
|
||
<user-selection v-model="formInline.contactUserLeader"
|
||
:placeholder="$t('pleaseSelect')+$t('workCenter.enStandardRevision.departLiaisonLeader')"
|
||
:disabled="disabled"
|
||
filedName="contactUserLeader"
|
||
@nameChange="userSelectNameChange"
|
||
:nameStr="formInline.contactUserLeader_dictText"
|
||
type="radio"/>
|
||
</a-form-model-item>
|
||
</div>
|
||
</div>
|
||
</a-form-model>
|
||
<comment-modal ref="commentModal" @ok="modalFormOk"></comment-modal>
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
import BaseInfoForm from './BaseInfoForm'
|
||
import JTable from '@/components/jero/JTable'
|
||
import CommentModal from './CommentModal'
|
||
import UserSelection from '@/components/selection/UserSelection'
|
||
import Vue from 'vue'
|
||
import { kkFilePreview } from '@/utils/kkFilePreview'
|
||
import { ACCESS_TOKEN } from '@/store/mutation-types'
|
||
import { queryFileInfoByEditId } from '../../../../api/workCenter'
|
||
import { Base64 } from 'js-base64'
|
||
|
||
export default {
|
||
name: 'DepartLiaisonCollectBaseInfo',
|
||
components: { CommentModal, BaseInfoForm, JTable, UserSelection },
|
||
props: {
|
||
disabled: {
|
||
type: Boolean,
|
||
required: false,
|
||
default: false
|
||
}
|
||
},
|
||
data () {
|
||
return {
|
||
loading: false,
|
||
/* 分页参数 */
|
||
ipagination: {
|
||
current: 1,
|
||
pageSize: 10,
|
||
pageSizeOptions: ['10', '30', '50', '100', '150', '200'],
|
||
showTotal: (total, range) => {
|
||
return range[0] + '-' + range[1] + ' ' + this.$t('total') + total + this.$t('strip')
|
||
},
|
||
showQuickJumper: true,
|
||
showSizeChanger: true,
|
||
total: 0
|
||
},
|
||
columns: [
|
||
{
|
||
title: this.$t('serialNumber'),
|
||
dataIndex: '',
|
||
key: 'rowIndex',
|
||
align: 'center',
|
||
width: 80,
|
||
customRender: function (t, r, index) {
|
||
return parseInt(index) + 1
|
||
}
|
||
},
|
||
{ // 条款号
|
||
title: this.$t('workCenter.enStandardRevision.clauseNumber'),
|
||
align: 'center',
|
||
width: 180,
|
||
dataIndex: 'clauseNum',
|
||
scopedSlots: { customRender: 'text' }
|
||
},
|
||
{ // 条款名称
|
||
title: this.$t('workCenter.enStandardRevision.clauseName'),
|
||
align: 'center',
|
||
width: 180,
|
||
dataIndex: 'clauseName',
|
||
scopedSlots: { customRender: 'text' }
|
||
},
|
||
{ // 修改意见内容(包括修改理由和依据)
|
||
title: this.$t('workCenter.enStandardRevision.contentOfRevisedOpinion'),
|
||
align: 'center',
|
||
width: 300,
|
||
dataIndex: 'editAdvice',
|
||
scopedSlots: { customRender: 'text' }
|
||
},
|
||
{ // 意见提出人
|
||
title: this.$t('workCenter.enStandardRevision.proposer'),
|
||
align: 'center',
|
||
width: 180,
|
||
dataIndex: 'createUserId_dictText',
|
||
scopedSlots: { customRender: 'text' }
|
||
},
|
||
{
|
||
title: this.$t('operation'),
|
||
scopedSlots: { customRender: 'action' },
|
||
align: 'center',
|
||
width: 200
|
||
}
|
||
],
|
||
dataSource: [],
|
||
formInline: {},
|
||
rules: {
|
||
// 部门联络人主管级领导
|
||
contactUserLeader: [
|
||
{
|
||
required: true,
|
||
message: this.$t('workCenter.enStandardRevision.departLiaisonLeader') + this.$t('cannotEmpty'),
|
||
trigger: 'change'
|
||
}
|
||
]
|
||
},
|
||
onEditFile: '' // 在线编辑的文件id
|
||
}
|
||
},
|
||
methods: {
|
||
// 拿到外面传进来的数据初始化，因为套了几层就不在外层初始化数据了
|
||
initData (data) {
|
||
// 给表格赋值,在线编辑不知道要怎么赋值？
|
||
this.dataSource = data.advices
|
||
this.formInline = Object.assign({}, data)
|
||
this.onEditFile = data.onEditFile
|
||
// 给表单赋值
|
||
this.$nextTick(() => {
|
||
this.$refs.baseInfoForm.initData(data)
|
||
})
|
||
},
|
||
// 外层要获取数据
|
||
getData () {
|
||
// 把数据抛出，在线编辑不知道要不要抛
|
||
const data = Object.assign({}, this.formInline)
|
||
data.advices = this.dataSource
|
||
return data
|
||
},
|
||
// 外层获取数据要过校验,返回false表示没有通过校验
|
||
async getDataValidate () {
|
||
let data = {} // 需要返回的数据
|
||
await this.$refs.ruleForm.validate(valid => {
|
||
if (valid) {
|
||
if (this.dataSource && this.dataSource.length > 0) {
|
||
data = Object.assign({}, this.formInline)
|
||
data.advices = this.dataSource
|
||
} else {
|
||
this.$message.warning(this.$t('addAtLeastOneRowOfData'))
|
||
data = false
|
||
}
|
||
} else {
|
||
data = false
|
||
}
|
||
})
|
||
return data
|
||
},
|
||
handleTableChange (pagination) {
|
||
this.ipagination = pagination
|
||
},
|
||
// 征求意见的编辑
|
||
handleEdit (record) {
|
||
// 不知道左侧要预览哪个文件
|
||
const file = this.onEditFile
|
||
this.$refs.commentModal.title = this.$t('edit')
|
||
this.$refs.commentModal.edit(file, record, record.id)
|
||
},
|
||
// 征求意见的删除
|
||
handleDelete (id) {
|
||
this.$confirm({
|
||
title: this.$t('confirmDeletion'),
|
||
content: this.$t('areYouSure'),
|
||
onOk: () => {
|
||
const dataIndex = this.dataSource.findIndex(item => item.id === id)
|
||
this.dataSource.splice(dataIndex, 1)
|
||
}
|
||
})
|
||
},
|
||
// 征求意见新增编辑完成
|
||
modalFormOk (value, id) {
|
||
console.log(value, id)
|
||
if (id || id === 0) {
|
||
const dataIndex = this.dataSource.findIndex(item => item.id === id)
|
||
// 有下标，说明是编辑
|
||
this.$set(this.dataSource[dataIndex], 'clauseNum', value.clauseNum)
|
||
this.$set(this.dataSource[dataIndex], 'clauseName', value.clauseName)
|
||
this.$set(this.dataSource[dataIndex], 'editAdvice', value.editAdvice)
|
||
// this.dataSource.splice(index, 1, value)
|
||
}
|
||
},
|
||
// 选择用户得到用户名
|
||
userSelectNameChange (value, fieldName) {
|
||
this.formInline[fieldName + '_dictText'] = value
|
||
},
|
||
// 在线编辑的查看
|
||
onlineEditView () {
|
||
this.$emit('onlineEditView', this.onEditFile)
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style scoped lang="less">
|
||
@import '~@assets/less/common.less';
|
||
.form-add {
|
||
margin-top: 20px;
|
||
}
|
||
|
||
.online-edit-wrapper {
|
||
height: 100%;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
p {
|
||
margin-bottom: 0;
|
||
height: 100%;
|
||
}
|
||
}
|
||
.form-flex-item-half {
|
||
width: 34%;
|
||
}
|
||
.title-text-long {
|
||
width: 180px !important;
|
||
}
|
||
</style>
|