Commit 16d572bd authored by 朱超's avatar 朱超
parents dd39eb09 1a42eac2
......@@ -108,7 +108,7 @@ function sortMethod({ order, prop }){
direction = 'DESC'
}
if(i === "name"){
sortname = "name";
sortname = "UnitName";
}else if(i === "alarmDate"){
sortname = "alarmDate";
}
......@@ -305,6 +305,7 @@ function gettransfer() {
}
http.post("/api/alarm/" + type.value, AlarmInfo).then((result) => {
console.log(result.data);
console.log(AlarmInfo);
if(result.data !== null){
tableData.value = result.data.dataInfoList;
total.value = result.data.rowCount;
......
<template>
换热站巡更
</template>
<!-- 条件筛选卡片 -->
<el-card class="card-contianer">
<div class="div-header">
<el-form-item label="设备:">
<el-cascader :options="options" v-model="PatrolInfo.Id" :props="props" collapse-tags clearable :show-all-levels="false"
placeholder="请选择" style="min-width: 210px;" />
</el-form-item>
<el-form-item label="开始时间:">
<el-config-provider :locale="zhCn">
<el-date-picker v-model="PatrolInfo.startTime" type="datetime" value-format="YYYY-MM-DD HH:mm:ss"
placeholder="选择开始时间" style="min-width: 180px;" /> <!-- 日期时间格式 2024-01-01 00:00:00-->
</el-config-provider>
</el-form-item>
<el-form-item label="结束时间:">
<el-config-provider :locale="zhCn">
<el-date-picker v-model="PatrolInfo.endTime" type="datetime" value-format="YYYY-MM-DD HH:mm:ss"
placeholder="选择结束时间" style="min-width: 180px;" />
</el-config-provider>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="getdata" style="min-width: 70px;">查询</el-button>
</el-form-item>
</div>
</el-card>
<el-card class="moduleCard" :height="tableHeight">
<el-table :data="tableData" :height="tableHeight" v-loading="loading" :cell-style="setCellStyle" id="out-table"
border highlight-current-row :header-cell-style="setHeaderCellStyle" @sort-change="sortMethod" :header-cell-class-name="handleHeadAddClass" >
<el-table-column prop="index" label="编号" :sortable="false" width="80px" fixed />
<el-table-column prop="transferName" label="换热站" :sortable="true" width="200px" fixed />
<el-table-column prop="realName" label="巡更人" :sortable="false" width="200px" fixed />
<el-table-column prop="patrolTime" label="巡更时间" :sortable="true" width="200px" fixed />
</el-table>
</el-card>
<el-footer style="height: 8px;">
<el-config-provider :locale="zhCn">
<el-pagination v-model:current-page="currentPage" v-model:page-size="pageSize"
:page-sizes="[30, 40, 50, 100, 200, 300]" :small="true" :disabled="disabled" :background="background"
layout="total, sizes, prev, pager, next, jumper" :total="total" @size-change="getdata" @current-change="getdata"
class="pagination" />
</el-config-provider>
</el-footer>
</template>
<script lang="ts" setup>
import { ref, reactive, onMounted, onUnmounted } from 'vue';
import http from '../../api/http';
import zhCn from 'element-plus/dist/locale/zh-cn.mjs'
import store from "../../store/index";
import { getFileName } from '../../utils/utils';
//分页设置
const currentPage = ref(1)
var pageSize = ref(30)
const disabled = ref(false)
const background = ref(false)
const total = ref()
const options = reactive([]);
const exporter = ref("TransExport")
const tableData = ref([]);
const tableHeight = ref(500);
const enterpriseId = ref();
const loading = ref(true);
const sortField = reactive({});
const type = ref('GetTransAlarmData');
getEnterprise();
function getEnterprise(){
var result = store.getters.getEnterprise();
if (result) {
enterpriseId.value = result[0].enterpriseId;
}
}
const props = { multiple: true, emitPath: false }
function setContentHeight() {
tableHeight.value = window.innerHeight - 232;
}
//获取排序的方法
function sortMethod({ order, prop }){
// 触发的排序和缓存的排序相同时,取消该字段的排序
if (!order || sortField[prop] === order) {
sortField[prop] = null
} else {
sortField[prop] = order
}
// console.log(sortField)
let sortname = "";
let sortnames = "";
let direction = '';
for (const i in sortField) {
if (sortField[i] == 'ascending') {
direction = 'ASC'
} else if (sortField[i] == 'descending') {
direction = 'DESC'
}
if(i === "transferName"){
sortname = "UnitName";
}else if(i === "patrolTime"){
sortname = "PatrolTime";
}
// console.log(sortname)
if(sortnames===""){
sortnames = sortnames + sortname + " " + direction;
}else{
sortnames = sortnames + "," + sortname + " " + direction;
}
PatrolInfo.sort = sortnames;
}
getdata() //调用后端查询接口
}
function handleHeadAddClass({ column }) {
if (sortField[column.property]) {
column.order = sortField[column.property]
}
}
var date = new Date();
var year = date.getFullYear();
var day = 0;
var dateArr = [
date.getMonth() + 1, //月份从0~11,所以加一
date.getDate(),
date.getHours(),
date.getMinutes(),
date.getSeconds(),
];
for (var i = 0; i < dateArr.length; i++) {
if (dateArr[i] >= 1 && dateArr[i] <= 9) {
dateArr[i] = "0" + dateArr[i];
}
}
day = dateArr[1] - 1;
if (day >= 1 && day <= 9) {
day = "0" + day;
}
var startTime = sessionStorage.getItem("DeviceQueryStart");
console.log(!!startTime);
if(!!startTime){
startTime = year + "-" + dateArr[0] + '-' + day + " " + dateArr[2] + ":" + dateArr[3] + ":" + dateArr[4];
sessionStorage.setItem("DeviceQueryStart", startTime);
}
var endTime = sessionStorage.getItem("DeviceQueryEnd");
if(!!endTime){
endTime = year + "-" + dateArr[0] + "-" + dateArr[1] + " " + dateArr[2] + ":" + dateArr[3] + ":" + dateArr[4];
sessionStorage.setItem("DeviceQueryEnd", endTime);
}
const PatrolInfo = reactive({
"Id": [],
"startTime": startTime,
"endTime": endTime,
"start": 0,
"count": 30,
"sort": ""
})
getSupplys();
getdata();
function getdata() {
sessionStorage.setItem("DeviceQueryStart", PatrolInfo.startTime);
sessionStorage.setItem("DeviceQueryEnd", PatrolInfo.endTime);
gettransfer();
}
//获取换热机组列表
function getSupplys(){
loading.value = true;
tableData.value.length = 0;
options.length = 0;
PatrolInfo.Id.length = 0;
var result = store.getters.getEnterprise();
if (result) {
result.forEach(element=>{
if(element.enterpriseId=== enterpriseId.value){
if(element.enterpriseId === "9BCA54BC-8F27-4849-8D7D-50C5099E1949".toLowerCase()){
element.serviceCenterList.forEach(center=>{
let c = [];
center.supplyList.forEach(supply => {
let chi = [];
supply.transferList.forEach(unit => {
chi.push({ value: unit.unitId, label: unit.unitName });
});
c.push({ children: chi, label: supply.supplyName});
});
options.push({children: c, label: center.serviceCenterName});
})
}else{
element.supplyList.forEach(element => {
let chi = [];
element.transferList.forEach(unit => {
chi.push({ value: unit.unitId, label: unit.unitName });
})
options.push({ children: chi, label: element.supplyName});
})
}
}
});
}
PatrolInfo.Id.push(options[0].children[0].children[0].value);
}
//获取数据列表
function gettransfer() {
loading.value = true;
if (currentPage.value == 1) {
PatrolInfo.start = 0;
PatrolInfo.count = pageSize.value;
} else {
PatrolInfo.start = ((currentPage.value - 1) * pageSize.value) + 1;
PatrolInfo.count = pageSize.value - 1;
}
http.post("/api/patrol/GetPatrolHisData", PatrolInfo).then((result) => {
console.log(result.data);
console.log(PatrolInfo);
if(result.data !== null){
tableData.value = result.data.dataInfoList;
total.value = result.data.rowCount;
}
if(result.data === null || PatrolInfo.Id.length < 1){
tableData.value = null;
total.value = 0;
}
loading.value = false;
});
}
function setCellStyle({ row, column, rowIndex, columnIndex }) {
let css_color = {};
css_color['padding-left'] = '0px';
css_color['padding-right'] = '0px';
css_color['borderColor'] = '#97d5fd';
css_color['padding'] = '0px';
return css_color;
}
function setHeaderCellStyle({ row, column, rowIndex, columnIndex }) {
let css_color;
var backcolor = 'd9f1ff';
css_color = { 'background-color': '#' + backcolor, 'padding-left': '0px', 'padding-right': '0px', 'borderColor': '#97d5fd', 'color': '#000', 'text-align': 'center', 'vertical-align': 'top' };
var backcolor = 'd9f1ff';
css_color = { 'background-color': '#' + backcolor, 'padding-left': '0px', 'padding-right': '0px', 'borderColor': '#97d5fd', 'color': '#000', 'text-align': 'center', 'vertical-align': 'top' };
return css_color;
}
onMounted(() => {
setContentHeight();
window.addEventListener('resize', setContentHeight);
})
onUnmounted(() => {
window.removeEventListener('resize', setContentHeight);
})
</script>
<style lang="less" scoped>
.moduleCard {
width: auto;
overflow: auto;
//max-height: 540px;
padding: 0px;
::v-deep .el-card__body {
padding: 0px;
}
}
.pagination {
padding: 4px;
margin-left: 20px;
height: 30px;
//background-color: #8939cf;
vertical-align: middle;
}
//鼠标所在行的颜色
::v-deep .el-table__body tr:hover>td {
background: linear-gradient(to top, rgb(0, 198, 255), rgb(255, 255, 255)) !important;
}
::v-deep .el-table__body tr.current-row>td {
background-color: #92cbf1 !important;
}
.card-contianer {
width: auto;
height: 70px;
.div-header {
width: 100%;
display: flex;
margin: 20px;
}
}
.el-form-item {
margin-top: -20px;
margin-right: 30px;
}
.el-tag--mini {
height: 21px !important
}
.el-cascader .el-input .el-input__inner:focus, .el-cascader .el-input.is-focus .el-input__inner{
height: 33px; //这里高度根据需求自己设定
}
.el-cascader__tags {
display: inline-flex;
margin-right: 10px;
flex-wrap: nowrap;
}
</style>
\ No newline at end of file
<template>
换热站巡更
</template>
\ No newline at end of file
<!-- 条件筛选卡片 -->
<el-card class="card-contianer">
<div class="div-header">
<el-form-item label="设备:">
<el-cascader :options="options" v-model="AlarmInfo" :props="props" collapse-tags clearable :show-all-levels="false"
placeholder="请选择" style="min-width: 210px;" />
</el-form-item>
<el-form-item>
<el-button type="primary" @click="getdata" style="min-width: 70px;">查询</el-button>
</el-form-item>
</div>
</el-card>
<el-card class="moduleCard" :height="tableHeight">
<el-table :data="tableData" :row-class-name="rowClassName" :height="tableHeight" v-loading="loading" :cell-style="setCellStyle" id="out-table"
border highlight-current-row :header-cell-style="setHeaderCellStyle" :header-cell-class-name="handleHeadAddClass" >
<el-table-column prop="index" label="编号" :sortable="false" width="70px" fixed />
<el-table-column prop="transferName" label="换热站" :sortable="false" width="170px" fixed />
<el-table-column prop="realName" label="巡更人" :sortable="false" width="150px" fixed />
<el-table-column prop="times" label="日巡次数" :sortable="false" width="120px" fixed />
<el-table-column prop="patrolStatus" label="巡更记录" :sortable="false" width="400px" fixed >
<template #default="scope">
<p v-html="getImgUrl(scope.row.patrolStatus)"></p>
<!-- <span>{{ getImgUrl(scope.row.patrolStatus) }}</span> -->
<!-- <div class="div-form-img">
<el-image class="img-center" v-if="getImgUrl(scope,scope.column.property)" style="width: 20px; height: 20px"
:src="getImgUrl(scope,scope.column.property)" :fit="'cover'" />
</div> -->
</template>
</el-table-column>
</el-table>
</el-card>
</template>
<script lang="ts" setup>
import { ref, reactive, onMounted, onUnmounted } from 'vue';
import http from '../../api/http';
import store from "../../store/index";
const options = reactive([]);
const tableData = ref([]);
const tableHeight = ref(500);
const enterpriseId = ref();
const loading = ref(true);
const sortField = reactive({});
getEnterprise();
function getEnterprise(){
var result = store.getters.getEnterprise();
if (result) {
enterpriseId.value = result[0].enterpriseId;
}
}
const props = { multiple: true, emitPath: false }
function setContentHeight() {
tableHeight.value = window.innerHeight - 195;
}
function handleHeadAddClass({ column }) {
if (sortField[column.property]) {
column.order = sortField[column.property]
}
}
const AlarmInfo = ref([])
getSupplys();
getdata();
function getdata() {
gettransfer();
}
//获取换热机组列表
function getSupplys(){
loading.value = true;
tableData.length = 0;
options.length = 0;
AlarmInfo.length = 0;
var result = store.getters.getEnterprise();
if (result) {
console.log(result)
result.forEach(element=>{
if(element.enterpriseId=== enterpriseId.value){
if(element.enterpriseId === "9BCA54BC-8F27-4849-8D7D-50C5099E1949".toLowerCase()){
element.serviceCenterList.forEach(center=>{
let c = [];
center.supplyList.forEach(supply => {
let chi = [];
supply.transferList.forEach(unit => {
chi.push({ value: unit.unitId, label: unit.unitName });
});
c.push({ children: chi, label: supply.supplyName});
});
options.push({children: c, label: center.serviceCenterName});
})
}else{
element.supplyList.forEach(element => {
let chi = [];
element.transferList.forEach(unit => {
chi.push({ value: unit.unitId, label: unit.unitName });
})
options.push({ children: chi, label: element.supplyName});
})
}
}
});
}
AlarmInfo.value.push(options[0].children[0].children[0].value);
}
//获取数据列表
function gettransfer() {
loading.value = true;
http.post("/api/patrol/GetPatrolTodeyData", AlarmInfo.value).then((result) => {
console.log(result.data);
if(result.data !== null){
tableData.value = result.data;
}
if(result.data === null){
tableData.value = null;
}
loading.value = false;
});
}
function setCellStyle({ row, column, rowIndex, columnIndex }) {
let css_color = {};
css_color['padding-left'] = 'px';
css_color['padding-right'] = '0px';
css_color['borderColor'] = '#97d5fd';
css_color['padding'] = '5px';
return css_color;
}
function setHeaderCellStyle({ row, column, rowIndex, columnIndex }) {
let css_color;
var backcolor = 'd9f1ff';
css_color = { 'background-color': '#' + backcolor, 'padding-left': '0px', 'padding-right': '0px', 'borderColor': '#97d5fd', 'color': '#000', 'text-align': 'center', 'vertical-align': 'top' };
var backcolor = 'd9f1ff';
css_color = { 'background-color': '#' + backcolor, 'padding-left': '0px', 'padding-right': '0px', 'borderColor': '#97d5fd', 'color': '#000', 'text-align': 'center', 'vertical-align': 'top' };
return css_color;
}
function getImgUrl(item) {
item = item.replaceAll("N",'<img style="width: 20px; height: 20px" src="/imgs/status/status_off.png" />')
item = item.replaceAll("N",'<img style="width: 20px; height: 20px" src="/imgs/status/status_run.png" />')
console.log(item)
return item;
}
onMounted(() => {
setContentHeight();
window.addEventListener('resize', setContentHeight);
})
onUnmounted(() => {
window.removeEventListener('resize', setContentHeight);
})
</script>
<style lang="less" scoped>
.moduleCard {
width: auto;
overflow: auto;
padding: 0px;
::v-deep .el-card__body {
padding: 0px;
}
}
.pagination {
padding: 4px;
margin-left: 20px;
height: 30px;
//background-color: #8939cf;
vertical-align: middle;
}
//鼠标所在行的颜色
::v-deep .el-table__body tr:hover>td {
background: linear-gradient(to top, rgb(0, 198, 255), rgb(255, 255, 255)) !important;
}
::v-deep .el-table__body tr.current-row>td {
background-color: #92cbf1 !important;
}
.card-contianer {
width: auto;
height: 70px;
.div-header {
width: 100%;
display: flex;
margin: 20px;
}
}
.el-form-item {
margin-top: -20px;
margin-right: 30px;
}
.el-tag--mini {
height: 21px !important
}
.el-cascader .el-input .el-input__inner:focus, .el-cascader .el-input.is-focus .el-input__inner{
height: 33px; //这里高度根据需求自己设定
}
.el-cascader__tags {
display: inline-flex;
margin-right: 10px;
flex-wrap: nowrap;
}
:deep(.div-form-img) {
display: flex;
align-items: center;
justify-content: center;
}
</style>
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment