Files
laws-sinotruk-client/src/views/standardRegulationLibrary/domesticStandard/DomesticStandardList.vue
T
2023-09-27 14:56:33 +08:00

627 lines
22 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<template>
<a-card :bordered="false" class="page-left-right-layout">
<!-- 树部分-->
<div class="page-left-box">
<a-input-search v-model="treeInput" class="tree-search"
:placeholder="$t('standardRegulationLibrary.domesticStandard.treeSearchPlaceholder')"
@search="handleTreeSearch" />
<div class="page-tree-box page-tree-box-has-search">
<a-spin :spinning="treeLoading">
<a-tree :show-line="true" :show-icon="true" :tree-data="treeData" :selected-keys="selectedTreeKeys">
<template #title="record">
<div class="tree-operate-node"
@mouseenter="handleTreeMouseover(record.key)"
@mouseleave="handleTreeMouseout(record.key)"
@click="handleSelectTreeNode(record)">
<a-icon class="parent-node-icon" type="folder" v-if="record.dataRef.children && record.dataRef.children.length > 0" />
<a-tooltip>
<template #title>
{{ record.title }}
</template>
<span class="tree-node-custom-title">{{ record.title }}</span>
</a-tooltip>
<div class="tree-operate-node-btn-box" :class="{'tree-operate-node-btn-box-hide': record.key !== mouseInNodeKey}">
<!-- 新增-->
<a-button icon="plus"
class="tree-operate-node-btn"
@click.stop="handleAddTreeNode(record)"
v-if="record.nodeType !== StandardSystemTreeNodeType.NOT_OPERATE_NODE.value"
v-has="'domesticStandard:tree:add'"></a-button>
<!-- 编辑,根节点不能编辑-->
<a-button class="tree-operate-node-btn"
@click.stop="handleEditTreeNode(record)"
v-has="'domesticStandard:tree:edit'"
v-if="record.nodeType !== StandardSystemTreeNodeType.ROOT_NODE.value && record.nodeType !== StandardSystemTreeNodeType.NOT_OPERATE_NODE.value">
<i class="iconfont icon-bianji" />
</a-button>
<!-- 删除,根节点不能删除-->
<a-button class="tree-operate-node-btn"
v-has="'domesticStandard:tree:delete'"
v-if="record.nodeType !== StandardSystemTreeNodeType.ROOT_NODE.value && record.nodeType !== StandardSystemTreeNodeType.NOT_OPERATE_NODE.value"
@click.stop="handleDelTreeNode(record)">
<i class="iconfont icon-shanchu_" />
</a-button>
</div>
</div>
</template>
</a-tree>
</a-spin>
</div>
</div>
<!-- 表格部分-->
<div class="page-right-box">
<div class="table-page-search-wrapper">
<search ref="searchRef"
:url="url"
:get-query-condition-func="getQueryConditionFunc"
search-has="domesticStandard:search"
@search="searchQuery"
@reset="searchReset" />
</div>
<div class="table-operator">
<!-- 新增-->
<a-button icon="plus" type="primary" @click="handleAdd" v-has="'domesticStandard:add'">{{ $t('newlyAdded') }}</a-button>
<!-- 导入-->
<a-upload name="file"
:showUploadList="false"
:multiple="false"
:headers="tokenHeader"
:action="importExcelUrl"
v-has="'domesticStandard:import'"
@change="handleImportExcel">
<a-button type="primary" icon="download" ghost>{{ $t('import') }}</a-button>
</a-upload>
<!-- 导出-->
<a-button icon="upload"
type="primary"
ghost
v-has="'domesticStandard:export'"
@click="handleExportXls($t('standardRegulationLibrary.domesticStandard.exportFileName'))">
{{ $t('export') }}
</a-button>
<!-- 带文件导出-->
<a-button icon="upload"
type="primary"
ghost
v-has="'domesticStandard:exportFile'"
@click="handleFileExport($t('standardRegulationLibrary.domesticStandard.exportFileName'))">
{{ $t('exportWithFile') }}
</a-button>
<!-- 模板下载-->
<a-button type="primary"
icon="download"
ghost
v-has="'domesticStandard:downTemplate'"
@click="downTemplate($t('standardRegulationLibrary.domesticStandard.templateName'))">
{{ $t('templateDownload') }}
</a-button>
<!-- 批量删除-->
<a-button type="primary" icon="delete" ghost @click="batchDel" v-has="'domesticStandard:batchDel'">{{ $t('batchDelete') }}</a-button>
<!-- 配置标准-->
<a-button type="primary" icon="setting" ghost @click="handleConfigStandard" v-has="'domesticStandard:configStandard'">
{{ $t('standardRegulationLibrary.configStandard') }}
</a-button>
<!-- 移出标准-->
<a-button type="primary" icon="minus-circle" ghost @click="handleRemoveStandard" v-has="'domesticStandard:removeStandard'">
{{ $t('standardRegulationLibrary.removeStandard') }}
</a-button>
</div>
<div>
<j-table
v-if="columns && columns.length > 0"
:columns="columns"
:dataSource="dataSource"
:can-drag="true"
rowKey="id"
:row-selection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }"
:pagination="ipagination"
:scroll="{x: '100%'}"
:loading="loading"
@change="tableOnChange">
<!-- 标准编号-->
<template v-slot:standard_number="{text, record}">
<a-tooltip overlay-class-name="tooltip-style">
<template slot="title">{{ text || text === 0 ? text : global.emptyLine }}</template>
<div class="table-text can-click-table-text" v-if="text || text === 0" @click="toDetailPage(record)">{{ text }}</div>
<div v-else class="table-text">{{ global.emptyLine }}</div>
</a-tooltip>
</template>
<!-- 标准名称-->
<template v-slot:standard_name="{text, record}">
<a-tooltip overlay-class-name="tooltip-style">
<template slot="title">{{ text || text === 0 ? text : global.emptyLine }}</template>
<div class="table-text can-click-table-text" v-if="text || text === 0" @click="toDetailPage(record)">{{ text }}</div>
<div v-else class="table-text">{{ global.emptyLine }}</div>
</a-tooltip>
</template>
<template v-slot:operation="{text, record}">
<!-- 收藏-->
<a @click="operationClick(operationList[0],record)" v-has="operationList[0].has">
<i class="iconfont icon-star1" v-show="record.collectionFlag" />
<i class="iconfont icon-star" v-show="!record.collectionFlag" />
</a>
<a-divider type="vertical" />
<a-dropdown placement="bottomCenter">
<a-icon type="more" class="operate-icon-btn operate-icon-more" />
<a-menu slot="overlay">
<a-menu-item v-for="(operation, index) in operationList.slice(operateMaxNum)" :key="index">
<a @click="operationClick(operation,record)" v-has="operation.has">
<div class="operate-btn">
<!-- 编辑图标-->
<i class="iconfont icon-bianji operate-btn-icon" v-if="operation.text === $t('edit')" />
<!-- 分享图标-->
<i class="iconfont icon-fangxingfenxiang operate-btn-icon" v-if="operation.text === $t('share')" />
<!-- 删除图标-->
<i class="iconfont icon-shanchu_ operate-btn-icon" v-if="operation.text === $t('delete')" />
{{ operation.text }}
</div>
</a>
</a-menu-item>
</a-menu>
</a-dropdown>
</template>
</j-table>
</div>
</div>
<!-- 新增、编辑-->
<domestic-standard-modal ref="modalForm" @ok="modalFormOk" />
<!-- 分享选人-->
<user-select-modal ref="userSelectModal" type="checkbox" @change="continueShare" />
<!-- 树新增、编辑-->
<domestic-system-tree-modal ref="treeModal" @ok="modalFormOk" />
<!-- 配置标准-->
<selection-domestic-standard-drawer ref="standardSelectionModal" :node-code="selectedTreeNodeCodes[0]" @change="continueConfigStandard" />
</a-card>
</template>
<script>
import '@assets/less/common.less'
import { ConfigurableTableMixin } from '../../../mixins/ConfigurableTableMixin'
import Search from '../../../components/customField/Search.vue'
import JTable from '../../../components/jero/JTable.vue'
import DomesticStandardModal from './modules/DomesticStandardModal.vue'
import {
configDomesticStandard,
deleteDomesticSystemTree,
getDomesticStandardSearchForm,
getDomesticStandardTableHeader,
getDomesticStandardTree,
removeDomesticStandard,
shareDomesticStandard,
collectionDomesticStandard,
cancelCollectionDomesticStandard
} from '../../../api/standardRegulationLibraryApi'
import { StandardSource, StandardSystemTreeNodeType, YesOrNoEnum } from '../../../enums/commonEnums'
import UserSelectModal from '../../../components/selection/UserSelectModal.vue'
import DomesticSystemTreeModal from './modules/DomesticSystemTreeModal.vue'
import SelectionDomesticStandardDrawer from './modules/SelectionDomesticStandardDrawer.vue'
import { postDownFile } from '../../../api/manage.js'
export default {
name: 'DomesticStandardList',
components: { Search, JTable, DomesticStandardModal, UserSelectModal, DomesticSystemTreeModal, SelectionDomesticStandardDrawer },
mixins: [ConfigurableTableMixin],
data () {
return {
StandardSystemTreeNodeType,
treeInput: null, // 树查询绑定值
treeData: [],
mouseInNodeKey: null, // 鼠标悬浮的节点key值
showAction: true,
operationList: [
// 收藏
{
text: this.$t('standardRegulationLibrary.domesticStandard.cancelCollection'),
clickEvent: 'handleCollection',
has: 'domesticStandard:collection'
},
// 编辑
{
text: this.$t('edit'),
clickEvent: 'handleEdit',
has: 'domesticStandard:edit'
},
// 分享
{
text: this.$t('share'),
clickEvent: 'handleShare',
has: 'domesticStandard:share'
},
// 删除
{
text: this.$t('delete'),
clickEvent: 'handleDelete',
has: 'domesticStandard:delete'
}
],
getTableHeaderFunc: getDomesticStandardTableHeader,
getQueryConditionFunc: getDomesticStandardSearchForm,
url: {
list: '/laws/standard/domestic/getCommonPage',
delete: '/laws/standard/domestic/deleteByIdsAndModule',
deleteBatch: '/laws/standard/domestic/deleteByIdsAndModule',
downTemplateUrl: '/laws/standard/domestic/templateDownload', // 下载模板
exportXlsUrl: '/laws/standard/domestic/exportData', // 导出
exportZipUrl: '/laws/standard/domestic/exportDataWithFile', // 带文件导出
importExcelUrl: '/laws/standard/domestic/importExcelWithData' // 导入
},
yesValue: YesOrNoEnum.YES.value,
noValue: YesOrNoEnum.NO.value,
nowShareInfo: {}, // 当前正在分享的数据
selectedTreeKeys: [], // 选中的树节点key
selectedTreeNodeCodes: [], // 选中树节点的code
tableSlotField: ['standard_name', 'standard_number'], // 表格中需要插槽的字段
treeLoading: false,
isCollection: false
}
},
computed: {
importExcelUrl () {
return `${window._CONFIG.domianURL}/${this.url.importExcelUrl}`
}
},
created () {
this.initTreeData()
},
methods: {
/**
* 获取树数据
*/
initTreeData () {
this.treeLoading = true
const params = {
nodeName: this.treeInput
}
if (!params.nodeName) {
delete params.nodeName
}
getDomesticStandardTree(params).then(res => {
this.treeData = []
this.selectedTreeKeys = []
this.selectedTreeNodeCodes = []
this.filters.nodeCode = null
if (res.success) {
this.treeData = res.result || []
} else {
this.$message.warn(res.message)
}
}).finally(() => {
this.treeLoading = false
})
},
/**
* 树节点查询
*/
handleTreeSearch () {
this.initTreeData()
},
/**
* 树节点鼠标移入
* @param key
*/
handleTreeMouseover (key) {
this.mouseInNodeKey = key
},
/**
* 树节点鼠标移出
* @param key
*/
handleTreeMouseout (key) {
if (this.mouseInNodeKey === key) {
this.mouseInNodeKey = null
}
},
/**
* 收藏/取消收藏
* @param record
*/
handleCollection ({ collectionFlag, id: standardId, standard_number: standardNumber }) {
if (this.isCollection) {
return
}
this.isCollection = true
let params
let submitFunc
// 取消收藏
if (collectionFlag) {
params = { id: standardId, standardNumber }
submitFunc = cancelCollectionDomesticStandard
} else {
params = { standardId, standardNumber }
submitFunc = collectionDomesticStandard
}
// 收藏
submitFunc(params).then(res => {
if (res.success) {
this.$message.success(res.message)
this.loadData()
} else {
this.$message.warn(res.message)
}
}).finally(() => {
this.isCollection = false
})
},
/**
* 分享
*/
handleShare ({ id, standard_number: standardNumber }) {
this.nowShareInfo = {
standardId: id,
standardNumber
}
this.$refs.userSelectModal.open()
},
/**
* 选择分享的人之后继续分享
* @param ids
*/
continueShare (ids) {
const params = Object.assign(this.nowShareInfo, {
recipientId: ids // 分享给的用户的id
})
this.loading = true
shareDomesticStandard(params).then(res => {
if (res.success) {
this.$message.success(res.message)
} else {
this.$message.warn(res.message)
}
}).finally(() => {
this.loading = false
})
},
modalFormOk () {
this.selectedTreeKeys = []
this.filters.nodeCode = null
this.initTreeData()
// 新增/修改 成功时,重载列表
this.loadData()
// 清空列表选中
this.onClearSelected()
},
/**
* 新增树节点
* @param dataRef
*/
handleAddTreeNode ({ dataRef }) {
this.$refs.treeModal.add({ parentId: dataRef.id, parentCode: dataRef.nodeCode })
},
/**
* 编辑树节点
* @param dataRef
*/
handleEditTreeNode ({ dataRef }) {
this.$refs.treeModal.edit(dataRef)
},
/**
* 删除树节点
* @param dataRef
*/
handleDelTreeNode ({ dataRef }) {
this.$confirm({
title: this.$t('confirmDeletion'),
content: this.$t('areYouSure'),
onOk: () => {
deleteDomesticSystemTree({ id: dataRef.id }).then((res) => {
if (res.success) {
this.$message.success(res.message)
this.modalFormOk()
} else {
this.$message.warning(res.message)
}
})
}
})
},
/**
* 选中树节点
* @param dataRef
*/
handleSelectTreeNode ({ dataRef }) {
this.selectedTreeKeys = [dataRef.key]
this.selectedTreeNodeCodes = [dataRef.nodeCode]
this.filters.nodeCode = dataRef.nodeCode
this.loadData(1)
},
/**
* 配置标准
*/
handleConfigStandard () {
// 没选择左侧树节点,需要提示“请先选择二级及以下体系”
if (!this.selectedTreeNodeCodes || this.selectedTreeNodeCodes.length === 0) {
this.$message.warn(this.$t('standardRegulationLibrary.configStandardNoTreeNode'))
return
}
this.$refs.standardSelectionModal.open()
},
/**
* 配置标准-提交
* @param dbFieldName
* @param standardIds
*/
continueConfigStandard (dbFieldName, standardIds) {
this.loading = true
const params = {
nodeCode: this.selectedTreeNodeCodes[0],
ids: standardIds
}
configDomesticStandard(params).then(res => {
if (res.success) {
this.$message.success(res.message)
this.loadData()
} else {
this.$message.warn(res.message)
}
}).finally(() => {
this.loading = false
})
},
/**
* 移出标准
*/
handleRemoveStandard () {
// 没选择左侧树节点,需要提示“请先选择二级及以下体系”
if (!this.selectedTreeNodeCodes || this.selectedTreeNodeCodes.length === 0) {
this.$message.warn(this.$t('standardRegulationLibrary.configStandardNoTreeNode'))
return
}
// 没有选择列表数据,需要提示“选中至少一条列表数据”
if (!this.selectedRowKeys || this.selectedRowKeys.length === 0) {
this.$message.warning(this.$t('standardRegulationLibrary.selectLeastOneTableData'))
return
}
this.loading = true
const params = {
nodeCode: this.selectedTreeNodeCodes[0],
ids: this.selectedRowKeys.join(',')
}
removeDomesticStandard(params).then(res => {
if (res.success) {
this.$message.success(res.message)
// 判断当前删除的数据是否是最后一页的最后一条数据,如果是的话页码减一
if (this.ipagination.current > 1 && ((this.ipagination.current - 1) * this.ipagination.pageSize) + 1 === this.ipagination.total) {
this.ipagination.current -= 1
}
this.loadData()
} else {
this.$message.warn(res.message)
}
}).finally(() => {
this.loading = false
})
},
/**
* 跳转详情页
* @param id
* @param standardNumber
*/
toDetailPage ({ id }) {
this.$openPageNewSheet({
path: '/standardRegulationLibrary/DomesticStandardDetail',
query: {
id
}
})
},
/**
* 重置查询
*/
searchReset () {
this.searchParams = {}
this.selectedRowKeys = []
this.selectedTreeKeys = []
delete this.filters.nodeCode
this.getTableHeader()
this.loadData()
},
// 导出改成用post
handleExportXls (fileName) {
if (!fileName || typeof fileName !== 'string') {
fileName = '导出文件'
}
const param = this.getQueryParams()
if (this.selectedRowKeys && this.selectedRowKeys.length > 0) {
param.selections = this.selectedRowKeys.join(',')
}
console.log('导出参数', param)
// 加一个大的提示
const modalLoading = this.$info({
title: '提示',
content: <span>正在导出,请稍候 <a-spin size="small" /></span>,
keyboard: false
})
// 把知道了这个按钮去掉
this.$nextTick(() => {
document.getElementsByClassName('ant-modal-confirm-btns')[0].style = 'display:none'
})
postDownFile(this.url.exportXlsUrl, param).then((data) => {
if (!data || data.size === 0) {
this.$message.warning('文件下载失败')
return
}
if (typeof window.navigator.msSaveBlob !== 'undefined') {
window.navigator.msSaveBlob(new Blob([data]), fileName + '.xls')
} else {
const url = window.URL.createObjectURL(new Blob([data]))
const link = document.createElement('a')
link.style.display = 'none'
link.href = url
link.setAttribute('download', fileName + '.xls')
document.body.appendChild(link)
link.click()
document.body.removeChild(link) // 下载完成移除元素
window.URL.revokeObjectURL(url) // 释放掉blob对象
}
}).finally(() => {
// 销毁这个提示
modalLoading.destroy()
})
},
// 带文件导出
handleFileExport (fileName) {
if (!fileName || typeof fileName !== 'string') {
fileName = '导出文件'
}
const param = this.getQueryParams()
if (this.selectedRowKeys && this.selectedRowKeys.length > 0) {
param.selections = this.selectedRowKeys.join(',')
}
param.module = StandardSource.DOMESTIC.value
console.log('导出参数', param)
// 加一个大的提示
const modalLoading = this.$info({
title: '提示',
content: <span>正在导出,请稍候 <a-spin size="small" /></span>,
keyboard: false
})
// 把知道了这个按钮去掉
this.$nextTick(() => {
document.getElementsByClassName('ant-modal-confirm-btns')[0].style = 'display:none'
})
postDownFile(this.url.exportZipUrl, param).then((data) => {
if (!data) {
this.$message.warning('文件下载失败')
}
if (typeof window.navigator.msSaveBlob !== 'undefined') {
window.navigator.msSaveBlob(new Blob([data]), fileName + '.zip')
} else {
const url = window.URL.createObjectURL(new Blob([data]))
const link = document.createElement('a')
link.style.display = 'none'
link.href = url
link.setAttribute('download', fileName + '.zip')
document.body.appendChild(link)
link.click()
document.body.removeChild(link) // 下载完成移除元素
window.URL.revokeObjectURL(url) // 释放掉blob对象
}
// }
}).finally(() => {
// 销毁这个提示
modalLoading.destroy()
})
}
}
}
</script>
<style scoped lang="less">
@import '~@assets/less/common.less';
/deep/ .ant-tree li span.ant-tree-switcher.ant-tree-switcher-noop {
color: #1D2129;
}
.parent-node-icon {
color: #1D2129;
font-size: 16px;
margin-right: 10px;
}
</style>