Compare commits

..

29 Commits

Author SHA1 Message Date
59d2a09644 pcs顶部方块样式调整 2025-07-04 15:12:25 +08:00
21a8871e3c bms总览接口参数更新 2025-07-03 21:59:40 +08:00
bf92b8010b Merge branch 'develop' of http://101.43.41.9:13000/xzzn/emsfront into develop 2025-07-03 21:37:04 +08:00
d06feb2078 站点管理菜单调整,新增设备列表页面 2025-07-03 21:34:46 +08:00
4d58c9883c 修改站点首页 2025-07-03 16:57:23 +08:00
ec35538afd 新增站点管理页面 2025-07-02 19:51:39 +08:00
328f893da9 有分页的表格,搜索或重置的时候pageNum切换到第一页 2025-07-02 17:44:14 +08:00
c53bc4dc45 bcm总览接口参数更新,电量指标没有返回数据时图表显示问题 2025-07-02 16:57:34 +08:00
cacd939dd6 概率统计-电量指标接口联调,站点信息6个方块样式调整 2025-07-01 22:41:45 +08:00
b59b564544 取消单体电池搜索栏的清空按钮 2025-07-01 15:20:51 +08:00
0861c3e15f 搜索栏清空按钮 2025-07-01 15:14:07 +08:00
edab894447 Merge branch 'develop' into baicai 2025-07-01 14:43:33 +08:00
99b019ebc9 故障告警接口联调 2025-07-01 14:42:53 +08:00
9b78635fd8 故障告警 2025-07-01 14:11:41 +08:00
ab9a13264c 单体电池表格新增簇号字段 2025-07-01 12:56:00 +08:00
46490aebee 故障告警接口联调 2025-07-01 10:45:13 +08:00
b8779bee61 Merge branch 'develop' into baicai 2025-07-01 09:35:40 +08:00
c296e63df4 单体电池表格温度取值错误解决 2025-07-01 09:35:09 +08:00
3fa574d18b 单体电池接口参数更新 2025-06-30 22:47:17 +08:00
ca7e9a60b2 故障告警部分功能 2025-06-30 22:44:18 +08:00
d763eb2cd8 单体电池接口参数更新 2025-06-30 22:10:23 +08:00
7aafcf2113 接口联调 2025-06-30 19:06:56 +08:00
62fff8c9f4 接口联调 2025-06-30 18:56:33 +08:00
3a6c668476 工单管理 2025-06-30 18:39:41 +08:00
71cd3cd76c 电表、单体电池接口联调 2025-06-30 18:37:37 +08:00
86cbf64a9d pcs头部数据处理 2025-06-30 17:57:09 +08:00
f64b5d30cb 合并最新代码 解决冲突 2025-06-30 17:38:22 +08:00
e42f1204ee 接口联调 2025-06-30 17:32:04 +08:00
37d2d9bde5 单体电池切换站点时清空搜索项 2025-06-28 15:22:08 +08:00
24 changed files with 1074 additions and 550 deletions

View File

@ -53,4 +53,42 @@ export function getClusterNameList(stackDeviceId) {
method: 'get' method: 'get'
}) })
} }
//单体电池表格数据
export function getClusterDataInfoList({siteId, stackDeviceId, clusterDeviceId, pageSize, pageNum}) {
return request({
url: `/ems/siteMonitor/getClusterDataInfoList?clusterDeviceId=${clusterDeviceId}&siteId=${siteId}&stackDeviceId=${stackDeviceId}&pageSize=${pageSize}&pageNum=${pageNum}`,
method: 'get'
})
}
//获取液冷列表数据
export function getCoolingDataList(siteId) {
return request({
url: `/ems/siteMonitor/getCoolingDataList?siteId=${siteId}`,
method: 'get'
})
}
//获取电表数据
export function getAmmeterDataList(siteId) {
return request({
url: `/ems/siteMonitor/getAmmeterDataList?siteId=${siteId}`,
method: 'get'
})
}
// 故障告警
export function getAlarmDetailList({siteId, deviceType, alarmLevel, alarmStartTime, alarmEndTime,pageSize,pageNum}) {
return request({
url: `/ems/siteAlarm/getAlarmDetailList?siteId=${siteId}&deviceType=${deviceType}&alarmLevel=${alarmLevel}&alarmStartTime=${alarmStartTime}&alarmEndTime=${alarmEndTime}&pageSize=${pageSize}&pageNum=${pageNum}`,
method: 'get'
})
}
// 概率统计
//获取概率统计 电量指标接口
export function getElectricData({siteId,startDate,endDate}) {
return request({
url: `/ems/statsReport/getElectricData?siteId=${siteId}&startDate=${startDate}&endDate=${endDate}`,
method: 'get'
})
}

24
src/api/ems/site.js Normal file
View File

@ -0,0 +1,24 @@
import request from '@/utils/request'
// 站点列表
export function getSiteInfoList({siteName,startTime, endTime,pageSize,pageNum}) {
return request({
url: `/ems/siteConfig/getSiteInfoList?siteName=${siteName}&startTime=${startTime}&endTime=${endTime}&pageSize=${pageSize}&pageNum=${pageNum}`,
method: 'get'
})
}
// 设备列表
export function getDeviceInfoList({siteId,pageSize,pageNum}) {
return request({
url: `/ems/siteConfig/getDeviceInfoList?siteId=${siteId}&pageSize=${pageSize}&pageNum=${pageNum}`,
method: 'get'
})
}
// 设备详情
export function getDeviceDetailInfo(deviceId) {
return request({
url: `/ems/siteConfig/getDeviceDetailInfo?deviceId=${deviceId}`,
method: 'get'
})
}

View File

@ -24,7 +24,7 @@
font-weight: 500; font-weight: 500;
} }
::v-deep .el-card__body{ ::v-deep .el-card__body{
padding: 12px 16px; padding: 12px 10px;
} }
} }
</style> </style>

View File

@ -4,7 +4,7 @@
<el-row type="flex" > <el-row type="flex" >
<el-card shadow="hover" class="card common-card-container-body-no-padding" v-for="(item,index) in data" :key="index+'zdInfo'" :style="{borderBottomColor:item.color}"> <el-card shadow="hover" class="card common-card-container-body-no-padding" v-for="(item,index) in data" :key="index+'zdInfo'" :style="{borderBottomColor:item.color}">
<div class="info">{{ item.title }}</div> <div class="info">{{ item.title }}</div>
<div class="num">{{item.num}}</div> <div class="num">{{item.num | formatNumber}}</div>
</el-card> </el-card>
</el-row> </el-row>
</template> </template>
@ -23,13 +23,13 @@ export default {
title:'装机功率MW', title:'装机功率MW',
num:'', num:'',
color:'#3C81FF', color:'#3C81FF',
attr:'installedPower' attr:'installPower'
},{ },{
title:'装机容量MW', title:'装机容量MW',
num:'', num:'',
color:'#5AC7C0', color:'#5AC7C0',
attr:'installedCap' attr:'installCapacity'
},{ },{
title:'总充电量MWh', title:'总充电量MWh',
@ -49,7 +49,7 @@ export default {
methods: { methods: {
setData(res = {}){ setData(res = {}){
this.data.forEach((item)=>{ this.data.forEach((item)=>{
item.num =(res[item.attr] || res[item.attr] === 0) ? res[item.attr] : '—' item.num =res[item.attr]
}) })
} }
}, },
@ -65,11 +65,13 @@ export default {
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
.card{ .card{
width: 150px; min-width: 150px;
height: 96px; height: 96px;
margin-right: 27px; margin-right: 27px;
border-bottom: 4px solid transparent; border-bottom: 4px solid transparent;
text-align: center; text-align: center;
box-sizing: border-box;
padding:0 10px;
.info{ .info{
color: #666666; color: #666666;
line-height: 14px; line-height: 14px;

View File

@ -4,7 +4,7 @@
<el-form :inline="true"> <el-form :inline="true">
<el-form-item label="站点选择"> <el-form-item label="站点选择">
<el-select v-model="id" placeholder="请选择换电站名称" :loading="loading" loading-text="正在加载数据"> <el-select v-model="id" placeholder="请选择换电站名称" :loading="loading" loading-text="正在加载数据">
<el-option :label="item.siteName" :value="item.id" v-for="(item,index) in siteList" :key="index+'zdxeSelect'"></el-option> <el-option :label="item.siteName" :value="item.siteId" v-for="(item,index) in siteList" :key="index+'zdxeSelect'"></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
@ -28,7 +28,7 @@ import {mapGetters} from "vuex"
required:false required:false
}, },
defaultSiteId:{//默认展示的站点ID defaultSiteId:{//默认展示的站点ID
type:String|Number, type:String,
default:'', default:'',
required:false required:false
} }
@ -50,10 +50,10 @@ import {mapGetters} from "vuex"
}, },
setDefaultSite(){ setDefaultSite(){
const defaultSite = this.defaultSiteId const defaultSite = this.defaultSiteId
if(defaultSite && this.siteList.find(item=>item.id === defaultSite)){ if(defaultSite && this.siteList.find(item=>item.siteId === defaultSite)){
this.id = defaultSite this.id = defaultSite
}else if(!defaultSite && this.siteList.length>0){ }else if(!defaultSite && this.siteList.length>0){
this.id = this.siteList[0].id this.id = this.siteList[0].siteId
} }
this.$emit('submitSite',this.id) this.$emit('submitSite',this.id)
}, },

View File

@ -4,3 +4,16 @@ export const formatNumber = (val) => {
return val return val
}else {return '-'} }else {return '-'}
} }
export const formatDate = (val,toSeconds = false) => {
if(!val) return ''
const date = new Date(val)
const month = date.getMonth() + 1,day = date.getDate()
if(!toSeconds){
return `${date.getFullYear()}-${month<10?'0'+month : month}-${day<10 ? '0'+day : day}`
}else{
const hours = date.getHours(),minuets=date.getMinutes(),seconds = date.getSeconds();
return `${date.getFullYear()}-${month<10?'0'+month : month}-${day<10 ? '0'+day : day} ${hours<10 ? '0'+hours : hours}:${minuets<10 ? '0'+minuets : minuets}:${seconds<10 ? '0'+seconds : seconds}`
}
}

View File

