266 lines
8.8 KiB
Vue
266 lines
8.8 KiB
Vue
<template>
|
||
<a-card :bordered="false">
|
||
<a-tabs type="card" v-model="activeTab" @change="handleTabChange">
|
||
<!--新车型实施预警-->
|
||
<a-tab-pane key="1" :tab="$t('docTool.standardWarning.implementEarlyWarningForNewModels')"></a-tab-pane>
|
||
<!--在产车实施预警-->
|
||
<a-tab-pane key="2" :tab="$t('docTool.standardWarning.implementEarlyWarningInProductionVehicles')"></a-tab-pane>
|
||
</a-tabs>
|
||
|
||
<div class="table-page-search-wrapper">
|
||
<a-form layout="inline" @keyup.enter.native="searchQuery">
|
||
<a-row :gutter="24">
|
||
<!--来源-->
|
||
<a-col :md="6" :sm="12">
|
||
<a-form-item :label="$t('standardSelect.source')" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
||
<j-dict-select-tag
|
||
class="box-input"
|
||
v-model="queryParam.source"
|
||
:placeholder="$t('pleaseSelect') + $t('standardSelect.source')"
|
||
:type="'select'"
|
||
:triggerChange="false"
|
||
:options="sourceOptions" />
|
||
</a-form-item>
|
||
</a-col>
|
||
<!--标准号/标准名称-->
|
||
<a-col :md="6" :sm="12">
|
||
<a-form-item :label="$t('standardSelect.standardNumOrName')">
|
||
<a-input :placeholder="$t('pleaseEnter') + $t('standardSelect.standardNumOrName')"
|
||
v-model="queryParam.standardNumberOrName"></a-input>
|
||
</a-form-item>
|
||
</a-col>
|
||
<!--责任部门-->
|
||
<a-col :md="6" :sm="12">
|
||
<a-form-model-item :label="$t('projectLibrary.vehicleItemLibrary.responsibleDepartment')"
|
||
:labelCol="labelCol"
|
||
:wrapperCol="wrapperCol">
|
||
<a-tree-select
|
||
tree-node-filter-prop="title"
|
||
v-model="queryParam.responsibleDepartment"
|
||
:maxTagCount="1"
|
||
:show-search="true"
|
||
:getPopupContainer="triggerNode=> triggerNode.parentNode"
|
||
class="box-input"
|
||
style="width: 100%"
|
||
:tree-data="departList"
|
||
:placeholder="$t('pleaseSelect') + $t('projectLibrary.vehicleItemLibrary.responsibleDepartment')"
|
||
@change="handleDepartsChange"
|
||
/>
|
||
</a-form-model-item>
|
||
</a-col>
|
||
|
||
<a-col :md="6" :sm="8">
|
||
<div style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
|
||
<a-button type="primary"
|
||
@click="searchQuery"
|
||
icon="search"
|
||
style="margin-left: 8px"
|
||
v-has="'standardWarning:search'">
|
||
{{ $t('query') }}
|
||
</a-button>
|
||
<a-button type="primary" @click="searchReset" icon="reload" ghost>{{ $t('reset') }}</a-button>
|
||
</div>
|
||
</a-col>
|
||
</a-row>
|
||
</a-form>
|
||
</div>
|
||
|
||
<div>
|
||
<j-table
|
||
:columns="columns"
|
||
:dataSource="dataSource"
|
||
:can-drag="true"
|
||
:rowKey="(index) => {return index}"
|
||
:pagination="ipagination"
|
||
:scroll="{x: '100%'}"
|
||
:loading="loading"
|
||
@change="handleTableChange"
|
||
@operationClick="operationClick">
|
||
|
||
<!--跳转标准详情-->
|
||
<template v-slot:detail="{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:date="{text, record}">
|
||
<a-tooltip overlay-class-name="tooltip-style">
|
||
<template slot="title">{{ text || text === 0 ? text : global.emptyLine }}</template>
|
||
<div class="table-text">
|
||
{{
|
||
activeTab === '1' ? record.newModelImplementationDate || global.emptyLine : record.onTheProductionDate || global.emptyLine
|
||
}}
|
||
</div>
|
||
</a-tooltip>
|
||
</template>
|
||
|
||
</j-table>
|
||
</div>
|
||
</a-card>
|
||
</template>
|
||
|
||
<script>
|
||
import { JeroListMixin } from '../../../mixins/JeroListMixin'
|
||
import { queryDepartTreeList, ajaxGetDictItems } from '../../../api/api'
|
||
import JTable from '../../../components/jero/JTable'
|
||
import { mapGetters } from 'vuex'
|
||
import { StandardSource } from '../../../enums/commonEnums'
|
||
|
||
export default {
|
||
name: 'StandardWarningList',
|
||
components: { JTable },
|
||
mixins: [JeroListMixin],
|
||
data () {
|
||
return {
|
||
departList: [],
|
||
disableMixinCreated: true,
|
||
activeTab: '1',
|
||
sourceOptions: [],
|
||
columns: [
|
||
// 来源
|
||
{
|
||
dataIndex: 'source_dictText',
|
||
title: this.$t('standardSelect.source'),
|
||
width: 150
|
||
},
|
||
// 标准号
|
||
{
|
||
dataIndex: 'standardNumber',
|
||
title: this.$t('standardNumber'),
|
||
width: 150,
|
||
scopedSlots: { customRender: 'detail' }
|
||
},
|
||
// 标准名称
|
||
{
|
||
dataIndex: 'standardName',
|
||
title: this.$t('standardName'),
|
||
width: 150,
|
||
scopedSlots: { customRender: 'detail' }
|
||
},
|
||
// 新车型实施日期
|
||
{
|
||
dataIndex: 'newModelImplementationDate',
|
||
title: this.$t('projectLibrary.vehicleItemLibrary.newModelImplementationDate'),
|
||
width: 150
|
||
}
|
||
],
|
||
url: {
|
||
list: '/laws/localTool/standardEarlyWarning/newModelImplementation'
|
||
}
|
||
}
|
||
},
|
||
computed: {
|
||
...mapGetters(['userInfo']),
|
||
yScrollHeight () {
|
||
/**
|
||
* 前几个使用变量是为了配合iframe嵌套，算出页面显示范围的高度
|
||
* 56px：tab的高度
|
||
* 48px：分页器的高度
|
||
* 48px：a-card的padding（上24+下24）
|
||
* 54px：表头行的高度
|
||
*/
|
||
log
|
||
return `calc(100vh - ${this.defaultHeight['user-info-height']} - ${this.defaultHeight['breadcrumb-height']} - ${this.defaultHeight.oneLineSearchHeight} - 56px - 48px - 48px - 54px - ${this.isBackTitle ? '56px' : '0'})`
|
||
}
|
||
},
|
||
created () {
|
||
this.queryParam.responsibleDepartment = this.userInfo.departIds
|
||
this.getDepartTreeList()
|
||
this.getSourceOptions()
|
||
this.loadData()
|
||
},
|
||
methods: {
|
||
getDepartTreeList () {
|
||
queryDepartTreeList().then((res) => {
|
||
if (res.success) {
|
||
this.departList = res.result
|
||
} else {
|
||
this.departList = []
|
||
}
|
||
})
|
||
},
|
||
getSourceOptions () {
|
||
ajaxGetDictItems('standard_source').then(res => {
|
||
if (res.success) {
|
||
this.sourceOptions = (res.result || []).filter(tt => tt.value !== StandardSource.ENTERPRISE.value)
|
||
console.log(this.sourceOptions)
|
||
}
|
||
})
|
||
},
|
||
handleTabChange () {
|
||
this.dataSource = []
|
||
switch (this.activeTab) {
|
||
// 新车型实施预警
|
||
case '1':
|
||
this.url.list = '/laws/localTool/standardEarlyWarning/newModelImplementation'
|
||
this.columns.splice(this.columns.length - 1, 1)
|
||
this.columns.push({
|
||
dataIndex: 'newModelImplementationDate',
|
||
title: this.$t('projectLibrary.vehicleItemLibrary.newModelImplementationDate'),
|
||
width: 150
|
||
})
|
||
break
|
||
// 在产车实施预警
|
||
case '2':
|
||
this.url.list = '/laws/localTool/standardEarlyWarning/onTheProduction'
|
||
this.columns.splice(this.columns.length - 1, 1)
|
||
this.columns.push({
|
||
dataIndex: 'onTheProductionDate',
|
||
title: this.$t('personalCenter.collection.productCarDate'),
|
||
width: 150
|
||
})
|
||
break
|
||
default:
|
||
break
|
||
}
|
||
this.queryParam = { responsibleDepartment: this.userInfo.departIds }
|
||
this.loadData(1)
|
||
},
|
||
/**
|
||
* 跳转标准详情
|
||
* @param id
|
||
* @param source
|
||
*/
|
||
toDetailPage ({ id, source }) {
|
||
let path
|
||
// 根据来源跳转不同的详情页
|
||
switch (source) {
|
||
// 国内
|
||
case StandardSource.DOMESTIC.value:
|
||
path = '/standardRegulationLibrary/DomesticStandardDetail'
|
||
break
|
||
// 海外
|
||
case StandardSource.OVERSEAS.value:
|
||
path = '/standardRegulationLibrary/OverseasStandardDetail'
|
||
break
|
||
// 企标
|
||
case StandardSource.ENTERPRISE.value:
|
||
path = '/enterpriseStandardLibrary/enterpriseStandardDetail'
|
||
break
|
||
default:
|
||
break
|
||
}
|
||
if (!path) {
|
||
return
|
||
}
|
||
const query = {
|
||
id
|
||
}
|
||
this.$openPageNewSheet({
|
||
path, query
|
||
})
|
||
},
|
||
handleDepartsChange () {
|
||
this.$forceUpdate()
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style scoped lang="less">
|
||
|
||
</style> |