You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
xy-frontend/src/views/photographicDevice/components/baseInfor.vue

291 lines
8.3 KiB
Vue

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<template>
<el-dialog
class="baseInforDialog"
title="基本信息报"
:visible.sync="isShow"
:close-on-click-modal="false"
width="1360px"
>
<div class="zzinfo">
<span v-if="rowInfo.protocol == '65280'"> 国网I1 </span>
<span v-if="rowInfo.protocol == '65296'"> 陕西 </span>
<span v-if="rowInfo.protocol == '65281'"> 安徽 </span>
<span v-if="rowInfo.protocol == '65282'"> 江苏 </span>
<span v-if="rowInfo.protocol == '65283'"> 湖南 </span>
<span v-if="rowInfo.protocol == '65284'"> 浙江 </span>
<span v-if="rowInfo.protocol == '65285'"> 河南 </span>
<span v-if="rowInfo.protocol == '65286'"> 河南郑州 </span>
<span v-if="rowInfo.protocol == '65290'"> 河南统一视频v2020 </span>
</div>
<el-form :inline="true" :model="formdata" class="demo-form-inline">
<el-form-item label="开始日期">
<el-date-picker
@change="changestartdate"
v-model="formdata.starttime"
type="datetime"
:picker-options="pickerOptions"
placeholder="开始日期"
value-format="timestamp"
>
</el-date-picker>
</el-form-item>
<el-form-item label="结束日期">
<el-date-picker
@change="changeenddate"
v-model="formdata.endtime"
type="datetime"
:picker-options="pickerOptions"
placeholder="结束日期"
value-format="timestamp"
class="ml10"
>
</el-date-picker>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="onSubmit">查询</el-button>
<el-button type="primary" @click="exportFault">导出</el-button>
</el-form-item>
</el-form>
<el-table
ref="multipleTable"
:data="listData"
stripe
tooltip-effect="dark"
style="width: 100%"
height="442px"
v-loading="loading"
>
<template slot="empty">
<el-empty :image-size="160" description="暂无数据"></el-empty>
</template>
<el-table-column min-width="45" label="序号">
<template slot-scope="scope">
<span>{{ (page - 1) * pageSize + scope.$index + 1 }}</span>
</template>
</el-table-column>
<el-table-column
prop="cmdid"
label="装置编号"
min-width="160"
show-overflow-tooltip
></el-table-column>
<el-table-column prop="updateTimeStr" label="采集时间" min-width="140">
</el-table-column>
<el-table-column prop="equip_name" label="装置名称" min-width="140">
</el-table-column>
<el-table-column prop="model" label="装置型号" show-overflow-tooltip>
</el-table-column>
<el-table-column
prop="bsId"
label="出厂编号"
show-overflow-tooltip
></el-table-column>
<el-table-column
prop="version"
label="基本信息版本号"
show-overflow-tooltip
></el-table-column>
<el-table-column
prop="protocolVersion"
label="通信协议版本号"
show-overflow-tooltip
></el-table-column>
<!-- <el-table-column
prop="protocolVersion"
label="规约版本号V1.3"
show-overflow-tooltip
></el-table-column> -->
<el-table-column prop="bsManu" label="生产厂家"> </el-table-column>
<el-table-column
prop="productionDate"
label="生产日期"
show-overflow-tooltip
>
<template slot-scope="scope">
{{ $moment(scope.row.productionDate).format("YYYY-MM-DD") }}
</template>
</el-table-column>
</el-table>
<div class="pageNation">
<el-pagination
@current-change="handleCurrentChange"
@size-change="handleSizeChange"
:current-page="page"
:page-size="pageSize"
layout="sizes, prev, pager, next, jumper,total"
:total="total"
background
>
</el-pagination>
</div>
<div slot="footer" class="dialog-footer">
<el-button @click="hide">取 消</el-button>
</div>
</el-dialog>
</template>
<script>
import {
getTermBasicInfoHistoryApi,
getTermBasicInfoHistoryApiExcel,
} from "@/utils/api/index";
export default {
data() {
return {
isShow: false,
formdata: {},
rowInfo: "",
listData: [],
loading: false,
page: 1, // 当前页数
pageSize: 10, // 每页数量
total: 0, //总条数
pickerOptions: {
disabledDate(date) {
return date.getTime() > Date.now(); // 禁用大于今天的日期
},
},
};
},
watch: {
endtime(newVal) {
if (newVal) {
const date = new Date(newVal);
date.setHours(23);
date.setMinutes(59);
date.setSeconds(59);
this.formdata.endtime = date;
}
},
},
created() {},
mounted() {},
methods: {
getTime() {
const thirtyDaysAgo = new Date();
thirtyDaysAgo.setHours(0); // 设置小时为23
thirtyDaysAgo.setMinutes(0); // 设置分钟为59
thirtyDaysAgo.setSeconds(0); // 设置秒数为59
console.log(
new Date(thirtyDaysAgo.setDate(thirtyDaysAgo.getDate() - 30))
);
const startTimeNew = new Date(
thirtyDaysAgo.setDate(thirtyDaysAgo.getDate())
).getTime();
this.$set(this.formdata, "starttime", startTimeNew);
console.log("开始时间", this.formdata.starttime);
const currentDate = new Date(); // 获取当前时间
currentDate.setHours(23); // 设置小时为23
currentDate.setMinutes(59); // 设置分钟为59
currentDate.setSeconds(59); // 设置秒数为59
this.$set(this.formdata, "endtime", currentDate.getTime());
console.log("结束时间", this.formdata.endtime);
this.getfaultinfo();
},
changestartdate(val) {
console.log(val);
if (val == null) {
console.log(new Date());
const startDate = new Date();
startDate.setHours(0); // 设置小时为23
startDate.setMinutes(0); // 设置分钟为59
startDate.setSeconds(0); // 设置秒数为59
this.formdata.starttime = startDate;
console.log(this.formdata.starttime);
} else {
this.formdata.starttime = val;
}
},
//结束日期
changeenddate(val) {
if (val == null) {
console.log(new Date());
const endDate = new Date();
endDate.setHours(23); // 设置小时为23
endDate.setMinutes(59); // 设置分钟为59
endDate.setSeconds(59); // 设置秒数为59
this.formdata.endtime = endDate;
console.log(this.formdata.endtime);
} else {
this.formdata.endtime = val;
console.log(val);
}
},
//查询
onSubmit() {
if (this.formdata.starttime > this.formdata.endtime) {
return this.$message({
duration: 1500,
showClose: true,
message: "开始日期不能大于结束日期",
type: "warning",
});
}
this.getfaultinfo();
},
//导出
exportFault() {
window.location.href =
"/api/getTermBasicInfoHistoryApiExcel?termid=" + this.rowInfo.id;
},
//获取数据
getfaultinfo() {
this.loading = true;
getTermBasicInfoHistoryApi({
termid: this.rowInfo.id,
// starttime: this.formdata.starttime,
// endtime: this.formdata.endtime,
pageindex: this.page,
pagesize: this.pageSize,
}).then((res) => {
this.listData = res.data.list;
this.total = res.data.total;
this.$nextTick(() => {
this.loading = false;
});
});
},
//点击分页
handleCurrentChange(val) {
this.page = val;
this.getfaultinfo();
},
//每页条数
handleSizeChange(val) {
this.pageSize = val;
this.getfaultinfo();
},
display(row) {
console.log(row);
this.rowInfo = row;
this.isShow = true;
this.getTime();
},
hide() {
this.isShow = false;
this.formdata = {};
},
},
};
</script>
<style lang="less">
.baseInforDialog {
.zzinfo {
position: absolute;
top: 22px;
left: 126px;
}
.pageNation {
justify-content: flex-start;
margin-top: 16px;
.el-pagination {
padding: 0px;
.el-select .el-input {
margin-left: 0px;
}
}
}
}
</style>