yudao-dev/src/views/specialEquipment/check/Record.vue
2024-03-27 16:46:06 +08:00

267 lines
6.1 KiB
Vue

<!--
filename: Record.vue
author: liubin
date: 2023-12-12 13:53:22
description:
-->
<template>
<div class="app-container SpecialEquipmentCheckRecord">
<!-- 搜索工作栏 -->
<SearchBar
:formConfigs="searchBarFormConfig"
ref="search-bar"
@headBtnClick="handleSearchBarBtnClick" />
<!-- 列表 -->
<base-table
:table-props="tableProps"
:page="queryParams.pageNo"
:limit="queryParams.pageSize"
:max-height="tableH"
:table-data="list"
@emitFun="handleEmitFun">
<method-btn
v-if="tableBtn.length"
slot="handleBtn"
label="操作"
:width="70"
:method-list="tableBtn"
@clickBtn="handleTableBtnClick" />
</base-table>
<!-- 分页组件 -->
<pagination
v-show="total > 0"
:total="total"
:page.sync="queryParams.pageNo"
:limit.sync="queryParams.pageSize"
@pagination="getList" />
<RecordDetail
ref="record-detail"
v-if="detailOpen"
@refreshDataList="getList"
@destroy="detailOpen = false" />
</div>
</template>
<script>
import basicPageMixin from '@/mixins/lb/basicPageMixin';
import { parseTime } from '../../core/mixins/code-filter';
import RecordDetail from './Record-detail.vue';
import moment from 'moment';
import tableHeightMixin from '@/mixins/lb/tableHeightMixin';
export default {
name: 'SpecialEquipmentCheckRecord',
components: { RecordDetail },
mixins: [basicPageMixin, tableHeightMixin],
data() {
const today = new Date();
const twoDaysAgo = new Date(today.getTime() - 2 * 24 * 60 * 60 * 1000);
twoDaysAgo.setHours(0, 0, 0, 0);
const t = [
moment(twoDaysAgo).format('yyyy-MM-DD HH:mm:ss'),
moment(today).format('yyyy-MM-DD HH:mm:ss'),
];
return {
detailOpen: false,
addOrUpdateVisible: false,
searchBarKeys: ['name', 'actualCheckTime'],
tableBtn: [
this.$auth.hasPermi('equipment:check-record:detail')
? {
type: 'detail',
btnName: '详情',
}
: undefined,
// this.$auth.hasPermi('equipment:check-record:update')
// ? {
// type: 'edit',
// btnName: '修改',
// }
// : undefined,
// this.$auth.hasPermi('equipment:check-record:delete')
// ? {
// type: 'delete',
// btnName: '删除',
// }
// : undefined,
].filter((v) => v),
tableProps: [
{ prop: 'name', label: '巡检单名称', showOverflowtooltip: true },
{ prop: 'department', label: '部门', showOverflowtooltip: true },
{
prop: 'actualCheckTime',
label: '巡检时间',
width: 160,
filter: parseTime,
showOverflowtooltip: true,
},
{ prop: 'groupClass', label: '班次', showOverflowtooltip: true },
// {
// prop: '_detail',
// label: '巡检内容',
// subcomponent: {
// name: 'ViewDetail',
// props: ['injectData'],
// data() {
// return {};
// },
// methods: {
// handleClick() {
// this.$emit('emitData', {
// action: this.injectData.label,
// value: this.injectData,
// });
// },
// },
// render: function (h) {
// return (
// <el-button type="text" onClick={this.handleClick}>
// 详情
// </el-button>
// );
// },
// },
// },
{ prop: 'remark', label: '备注' },
],
searchBarFormConfig: [
{
type: 'input',
label: '巡检单名称',
placeholder: '请输入巡检单名称',
param: 'name',
},
// 开始结束时间
{
type: 'datePicker',
label: '巡检时间',
dateType: 'daterange', // datetimerange
format: 'yyyy-MM-dd',
valueFormat: 'yyyy-MM-dd HH:mm:ss',
rangeSeparator: '-',
startPlaceholder: '开始日期',
endPlaceholder: '结束日期',
defaultTime: ['00:00:00', '23:59:59'],
param: 'actualCheckTime',
defaultSelect: t,
// width: 350,
},
{
type: 'button',
btnName: '查询',
name: 'search',
color: 'primary',
},
{
type: 'separate',
},
{
type: this.$auth.hasPermi('equipment:check-record:export')
? 'button'
: '',
btnName: '导出',
name: 'export',
plain: true,
color: 'primary',
},
// {
// type: this.$auth.hasPermi('equipment:check-record:create')
// ? 'button'
// : '',
// btnName: '新增',
// name: 'add',
// plain: true,
// },
],
// 是否显示弹出层
open: false,
// 查询参数
queryParams: {
pageNo: 1,
pageSize: 20,
special: true,
status: 2,
actualCheckTime: t,
},
// 表单参数
form: {},
basePath: '/base/equipment-check-order',
mode: null,
};
},
created() {
this.getList();
},
methods: {
/** 查询列表 */
getList() {
this.loading = true;
// 执行查询
this.recv({ ...this.queryParams }).then((response) => {
this.list = response.data.list;
this.total = response.data.total;
this.loading = false;
});
},
/** 取消按钮 */
cancel() {
this.open = false;
this.mode = null;
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNo = 1;
this.getList();
},
handleDetail(row) {
this.detailOpen = true;
this.$nextTick(() => {
this.$refs['record-detail'].init(row, true);
});
},
/** 导出按钮操作 */
handleExport() {
this.$modal
.confirm('是否确认导出所有设备巡检记录?')
.then(() => {
this.exportLoading = true;
return this.$axios({
url: '/base/equipment-check-order/export-excel',
params: {
name: this.queryParams.name,
status: 2,
special: true,
},
responseType: 'blob',
});
})
.then((response) => {
// const link = document.createElement('a');
// link.href = window.URL.createObjectURL(new Blob([response]));
// link.download = '设备巡检记录.xls';
// document.body.appendChild(link);
// link.click();
// document.body.removeChild(link);
// window.URL.revokeObjectURL(link.href);
this.$download.excel(response, '设备巡检记录.xls');
this.exportLoading = false;
})
.catch(() => {});
},
},
};
</script>
<style scoped lang="scss">
.SpecialEquipmentCheckRecord {
}
</style>