yudao-dev/src/views/safetyEnvironmental/environmental/wasteGas/wasteGasDetectionHistory/index.vue

<template>
	<div class="app-container wasteGasHis">
		<!-- 搜索工作栏 -->
		<search-bar
			:formConfigs="formConfig"
			ref="searchBarForm"
			@headBtnClick="buttonClick" />
		<!-- 列表 -->
		<base-table
			:page="queryParams.pageNo"
			:limit="queryParams.pageSize"
			:table-props="tableProps"
			:table-data="list"
			:max-height="tableH"
			:row-class-name="tableRowClassName" />
		<pagination
			:page.sync="queryParams.pageNo"
			:limit.sync="queryParams.pageSize"
			:total="total"
			@pagination="getList" />
	</div>
</template>
<script>
import { publicFormatter } from '@/utils/dict';
import { parseTime } from '@/utils/ruoyi';
import {
	environmentalCheckRecordPage,
	environmentalCheckRecordExport,
	environmentalCheckPage,
} from '@/api/safetyEnvironmental/environmental';
import moment from 'moment';
import tableHeightMixin from '@/mixins/lb/tableHeightMixin';
const tableProps = [
	{
		prop: 'checkName',
		label: '指标名称',
	},
	{
		prop: 'checkValue',
		label: '检测数值',
	},
	{
		prop: 'unit',
		label: '单位',
		filter: publicFormatter('environment_check_unit'),
	},
	{
		prop: 'checkTime',
		label: '检测时间',
		filter: parseTime,
		minWidth: 160,
	},
	{
		prop: 'origin',
		label: '来源',
		filter: (val) => ['手动', '自动'][val],
	},
	{
		prop: 'recordPerson',
		label: '录入人',
	},
	{
		prop: 'recordTime',
		label: '录入时间',
		filter: parseTime,
		minWidth: 160,
	},
];
export default {
	name: 'WasteGasDetectionHistory',
	mixins: [tableHeightMixin],
	data() {
		return {
			formConfig: [
				{
					type: 'select',
					label: '指标名称',
					selectOptions: [],
					param: 'checkId',
					filterable: true,
				},
				{
					type: 'datePicker',
					label: '时间',
					dateType: 'datetimerange',
					format: 'yyyy-MM-dd HH:mm:ss',
					valueFormat: 'timestamp',
					rangeSeparator: '-',
					startPlaceholder: '开始时间',
					endPlaceholder: '结束时间',
					param: 'timeVal',
					defaultSelect: [],
					width: 350,
				},
				{
					type: 'button',
					btnName: '查询',
					name: 'search',
					color: 'primary',
				},
				{
					type: this.$auth.hasPermi('base:waste-gas:export') ? 'separate' : '',
				},
				{
					type: this.$auth.hasPermi('base:waste-gas:export') ? 'button' : '',
					btnName: '导出',
					name: 'export',
					color: 'primary',
					plain: true,
				},
			],
			// 查询参数
			queryParams: {
				pageNo: 1,
				pageSize: 20,
				checkId: null,
				checkType: 2,
				startTime: null,
				endTime: null,
			},
			tableProps,
			list: [],
			total: 0,
		};
	},
	created() {
		let end = moment(moment().format('YYYY-MM-DD 23:59:59')).valueOf();
		let start = moment(moment().format('YYYY-MM-DD 00:00:00')).valueOf();
		this.formConfig[1].defaultSelect = [start, end];
		this.queryParams.startTime = start;
		this.queryParams.endTime = end;
		this.getSelectList();
		this.getList();
	},
	methods: {
		buttonClick(val) {
			this.queryParams.pageNo = 1;
			this.queryParams.checkId = val.checkId;
			this.queryParams.startTime = val.timeVal ? val.timeVal[0] : null;
			this.queryParams.endTime = val.timeVal ? val.timeVal[1] : null;
			if (val.btnName === 'search') {
				this.getList();
			} else {
				this.$modal
					.confirm('是否确认导出')
					.then(() => {
						return environmentalCheckRecordExport({ ...this.queryParams });
					})
					.then((response) => {
						this.$download.excel(response, '废气检测历史记录.xls');
					})
					.catch(() => {});
			}
		},
		getList() {
			environmentalCheckRecordPage({ ...this.queryParams }).then((res) => {
				this.list = res.data.list || [];
				this.total = res.data.total || 0;
			});
		},
		getSelectList() {
			environmentalCheckPage({
				pageNo: 1,
				pageSize: 100,
				checkType: 2,
			}).then((res) => {
				console.log(res);
				this.formConfig[0].selectOptions = res.data.list || [];
			});
		},
		tableRowClassName({ row, rowIndex }) {
			console.log(row);
			if (row.markRed) {
				return 'warning-row';
			} else {
				return '';
			}
		},
	},
};
</script>
<style lang='scss'>
.wasteGasHis {
	.el-table .warning-row {
		background: #fee1e1;
	}
}
</style>