@ -41,7 +41,7 @@ export const dzjk=[
path: '/dzjk/home', path: '/dzjk/home',
component: () => import('@/views/ems/dzjk/home/index.vue'), component: () => import('@/views/ems/dzjk/home/index.vue'),
name: 'DzjkHome', name: 'DzjkHome',
meta: { title: '首页',breadcrumb: false,activeMenu: '/dzjk',activeSecondMenuName:'DzjkHome' } meta: { title: '站点首页',breadcrumb: false,activeMenu: '/dzjk',activeSecondMenuName:'DzjkHome' }
}, },
{ {
path: '/dzjk/sbjk', path: '/dzjk/sbjk',

View File

@ -1,6 +1,16 @@
const ems = { const ems = {
state: { state: {
zdList:[] zdList:[],
workStatusOptions:{'0':'正常','1':'异常','2':'停止'},//工作状态
deviceStatusOptions:{'0':'在线','1':'离线','2':'维修中'},//设备状态
gridStatusOptions:{'0':'并网','1':'未并网'},//并网状态
controlModeOptions:{'0':'远程','1':'本地'},//控制模式
warnOptions:{0:'正常', 1:'中断', 2:'不在线',3:'异常'},//告警状态
communicationStatusOptions:{'0':'正常','1':'通讯中断','2':'异常'},//通讯状态
workModeOptions:{'0':'正常','1':'停止'},//工作模式
alarmLevelOptions:{'A':'提示','B':'一般','C':'严重','D':'紧急'},//告警等级
alarmStatusOptions:{'0':'待处理','1':'已处理','2':'处理中'},//告警状态
deviceTypeOptions:{'TCP':'TCP','RTU':'RTU'},//设备类型
}, },
mutations: { mutations: {
SET_ZD_LIST(state, list) { SET_ZD_LIST(state, list) {

View File

@ -1,16 +1,16 @@
<template> <template>
<el-card shadow="always" class="common-card-container common-card-container-no-title-bg"> <el-card v-loading="loading" gshadow="always" class="common-card-container common-card-container-no-title-bg">
<!-- 搜索栏--> <!-- 搜索栏-->
<el-form :inline="true" class="select-container"> <el-form :inline="true" class="select-container">
<el-form-item label="设备类型"> <el-form-item label="设备类型">
<el-select v-model="search.sblx" placeholder="请选择" :loading="loading" loading-text="正在加载数据"> <el-select v-model="search.deviceType" clearable placeholder="请选择" :loading="loading" loading-text="正在加载数据">
<el-option :label="item.name" :value="item.id" v-for="(item,index) in sblxOptions" :key="index+'sblxOptions'"></el-option> <el-option :label="value" :value="key" v-for="(value,key) in $store.state.ems.deviceTypeOptions" :key="key+'deviceTypeOptions'"></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="告警等级"> <el-form-item label="告警等级">
<el-select v-model="search.gjdj" placeholder="请选择" :loading="loading" loading-text="正在加载数据"> <el-select v-model="search.alarmLevel" clearable placeholder="请选择" :loading="loading" loading-text="正在加载数据">
<el-option :label="item.name" :value="item.id" v-for="(item,index) in gjdjOptions" :key="index+'gjdjOptions'"></el-option> <el-option :label="value" :value="key" v-for="(value,key) in $store.state.ems.alarmLevelOptions" :key="key+'alarmLevelOptions'"></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="时间选择"> <el-form-item label="时间选择">
@ -48,7 +48,7 @@
max-height="500" max-height="500"
style="width: 100%;margin-top:25px;"> style="width: 100%;margin-top:25px;">
<el-table-column <el-table-column
prop="name" prop="deviceName"
width="200" width="200"
label="设备名称"> label="设备名称">
</el-table-column> </el-table-column>
@ -56,43 +56,66 @@
label="告警等级" label="告警等级"
> >
<template slot-scope="scope"> <template slot-scope="scope">
<span>{{scope.row.gjdj}}</span> <span>{{$store.state.ems.alarmLevelOptions[scope.row.alarmLevel]}}</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="alarmContent"
show-overflow-tooltip
label="告警内容"> label="告警内容">
</el-table-column>
<el-table-column
prop="alarmStartTime"
label="告警发生时间">
<template slot-scope="scope"> <template slot-scope="scope">
<span>{{scope.row.gjnr}}</span> <span>{{formatDate(scope.row.alarmStartTime,true)}}</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="startTime" prop="alarmEndTime"
label="告警发生时间">
</el-table-column>
<el-table-column
prop="finishTime"
label="告警结束时间"> label="告警结束时间">
<template slot-scope="scope">
<span>{{formatDate(scope.row.alarmEndTime,true)}}</span>
</template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column
label="状态"> label="状态">
<template slot-scope="scope"> <template slot-scope="scope">
<span :class="scope.row.status === 2 ? 'warning-status' : ''">{{scope.row.status === 2 ? '告警中' :'已结束'}}</span> <span :class="['0','2'].includes(scope.row.status) ? 'warning-status' : ''">{{$store.state.ems.alarmStatusOptions[scope.row.status]}}</span>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
<el-pagination
v-show="tableData.length>0"
background
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="pageNum"
:page-size="pageSize"
:page-sizes="[10, 20, 30, 40]"
layout="total, sizes, prev, pager, next, jumper"
:total="totalSize"
style="margin-top:15px;text-align: center"
>
</el-pagination>
</div> </div>
</el-card> </el-card>
</template> </template>
<script> <script>
import {getAlarmDetailList} from'@/api/ems/dzjk'
import getQuerySiteId from "@/mixins/ems/getQuerySiteId";
import { formatDate } from '@/filters/ems'
export default { export default {
name:'DzjkGzgj', name:'DzjkGzgj',
mixins:[getQuerySiteId],
data() { data() {
return { return {
loading:false,
btnList:[ btnList:[
{name:'今日告警',id:'today'}, {name:'今日告警',id:'today'},
{name:'历史告警',id:'yesterday'}, {name:'历史告警',id:'history'},
], ],
pickerOptions:{ pickerOptions:{
disabledDate(time) { disabledDate(time) {
@ -100,56 +123,115 @@ export default {
}, },
}, },
defaultDateRange:[],//默认展示的时间 defaultDateRange:[],//默认展示的时间
dateRange:[], dateRange:[],//alarmStartTime,alarmEndTime
activeBtn:'today', activeBtn:'today',
loading:false, search:{deviceType:'',alarmLevel:''},
search:{sblx:'',gjdj:''}, // 表格、分页
sblxOptions:[ tableData:[],
{name:'类型一',id:1}, pageSize:10,//分页栏当前每个数据总数
{name:'类型二',id:2}, pageNum:1,//分页栏当前页数
{name:'类型三',id:3}, totalSize:0,//table表格数据总数
],
gjdjOptions:[
{name:'等级一',id:1},
{name:'等级二',id:2},
],
tableData:[
{name:'告警一',gjdj:'等级一',gjnr:'设备一温度过高',startTime:'2025/06/20 18:09:40',finishTime:'2025/06/20 20:07:01',status:1},
{name:'告警二',gjdj:'等级一',gjnr:'设备二温度过高',startTime:'2025/06/20 18:09:40',finishTime:'2025/06/20 20:07:01',status:2},
{name:'告警三',gjdj:'等级一',gjnr:'设备一温度过高',startTime:'2025/06/20 18:09:40',finishTime:'2025/06/20 20:07:01',status:1},
{name:'告警四',gjdj:'等级一',gjnr:'设备二温度过高',startTime:'2025/06/20 18:09:40',finishTime:'2025/06/20 20:07:01',status:2}
]
} }
}, },
methods:{ methods:{
formatDate,
// 判断是否是同一天
isSameDay(day1, day2) {
const date1 = new Date(day1),date2 = new Date(day2)
return date1.getFullYear() === date2.getFullYear() &&
date1.getMonth() === date2.getMonth() &&
date1.getDate() === date2.getDate();
},
// 分页
handleSizeChange(val) {
this.pageSize = val;
this.$nextTick(()=>{
this.getTableData()
})
},
handleCurrentChange(val) {
this.pageNum = val
this.$nextTick(()=>{
this.getTableData()
})
},
// 搜索 // 搜索
onSearch(){ onSearch(){
this.pageNum =1//每次搜索从1开始搜索
const [alarmStartTime='',alarmEndTime='']=(this.dateRange || [])
// 选中了时间范围
if(alarmStartTime && alarmStartTime){
// 如果选择的时间范围是今天
if(this.isSameDay(alarmStartTime,alarmEndTime) && this.isSameDay(alarmStartTime,new Date())){
this.activeBtn = 'today'
}else {
this.activeBtn = 'history'
}
}else{
//没有选择时间范围 还是按照选中的今日告警、历史告警查询
}
this.getData() this.getData()
}, },
// 重置 // 重置
onReset(){ onReset(){
this.search.sblx='' this.search={deviceType:'',alarmLevel:''}
this.search.gjdj=''
this.dateRange=[] this.dateRange=[]
this.pageNum =1//每次搜索从1开始搜索
this.getData() this.getData()
}, },
// 获取数据 // 切换今日、历史告警
getData(){
this.loading=false
},
changeDataType(id){ changeDataType(id){
if(id !== this.activeBtn){ if(id !== this.activeBtn){
console.log('点击了不同的菜单,更新数据') console.log('点击了不同的菜单,更新数据')
this.activeBtn=id; this.activeBtn=id;
const [alarmStartTime,alarmEndTime]=(this.dateRange || [])
// 切换到今日告警,如果已经选择了时间范围清空
if(alarmStartTime && alarmEndTime){
// 如果切换到了今日告警,时间范围不相等或者相等但是不是今天 清空时间选择范围
if(id === 'today' && !this.isSameDay(alarmStartTime,alarmEndTime) || (this.isSameDay(alarmStartTime,alarmEndTime) && !this.isSameDay(alarmStartTime,new Date()))){
this.dateRange = []
}else if(id === 'history' && this.isSameDay(alarmStartTime,alarmEndTime) && this.isSameDay(alarmStartTime,new Date())){
// 切换成历史告警,但是选择时间范围是当天,清空时间范围
this.dateRange = []
}
}
this.getData()
} }
}, },
// 获取数据
getData(){
this.loading=true
const {deviceType,alarmLevel} = this.search
const {siteId,pageNum,pageSize,activeBtn} =this
const [alarmStartTime='',alarmEndTime='']=(this.dateRange || [])
let start='',end = '',now =new Date()
if(activeBtn === 'today'){
start = end = now
}else{
if(alarmStartTime && alarmEndTime){
start = alarmStartTime
end = alarmEndTime
}else{
start=''
end = ''
// now
// end.setDate(end.getDate() - 1);
}
}
getAlarmDetailList({deviceType,alarmLevel,siteId,pageSize,pageNum,alarmStartTime:formatDate(start),alarmEndTime:formatDate(end)}).then(response => {
this.tableData=response?.rows || [];
this.totalSize = response?.total || 0
}).finally(() => {this.loading=false})
},
init(){
this.onReset()
},
}, },
mounted(){ mounted(){
this.getData()
const now = new Date(); const now = new Date();
const lastMonth = new Date(now.getFullYear(), now.getMonth() - 1, 1); const lastMonth = new Date(now.getFullYear(), now.getMonth() - 1, 1);
this.defaultDateRange = [lastMonth, now]; this.defaultDateRange = [lastMonth, now];
} }
} }
</script> </script>

View File

@ -15,6 +15,7 @@
<script> <script>
import * as echarts from 'echarts' import * as echarts from 'echarts'
import resize from '@/mixins/ems/resize' import resize from '@/mixins/ems/resize'
import {formatNumber} from "@/filters/ems";
export default { export default {
mixins: [resize], mixins: [resize],
@ -45,12 +46,11 @@ export default {
siteMonitorDataVo.forEach(item=>{ siteMonitorDataVo.forEach(item=>{
source.push([item.ammeterDate, item.chargedCap,item.disChargedCap]) source.push([item.ammeterDate, item.chargedCap,item.disChargedCap])
}) })
const filterValue=(num)=>{return num || num === 0 ? num : '-'}
this.chart.setOption({ this.chart.setOption({
title: [ title: [
// 右上角 // 右上角
{ {
text: `电网 实时功率:${filterValue(gridNrtPower)} kW`, text: `电网 实时功率:${formatNumber(gridNrtPower)} kW`,
top: 10, top: 10,
right: 10, right: 10,
textStyle:{ textStyle:{
@ -60,7 +60,7 @@ export default {
}, },
// 右下角 // 右下角
{ {
text: `负载 实时功率:${filterValue(loadNrtPower)} kW`, text: `负载 实时功率:${formatNumber(loadNrtPower)} kW`,
bottom: 10, bottom: 10,
right: 10, right: 10,
textStyle:{ textStyle:{
@ -80,7 +80,7 @@ export default {
}, },
// 左下角第二行 // 左下角第二行
{ {
text: `实时功率:${filterValue(energyStorageNrtPower)} kW`, text: `实时功率:${formatNumber(energyStorageNrtPower)} kW`,
bottom: 26, bottom: 26,
left: 10, left: 10,
textStyle:{ textStyle:{
@ -90,7 +90,7 @@ export default {
}, },
// 左下角第三行 // 左下角第三行
{ {
text: `可用电量:${filterValue(energyStorageAvailElec)} kWh`, text: `可用电量:${formatNumber(energyStorageAvailElec)} kWh`,
bottom: 10, bottom: 10,
left: 10, left: 10,
textStyle:{ textStyle:{

View File

@ -10,7 +10,7 @@
<el-row :gutter="20"> <el-row :gutter="20">
<el-col :span="12" v-for="(item,index) in sjglData" :key="index+'sjglData'" class="sjgl-data"> <el-col :span="12" v-for="(item,index) in sjglData" :key="index+'sjglData'" class="sjgl-data">
<div class="sjgl-title">{{item.title}}</div> <div class="sjgl-title">{{item.title}}</div>
<div class="sjgl-value">{{item.value}}</div> <div class="sjgl-value">{{item.value | formatNumber}}</div>
</el-col> </el-col>
</el-row> </el-row>
</div> </div>
@ -37,7 +37,7 @@
label="状态" label="状态"
> >
<template slot-scope="scope"> <template slot-scope="scope">
<span class="warning-status circle">{{ scope.row.status === 0 ? '中断':'todo不是0是什么告警'}}</span> <span :class="{'circle warning-status' : scope.row.status !== 0}">{{ $store.state.ems.warnOptions[scope.row.status]}}</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column
@ -97,7 +97,7 @@ export default {
getDzjkHomeView(this.siteId).then(response => { getDzjkHomeView(this.siteId).then(response => {
const data = response?.data || {} const data = response?.data || {}
this.sjglData.forEach(item=>{ this.sjglData.forEach(item=>{
item.value = (data[item.attr] || data[item.attr] === 0) ? data[item.attr] : '-' item.value =data[item.attr]
}) })
this.tableData = data?.siteMonitorHomeAlarmVo || [] this.tableData = data?.siteMonitorHomeAlarmVo || []
this.$refs.nllzChart.setOption(data) this.$refs.nllzChart.setOption(data)

View File

@ -3,7 +3,7 @@
<!-- 6个方块--> <!-- 6个方块-->
<el-row :gutter="10"> <el-row :gutter="10">
<el-col :xs="12" :sm="8" :lg="4" class="single-square-box-container" v-for="(item,index) in singleZdSqaure" :key="index+'singleSquareBox'"> <el-col :xs="12" :sm="8" :lg="4" class="single-square-box-container" v-for="(item,index) in singleZdSqaure" :key="index+'singleSquareBox'">
<single-square-box :data="{...item,value:Object.values(data).length ? data[item.attr] || '-' : '-'}" ></single-square-box> <single-square-box :data="{...item,value:formatNumber(data[item.attr])}" ></single-square-box>
</el-col> </el-col>
</el-row> </el-row>
</template> </template>
@ -11,7 +11,7 @@
<script> <script>
import SingleSquareBox from "@/components/Ems/SingleSquareBox/index.vue"; import SingleSquareBox from "@/components/Ems/SingleSquareBox/index.vue";
import {formatNumber} from '@/filters/ems'
export default { export default {
components:{SingleSquareBox}, components:{SingleSquareBox},
props:{ props:{
@ -21,6 +21,7 @@ export default {
default:()=>{return {}} default:()=>{return {}}
}, },
}, },
methods:{formatNumber},
data() { data() {
return { return {
// 单个电站 四个方块数据 // 单个电站 四个方块数据

View File

@ -8,9 +8,9 @@
</div> </div>
<div class="descriptions-main"> <div class="descriptions-main">
<el-descriptions direction="vertical" :column="3" :colon="false"> <el-descriptions direction="vertical" :column="3" :colon="false">
<el-descriptions-item labelClassName="descriptions-label" contentClassName="descriptions-direction keep" :span="1" label="工作状态" >{{baseInfo.workStatus}}</el-descriptions-item> <el-descriptions-item labelClassName="descriptions-label" :contentClassName="`descriptions-direction ${baseInfo.workStatus === '0' ? 'save' :'danger'}`" :span="1" label="工作状态" >{{$store.state.ems.workStatusOptions[baseInfo.workStatus]}}</el-descriptions-item>
<el-descriptions-item labelClassName="descriptions-label" contentClassName="descriptions-direction" :span="1" label="与PCS通信">{{baseInfo.pcsCommunicationStatus}}</el-descriptions-item> <el-descriptions-item labelClassName="descriptions-label" contentClassName="descriptions-direction" :span="1" label="与PCS通信">{{$store.state.ems.communicationStatusOptions[baseInfo.pcsCommunicationStatus]}}</el-descriptions-item>
<el-descriptions-item labelClassName="descriptions-label" contentClassName="descriptions-direction" :span="1" label="与EMS通信">{{baseInfo.emsCommunicationStatus}}</el-descriptions-item> <el-descriptions-item labelClassName="descriptions-label" contentClassName="descriptions-direction" :span="1" label="与EMS通信">{{$store.state.ems.communicationStatusOptions[baseInfo.emsCommunicationStatus]}}</el-descriptions-item>
</el-descriptions> </el-descriptions>
</div> </div>
<div class="descriptions-main descriptions-main-bg-color"> <div class="descriptions-main descriptions-main-bg-color">

View File

@ -8,9 +8,9 @@
</div> </div>
<div class="descriptions-main"> <div class="descriptions-main">
<el-descriptions direction="vertical" :column="3" :colon="false"> <el-descriptions direction="vertical" :column="3" :colon="false">
<el-descriptions-item labelClassName="descriptions-label" contentClassName="descriptions-direction keep" :span="1" label="工作状态" >{{baseInfo.workStatus}}</el-descriptions-item> <el-descriptions-item labelClassName="descriptions-label" :contentClassName="`descriptions-direction ${baseInfo.workStatus === '0' ? 'save' :'danger'}`" :span="1" label="工作状态" >{{$store.state.ems.workStatusOptions[baseInfo.workStatus]}}</el-descriptions-item>
<el-descriptions-item labelClassName="descriptions-label" contentClassName="descriptions-direction" :span="1" label="与PCS通信">{{baseInfo.pcsCommunicationStatus}}</el-descriptions-item> <el-descriptions-item labelClassName="descriptions-label" contentClassName="descriptions-direction" :span="1" label="与PCS通信">{{$store.state.ems.communicationStatusOptions[baseInfo.pcsCommunicationStatus]}}</el-descriptions-item>
<el-descriptions-item labelClassName="descriptions-label" contentClassName="descriptions-direction" :span="1" label="与EMS通信">{{baseInfo.emsCommunicationStatus}}</el-descriptions-item> <el-descriptions-item labelClassName="descriptions-label" contentClassName="descriptions-direction" :span="1" label="与EMS通信">{{$store.state.ems.communicationStatusOptions[baseInfo.emsCommunicationStatus]}}</el-descriptions-item>
</el-descriptions> </el-descriptions>
</div> </div>
<div class="descriptions-main descriptions-main-bg-color"> <div class="descriptions-main descriptions-main-bg-color">
@ -20,9 +20,9 @@
<!-- 进度--> <!-- 进度-->
<div class="process-container"> <div class="process-container">
<div class="process-line-bg"> <div class="process-line-bg">
<div class="process-line" :style="{height:baseInfo.currentSoc+'%'}"></div> <div class="process-line" :style="{height:baseInfo.stackSoc+'%'}"></div>
</div> </div>
<div class="process">当前SOC : {{baseInfo.currentSoc}}%</div> <div class="process">当前SOC : {{baseInfo.stackSoc}}%</div>
</div> </div>
</div> </div>
<el-table <el-table
@ -58,27 +58,27 @@
prop="maxVoltage" prop="maxVoltage"
label="单体最高电压"> label="单体最高电压">
<template slot-scope="scope"> <template slot-scope="scope">
<span>{{scope.row.maxVoltage}} V</span> <span>{{scope.row.maxCellVoltage}} V</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="minVoltage" prop="minVoltage"
label="单体最低电压"> label="单体最低电压">
<template slot-scope="scope"> <template slot-scope="scope">
<span>{{scope.row.minVoltage}} V</span> <span>{{scope.row.minCellVoltage}} V</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column
label="单体最高温度"> label="单体最高温度">
<template slot-scope="scope"> <template slot-scope="scope">
<span>{{scope.row.maxTemperature}} &#8451;</span> <span>{{scope.row.maxCellTemp}} &#8451;</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="minTemperature" prop="minTemperature"
label="单体最低温度"> label="单体最低温度">
<template slot-scope="scope"> <template slot-scope="scope">
<span>{{scope.row.minTemperature}} &#8451;</span> <span>{{scope.row.minCellTemp}} &#8451;</span>
</template> </template>
</el-table-column> </el-table-column>
@ -100,15 +100,15 @@ export default {
loading:false, loading:false,
baseInfoList:[], baseInfoList:[],
infoData:[ infoData:[
{label:'电池堆总电压',attr:'totalVoltage',unit:'V'}, {label:'电池堆总电压',attr:'stackVoltage',unit:'V'},
{label:'可充电量',attr:'chargeableCapacity',unit:'kWh'}, {label:'可充电量',attr:'availableChargeCapacity',unit:'kWh'},
{label:'累计充电量',attr:'totalChargedCapacity',unit:'kWh'}, {label:'累计充电量',attr:'totalChargeCapacity',unit:'kWh'},
{label:'电池堆总电流',attr:'totalCurrent',unit:'A'}, {label:'电池堆总电流',attr:'stackCurrent',unit:'A'},
{label:'可放电量',attr:'dischargeableCapacity',unit:'kWh'}, {label:'可放电量',attr:'availableDischargeCapacity',unit:'kWh'},
{label:'累计放电量',attr:'totalDischargedCapacity',unit:'kWh'}, {label:'累计放电量',attr:'totalDischargeCapacity',unit:'kWh'},
{label:'SOH',attr:'soh',unit:'%'}, {label:'SOH',attr:'stackSoh',unit:'%'},
{label:'平均温度',attr:'averageTemperature',unit:'&#8451;'}, {label:'平均温度',attr:'operatingTemp',unit:'&#8451;'},
{label:'绝缘电阻',attr:'insulationResistance',unit:'&Omega;'}, {label:'绝缘电阻',attr:'stackInsulationResistance',unit:'&Omega;'},
] ]
} }
}, },

View File

@ -1,82 +1,82 @@
<template> <template>
<div> <div v-loading="loading">
<el-card shadow="always" class="common-card-container zb-common-card-container"> <el-card shadow="always" class="common-card-container" :class="zbInfo.emsCommunicationStatus === '1' ? 'zb-common-card-container' : 'cnb-common-card-container'">
<div slot="header"> <div slot="header">
<span class="large-title">1#总表</span> <span class="large-title">1#总表</span>
<div class="status"> <div class="status">
<div>通信中断</div> <div>{{$store.state.ems.communicationStatusOptions[zbInfo.emsCommunicationStatus]}}</div>
<div>数据更新时间2024-10-11 12:00:00</div> <div>数据更新时间{{zbInfo.dataUpdateTime}}</div>
</div> </div>
</div> </div>
<el-table <el-table
class="common-table" class="common-table"
:data="zbTableData" :data="zbInfo.ammeterDataDetailInfos"
stripe stripe
style="width: 100%;"> style="width: 100%;">
<el-table-column <el-table-column
prop="name" prop="category"
label="类别"> label="类别">
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="zong" prop="totalKwh"
label="总/kWh" label="总/kWh"
> >
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="jian" prop="sharpKwh"
label="尖/kWh"> label="尖/kWh">
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="feng" prop="peakKwh"
label="峰/kWh"> label="峰/kWh">
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="ping" prop="flatKwh"
label="平/kWh"> label="平/kWh">
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="gu" prop="valleyKwh"
label="谷/kWh"> label="谷/kWh">
</el-table-column> </el-table-column>
</el-table> </el-table>
</el-card> </el-card>
<el-card shadow="always" class="common-card-container cnb-common-card-container"> <el-card shadow="always" class="common-card-container" :class="cnbInfo.emsCommunicationStatus === '1' ? 'zb-common-card-container' : 'cnb-common-card-container'">
<div slot="header"> <div slot="header">
<span class="large-title">2#储能表</span> <span class="large-title">2#储能表</span>
<div class="status"> <div class="status">
<div>通信正常</div> <div>{{$store.state.ems.communicationStatusOptions[cnbInfo.emsCommunicationStatus]}}</div>
<div>数据更新时间2024-10-11 12:00:00</div> <div>数据更新时间{{cnbInfo.dataUpdateTime}}</div>
</div> </div>
</div> </div>
<el-table <el-table
class="common-table" class="common-table"
:data="cnbTableData" :data="cnbInfo.ammeterDataDetailInfos"
stripe stripe
style="width: 100%;"> style="width: 100%;">
<el-table-column <el-table-column
prop="name" prop="category"
label="类别"> label="类别">
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="zong" prop="totalKwh"
label="总/kWh" label="总/kWh"
> >
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="jian" prop="sharpKwh"
label="尖/kWh"> label="尖/kWh">
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="feng" prop="peakKwh"
label="峰/kWh"> label="峰/kWh">
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="ping" prop="flatKwh"
label="平/kWh"> label="平/kWh">
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="gu" prop="valleyKwh"
label="谷/kWh"> label="谷/kWh">
</el-table-column> </el-table-column>
</el-table> </el-table>
@ -86,26 +86,26 @@
<script> <script>
import getQuerySiteId from "@/mixins/ems/getQuerySiteId";
import {getAmmeterDataList} from '@/api/ems/dzjk'
export default { export default {
name:'DzjkSbjkDb', name:'DzjkSbjkDb',
mixins:[getQuerySiteId],
data() { data() {
return { return {
zbTableData:[ loading:false,
{name:'累计充电量',zong:1000,jian:2000,feng:1500,ping:500,gu:40}, zbInfo:{},
{name:'累计放电量',zong:1000,jian:2000,feng:1500,ping:500,gu:40}, cnbInfo:{},
{name:'日充电量',zong:1000,jian:2000,feng:1500,ping:500,gu:40},
{name:'日放电量',zong:1000,jian:2000,feng:1500,ping:500,gu:40},
],
cnbTableData:[
{name:'累计充电量',zong:1000,jian:2000,feng:1500,ping:500,gu:40},
{name:'累计放电量',zong:1000,jian:2000,feng:1500,ping:500,gu:40},
{name:'日充电量',zong:1000,jian:2000,feng:1500,ping:500,gu:40},
{name:'日放电量',zong:1000,jian:2000,feng:1500,ping:500,gu:40},
]
} }
}, },
methods:{ methods:{
init(){
this.loading = true
getAmmeterDataList(this.siteId).then(response => {
this.zbInfo =JSON.parse(JSON.stringify(response?.data[0] || {}));
this.cnbInfo =JSON.parse(JSON.stringify(response?.data[1] || {}));
}).finally(() => {this.loading = false})
}
}, },
mounted(){ mounted(){

View File

@ -23,21 +23,66 @@
<el-button @click="onReset" native-type="button">重置</el-button> <el-button @click="onReset" native-type="button">重置</el-button>
</el-form-item> </el-form-item>
</el-form> </el-form>
<div style="margin:30px 0;box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);">
<!-- 图表--> <!-- 图表-->
<el-row style="background:#fff;margin:30px 0;"> <!-- <div style="margin:30px 0;box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);">-->
<el-col :xs="24" :sm="24" :lg="24"> <!-- <el-row style="background:#fff;margin:30px 0;">-->
<bar-chart ref="barChart"/> <!-- <el-col :xs="24" :sm="24" :lg="24">-->
</el-col> <!-- <bar-chart ref="barChart"/>-->
</el-row> <!-- </el-col>-->
</div> <!-- </el-row>-->
<!-- </div>-->
<el-table
class="common-table"
:data="tableData"
stripe
style="width: 100%;margin-top: 25px">
<el-table-column
prop="deviceId"
label="单体编号">
</el-table-column>
<el-table-column
prop="clusterDeviceId"
label="簇号">
</el-table-column>
<el-table-column
prop="voltage"
label="电压V"
>
</el-table-column>
<el-table-column
prop="temperature"
label="温度(℃)">
</el-table-column>
<el-table-column
prop="soc"
label="SOC%">
</el-table-column>
<el-table-column
prop="soh"
label="SOH%">
</el-table-column>
</el-table>
<el-pagination
v-show="tableData.length>0"
background
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="pageNum"
:page-size="pageSize"
:page-sizes="[10, 20, 30, 40]"
layout="total, sizes, prev, pager, next, jumper"
:total="totalSize"
style="margin-top:15px;text-align: center"
>
</el-pagination>
</el-card> </el-card>
</template> </template>
<script> <script>
import BarChart from './BarChart' import BarChart from './BarChart'
import {getStackNameList,getClusterNameList} from '@/api/ems/dzjk' import {getStackNameList, getClusterNameList, getClusterDataInfoList} from '@/api/ems/dzjk'
import getQuerySiteId from "@/mixins/ems/getQuerySiteId"; import getQuerySiteId from "@/mixins/ems/getQuerySiteId";
export default { export default {
name:'DzjkSbjkDtdc', name:'DzjkSbjkDtdc',
@ -49,13 +94,31 @@ export default {
clusterloading:false, clusterloading:false,
search:{stackId:'',clusterId:''}, search:{stackId:'',clusterId:''},
stackOptions:[],//{id:'',deviceName:''} stackOptions:[],//{id:'',deviceName:''}
clusterOptions:[]//{id:'',deviceName:''} clusterOptions:[],//{id:'',deviceName:''}
tableData:[],
pageSize:10,//分页栏当前每个数据总数
pageNum:1,//分页栏当前页数
totalSize:0,//table表格数据总数
} }
}, },
methods:{ methods:{
// 分页
handleSizeChange(val) {
this.pageSize = val;
this.$nextTick(()=>{
this.getTableData()
})
},
handleCurrentChange(val) {
this.pageNum = val
this.$nextTick(()=>{
this.getTableData()
})
},
// 搜索 // 搜索
onSearch(){ onSearch(){
this.init(false) this.pageNum =1//每次搜索从1开始搜索
this.getTableData()
}, },
// 重置 // 重置
// 清空搜索栏选中数据 // 清空搜索栏选中数据
@ -63,7 +126,8 @@ export default {
onReset(){ onReset(){
this.search={stackId:'',clusterId:''} this.search={stackId:'',clusterId:''}
this.clusterOptions=[] this.clusterOptions=[]
this.init(false) this.pageNum = 1
this.getTableData()
}, },
changeStackId(val){ changeStackId(val){
if(val){ if(val){
@ -72,6 +136,18 @@ export default {
this.getClusterList() this.getClusterList()
} }
}, },
//表格数据
getTableData(){
this.loading=true;
const {stackId:stackDeviceId,clusterId:clusterDeviceId} =this.search
const {siteId,pageNum,pageSize}=this
getClusterDataInfoList({stackDeviceId,clusterDeviceId,siteId,pageNum,pageSize}).then(response => {
this.tableData=response?.rows || [];
this.totalSize = response?.total || 0
}).finally(()=>{
this.loading=false;
})
},
getStackList(){ getStackList(){
getStackNameList(this.siteId).then(response => { getStackNameList(this.siteId).then(response => {
this.stackOptions = JSON.parse(JSON.stringify(response?.data || [])) this.stackOptions = JSON.parse(JSON.stringify(response?.data || []))
@ -83,16 +159,11 @@ export default {
this.clusterOptions = JSON.parse(JSON.stringify(response?.data || [])) this.clusterOptions = JSON.parse(JSON.stringify(response?.data || []))
}).finally(() => {this.clusterloading =false}) }).finally(() => {this.clusterloading =false})
}, },
init(mounted = true){ init(){
this.loading=true; // 只有页面初次加载或切换站点的时候调用电池堆列表,其他情况不需要
// todo 获取单体电池数据 this.search={stackId:'',clusterId:''}//保证切换站点时,清空选择项
this.loading=false;
this.$refs.barChart.setOption()
// 只有页面初次加载的时候调用电池堆列表,其他情况不需要
if(mounted){
this.getStackList() this.getStackList()
} this.getTableData()
} }
}, },
mounted(){ mounted(){

View File

@ -5,24 +5,25 @@
<real-time-base-info :data="runningHeadData"/> <real-time-base-info :data="runningHeadData"/>
<!-- 内容--> <!-- 内容-->
<el-container class="pcs-container" v-for="(pcsItem,pcsIndex) in pcsList" :key="pcsIndex+'PcsHome'"> <el-container class="pcs-container" v-for="(pcsItem,pcsIndex) in pcsList" :key="pcsIndex+'PcsHome'">
<el-header class="pcs-header"> <!-- 背景颜色根据工作状态来展示-->
<el-header class="pcs-header" :class="pcsItem.workStatus === '1' ? 'warn' : pcsItem.workStatus === '2' ? 'close' : ''">
<div class="pcs-title">{{pcsItem.deviceName}}</div> <div class="pcs-title">{{pcsItem.deviceName}}</div>
<div class="pcs-status"> <div class="pcs-status">
<div>{{pcsItem.communicationStatus}}</div> <div>{{$store.state.ems.communicationStatusOptions[pcsItem.communicationStatus]}}</div>
<div>数据更新时间{{pcsItem.dataUpdateTime}}</div> <div>数据更新时间{{pcsItem.dataUpdateTime}}</div>
</div> </div>
<div class="pcs-btns"> <!-- <div class="pcs-btns">-->
<el-button type="warning" size="small" @click="problemSaved">故障复位</el-button> <!-- <el-button type="warning" size="small" @click="problemSaved">故障复位</el-button>-->
<el-button size="small" @click="machineClosed">关机</el-button> <!-- <el-button size="small" @click="machineClosed">关机</el-button>-->
</div> <!-- </div>-->
</el-header> </el-header>
<el-main style="padding: 0"> <el-main style="padding: 0">
<div class="descriptions-main"> <div class="descriptions-main">
<el-descriptions direction="vertical" :column="4" :colon="false"> <el-descriptions direction="vertical" :column="4" :colon="false">
<el-descriptions-item labelClassName="descriptions-label" contentClassName="descriptions-direction danger" :span="1" label="工作状态">{{pcsItem.workStatus}}</el-descriptions-item> <el-descriptions-item labelClassName="descriptions-label" :contentClassName="`descriptions-direction ${pcsItem.workStatus === '0' ? 'save' :'danger'}`" :span="1" label="工作状态">{{$store.state.ems.workStatusOptions[pcsItem.workStatus]}}</el-descriptions-item>
<el-descriptions-item labelClassName="descriptions-label" contentClassName="descriptions-direction" :span="1" label="并网状态">{{pcsItem.gridStatus}}</el-descriptions-item> <el-descriptions-item labelClassName="descriptions-label" contentClassName="descriptions-direction" :span="1" label="并网状态">{{$store.state.ems.gridStatusOptions[pcsItem.gridStatus]}}</el-descriptions-item>
<el-descriptions-item labelClassName="descriptions-label" contentClassName="descriptions-direction save" :span="1" label="设备状态">{{pcsItem.deviceStatus}}</el-descriptions-item> <el-descriptions-item labelClassName="descriptions-label" :contentClassName="`descriptions-direction ${pcsItem.deviceStatus === '0' ? 'save' : 'danger'}`" :span="1" label="设备状态">{{$store.state.ems.deviceStatusOptions[pcsItem.deviceStatus]}}</el-descriptions-item>
<el-descriptions-item labelClassName="descriptions-label" contentClassName="descriptions-direction" :span="1" label="控制模式">{{pcsItem.controlMode}}</el-descriptions-item> <el-descriptions-item labelClassName="descriptions-label" contentClassName="descriptions-direction" :span="1" label="控制模式">{{$store.state.ems.controlModeOptions[pcsItem.controlMode]}}</el-descriptions-item>
</el-descriptions> </el-descriptions>
</div> </div>
<div class="descriptions-main descriptions-main-bg-color"> <div class="descriptions-main descriptions-main-bg-color">
@ -75,7 +76,7 @@ export default {
{label:'PCS环境温度',attr:'pcsEnvironmentTemperature',unit:'&#8451;'}, {label:'PCS环境温度',attr:'pcsEnvironmentTemperature',unit:'&#8451;'},
{label:'交流频率',attr:'acFrequency',unit:'Hz'} {label:'交流频率',attr:'acFrequency',unit:'Hz'}
], ],
pcsBranchList:[]//pcs的支路列表 pcsBranchList:[],//pcs的支路列表
} }
}, },
methods:{ methods:{
@ -170,7 +171,7 @@ export default {
border-radius: 6px 6px 0 0; border-radius: 6px 6px 0 0;
//红色标题 //红色标题
.pcs-header{ .pcs-header{
background: #FC6B69; background: #05AEA3;
display: flex; display: flex;
position: relative; position: relative;
justify-content: flex-start; justify-content: flex-start;
@ -197,5 +198,11 @@ export default {
transform: translateY(-50%); transform: translateY(-50%);
} }
} }
.pcs-header.warn{
background-color:#FC6B69 ;
}
.pcs-header.close{
background-color:#666666 ;
}
} }
</style> </style>

View File

@ -1,78 +1,52 @@
<template> <template>
<div> <div v-loading="loading">
<div class="yl-item-container"> <!-- todo 判断条件是否需要更新-->
<div class="yl-item-container" :class="{'yl-warn-item-container':item.workMode !== '0'}" v-for="(item,index) in list" :key="index+'ylLise'">
<div class="header"> <div class="header">
<div class="header-title">1#液冷</div> <div class="header-title">{{item.systemName}}</div>
<div>工作模式<span class="header-values">运行</span></div> <div>工作模式<span class="header-values">{{$store.state.ems.workModeOptions[item.workMode]}}</span></div>
<div>当前温度<span class="header-values">12&#8451;</span></div> <div>当前温度<span class="header-values">{{item.currentTemperature}}&#8451;</span></div>
</div> </div>
<div class="content"> <div class="content">
<el-row> <el-row>
<el-col v-for="(item,index) in tempData" :key="index+'ylTempData'" :span="8">{{item.title}}{{item.value}}&#8451;</el-col> <el-col v-for="(tempDataItem,tempDataIndex) in tempData" :key="tempDataIndex+'ylTempData'" :span="8">{{tempDataItem.title}}{{item[tempDataItem.attr]}}&#8451;</el-col>
</el-row>
</div>
</div>
<div class="yl-item-container yl-warn-item-container">
<div class="header">
<div class="header-title">2#液冷</div>
<div>工作模式<span class="header-values">运行</span></div>
<div>当前温度<span class="header-values">12&#8451;</span></div>
</div>
<div class="content">
<el-row>
<el-col v-for="(item,index) in tempData" :key="index+'ylTempData'" :span="8">{{item.title}}{{item.value}}&#8451;</el-col>
</el-row>
</div>
</div>
<div class="yl-item-container">
<div class="header">
<div class="header-title">3#液冷</div>
<div>工作模式<span class="header-values">运行</span></div>
<div>当前温度<span class="header-values">12&#8451;</span></div>
</div>
<div class="content">
<el-row>
<el-col v-for="(item,index) in tempData" :key="index+'ylTempData'" :span="8">{{item.title}}{{item.value}}&#8451;</el-col>
</el-row>
</div>
</div>
<div class="yl-item-container yl-warn-item-container">
<div class="header">
<div class="header-title">4#液冷</div>
<div>工作模式<span class="header-values">运行</span></div>
<div>当前温度<span class="header-values">12&#8451;</span></div>
</div>
<div class="content">
<el-row>
<el-col v-for="(item,index) in tempData" :key="index+'ylTempData'" :span="8">{{item.title}}{{item.value}}&#8451;</el-col>
</el-row> </el-row>
</div> </div>
</div> </div>
<el-empty v-show="list.length<=0" :image-size="200"></el-empty>
</div> </div>
</template> </template>
<script> <script>
import getQuerySiteId from "@/mixins/ems/getQuerySiteId";
import {getCoolingDataList} from '@/api/ems/dzjk'
export default { export default {
name:'DzjkSbjkYl', name:'DzjkSbjkYl',
mixins:[getQuerySiteId],
data() { data() {
return { return {
loading:false,
list:[],
tempData:[ tempData:[
{title:'制热开启点',value:12,attr:''}, {title:'制热开启点',attr:'heatingStartPoint'},
{title:'制冷开启点',value:23,attr:''}, {title:'制冷开启点',attr:'coolingStartPoint'},
{title:'高温告警点',value:30,attr:''}, {title:'高温告警点',attr:'highTempAlarmPoint'},
{title:'制热停止点',value:24,attr:''}, {title:'制热停止点',attr:'heatingStopPoint'},
{title:'制冷停止点',value:21,attr:''}, {title:'制冷停止点',attr:'coolingStopPoint'},
{title:'低温告警点',value:10,attr:''}, {title:'低温告警点',attr:'lowTempAlarmPoint'},
] ]
} }
}, },
methods:{ methods:{
init(){
this.loading = true
getCoolingDataList(this.siteId).then(response => {
this.list = JSON.parse(JSON.stringify(response?.data || []));
}).finally(() => {this.loading = false})
}
}, },
mounted(){ mounted(){

View File

@ -3,7 +3,7 @@
<div slot="header"> <div slot="header">
<span class="card-title">电量指标</span> <span class="card-title">电量指标</span>
</div> </div>
<div class="card-main"> <div class="card-main" v-loading="loading">
<!-- 搜索栏--> <!-- 搜索栏-->
<div class="select-container"> <div class="select-container">
<el-form :inline="true"> <el-form :inline="true">
@ -19,7 +19,7 @@
</el-date-picker> </el-date-picker>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-button type="primary" @click="onSearch" native-type="button">搜索</el-button> <el-button type="primary" @click="getData" native-type="button">搜索</el-button>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-button @click="onReset" native-type="button">重置</el-button> <el-button @click="onReset" native-type="button">重置</el-button>
@ -27,9 +27,9 @@
</el-form> </el-form>
</div> </div>
<div class="total-data"> <div class="total-data">
<div>总充电量:<span class="point">1390988kWh</span></div> <div>总充电量:<span class="point">{{totalChargedCap | formatNumber}}kWh</span></div>
<div>总放电量:<span class="point">988kWh</span></div> <div>总放电量:<span class="point">{{totalDisChargedCap | formatNumber}}kWh</span></div>
<div>综合效率:<span class="point">99%</span></div> <div>综合效率:<span class="point">{{efficiency | formatNumber}}%</span></div>
</div> </div>
<div id="dlzbChart" style="height: 310px"></div> <div id="dlzbChart" style="height: 310px"></div>
</div> </div>
@ -39,8 +39,11 @@
<script> <script>
import * as echarts from 'echarts' import * as echarts from 'echarts'
import resize from "@/mixins/ems/resize"; import resize from "@/mixins/ems/resize";
import getQuerySiteId from "@/mixins/ems/getQuerySiteId";
import {getElectricData} from '@/api/ems/dzjk'
import {formatDate} from '@/filters/ems'
export default { export default {
mixins: [resize], mixins: [resize,getQuerySiteId],
data() { data() {
return { return {
pickerOptions:{ pickerOptions:{
@ -51,74 +54,94 @@ export default {
defaultDateRange:[],//默认展示的时间 defaultDateRange:[],//默认展示的时间
dateRange:[], dateRange:[],
loading:false, loading:false,
chart: null chart: null,
totalChargedCap:'',
totalDisChargedCap:'',
efficiency:''
} }
}, },
methods: { methods: {
// 搜索
onSearch(){
this.getData()
},
// 重置 // 重置
onReset(){ onReset(){
this.dateRange=[] this.dateRange=[]
this.getData() this.getData()
}, },
getData(){
this.loading=true;
this.chart.showLoading()
//接口调用完成之后 设置图表、结束loading
this.setOption()
this.loading=false;
this.chart.hideLoading()
},
setOption(data){ setOption(data){
// const source = [['日期','充电量','放电量']] const source = [['日期','充电量','放电量','效率']]
// data.forEach(item=>{ data.forEach(item=>{
// source.push([item.ammeterDate, item.chargedCap,item.disChargedCap]) source.push([item.ammeterDate, item.chargedCap,item.disChargedCap,item.dailyEfficiency])
// }) })
this.chart.setOption({ this.chart.setOption({
color:['#FFBD00','#3C81FF'], color:['#FFBD00','#3C81FF','#05AEA3'],
// legend: { // legend: {
// left: 'right', // left: 'right',
// bottom: '10', // bottom: '10',
// }, // },
tooltip: {}, tooltip: {},
xAxis: { type: 'category' }, xAxis: { type: 'category' },
yAxis: { type: 'value' }, yAxis: [{
grid:{top:30}, type: 'value',
name:'充电量/放电量kWh',
axisLine: {
lineStyle:{
color: '#333333',
},
onZero:false
}
},{
type: 'value',
name:'效率%',
axisLine: {
lineStyle:{
color: '#333333',
},
onZero:false
}
}],
grid:{top:40},
dataset:{ dataset:{
// source source
source:[//格式
['product','充电量','放电量'],
['6/10',101,220],
['6/11',210,390],
['6/12',220,360],
['6/13',520,340],
['6/14',270,430],
]
}, },
series: [ series: [
{ {
yAxisIndex:0,
type: 'bar',//柱状图 type: 'bar',//柱状图
}, },
{ {
yAxisIndex:0,
type: 'bar',//柱状图 type: 'bar',//柱状图
}, },
{
yAxisIndex:1,
type: 'line',//柱状图
},
] ]
}) })
}, },
initChart() { getData(){
this.loading=true;
//接口调用完成之后 设置图表、结束loading
const [start='',end='']=this.dateRange || [];
const startDate=formatDate(start),endDate = formatDate(end)
getElectricData({siteId:this.siteId,startDate,endDate}).then(response => {
const {totalChargedCap='',totalDisChargedCap='',efficiency='',sevenDayDisChargeStats=[]}=response?.data || {}
this.setOption(sevenDayDisChargeStats || [])
this.totalChargedCap=totalChargedCap
this.totalDisChargedCap=totalDisChargedCap
this.efficiency=efficiency
}).finally(() => {
this.loading=false;
})
},
init(){
this.chart = echarts.init(document.querySelector('#dlzbChart')); this.chart = echarts.init(document.querySelector('#dlzbChart'));
this.onReset()
} }
}, },
mounted(){ mounted(){
const now = new Date(); const now = new Date();
const lastMonth = new Date(now.getFullYear(), now.getMonth() - 1, 1); const lastMonth = new Date(now.getFullYear(), now.getMonth() - 1, 1);
this.defaultDateRange = [lastMonth, now]; this.defaultDateRange = [lastMonth, now];
this.initChart()
this.getData()
}, },
beforeDestroy() { beforeDestroy() {
if (!this.chart) { if (!this.chart) {

View File

@ -0,0 +1,197 @@
<template>
<div class="ems-dashboard-editor-container" style="background-color: #ffffff" v-loading="loading">
<el-form :inline="true" class="select-container">
<el-form-item label="站点选择">
<el-select v-model="siteId" placeholder="请选择换电站名称" :loading="loading" loading-text="正在加载数据">
<el-option :label="item.siteName" :value="item.siteId" v-for="(item,index) in siteList" :key="index+'zdxeSelect'"></el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="onSearch" native-type="button">搜索</el-button>
<el-button @click="onReset" native-type="button">重置</el-button>
</el-form-item>
</el-form>
<el-table
class="common-table"
:data="tableData"
stripe
max-height="600px"
style="width: 100%;margin-top: 25px">
<el-table-column
prop="siteId"
label="站点ID">
</el-table-column>
<el-table-column
prop="siteName"
label="站点名称">
</el-table-column>
<el-table-column
prop="deviceId"
label="设备ID"
>
</el-table-column>
<el-table-column
prop="deviceName"
label="设备名称">
</el-table-column>
<el-table-column
prop="deviceType"
label="设备类型">
</el-table-column>
<el-table-column
prop="communicationStatus"
label="通信状态">
<template slot-scope="scope">
<span>{{$store.state.ems.communicationStatusOptions[scope.row.communicationStatus]}}</span>
</template>
</el-table-column>
<el-table-column
fixed="right"
label="操作"
width="140">
<template slot-scope="scope">
<el-button
@click="toDetail(scope.row.deviceId)"
type="primary"
size="small">
查看详情
</el-button>
</template>
</el-table-column>
</el-table>
<el-pagination
v-show="tableData.length>0"
background
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="pageNum"
:page-size="pageSize"
:page-sizes="[10, 20, 30, 40]"
layout="total, sizes, prev, pager, next, jumper"
:total="totalSize"
style="margin-top:15px;text-align: center"
>
</el-pagination>
<el-dialog :visible.sync="dialogTableVisible" class="ems-dialog" title=" 详细信息" :close-on-click-modal="false" :before-close="handleClosed">
<div class="descriptions-main" style="padding: 0" >
<el-descriptions direction="vertical" :column="2" :colon="false" border>
<el-descriptions-item v-for="item in detailData" labelClassName="descriptions-label" contentClassName="descriptions-direction" :span="1" :label="item.label">{{item.value}}</el-descriptions-item>
</el-descriptions>
</div>
</el-dialog>
</div>
</template>
<script>
import {getDeviceInfoList,getDeviceDetailInfo} from'@/api/ems/site'
import {getAllSites} from '@/api/ems/zddt'
import {formatNumber} from "@/filters/ems";
export default {
name: "Sblb",
data() {
return {
loading:false,
searchLoading:false,
siteId:'',
siteList:[],
tableData:[],
pageSize:10,//分页栏当前每个数据总数
pageNum:1,//分页栏当前页数
totalSize:0,//table表格数据总数
dialogTableVisible:false,
detailData:[
{label:'设备ID',value:'',attr:'deviceId'},
{label:'设备名称',value:'',attr:'deviceName'},
{label:'设备类型',value:'',attr:'deviceType'},
{label:'通信状态',value:'',attr:'communicationStatus'},
{label:'TCP设备的IP地址',value:'',attr:'ipAddress'},
{label:'TCP端口号',value:'',attr:'ipPort'},
{label:'串口路径',value:'',attr:'serialPort'},
{label:'波特率',value:'',attr:'baudRate'},
{label:'数据位',value:'',attr:'dataBits'},
{label:'停止位',value:'',attr:'stopBits'},
{label:'校验位',value:'',attr:'parity'},
{label:'设备描述',value:'',attr:'description'},
{label:'设备类别',value:'',attr:'deviceCategory'},
{label:'上级设备ID',value:'',attr:'parentId'},
{label:'设备唯一标识符',value:'',attr:'deviceId'},
],
detailformatAttr:{
'deviceType':'deviceTypeOptions',
'communicationStatus':'communicationStatusOptions',
}
}
},
methods:{
handleClosed(done){
this.detailData.forEach((item)=>{item.value = ''})
done()
},
toDetail(deviceId){
this.loading = true
getDeviceDetailInfo(deviceId).then(response => {
const data = response?.data || {};
this.detailData.forEach(item=>{
if(this.detailformatAttr[item.attr]){
item.value=formatNumber(this.$store.state.ems[this.detailformatAttr[item.attr]][data[item.attr]]);
}else{
item.value=formatNumber(data[item.attr]);
}
})
this.dialogTableVisible = true
}).finally(() => {this.loading = false})
},
// 分页
handleSizeChange(val) {
this.pageSize = val;
this.$nextTick(()=>{
this.getData()
})
},
handleCurrentChange(val) {
this.pageNum = val
this.$nextTick(()=>{
this.getData()
})
},
// 搜索
onSearch(){
this.pageNum =1//每次搜索从1开始搜索
this.getData()
},
// 重置
onReset(){
this.siteId=''
this.pageNum =1//每次搜索从1开始搜索
this.getData()
},
// 获取数据
getData(){
this.loading=true
const {siteId,pageNum,pageSize} =this
getDeviceInfoList({siteId,pageNum,pageSize}).then(response => {
this.tableData=response?.rows || [];
this.totalSize = response?.total || 0
}).finally(() => {this.loading=false})
},
//获取站点列表
getZdList(){
this.searchLoading=true
getAllSites().then(response => {
this.siteList = response?.data || []
}).finally(() => {this.searchLoading=false})
}
},
mounted() {
this.onReset()
this.getZdList()
}
}
</script>
<style scoped lang="scss">
</style>

View File

@ -0,0 +1,147 @@
<template>
<div class="ems-dashboard-editor-container" style="background-color: #ffffff" v-loading="loading">
<el-form :inline="true" class="select-container">
<el-form-item label="站点名称">
<el-input
v-model="siteName"
placeholder="请输入"
clearable
style="width: 240px"
/>
</el-form-item>
<el-form-item label="运营时间">
<el-date-picker
v-model="dateRange"
type="daterange"
range-separator=""
start-placeholder="开始日期"
end-placeholder="结束日期"
:picker-options="pickerOptions"
:default-value="defaultDateRange"
></el-date-picker>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="onSearch" native-type="button">搜索</el-button>
<el-button @click="onReset" native-type="button">重置</el-button>
</el-form-item>
</el-form>
<el-table
class="common-table"
:data="tableData"
stripe
max-height="500px"
style="width: 100%;margin-top: 25px">
<el-table-column
prop="siteId"
label="站点ID">
</el-table-column>
<el-table-column
prop="siteName"
label="站点名称">
</el-table-column>
<el-table-column
prop="siteAddress"
label="站点地址"
>
</el-table-column>
<el-table-column
prop="runningTime"
label="运营时间">
</el-table-column>
<el-table-column
prop="installPower"
label="装机功率">
</el-table-column>
<el-table-column
prop="installCapacity"
label="装机容量">
</el-table-column>
</el-table>
<el-pagination
v-show="tableData.length>0"
background
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="pageNum"
:page-size="pageSize"
:page-sizes="[10, 20, 30, 40]"
layout="total, sizes, prev, pager, next, jumper"
:total="totalSize"
style="margin-top:15px;text-align: center"
>
</el-pagination>
</div>
</template>
<script>
import {getSiteInfoList} from '@/api/ems/site'
import { formatDate } from '@/filters/ems'
export default {
name: "Zdlb",
data() {
return {
loading:false,
siteName:"",
pickerOptions:{
disabledDate(time) {
return time.getTime() > Date.now();
},
},
defaultDateRange:[],//默认展示的时间
dateRange:[],//startTime,endTime
tableData:[],
pageSize:10,//分页栏当前每个数据总数
pageNum:1,//分页栏当前页数
totalSize:0,//table表格数据总数
}
},
methods:{
// 分页
handleSizeChange(val) {
this.pageSize = val;
this.$nextTick(()=>{
this.getData()
})
},
handleCurrentChange(val) {
this.pageNum = val
this.$nextTick(()=>{
this.getData()
})
},
// 搜索
onSearch(){
this.pageNum =1//每次搜索从1开始搜索
this.getData()
},
// 重置
onReset(){
this.siteName=''
this.dateRange=[]
this.pageNum =1//每次搜索从1开始搜索
this.getData()
},
// 获取数据
getData(){
this.loading=true
const {siteName,pageNum,pageSize} =this
const [startTime='',endTime='']=(this.dateRange || [])
getSiteInfoList({siteName,pageSize,pageNum,startTime:formatDate(startTime),endTime:formatDate(endTime)}).then(response => {
this.tableData=response?.rows || [];
this.totalSize = response?.total || 0
}).finally(() => {this.loading=false})
},
},
mounted() {
this.onReset()
const now = new Date();
const lastMonth = new Date(now.getFullYear(), now.getMonth() - 1, 1);
this.defaultDateRange = [lastMonth, now];
}
}
</script>
<style scoped lang="scss">
</style>

View File

@ -0,0 +1,110 @@
<template>
<el-dialog :visible.sync="dialogTableVisible" class="ems-dialog" :title="mode === 'add'?'新增模板':`编辑todo 工单名称` " :close-on-click-modal="false" :show-close="false">
<el-form ref="addTempForm" :model="formData" :rules="rules" size="medium" label-width="100px">
<el-form-item label="工单号" prop="gdh">
<el-input :disabled="mode !=='add'" v-model="formData.gdh" placeholder="请输入" clearable :style="{width: '100%'}">
</el-input>
</el-form-item>
<el-form-item label="工单标题" prop="title" required>
<el-input v-model="formData.title" placeholder="请输入" clearable :style="{width: '100%'}">
</el-input>
</el-form-item>
<el-form-item label="问题描述" prop="question" required>
<el-input v-model="formData.question" type="textarea" placeholder="请输入" clearable :style="{width: '100%'}">
</el-input>
</el-form-item>
<el-form-item label="处理状态" prop="handleStatus">
<el-select v-model="formData.handleStatus" placeholder="请选择">
<el-option :label="value" :value="key" v-for="(value,key) in handleStatusOptions" :key="key+'handleStatusOptions'"></el-option>
</el-select>
</el-form-item>
<el-form-item label="提交人" prop="submitName" required>
<el-input v-model="formData.submitName" placeholder="请输入" clearable :style="{width: '100%'}">
</el-input>
</el-form-item>
<el-form-item label="处理人" prop="handleName" required>
<el-input v-model="formData.handleName" placeholder="请输入" clearable :style="{width: '100%'}">
</el-input>
</el-form-item>
<el-form-item label="提交时间" prop="submitTime" required>
<el-input v-model="formData.submitTime" placeholder="请输入" clearable :style="{width: '100%'}">
</el-input>
</el-form-item>
</el-form>
<div slot="footer">
<el-button @click="closeDialog">取消</el-button>
<el-button type="primary" @click="saveDialog">确定</el-button>
</div>
</el-dialog>
</template>
<script>
export default {
props:{
mode:{
type:String,
default:"add"
},
//todo 修改数据时,从接口获取工单详情还是从列表中返回?
},
data() {
return {
dialogTableVisible:false,
handleStatusOptions:{'0':'处理完成','1':'处理中','2':'未处理'},
formData: {
gdh: '',//工单号
title: '',//工单标题
question: '',
handleStatus:'',
submitName:'',
handleName: '',
submitTime: '',
},
rules: {
gdh: [{
required: true,
message: '请输入',
trigger: 'blur'
}],
},
}
},
computed: {},
created() {},
mounted() {},
methods: {
saveDialog() {
this.$refs.addTempForm.validate(valid => {
if (!valid) return
this.closeDialog()
})
},
closeDialog(){
// 清空所有数据
this.$refs.addTempForm.resetFields()
this.formData={
gdh: '',//工单号
title: '',//工单标题
question: '',
handleStatus:'',
submitName:'',
handleName: '',
submitTime: '',
}
this.dialogTableVisible=false
}
}
}
</script>
<style scoped>
.ems-dialog{
.el-dialog{
max-width: 700px;
}
.add-time-form{
.el-input{
width: 220px;
}
}
}
</style>

View File

@ -1,333 +1,158 @@
<template> <template>
<div class="app-container"> <div class="ems-dashboard-editor-container" style="background-color: #ffffff" v-loading="loading">
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px"> <el-button type="primary" @click="addTicket" native-type="button">新增</el-button>
<el-form-item label="工单号" prop="ticketNo"> <el-table
<el-input class="common-table"
v-model="queryParams.ticketNo" :data="tableData"
placeholder="请输入工单号" stripe
clearable max-height="500px"
@keyup.enter.native="handleQuery" style="width: 100%;margin-top: 25px">
/> <el-table-column
</el-form-item> prop="gdh"
<el-form-item label="工单标题" prop="title"> label="工单号">
<el-input
v-model="queryParams.title"
placeholder="请输入工单标题"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="完成时间" prop="completeTime">
<el-date-picker clearable
v-model="queryParams.completeTime"
type="date"
value-format="yyyy-MM-dd"
placeholder="请选择完成时间">
</el-date-picker>
</el-form-item>
<el-form-item label="处理人ID" prop="workUserId">
<el-input
v-model="queryParams.workUserId"
placeholder="请输入处理人ID"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button
type="primary"
plain
icon="el-icon-plus"
size="mini"
@click="handleAdd"
v-hasPermi="['system:ticket:add']"
>新增</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="success"
plain
icon="el-icon-edit"
size="mini"
:disabled="single"
@click="handleUpdate"
v-hasPermi="['system:ticket:edit']"
>修改</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="danger"
plain
icon="el-icon-delete"
size="mini"
:disabled="multiple"
@click="handleDelete"
v-hasPermi="['system:ticket:remove']"
>删除</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="warning"
plain
icon="el-icon-download"
size="mini"
@click="handleExport"
v-hasPermi="['system:ticket:export']"
>导出</el-button>
</el-col>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
<el-table v-loading="loading" :data="ticketList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center" />
<el-table-column label="${comment}" align="center" prop="id" />
<el-table-column label="工单号" align="center" prop="ticketNo" />
<el-table-column label="提交用户ID" align="center" prop="userId" />
<el-table-column label="工单标题" align="center" prop="title" />
<el-table-column label="问题描述" align="center" prop="content" />
<el-table-column label="图片URL数组" align="center" prop="images" />
<el-table-column label="1待处理 2处理中 3已完成" align="center" prop="status" />
<el-table-column label="完成时间" align="center" prop="completeTime" width="180">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.completeTime, '{y}-{m}-{d}') }}</span>
</template>
</el-table-column> </el-table-column>
<el-table-column label="处理人ID" align="center" prop="workUserId" /> <el-table-column
<el-table-column label="操作" align="center" class-name="small-padding fixed-width"> prop="title"
label="工单标题"
>
</el-table-column>
<el-table-column
prop="question"
min-width="300"
show-overflow-tooltip
label="问题描述">
</el-table-column>
<el-table-column
prop="handleStatus"
label="处理状态">
</el-table-column>
<el-table-column
prop="submitName"
label="提交人">
</el-table-column>
<el-table-column
prop="handleName"
label="处理人">
</el-table-column>
<el-table-column
prop="submitTime"
label="提交时间">
</el-table-column>
<el-table-column
fixed="right"
label="操作"
width="150">
<template slot-scope="scope"> <template slot-scope="scope">
<el-button <el-button
size="mini" @click="editTicket(scope.row.gdh)"
type="text" type="warning"
icon="el-icon-edit" size="mini">
@click="handleUpdate(scope.row)" 编辑
v-hasPermi="['system:ticket:edit']" </el-button>
>修改</el-button>
<el-button <el-button
size="mini" @click="deleteTicket(scope.row)"
type="text" type="danger"
icon="el-icon-delete" size="small">
@click="handleDelete(scope.row)" 废弃
v-hasPermi="['system:ticket:remove']" </el-button>
>删除</el-button>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
<add-ticket ref="addTicket" :mode="mode"/>
<pagination
v-show="total>0"
:total="total"
:page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize"
@pagination="getList"
/>
<!-- 添加或修改工单主对话框 -->
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
<el-form-item label="工单号" prop="ticketNo">
<el-input v-model="form.ticketNo" placeholder="请输入工单号" />
</el-form-item>
<el-form-item label="工单标题" prop="title">
<el-input v-model="form.title" placeholder="请输入工单标题" />
</el-form-item>
<el-form-item label="问题描述">
<editor v-model="form.content" :min-height="192"/>
</el-form-item>
<el-form-item label="完成时间" prop="completeTime">
<el-date-picker clearable
v-model="form.completeTime"
type="date"
value-format="yyyy-MM-dd"
placeholder="请选择完成时间">
</el-date-picker>
</el-form-item>
<el-form-item label="处理人ID" prop="workUserId">
<el-input v-model="form.workUserId" placeholder="请输入处理人ID" />
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm"> </el-button>
<el-button @click="cancel"> </el-button>
</div>
</el-dialog>
</div> </div>
</template> </template>
<script> <script>
import { listTicket, getTicket, delTicket, addTicket, updateTicket } from "@/api/ems/ticket" // import {getSingleSiteBaseInfo} from '@/api/ems/zddt'
import AddTicket from './AddTicket.vue'
export default { export default {
name: "Ticket", name: "Ticket",
components: {AddTicket},
data() { data() {
return { return {
// 遮罩层 mode:'',//新增、修改工单
loading: true, editTicketId:'',
// 选中数组 loading:false,
ids: [], tableData:[
// 非单个禁用 {gdh:'0001',title:'工单一',question:'问题描述问题描述问题描述问题描述问题描述问题描述问题描述问题描述问题描述问题描述问题描述问题描述问题描述',handleStatus:'处理完成',submitName:'张三',handleName:'李四',submitTime:'2025/06/20'}
single: true, ]
// 非多个禁用
multiple: true,
// 显示搜索条件
showSearch: true,
// 总条数
total: 0,
// 工单主表格数据
ticketList: [],
// 弹出层标题
title: "",
// 是否显示弹出层
open: false,
// 查询参数
queryParams: {
pageNum: 1,
pageSize: 10,
ticketNo: null,
userId: null,
title: null,
content: null,
images: null,
status: null,
completeTime: null,
workUserId: null
},
// 表单参数
form: {},
// 表单校验
rules: {
ticketNo: [
{ required: true, message: "工单号不能为空", trigger: "blur" }
],
userId: [
{ required: true, message: "提交用户ID不能为空", trigger: "blur" }
],
title: [
{ required: true, message: "工单标题不能为空", trigger: "blur" }
],
content: [
{ required: true, message: "问题描述不能为空", trigger: "blur" }
],
status: [
{ required: true, message: "1待处理 2处理中 3已完成不能为空", trigger: "change" }
],
createTime: [
{ required: true, message: "创建时间不能为空", trigger: "blur" }
],
} }
}
},
created() {
this.getList()
}, },
methods:{ methods:{
/** 查询工单主列表 */ addTicket(){
getList() { this.mode = 'add';
this.loading = true this.$refs.addTicket.dialogTableVisible = true;
listTicket(this.queryParams).then(response => {
this.ticketList = response.rows
this.total = response.total
this.loading = false
})
}, },
// 取消按钮 editTicket(id){
cancel() { this.mode = 'add';
this.open = false this.editTicketId = id
this.reset() this.$refs.addTicket.dialogTableVisible = true;
}, },
// 表单重置 deleteTicket(row){
reset() { console.log('表格行数据',row)
this.form = { this.$confirm(`确认要废弃工单${row.title}吗?`, {
id: null, confirmButtonText: '确定',
ticketNo: null, cancelButtonText: '取消',
userId: null, showClose:false,
title: null, closeOnClickModal:false,
content: null, type: 'warning',
images: null, beforeClose: (action, instance, done) => {
status: null, if (action === 'confirm') {
createTime: null, instance.confirmButtonLoading = true;
completeTime: null, setTimeout(() => {
createBy: null, // todo 调用接口如果关机成功 调用done方法 否则不关闭弹窗
updateBy: null, done();
updateTime: null, // setTimeout(() => {
workUserId: null instance.confirmButtonLoading = false;
} // }, 300);
this.resetForm("form") }, 3000);
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNum = 1
this.getList()
},
/** 重置按钮操作 */
resetQuery() {
this.resetForm("queryForm")
this.handleQuery()
},
// 多选框选中数据
handleSelectionChange(selection) {
this.ids = selection.map(item => item.id)
this.single = selection.length!==1
this.multiple = !selection.length
},
/** 新增按钮操作 */
handleAdd() {
this.reset()
this.open = true
this.title = "添加工单主"
},
/** 修改按钮操作 */
handleUpdate(row) {
this.reset()
const id = row.id || this.ids
getTicket(id).then(response => {
this.form = response.data
this.open = true
this.title = "修改工单主"
})
},
/** 提交按钮 */
submitForm() {
this.$refs["form"].validate(valid => {
if (valid) {
if (this.form.id != null) {
updateTicket(this.form).then(response => {
this.$modal.msgSuccess("修改成功")
this.open = false
this.getList()
})
} else { } else {
addTicket(this.form).then(response => { done();
this.$modal.msgSuccess("新增成功")
this.open = false
this.getList()
})
} }
} }
})
},
/** 删除按钮操作 */
handleDelete(row) {
const ids = row.id || this.ids
this.$modal.confirm('是否确认删除工单主编号为"' + ids + '"的数据项?').then(function() {
return delTicket(ids)
}).then(() => { }).then(() => {
this.getList() //只有在废弃成功的情况下会走到这里
this.$modal.msgSuccess("删除成功") this.$message({
}).catch(() => {}) type: 'success',
message: '废弃成功!'
});
//调用接口 更新表格数据
}).catch(() => {
//取消关机
});
}
}, },
/** 导出按钮操作 */
handleExport() {
this.download('ticket/export', {
...this.queryParams
}, `ticket_${new Date().getTime()}.xlsx`)
}
}
} }
</script> </script>
<style lang="scss" scoped>
.ems-content-container{
display: flex;
padding:24px;
padding-right: 0;
.map-container{
flex:auto;
}
.zd-msg-container{
width: 500px;
padding: 24px;
.single-zd-name{
font-weight: 500;
line-height: 23px;
color: #FFBD00;
font-size: 16px;
margin-bottom: 24px;
}
.single-square-box-container{
height: 78px;
box-sizing: border-box;
margin-bottom: 10px;
}
.single-zd-info-container{
font-size: 12px;
margin-top: 10px;
color:#666666;
}
}
}
</style>

View File

@ -86,11 +86,11 @@ export default {
},{ },{
title:'装机功率', title:'装机功率',
value:'', value:'',
attr:'installedPower' attr:'installPower'
},{ },{
title:'装机容量', title:'装机容量',
value:'', value:'',
attr:'installedCap', attr:'installCapacity',
}] }]
} }
}, },