Files
foton-laws-system-front/src/pages/localTool/standardWarning.vue
T

1210 lines
39 KiB
Vue

<!-- 标准法规库 - 动态&资料 -->
<template>
<div id="dynamicInformation" class="dynamic-information v-class">
<div class="dynamic-content">
<!-- 实施预警 -->
<div class="dynamic">
<div class="container">
<!-- <el-tabs v-model="activeName" @tab-click="handleClick">-->
<!-- <el-tab-pane label="标准预警" name="STANDARD">-->
<div class="dynamic-content">
<!-- <div>-->
<!-- <h5 style="font-size: 20px">实施预警</h5>-->
<!-- </div>-->
<div class="more">
<el-form :inline="true" :model="dynamic" class="demo-form-inline">
<el-row :gutter="24">
<el-col>
<el-form-item label="标准编号">
<el-input clearable size="mini"
v-model="dynamic.standCode"
placeholder="根据标准编号查找">
</el-input>
</el-form-item>
<el-form-item label="标准名称">
<el-input clearable size="mini"
v-model="dynamic.standName"
placeholder="根据标准名称查找">
</el-input>
</el-form-item>
<!-- 适用车型-->
<el-form-item :label="$t('m.applicableModels')" class="add-form-item form-item-disabled">
<el-select v-model="dynamic.applyType" size="mini"
:placeholder="$t('m.searchAccordingToThApplicableModel')" clearable>
<el-option v-for="opt in applyArcticOptions" :value="opt.value === undefined ? '' :opt.value"
:key="opt.value" :label="opt.label">{{ opt.label }}
</el-option>
</el-select>
</el-form-item>
<!-- <el-form-item label="适用车型">-->
<!-- <el-input clearable size="mini"-->
<!-- v-model="dynamic.applyType"-->
<!-- placeholder="根据适用车型查找">-->
<!-- </el-input>-->
<!-- </el-form-item>-->
</el-col>
</el-row>
<el-row :gutter="24">
<el-col>
<el-form-item label="发布日期" style="margin-right: 10px" class="choose-time-area">
<el-date-picker
v-model="dynamic.startIssueTime"
type="date"
size="mini"
:picker-options="pickerBeginDateBefore"
format="yyyy-MM-dd"
placeholder="选择开始时间">
</el-date-picker>
</el-form-item>
<el-form-item label="至" label-width="25px">
<el-date-picker
v-model="dynamic.endIssueTime"
type="date"
size="mini"
format="yyyy-MM-dd"
:picker-options="pickerBeginDateAfter"
placeholder="选择结束时间">
</el-date-picker>
</el-form-item>
<el-form-item label="新车型实施日期" style="margin-right: 10px" class="choose-time-area">
<el-date-picker
v-model="dynamic.startXCXSSRQ"
type="date"
size="mini"
:picker-options="XCXSSRQDateBefore"
format="yyyy-MM-dd"
placeholder="选择开始时间">
</el-date-picker>
</el-form-item>
<el-form-item label="至" label-width="25px">
<el-date-picker
v-model="dynamic.endXCXSSRQ"
type="date"
size="mini"
format="yyyy-MM-dd"
:picker-options="XCXSSRQDateAfter"
placeholder="选择结束时间">
</el-date-picker>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col>
<el-form-item label="实施日期" style="margin-right: 10px" class="choose-time-area">
<el-date-picker
v-model="dynamic.startSSRQ"
type="date"
size="mini"
:picker-options="SSRQDateBefore"
format="yyyy-MM-dd"
placeholder="选择开始时间">
</el-date-picker>
</el-form-item>
<el-form-item label="至" label-width="25px">
<el-date-picker
v-model="dynamic.endSSRQ"
type="date"
size="mini"
format="yyyy-MM-dd"
:picker-options="SSRQDateAfter"
placeholder="选择结束时间">
</el-date-picker>
</el-form-item>
<el-form-item label="在产车实施日期" style="margin-right: 10px" class="choose-time-area">
<el-date-picker
v-model="dynamic.startZCCSSRQ"
type="date"
size="mini"
:picker-options="ZCCSSRQDateBefore"
format="yyyy-MM-dd"
placeholder="选择开始时间">
</el-date-picker>
</el-form-item>
<el-form-item label="至" label-width="25px">
<el-date-picker
v-model="dynamic.endZCCSSRQ"
type="date"
size="mini"
format="yyyy-MM-dd"
:picker-options="ZCCSSRQDateAfter"
placeholder="选择结束时间">
</el-date-picker>
</el-form-item>
<el-button
style="margin: 6px 8px 0 0"
type="primary"
size="mini"
v-btn-permission="'5dca375c3d8d57c45e4815acf3611b34'"
@click="searchBtnClick"
class="common-button-primary">
查询
</el-button>
<el-button
style="margin: 6px 0 0 0"
size="mini"
v-btn-permission="'8258ee44344e92365e7e5bd90f3c8d21'"
@click="clearBtnClick"
class="common-button-primary">
清空
</el-button>
</el-col>
</el-row>
</el-form>
</div>
<div style="float: right;margin: 0 3% 10px 0">
<el-button type="primary" size="mini"
v-btn-permission="'a34dcbc3a44a297a6b6cc95e450b28ea'"
@click="exportExcelBtn">导出Excel</el-button>
</div>
<div class="content">
<!-- <el-divider content-position="left" class="dynamic-child-title">实施日期预警</el-divider>-->
<el-table
:data="warningTableDatas"
style="overflow-y: auto;"
height="100%"
border
:resizable="false"
:header-cell-style="{background: '#f8f8f9', color: '#515a6e'}"
v-loading="warningTableLoading"
@selection-change="selectChange"
>
<el-table-column
type="selection"
width="55"
align="center">
</el-table-column>
<el-table-column prop="standType" label="类型" width="100" align="center">
<template slot-scope="scope">
<div v-if="scope.row.sortName === 'BUSINESS_STAND'">企业标准</div>
<div v-if="scope.row.standType === 'FOREIGN'">海外标准法规</div>
<div v-if="scope.row.standType === 'INLAND'">国内标准法规</div>
<div v-if="scope.row.sortName === 'INLAND_LAWS'">国内政策</div>
<div v-if="scope.row.sortName === 'FOREIGN_LAWS'">国外政策</div>
</template>
</el-table-column>
<el-table-column prop="standCode" label="标准编号" width="200" align="center">
<template slot-scope="scope">
<a @click="handlePreview(scope.row)">{{ scope.row.standCode }}</a>
</template>
</el-table-column>
<el-table-column prop="standName" width="320" label="标准名称" align="center">
<template slot-scope="scope">
<a @click="handlePreview(scope.row)">{{ scope.row.standName }}</a>
</template>
</el-table-column>
<el-table-column prop="itemsNum" label="条款编号" width="120" align="center">
<template slot-scope="scope">
<a @click="handlePreview(scope.row)">{{ scope.row.itemsNum }}</a>
</template>
</el-table-column>
<el-table-column prop="itemsName" width="320" label="条款名称" align="center" show-overflow-tooltip>
<template slot-scope="scope">
<a @click="handlePreview(scope.row)">{{ scope.row.itemsName }}</a>
</template>
</el-table-column>
<el-table-column
prop="termsConditions"
label="条款内容"
width="400"
align="center">
<template slot-scope="scope">
<a v-if="scope.row.termsConditions === null"></a>
<a v-else @click="openDialog(scope.row.termsConditions)">{{
scope.row.termsConditions.replace(/<[^>]+>/g, '').slice(0, 20) + '...'
}}</a>
</template>
</el-table-column>
<el-table-column prop="issueTime" label="发布日期" width="120" align="center">
<template slot-scope="scope">
<span>{{ scope.row.issueTime ? scope.row.issueTime.substring(0, 10) : '' }}</span>
</template>
</el-table-column>
<el-table-column prop="ssrq" label="实施日期" width="200" align="center">
<template slot-scope="scope">
<span>{{ scope.row.ssrq }}</span>
</template>
</el-table-column>
<el-table-column prop="xcxssrq" label="新车型实施日期" width="200" align="center">
<template slot-scope="scope">
<span>{{ scope.row.xcxssrq }}</span>
</template>
</el-table-column>
<el-table-column prop="zccssrq" label="在产车实施日期" width="200" align="center">
<template slot-scope="scope">
<span>{{ scope.row.zccssrq }}</span>
</template>
</el-table-column>
<el-table-column prop="applyType" label="适用车型" width="150" align="center">
</el-table-column>
<el-table-column label="操作" width="100" align="center" v-if="isShowBtn" fixed="right">
<template slot-scope="scope">
<el-button
size="mini"
type="danger"
v-btn-permission="'30d080f4194a10a76cc4994bad0afc9e'"
@click="cancelWarning(scope.$index, scope.row)">取消预警
</el-button>
</template>
</el-table-column>
</el-table>
<pagination
style="position: static;"
:page="pageConfig.page"
:pageSize="pageConfig.pageSize"
:total="pageConfig.total"
autoSize
@pageChange="page => handlePageChange('page', page)"
@pageSizeChange="pageSize => handlePageSizeChange('pageSize', pageSize)"></pagination>
</div>
</div>
</div>
</div>
</div>
<adc-back-top scroll-bind="dynamicInformation"></adc-back-top>
<!--导出模态框区域-->
<el-dialog :visible.sync="exportModelFlag" title="导出文件" width="300px">
<el-form :inline="true" class="label-input-form search-area">
<el-form-item label="导出名称" class="search-item">
<el-input v-model="exportName" placeholder="请输入导出文件名称" :maxlength="30" clearable label="导出名称"/>
</el-form-item>
</el-form>
<span slot="footer" class="demo-drawer-footer">
<el-button size="mini" class="common-button-default" icon="el-icon-close" @click="cancal">取消</el-button>
<el-button type="primary" size="mini" class="common-button-primary" icon="el-icon-check"
@click="exportExcel">提交</el-button>
</span>
</el-dialog>
<el-dialog
class="textDialog"
title="条款内容"
:visible.sync="detailTextDialog"
width="50%">
<span style="line-height: normal" v-html="detailText"></span>
<div slot="footer" class="dialog-footer">
</div>
</el-dialog>
</div>
</template>
<script>
import {mapMutations} from "vuex";
import {interfaceUrl} from "@/sysConfig";
export default {
name: "standardWarning",
data() {
return {
detailTextDialog: false,
detailText: '',
selectedList: [],
exportName: '',
exportModelFlag: false,
warningTableDatas: [],
warningTableHeight: '',
applyArcticOptions: [], // 适用车型下拉框
isShowBtn: true,
activeName: "STANDARD", //tab 默认选中值
// 头部搜索框
dynamic: {
// 发布日期
startIssueTime: '',
endIssueTime: '',
// 实施日期
startSSRQ: '',
endSSRQ: '',
//新车型实施日期
startXCXSSRQ: '',
endXCXSSRQ: '',
// 在产车实施日期
startZCCSSRQ: '',
endZCCSSRQ: '',
//标准编号
standCode: "",
//标准名称
standName: "",
//发布日期
putTime: [],
//实施日期
SSRQ: [],
//新车型实施日期
XCXSSRQ: [],
//在产车实施日期
ZCCSSRQ: [],
//适用车型
applyType: "",
},
height: null,
energyKindOptions: [], //存放适用车型数据
zrgcs: [], //责任工程师
// 新车型实施日期预警
newItems: [],
//政策新车型实施日期预警
newPolicy: [],
// 新车型条款预警
newStand: [],
// 在产车实施日期预警
oldItems: [],
// 在产车条款预警
oldStand: [],
//政策在产车实施日期预警
oldPolicy: [],
tableHeight: 0,
pageConfig: {
page: 1,
pageSize: 10,
total: 0,
},
warningTableLoading: false,
// 记录当前分页器是哪个预警信息触发
field: '',
// 发布日期当前日期之前不可选择
pickerBeginDateBefore: {
disabledDate: (time) => {
let beginDateVal = this.dynamic.endIssueTime;
if (beginDateVal) {
return time.getTime() > beginDateVal;
}
}
},
pickerBeginDateAfter: {
disabledDate: (time) => {
let beginDateVal = this.dynamic.startIssueTime;
if (beginDateVal) {
return time.getTime() < beginDateVal;
}
}
},
SSRQDateBefore: {
disabledDate: (time) => {
let beginDateVal = this.dynamic.endSSRQ;
if (beginDateVal) {
return time.getTime() > beginDateVal;
}
}
},
SSRQDateAfter: {
disabledDate: (time) => {
let beginDateVal = this.dynamic.startSSRQ;
if (beginDateVal) {
return time.getTime() < beginDateVal;
}
}
},
XCXSSRQDateBefore: {
disabledDate: (time) => {
let beginDateVal = this.dynamic.endXCXSSRQ;
if (beginDateVal) {
return time.getTime() > beginDateVal;
}
}
},
XCXSSRQDateAfter: {
disabledDate: (time) => {
let beginDateVal = this.dynamic.startXCXSSRQ;
if (beginDateVal) {
return time.getTime() < beginDateVal;
}
}
},
ZCCSSRQDateBefore: {
disabledDate: (time) => {
let beginDateVal = this.dynamic.endZCCSSRQ;
if (beginDateVal) {
return time.getTime() > beginDateVal;
}
}
},
ZCCSSRQDateAfter: {
disabledDate: (time) => {
let beginDateVal = this.dynamic.startZCCSSRQ;
if (beginDateVal) {
return time.getTime() < beginDateVal;
}
}
},
};
},
methods: {
//取消导出
cancal() {
this.exportModelFlag = false
},
//确认导出
exportExcel() {
console.log('293', this.selectedList)
const exportURL = interfaceUrl + 'sys/EarlyWarning/exportWarning?' +
'&ids=' + this.selectedList.join(',') + '&exportName=' + this.exportName
window.open(exportURL)
this.$message.success('导出信息成功')
this.exportModelFlag = false
},
exportExcelBtn() {
console.log('302', this.selectedList)
this.exportName = ''
this.exportModelFlag = true
},
selectChange(alldata) {
console.log('307', alldata)
this.selectedList = []
for (let i = 0; i < alldata.length; i++) {
this.selectedList.push(alldata[i]['id'])
}
},
// 获取标准预警数据 (type用于区别分页器切换)
getEarlyDate() {
this.warningTableLoading = true
this.$http.get('sys/EarlyWarning/getStandWarning', {
applyType: '',
...this.pageConfig
}, {
_this: this
}, res => {
const result = res.data[0]
for (const field in result) {
this[field] = result[field].records
this[field].forEach(item => {
// 适用车型转换
if (item.applyType !== null) {
let k = (item.applyType || "").split(",");
for (let i in this.energyKindOptions) {
for (let m = 0; m < k.length; m++) {
if (this.energyKindOptions[i].value === k[m]) {
k[m] = this.energyKindOptions[i].label;
}
item.applyType = k.join(",");
}
}
}
// 责任工程师转换
if (item.dutyEngineer !== null) {
let k = (item.dutyEngineer || "").split(",");
for (let i in this.zrgcs) {
for (let m = 0; m < k.length; m++) {
if (this.zrgcs[i].value === k[m]) {
k[m] = this.zrgcs[i].label;
}
item.dutyEngineer = k.join(",");
}
}
}
})
let arr = result.newItems.records
arr.forEach(item => {
// 适用车型转换
if (item.applyType !== null) {
let k = (item.applyType || "").split(",");
for (let i in this.energyKindOptions) {
for (let m = 0; m < k.length; m++) {
if (this.energyKindOptions[i].value === k[m]) {
k[m] = this.energyKindOptions[i].label;
}
item.applyType = k.join(",");
}
}
}
// 责任工程师转换
if (item.dutyEngineer !== null) {
let k = (item.dutyEngineer || "").split(",");
for (let i in this.zrgcs) {
for (let m = 0; m < k.length; m++) {
if (this.zrgcs[i].value === k[m]) {
k[m] = this.zrgcs[i].label;
}
item.dutyEngineer = k.join(",");
}
}
}
})
this.newItems = arr
//可能还需要调整一下条款或标准的顺序(zyh)
switch (field) {
case 'newItems':
this.pageConfig.count1 = result.newItems.total
break
case 'oldItems':
this.pageConfig.count2 = result.oldItems.total
break
case 'newStand':
this.pageConfig.count3 = result.newStand.total
break
case 'oldStand':
this.pageConfig.count4 = result.oldStand.total
break
}
}
this.warningTableLoading = false
}, e => {
});
},
//点击查看详情
handlePreview(item) {
let routeUrl = this.$router.resolve({
name: 'OtherStandardDetails',
params: {
id: item.standId,
pageType: item.standType + '_STAND'
}
})
window.open(routeUrl.href, '_blank')
},
//获取政策预警数据(type用于区别分页器切换)
getPolicyDate() {
this.loading[this.field] = true
this.$http.get('sys/EarlyWarning/PolicyWarning', {
applyType: '',
...this.pageConfig
}, {
_this: this
}, res => {
const policys = res.data[0]
for (const field in policys) {
this[field] = policys[field].records
switch (field) {
case 'newPolicy':
this.pageConfig.count5 = policys.newPolicy.total
break
case 'oldPolicy':
this.pageConfig.count6 = policys.oldPolicy.total
break
}
}
for (const loading in this.loading) {
this.loading[loading] = false
}
}, e => {
});
},
// 切换tab
handleClick(tab, event) {
this.getPolicyDate();
switch (tab.name) {
case "POLICY":
const computedHeight = () => {
this.tableHeight = $(".content-group").find(".table-wrap").height();
}
this.$nextTick(() => {
computedHeight()
window.addEventListener('resize', computedHeight)
this.$once('hook:beforeDestroy', () => {
window.removeEventListener('resize', computedHeight)
})
});
}
},
//查找适用车型
searchBtnClick() {
if (this.dynamic.putTime === null) {
this.dynamic.putTime = []
}
if (this.dynamic.SSRQ === null) {
this.dynamic.SSRQ = []
}
if (this.dynamic.XCXSSRQ === null) {
this.dynamic.XCXSSRQ = []
}
if (this.dynamic.ZCCSSRQ === null) {
this.dynamic.ZCCSSRQ = []
}
this.warningTableLoading = true
this.$http.get('sys/EarlyWarning/getStandWarning', {
...this.pageConfig,
//标准编号
standCode: this.dynamic.standCode,
//标准名称
standName: this.dynamic.standName,
//发布日期
startIssueTime: this.dynamic.startIssueTime ? this.$moment(this.dynamic.startIssueTime).format('YYYY-MM-DD') : '',
endIssueTime: this.dynamic.endIssueTime ? this.$moment(this.dynamic.endIssueTime).format('YYYY-MM-DD') : '',
//实施日期
startSSRQ: this.dynamic.startSSRQ ? this.$moment(this.dynamic.startSSRQ).format('YYYY-MM-DD') : '',
endSSRQ: this.dynamic.endSSRQ ? this.$moment(this.dynamic.endSSRQ).format('YYYY-MM-DD') : '',
//新车型实施日期
startXCXSSRQ: this.dynamic.startXCXSSRQ ? this.$moment(this.dynamic.startXCXSSRQ).format('YYYY-MM-DD') : '',
endXCXSSRQ: this.dynamic.endXCXSSRQ ? this.$moment(this.dynamic.endXCXSSRQ).format('YYYY-MM-DD') : '',
//在产车实施日期
startZCCSSRQ: this.dynamic.startZCCSSRQ ? this.$moment(this.dynamic.startZCCSSRQ).format('YYYY-MM-DD') : '',
endZCCSSRQ: this.dynamic.endZCCSSRQ ? this.$moment(this.dynamic.endZCCSSRQ).format('YYYY-MM-DD') : '',
//适用车型
applyType: this.dynamic.applyType
}, {
_this: this,
}, res => {
// 适用车型转换
for (let a = 0; a < res.data.records.length; a++) {
if (res.data.records[a].applyType !== null) {
let k = (res.data.records[a].applyType || "").split(",");
for (let i in this.energyKindOptions) {
for (let m = 0; m < k.length; m++) {
if (this.energyKindOptions[i].value === k[m]) {
k[m] = this.energyKindOptions[i].label;
}
res.data.records[a].applyType = k.join(",");
}
}
}
}
this.warningTableDatas = res.data.records
this.pageConfig.page = res.data.current
if ((this.warningTableDatas.length === 0 || this.warningTableDatas === []) && this.pageConfig.page !== 1) {
this.warningTableLoading = true
this.handlePageChange('page', 1)
} else {
this.warningTableLoading = false
}
this.pageConfig.pageSize = res.data.size
this.pageConfig.total = res.data.total
// this.warningTableLoading = false
}, e => {
})
},
clearBtnClick() {
this.dynamic = {
//标准编号
standCode: "",
//标准名称
standName: "",
//发布日期
putTime: [],
//实施日期
SSRQ: [],
//新车型实施日期
XCXSSRQ: [],
//在产车实施日期
ZCCSSRQ: [],
//适用车型
applyType: "",
}
this.pageConfig.page = 1
this.searchBtnClick()
},
//取消预警
cancelWarning(index, row) {
this.$confirm('确认取消预警?', '提示', {
confirmButtonText: '确定',
confirmButtonClass: 'common-button-primary',
cancelButtonText: '取消',
type: 'warning',
roundButton: false
}).then(() => {
this.$http.get('sys/EarlyWarning/ChangePermissions', {
id: row.id,
}, {}, res => {
this.pageConfig.page = 1
this.pageConfig.newPolicyPage = 1
this.pageConfig.oldPolicyPage = 1
this.searchBtnClick()
this.getEarlyDate()
}
)
}).catch(() => {
this.$message.warning('取消事件')
})
},
showStandDetails(item) {
let getStandId = item.sarId;
let getStandType = item.sortName;
// this.$http.get("lawss/sarMenu/judgeSarMenuByRole", {
// sarId: getStandId,
// sarType: getStandType,
// isExit: "1"
// }, {
// _this: this
// }, res => {
// if (res.ok) {
// let pageTpe = "";
// let id = "";
// let routename = "";
// if (getStandType === "INLAND_STAND" || getStandType === "FOREIGN_STAND") {
// if (this.$hasPermission("SSA6WR4HV8")) {
// pageTpe = getStandType;
// id = getStandId;
// routename = "OtherStandardDetails";
// } else {
// this.$message.error("无权访问");
// }
// } else if (getStandType === "INLAND_LAWS" || getStandType === "FOREIGN_LAWS") {
// if (this.$hasPermission("A2HDHMEA6W")) {
// pageTpe = getStandType;
// id = getStandId;
// routename = "OtherLawsDetails";
// } else {
// this.$message.error("无权访问");
// }
// } else if (getStandType === "BUSSIONESS_STAND") {
// if (this.$hasPermission("YJUHC32R7G")) {
// pageTpe = "BUSINESS_STAND";
// id = getStandId;
// routename = "OtherBussStandardDetails";
// } else {
// this.$message.error("无权访问");
// }
// }
// if (routename !== "") {
// let routeUrl = this.$router.resolve({
// name: routename,
// params: {
// id: id,
// pageType: pageTpe
// }
// });
// window.open(routeUrl.href, "_blank");
// }
// } else {
// this.$message.error(res.message);
// }
// }, e => {
// });
},
/**
* @description: 日期转换
* @author: chenxiaoxi
* @date: 2018/11/01 10:20:12
*/
dateFormat(date) {
let year = new Date(date).getFullYear();
let month = new Date(date).getMonth() + 1;
let day = new Date(date).getDate();
return year + "-" + (month < 10 ? "0" + month : month) + "-" + (day < 10 ? "0" + day : day);
},
getDate(date) {
return date !== undefined && date != null ? date.split(" ")[0] : "";
},
handlePageChange(field, page) {
this.pageConfig.page = page
this.searchBtnClick()
console.log('735', this.warningTableDatas)
this.activeName === 'STANDARD' ? this.getEarlyDate() : this.getPolicyDate()
this.field = field
},
//分页每页显示数改变后方法
handlePageSizeChange(field, pageSize) {
// const _pageSize = field + 'PageSize'
// this.pageConfig[_pageSize] = pageSize
this.pageConfig.pageSize = pageSize
this.searchBtnClick()
console.log('771', this.warningTableDatas)
// this.activeName === 'STANDARD' ? this.getEarlyDate() : this.getPolicyDate()
// this.field = field
},
...mapMutations(["setDetailMap"]),
openDialog(text) {
this.detailText = text
this.detailTextDialog = true
},
},
props: {
reload: {
type: Boolean
}
},
computed: {
containerStyle() {
this.$nextTick(() => {
return this.activeName === 'POLICY' ? {
height: '100%'
} : {}
})
}
},
watch: {},
mounted() {
this.warningTableLoading = true
// this.$nextTick(() => {
// this.warningTableHeight = $(window).height()*0.54
// window.onresize = () => {
// this.warningTableHeight = $(window).height()*0.54;
// };
// })
// alert(this.warningTableHeight)
// this.height = $(".content").height();
// window.onresize = () => {
// this.height = $(".content").height();
// };
//从数据库中查询下拉框数据
this.$http.get("sys/dictype/getDicTypeListCode", {}, {
_this: this
}, res => {
this.energyKindOptions = res.data.ENERGYTYPES; // 文本状态
this.applyArcticOptions = res.data.ENERGYTYPES // 适用车型
this.zrgcs = res.data.ZRGCSCLASS;
this.warningTableLoading = true
this.$http.get('sys/EarlyWarning/getStandWarning', {
applyType: '',
...this.pageConfig
}, {
_this: this
}, res => {
// 适用车型转换
for (let a = 0; a < res.data.records.length; a++) {
if (res.data.records[a].applyType !== null) {
let k = (res.data.records[a].applyType || "").split(",");
for (let i in this.energyKindOptions) {
for (let m = 0; m < k.length; m++) {
if (this.energyKindOptions[i].value === k[m]) {
k[m] = this.energyKindOptions[i].label;
}
res.data.records[a].applyType = k.join(",");
}
}
}
}
this.warningTableDatas = res.data.records
this.pageConfig.page = res.data.current
this.pageConfig.pageSize = res.data.size
this.pageConfig.total = res.data.total
this.getEarlyDate();
this.warningTableLoading = false
}, e => {
});
});
this.searchBtnClick()
}
};
</script>
<style lang="less" scoped>
@import "~@/assets/styles/style";
@import "~@/assets/styles/mixins";
#dynamicInformation {
background: #fff;
padding-top: 10px;
width: 100%;
height: 100%;
.dynamic-header {
height: 300px;
background: @homeSectionBgColor;
.dynamic-header-left {
width: 750px;
height: 100%;
border-right: 1px solid #ddd;
float: left;
background: #eee;
.wrapper {
overflow: hidden;
width: 100%;
max-width: 750px;
margin: 0 auto;
height: 100%;
background: #eee;
cursor: pointer;
border: 1px solid #eee;
border-right: none;
.swiper-pagination {
.swiper-pagination-bullet {
width: 10px;
height: 10px;
outline: none;
&:hover {
cursor: pointer;
}
&.swiper-pagination-bullet-active {
background: #fff;
}
}
}
.swiper-container {
height: 100%;
.swiper-img {
width: 100%;
height: 100%;
}
}
}
}
.dynamic-header-right {
padding: 10px;
float: left;
.flex();
justify-content: center;
align-items: center;
width: calc(~"100% - 750px");
height: 100%;
.dynamic-search {
width: 300px;
.dynamic-search-line {
width: 100%;
height: 4px;
background: @boxBgColor;
margin-bottom: 5px;
}
.dynamic-search-center {
.search-btn {
padding: 0;
width: 100%;
height: 32px;
font-size: 12px;
}
}
h5 {
font-size: 18px;
line-height: 30px;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
font-weight: 600;
}
.dynamic-label-input-form {
.el-form-item {
margin-bottom: 5px;
}
}
}
}
@media screen and (min-width: 1920px) {
.dynamic-header-left {
width: 1200px;
}
.dynamic-header-right {
width: calc(~"100% - 1200px");
}
}
}
.container {
height: calc(100% - 139px);
/deep/ .el-tabs__header {
height: 50px;
}
}
.dynamic-content {
height: 100%;
width: 100%;
position: relative;
.dynamic {
width: 100%;
height: 100%;
.dynamic-content {
h5 {
margin-left: 20px;
font-size: 18px;
line-height: 30px;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
font-weight: 600;
}
.dynamic-line {
width: 100%;
height: 4px;
background: @boxBgColor;
margin-bottom: 5px;
}
.more {
display: flex;
align-items: center;
justify-content: center;
/deep/ .el-input__inner {
width: 185px;
}
.choose-time-area {
/deep/ .el-input__inner {
width: 180px;
}
}
//cursor: pointer;
color: #12508e;
//position: absolute;
top: 0;
right: 0;
z-index: 100;
//padding: 5px 10px;
// &:hover {
// color: #fff;
// background: #12508e;
// transition: all 0.2s linear;
// }
}
.content {
padding-bottom: 10px;
height: calc(~'100% - 25%') ;
/deep/ .el-button--mini {
padding: 5px 7px;
font-size: 8px;
}
}
.dynamic-loop-container {
position: relative;
min-height: 160px;
.dynamic-loop {
cursor: pointer;
width: 100%;
padding: 5px 18px;
&:hover {
.domestic-loop-header {
color: @baseColor;
}
.loop-content-left {
text-decoration: underline;
color: @baseColor;
}
}
.domestic-loop-header {
font-size: 15px;
height: 20px;
line-height: 20px;
.flex();
align-items: center;
.domestic-title {
max-width: 80%;
.ellipsis();
}
}
.newInformation {
color: #e4393c;
}
.time {
position: absolute;
right: 0.1rem;
//top: 0;
}
.newI {
font-style: italic;
color: #e4393c;
font-weight: bold;
margin-right: 5px;
}
.domestic-loop-content {
width: 100%;
height: 20px;
line-height: 20px;
.flex();
.loop-content-left {
padding-left: 30px;
flex: 1;
overflow: hidden;
.left-content {
width: 100%;
p {
.ellipsis();
}
}
}
.loop-content-right {
width: 150px;
.flex();
justify-content: flex-end;
}
}
}
}
}
::v-deep {
.el-tabs {
height: 100%;
display: flex;
flex-direction: column;
.el-tabs__content {
flex: 1;
overflow: hidden;
.el-tab-pane {
&:last-child {
height: 100%;
.dynamic-content {
display: flex;
flex-direction: column;
.content {
flex: 1;
overflow: hidden;
display: flex;
flex-direction: column;
.content-group {
flex: 1;
overflow: hidden;
display: flex;
flex-direction: column;
.table-wrap {
flex: 1;
overflow: hidden;
}
}
}
}
}
}
}
}
}
}
.dynamic-child-title {
color: #515a6e;
margin: 24px 0;
}
}
.textDialog {
/deep/ .el-dialog__body {
height: 400px;
overflow-y: auto;
}
}
/deep/ .el-date-editor.el-input {
width: 180px;
}
}
</style>