接口联调

This commit is contained in:
白菜
2025-06-30 17:32:04 +08:00
parent 37d2d9bde5
commit e42f1204ee
14 changed files with 441 additions and 109 deletions

View File

@ -54,3 +54,18 @@ export function getClusterNameList(stackDeviceId) {
}) })
} }
//获取液冷列表数据
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'
})
}

View File

@ -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',

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
} }
@ -49,11 +49,11 @@ import {mapGetters} from "vuex"
this.$emit('submitSite',this.id) this.$emit('submitSite',this.id)
}, },
setDefaultSite(){ setDefaultSite(){
const defaultSite = parseInt(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

@ -1,6 +1,13 @@
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':'停止'},//工作模式
}, },
mutations: { mutations: {
SET_ZD_LIST(state, list) { SET_ZD_LIST(state, list) {

View File

@ -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

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">

View File

@ -1,46 +1,47 @@
<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="info.emsCommunicationStatus === '0' ? 'cnb-common-card-container' : 'zb-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[info.emsCommunicationStatus]}}</div>
<div>数据更新时间2024-10-11 12:00:00</div> <div>数据更新时间{{info.dataUpdateTime}}</div>
</div> </div>
</div> </div>
<el-table <el-table
class="common-table" class="common-table"
:data="zbTableData" :data="info.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 cnb-common-card-container">
<div slot="header"> <div slot="header">
<span class="large-title">2#储能表</span> <span class="large-title">2#储能表</span>
@ -86,26 +87,31 @@
<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}, info:{},
{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},
],
cnbTableData:[ 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},
{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 => {
// todo 返回数据等待确认,是数组吗?
this.info =JSON.parse(JSON.stringify(response?.data[0] || {}));
}).finally(() => {this.loading = false})
}
}, },
mounted(){ mounted(){

View File

@ -23,14 +23,51 @@
<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="id"
label="单体编号">
</el-table-column>
<el-table-column
prop="dianya"
label="电压V"
>
</el-table-column>
<el-table-column
prop="wendu"
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
background
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="pageNum"
:page-sizes="[10, 20, 30, 40]"
:page-size="pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="totalSize">
</el-pagination>
</el-card> </el-card>
</template> </template>
@ -49,10 +86,28 @@ 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:[],
currentPage:1,
pageSize:10,//分页栏当前每个数据总数
pageNum:1,//分页栏当前页数
totalSize:1000,//table表格数据总数
} }
}, },
methods:{ methods:{
// 分页
handleSizeChange(val) {
this.pageSize = val;
this.$nextTick(()=>{
this.init(false)
})
},
handleCurrentChange(val) {
this.pageNum = val
this.$nextTick(()=>{
this.init(false)
})
},
// 搜索 // 搜索
onSearch(){ onSearch(){
this.init(false) this.init(false)
@ -87,7 +142,7 @@ export default {
this.loading=true; this.loading=true;
// todo 获取单体电池数据 // todo 获取单体电池数据
this.loading=false; this.loading=false;
this.$refs.barChart.setOption() // this.$refs.barChart.setOption()
// 只有页面初次加载或切换站点的时候调用电池堆列表,其他情况不需要 // 只有页面初次加载或切换站点的时候调用电池堆列表,其他情况不需要
if(mounted){ if(mounted){
this.search={stackId:'',clusterId:''}//保证切换站点时,清空选择项 this.search={stackId:'',clusterId:''}//保证切换站点时,清空选择项

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

@ -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

@ -0,0 +1,158 @@
<template>
<div class="ems-dashboard-editor-container" style="background-color: #ffffff" v-loading="loading">
<el-button type="primary" @click="addTicket" native-type="button">新增</el-button>
<el-table
class="common-table"
:data="tableData"
stripe
max-height="500px"
style="width: 100%;margin-top: 25px">
<el-table-column
prop="gdh"
label="工单号">
</el-table-column>
<el-table-column
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">
<el-button
@click="editTicket(scope.row.gdh)"
type="warning"
size="mini">
编辑
</el-button>
<el-button
@click="deleteTicket(scope.row)"
type="danger"
size="small">
废弃
</el-button>
</template>
</el-table-column>
</el-table>
<add-ticket ref="addTicket" :mode="mode"/>
</div>
</template>
<script>
// import {getSingleSiteBaseInfo} from '@/api/ems/zddt'
import AddTicket from './AddTicket.vue'
export default {
name: "Ticket",
components: {AddTicket},
data() {
return {
mode:'',//新增、修改工单
editTicketId:'',
loading:false,
tableData:[
{gdh:'0001',title:'工单一',question:'问题描述问题描述问题描述问题描述问题描述问题描述问题描述问题描述问题描述问题描述问题描述问题描述问题描述',handleStatus:'处理完成',submitName:'张三',handleName:'李四',submitTime:'2025/06/20'}
]
}
},
methods:{
addTicket(){
this.mode = 'add';
this.$refs.addTicket.dialogTableVisible = true;
},
editTicket(id){
this.mode = 'add';
this.editTicketId = id
this.$refs.addTicket.dialogTableVisible = true;
},
deleteTicket(row){
console.log('表格行数据',row)
this.$confirm(`确认要废弃工单${row.title}吗?`, {
confirmButtonText: '确定',
cancelButtonText: '取消',
showClose:false,
closeOnClickModal:false,
type: 'warning',
beforeClose: (action, instance, done) => {
if (action === 'confirm') {
instance.confirmButtonLoading = true;
setTimeout(() => {
// todo 调用接口如果关机成功 调用done方法 否则不关闭弹窗
done();
// setTimeout(() => {
instance.confirmButtonLoading = false;
// }, 300);
}, 3000);
} else {
done();
}
}
}).then(() => {
//只有在废弃成功的情况下会走到这里
this.$message({
type: 'success',
message: '废弃成功!'
});
//调用接口 更新表格数据
}).catch(() => {
//取消关机
});
}
},
}
</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',
}] }]
} }
}, },