306 lines
10 KiB
Vue
306 lines
10 KiB
Vue
<template>
|
||
<div>
|
||
<div class="table-operator" v-if="isInitiate">
|
||
<!-- 新增 -->
|
||
<a-button icon="plus" type="primary" @click="handleAdd">{{ $t('newlyAdded') }}</a-button>
|
||
</div>
|
||
<div>
|
||
<j-table
|
||
v-if="columns && columns.length > 0"
|
||
:columns="columns"
|
||
:dataSource="dataSource"
|
||
:can-drag="true"
|
||
rowKey="id"
|
||
:loading="loading"
|
||
:pagination="false"
|
||
:scroll="{x: '100%'}"
|
||
@change="tableOnChange">
|
||
|
||
<!-- 企标号、企标名称 -->
|
||
<template v-slot:standard="{text, record}">
|
||
<a-tooltip overlay-class-name="tooltip-style">
|
||
<template slot="title">{{ text || text === 0 ? text : global.emptyLine }}</template>
|
||
<a v-if="text" class="link-a" @click="detailClick(record)">{{ text }}</a>
|
||
<div v-else class="table-text">{{ global.emptyLine }}</div>
|
||
</a-tooltip>
|
||
</template>
|
||
|
||
<!-- 稽查联络人 -->
|
||
<template v-slot:inspectionContactPerson="{text, record}">
|
||
<div class="table-form" v-if="isInitiate">
|
||
<a-select v-model="record.liaisons" style="width: 100%" allowClear
|
||
show-search :filter-option="filterOption"
|
||
:placeholder="$t('pleaseSelect')+$t('workCenter.incExtensionRequest.inspectionContactPerson')">
|
||
<a-select-option v-for="item in userList" :key="item.id" :value="item.id">{{ item.realname + '(' + item.username + ')' }}</a-select-option>
|
||
</a-select>
|
||
</div>
|
||
<a-tooltip v-else overlay-class-name="tooltip-style">
|
||
<template slot="title">{{ text || text === 0 ? text : global.emptyLine }}</template>
|
||
<div class="table-text" v-if="text || text === 0">{{ text }}</div>
|
||
<div class="table-text" v-else>{{ global.emptyLine }}</div>
|
||
</a-tooltip>
|
||
</template>
|
||
|
||
<!-- 操作 -->
|
||
<template slot="action" slot-scope="{text, record, index}">
|
||
<!-- 节点1，显示申请延期和删除，后续不显示操作列 -->
|
||
<a @click="handleRequestExtension(record, index)" >{{ $t('workCenter.incExtensionRequest.requestExtension') }}</a>
|
||
<a-divider type="vertical" />
|
||
<a @click="handleDelete(record.id)" >{{ $t('delete') }}</a>
|
||
</template>
|
||
</j-table>
|
||
</div>
|
||
<!-- 新增 -->
|
||
<extension-request-table-modal ref="extensionRequestTableModal" @ok="handleAddCallback"/>
|
||
<!-- 申请延期 -->
|
||
<request-extension-modal ref="requestExtensionModal" @ok="requestExtensionCallback"/>
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
import JTable from '@comp/jero/JTable'
|
||
import { JeroListMixin } from '@/mixins/JeroListMixin'
|
||
import { getUserList } from '@api/api'
|
||
import ExtensionRequestTableModal
|
||
from '@views/workCenter/inspectionExtensionRequestProcess/modules/ExtensionRequestTableModal'
|
||
import RequestExtensionModal from '@views/workCenter/inspectionExtensionRequestProcess/modules/RequestExtensionModal'
|
||
import { InspectionExtensionRequestProcess } from '@/enums/commonEnums'
|
||
import { editInspectExtensionTable } from '@api/workCenter'
|
||
export default {
|
||
name: 'ExtensionRequestTable',
|
||
components: { RequestExtensionModal, ExtensionRequestTableModal, JTable },
|
||
mixins: [JeroListMixin],
|
||
props: {
|
||
// 当前节点
|
||
currentNode: {
|
||
type: String,
|
||
required: true
|
||
},
|
||
// 项目id
|
||
projectId: {
|
||
type: String,
|
||
required: true
|
||
}
|
||
},
|
||
data () {
|
||
return {
|
||
disableMixinCreated: true,
|
||
url: {
|
||
list: '/esinspectdelayapply/processEsInspectDelayApply/queryByList',
|
||
delete: '/esinspectdelayapply/processEsInspectDelayApply/delete'
|
||
},
|
||
model: {},
|
||
userList: [],
|
||
dataSource: [],
|
||
allColumns: [
|
||
{
|
||
title: this.$t('serialNumber'),
|
||
dataIndex: '',
|
||
key: 'rowIndex',
|
||
align: 'center',
|
||
width: 80,
|
||
customRender: function (t, r, index) {
|
||
return parseInt(index) + 1
|
||
}
|
||
},
|
||
{ // 稽查依据标准号
|
||
title: this.$t('workCenter.esInspectionPlan.inspectionBasisStandardNumber'),
|
||
align: 'center',
|
||
width: 180,
|
||
dataIndex: 'inspectNo',
|
||
scopedSlots: { customRender: 'standard' }
|
||
},
|
||
{ // 稽查依据标准名称
|
||
title: this.$t('workCenter.esInspectionPlan.inspectionBasisStandardName'),
|
||
align: 'center',
|
||
width: 180,
|
||
dataIndex: 'inspectName',
|
||
scopedSlots: { customRender: 'standard' }
|
||
},
|
||
{ // 计划稽查对象
|
||
title: this.$t('workCenter.esInspectionPlan.planInspectionObjects'),
|
||
align: 'center',
|
||
width: 120,
|
||
dataIndex: 'planInspectObject_dictText',
|
||
scopedSlots: { customRender: 'text' }
|
||
},
|
||
{ // 计划稽查日期
|
||
title: this.$t('workCenter.esInspectionPlan.planInspectionDate'),
|
||
align: 'center',
|
||
width: 120,
|
||
dataIndex: 'planInspectDate',
|
||
scopedSlots: { customRender: 'text' }
|
||
},
|
||
{ // 稽查负责人
|
||
title: this.$t('workCenter.esInspectionPlan.inspectionDirector'),
|
||
align: 'center',
|
||
width: 120,
|
||
dataIndex: 'inspectUserDictText',
|
||
scopedSlots: { customRender: 'text' }
|
||
},
|
||
{ // 状态
|
||
title: this.$t('workCenter.incExtensionRequest.state'),
|
||
align: 'center',
|
||
width: 120,
|
||
dataIndex: 'inspectStatus_dictText',
|
||
scopedSlots: { customRender: 'text' }
|
||
},
|
||
{ // 申请延期日期
|
||
title: this.$t('workCenter.incExtensionRequest.requestExtensionDate'),
|
||
align: 'center',
|
||
width: 120,
|
||
dataIndex: 'requestDelayDate',
|
||
scopedSlots: { customRender: 'text' }
|
||
},
|
||
{ // 延期说明
|
||
title: this.$t('workCenter.incExtensionRequest.extensionDescription'),
|
||
align: 'center',
|
||
width: 120,
|
||
dataIndex: 'delayDescription',
|
||
scopedSlots: { customRender: 'text' }
|
||
},
|
||
{ // 稽查联络人
|
||
title: this.$t('workCenter.incExtensionRequest.inspectionContactPerson'),
|
||
showCodeList: [
|
||
InspectionExtensionRequestProcess.initiate.value
|
||
],
|
||
align: 'center',
|
||
width: 200,
|
||
dataIndex: 'liaisons',
|
||
scopedSlots: { customRender: 'inspectionContactPerson' }
|
||
},
|
||
{
|
||
// 操作
|
||
fixed: 'right',
|
||
title: this.$t('operation'),
|
||
showCodeList: [
|
||
InspectionExtensionRequestProcess.initiate.value
|
||
],
|
||
// dataIndex: 'action',
|
||
align: 'center',
|
||
width: 180,
|
||
scopedSlots: { customRender: 'action' }
|
||
}
|
||
]
|
||
}
|
||
},
|
||
computed: {
|
||
// 是否第一个节点
|
||
isInitiate () {
|
||
return this.currentNode === InspectionExtensionRequestProcess.initiate.value
|
||
},
|
||
// 是否第二个节点
|
||
isDirectorLeaderApproval () {
|
||
return this.currentNode === InspectionExtensionRequestProcess.directorLeaderApproval.value
|
||
},
|
||
// 是否第三个节点
|
||
isContactEvaluation () {
|
||
return this.currentNode === InspectionExtensionRequestProcess.contactEvaluation.value
|
||
},
|
||
// 是否第四个节点
|
||
isDirectorSuperiorLeaderApproval () {
|
||
return this.currentNode === InspectionExtensionRequestProcess.directorSuperiorLeaderApproval.value
|
||
},
|
||
// 按节点进行过滤
|
||
columns () {
|
||
return this.allColumns.filter(item => {
|
||
// 没有这个属性，就默认显示
|
||
if (!item.showCodeList) {
|
||
return true
|
||
}
|
||
// 如果有，就根据当前节点显示
|
||
return item.showCodeList.includes(this.currentNode)
|
||
})
|
||
}
|
||
},
|
||
mounted () {
|
||
if (this.isInitiate) {
|
||
this.getUserList()
|
||
}
|
||
},
|
||
methods: {
|
||
// 添加回调
|
||
handleAddCallback (rows) {
|
||
this.dataSource.push(...rows)
|
||
},
|
||
// 设置表格数据
|
||
setData (list) {
|
||
this.dataSource = list.map(item => {
|
||
item.liaisons = item.liaisons || undefined
|
||
return item
|
||
})
|
||
},
|
||
// 修改：稽查联络人
|
||
changeRowData (record, field) {
|
||
editInspectExtensionTable({
|
||
id: record.id,
|
||
[field]: record[field] || ''
|
||
}).then(res => {
|
||
if (res.success) {
|
||
this.$message.success(res.message)
|
||
} else {
|
||
this.$message.warn(res.message)
|
||
}
|
||
})
|
||
},
|
||
// 申请延期
|
||
handleRequestExtension (record, index) {
|
||
this.$refs.requestExtensionModal.edit(record, index)
|
||
},
|
||
// 申请延期回调
|
||
requestExtensionCallback (row, index) {
|
||
this.dataSource.splice(index, 1, row)
|
||
},
|
||
// 返回用户列表
|
||
getUserList () {
|
||
getUserList({ pageNo: -1, pageSize: -1, order: 'desc', column: 'createTime' }).then(res => {
|
||
if (res.success) {
|
||
this.userList = res.result.records || []
|
||
}
|
||
})
|
||
},
|
||
// 跳转详情
|
||
detailClick (record) {
|
||
this.$openPageNewSheet({
|
||
path: '/enterpriseStandardLibrary/enterpriseStandardDetail',
|
||
query: {
|
||
standardNumber: record.inspectNo
|
||
}
|
||
})
|
||
},
|
||
tableOnChange (pagination, filters, sorter) {
|
||
this.orderBy = sorter.order === 'ascend' ? '1' : '2'
|
||
this.orderByField = sorter.columnKey
|
||
this.ipagination = pagination
|
||
this.getTableList()
|
||
},
|
||
// 获取向上第n个父节点
|
||
getNumParentNode (el, n) {
|
||
if (n < 1 || el === document.body) {
|
||
return el.parentNode || document.body
|
||
}
|
||
return this.getNumParentNode(el.parentNode, n - 1)
|
||
},
|
||
handleAdd () {
|
||
this.$refs.extensionRequestTableModal.show({
|
||
projectId: this.projectId
|
||
})
|
||
},
|
||
filterOption (input, option) {
|
||
return (
|
||
option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
|
||
)
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="less" scoped>
|
||
.table-form {
|
||
position: relative;
|
||
/deep/ .ant-calendar-picker {
|
||
min-width: 130px !important;
|
||
}
|
||
}
|
||
</style>
|