358 lines
12 KiB
Vue
358 lines
12 KiB
Vue
<template>
|
|
<a-drawer
|
|
:title="$t('standardSelect.standardSelection')"
|
|
:maskClosable="false"
|
|
:width="1000"
|
|
placement="right"
|
|
:closable="true"
|
|
@close="handleCancel"
|
|
:visible="visible"
|
|
class="custom-drawer-style">
|
|
<div class="custom-drawer-style-scroll">
|
|
<div class="table-page-search-wrapper">
|
|
<a-form layout="inline" @keyup.enter.native="searchQuery">
|
|
<a-row :gutter="24">
|
|
<a-col :sm="8">
|
|
<a-form-item :label="$t('standardSelect.source')" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
|
<j-dict-select-tag style="width: 100%" v-model="queryParam.source"
|
|
:disabled="disabledSourceSearch"
|
|
:placeholder="$t('pleaseSelect')+$t('standardSelect.source')"
|
|
:triggerChange="false"
|
|
:options="sourceOptions"
|
|
@change="handleTypeChange" />
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :sm="8">
|
|
<a-form-item :label="$t('standardSelect.standardNumOrName')" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
|
<a-input :placeholder="$t('pleaseEnter')+$t('standardSelect.standardNumOrName')"
|
|
v-model="queryParam.standardNumberOrName"></a-input>
|
|
</a-form-item>
|
|
</a-col>
|
|
<div style="float: right;overflow: hidden;margin-right: 41px;margin-bottom: 20px"
|
|
class="table-page-search-submitButtons">
|
|
<a-button style="margin-left: 8px" type="primary" icon="search" @click="searchQuery">{{ $t('query') }}</a-button>
|
|
<a-button style="margin-left: 8px" type="primary" ghost icon="reload" @click="searchReset">{{ $t('reset') }}</a-button>
|
|
</div>
|
|
</a-row>
|
|
</a-form>
|
|
</div>
|
|
<a-table
|
|
:columns="columns"
|
|
rowKey="standardNumber"
|
|
:scroll="{x: 900}"
|
|
:data-source="dataList"
|
|
:pagination="ipagination"
|
|
:row-selection="{ type: type, selectedRowKeys: selectedRowKeys, onChange: onSelectChange }"
|
|
:loading="loading"
|
|
@change="handleTableChange">
|
|
<template slot="text" slot-scope="text">
|
|
<a-tooltip overlay-class-name="tooltip-style">
|
|
<template slot="title">{{ text || text === 0 ? text : global.emptyLine }}</template>
|
|
<div class="table-text">{{ text || text === 0 ? text : global.emptyLine }}</div>
|
|
</a-tooltip>
|
|
</template>
|
|
|
|
<!-- 企标编号/企标名称 -->
|
|
<template v-slot:toDetail="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="handleGoDetail(record)">{{ text }}</a>
|
|
<div v-else class="table-text">{{ global.emptyLine }}</div>
|
|
</a-tooltip>
|
|
</template>
|
|
|
|
<!-- 标准状态 -->
|
|
<template slot="standardState" slot-scope="text, record">
|
|
<a-tooltip overlay-class-name="tooltip-style">
|
|
<template slot="title">{{ record.source === '3' ? (record.esStandardState_dictText || global.emptyLine) : (record.standardState_dictText || global.emptyLine) }}</template>
|
|
<div class="table-text">{{ record.source === '3' ? (record.esStandardState_dictText || global.emptyLine) : (record.standardState_dictText || global.emptyLine) }}</div>
|
|
</a-tooltip>
|
|
</template>
|
|
|
|
</a-table>
|
|
</div>
|
|
|
|
<div class="custom-drawer-style-bottom-btn">
|
|
<a-button @click="handleCancel">{{ $t('cancel') }}</a-button>
|
|
<a-button @click="handleSubmit" type="primary" :loading="confirmLoading">{{ $t('submit') }}</a-button>
|
|
</div>
|
|
</a-drawer>
|
|
</template>
|
|
|
|
<script>
|
|
import { ajaxGetDictItems, getStandardList } from '@/api/api'
|
|
import JDictSelectTag from '../dict/JDictSelectTag'
|
|
import { StandardSource } from '../../enums/commonEnums'
|
|
|
|
export default {
|
|
name: 'StandardSelectionModal',
|
|
components: { JDictSelectTag },
|
|
props: {
|
|
source: {
|
|
type: [String, Number],
|
|
default: '1'
|
|
},
|
|
// 查询条件可以选择的类型
|
|
canSelectedSource: {
|
|
type: [String, Array],
|
|
required: false,
|
|
default: () => {
|
|
return [StandardSource.DOMESTIC.value, StandardSource.OVERSEAS.value, StandardSource.ENTERPRISE.value]
|
|
}
|
|
},
|
|
value: {
|
|
type: String,
|
|
default: ''
|
|
},
|
|
// 搜索条件中的来源是否不可更改
|
|
disabledSourceSearch: {
|
|
type: Boolean,
|
|
default: false
|
|
},
|
|
type: {
|
|
type: String,
|
|
required: false,
|
|
default: 'checkbox'
|
|
},
|
|
// 列表数据不包含的标准
|
|
excludeStandardNumbers: {
|
|
type: String,
|
|
required: false,
|
|
default: null
|
|
},
|
|
// 过滤条件
|
|
filters: {
|
|
type: Object,
|
|
required: false,
|
|
default: () => {
|
|
return {}
|
|
}
|
|
}
|
|
},
|
|
data () {
|
|
return {
|
|
visible: false,
|
|
confirmLoading: false,
|
|
labelCol: {
|
|
sm: 8
|
|
},
|
|
wrapperCol: {
|
|
sm: 14
|
|
},
|
|
selectedRowKeys: [],
|
|
selectedRowList: [],
|
|
loading: false,
|
|
queryParam: {},
|
|
/* 分页参数 */
|
|
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('standardNumber'),
|
|
dataIndex: 'standardNumber',
|
|
ellipsis: true,
|
|
align: 'center',
|
|
width: 150,
|
|
scopedSlots: { customRender: 'toDetail' }
|
|
},
|
|
{
|
|
title: this.$t('standardName'),
|
|
dataIndex: 'standardName',
|
|
ellipsis: true,
|
|
align: 'center',
|
|
width: 150,
|
|
scopedSlots: { customRender: 'toDetail' }
|
|
},
|
|
// 发布日期
|
|
{
|
|
title: this.$t('standardSelect.releaseDate'),
|
|
dataIndex: 'releaseDate',
|
|
align: 'center',
|
|
width: 120,
|
|
scopedSlots: { customRender: 'text' }
|
|
},
|
|
{
|
|
title: this.$t('standardSelect.textState'),
|
|
dataIndex: 'standardState_dictText',
|
|
align: 'center',
|
|
width: 150,
|
|
scopedSlots: { customRender: 'standardState' }
|
|
}
|
|
],
|
|
dataList: [],
|
|
sourceOptions: []
|
|
}
|
|
},
|
|
methods: {
|
|
open () {
|
|
this.visible = true
|
|
this.queryParam = {}
|
|
this.initDict()
|
|
this.$nextTick(() => {
|
|
this.source ? this.queryParam.source = this.source : this.queryParam = {}
|
|
this.replacePage()
|
|
})
|
|
},
|
|
initDict () {
|
|
ajaxGetDictItems('standard_source').then(res => {
|
|
if (res.success) {
|
|
const canSelectedArr = typeof this.canSelectedSource === 'string' ? this.canSelectedSource.split(',') : this.canSelectedSource
|
|
this.sourceOptions = res.result.filter(tt => canSelectedArr.includes(tt.value))
|
|
}
|
|
})
|
|
},
|
|
// 获取表格数据
|
|
replacePage (arg) {
|
|
if (arg === 1) {
|
|
this.ipagination.current = 1
|
|
}
|
|
const query = {
|
|
...this.queryParam,
|
|
...this.filters,
|
|
pageNo: this.ipagination.current,
|
|
pageSize: this.ipagination.pageSize,
|
|
excludeStandardNumbers: this.excludeStandardNumbers
|
|
}
|
|
// 清空在可选范围内进行查询
|
|
if (!query.source && this.canSelectedSource.length < 3) {
|
|
query.source = this.canSelectedSource.join(',')
|
|
}
|
|
// this.selectedRowKeys = []
|
|
this.loading = true
|
|
getStandardList(query).then((res) => {
|
|
if (res.success) {
|
|
this.dataList = res.result.records
|
|
this.ipagination.total = res.result.total
|
|
this.selectedRowKeys = this.value ? this.value.split(',') : (this.selectedRowKeys || [])
|
|
} else {
|
|
this.dataList = []
|
|
}
|
|
}).finally(() => {
|
|
this.loading = false
|
|
})
|
|
},
|
|
searchQuery () {
|
|
this.replacePage(1)
|
|
},
|
|
searchReset () {
|
|
// 如果禁用来源，就不重置来源
|
|
if (this.disabledSourceSearch) {
|
|
this.queryParam = { source: this.source }
|
|
} else {
|
|
this.queryParam = {}
|
|
}
|
|
this.replacePage(1)
|
|
},
|
|
// 表格选择改变
|
|
onSelectChange (selectedRowKeys, selectedRows) {
|
|
this.selectedRowKeys = selectedRowKeys
|
|
// this.selectedRowList = row
|
|
if (this.type === 'checkbox') {
|
|
if (selectedRowKeys.length > this.selectedRowList.length) {
|
|
// 说明是增加了数据
|
|
for (const rowIndex in selectedRows) {
|
|
if (!this.selectedRowList.find(item => item.standardNumber === selectedRows[rowIndex].standardNumber)) {
|
|
// 不存在，追加
|
|
this.selectedRowList.push(selectedRows[rowIndex])
|
|
}
|
|
}
|
|
} else {
|
|
// 说明是删除了数据
|
|
if (selectedRowKeys && selectedRowKeys.length > 0) {
|
|
// 没有选中数据，说明这一页没有选中数据了
|
|
for (let i = 0; i < this.selectedRowList.length; i++) {
|
|
if (!selectedRowKeys.find(item => item === this.selectedRowList[i].standardNumber)) {
|
|
// 表格选中中没有找到这一条数据，说明已经被删了
|
|
this.selectedRowList.splice(i, 1)
|
|
i--
|
|
}
|
|
}
|
|
} else {
|
|
this.selectedRowList = []
|
|
}
|
|
}
|
|
console.log(this.selectedRowList)
|
|
} else {
|
|
this.selectedRowList = selectedRows
|
|
}
|
|
},
|
|
handleTableChange (pagination) {
|
|
// 分页、排序、筛选变化时触发
|
|
this.ipagination = pagination
|
|
this.replacePage()
|
|
},
|
|
handleCancel () {
|
|
this.close()
|
|
},
|
|
handleSubmit () {
|
|
const serialNumber = []
|
|
const serialNameArr = []
|
|
if (this.selectedRowKeys && this.selectedRowKeys.length > 0) {
|
|
this.selectedRowList.forEach(res => {
|
|
serialNumber.push(res.standardNumber)
|
|
serialNameArr.push(res.standardName)
|
|
})
|
|
// console.log('this.selectedRowKeys', this.selectedRowKeys)
|
|
// console.log('serialNameArr', serialNameArr)
|
|
// console.log('this.selectedRowList', this.selectedRowList)
|
|
this.$emit('change', this.selectedRowKeys.join(','))
|
|
this.$emit('nameChange', serialNameArr.join(','))
|
|
this.$emit('listChange', this.selectedRowList)
|
|
this.close()
|
|
} else {
|
|
this.$message.warning(this.$t('selectLeastOne'))
|
|
}
|
|
},
|
|
close () {
|
|
this.visible = false
|
|
this.selectedRowKeys = []
|
|
this.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
|
|
}
|
|
},
|
|
handleTypeChange () {
|
|
this.$forceUpdate()
|
|
},
|
|
// 点击跳转标准详情
|
|
handleGoDetail (record) {
|
|
let path = ''
|
|
// 需要先判断是哪种标准
|
|
if (record.source === '1') {
|
|
path = '/standardRegulationLibrary/DomesticStandardDetail'
|
|
} else if (record.source === '2') {
|
|
path = '/standardRegulationLibrary/OverseasStandardDetail'
|
|
} else if (record.source === '3') {
|
|
path = '/enterpriseStandardLibrary/enterpriseStandardDetail'
|
|
}
|
|
this.$openPageNewSheet({
|
|
path: path,
|
|
query: {
|
|
id: record.id
|
|
}
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped lang="less">
|
|
@import '~@assets/less/common.less';
|
|
</style>
|