策略
This commit is contained in:
白菜
@ -212,3 +212,66 @@ export function configStrategy(data) {
|
||||
})
|
||||
}
|
||||
|
||||
//http://localhost:8089/strategy/temp/getTempNameList?strategyId=1&siteId=021_FXX_01
|
||||
//获取策略下的所有模板列表
|
||||
export function getTempNameList({siteId,strategyId}) {
|
||||
return request({
|
||||
url: `/strategy/temp/getTempNameList?siteId=${siteId}&strategyId=${strategyId}`,
|
||||
method: 'get',
|
||||
})
|
||||
}
|
||||
//获取模板详情
|
||||
///strategy/temp/list?templateId=1
|
||||
export function getStrategyTempDetail(templateId) {
|
||||
return request({
|
||||
url: `/strategy/temp/list?templateId=${templateId}`,
|
||||
method: 'get',
|
||||
})
|
||||
}
|
||||
//新增模板
|
||||
export function addStrategyTemp(data) {
|
||||
return request({
|
||||
url: `/strategy/temp`,
|
||||
method: 'post',
|
||||
data
|
||||
})
|
||||
}
|
||||
export function editStrategyTemp(data) {
|
||||
return request({
|
||||
url: `/strategy/temp`,
|
||||
method: 'put',
|
||||
data
|
||||
})
|
||||
}
|
||||
//http://localhost:8089/strategy/temp/{id}
|
||||
export function deleteStrategyTemp(id) {
|
||||
return request({
|
||||
url: `/strategy/temp/`+id,
|
||||
method: 'delete',
|
||||
})
|
||||
}
|
||||
|
||||
//http://localhost:8089/strategy/timeConfig/list?strategyId=1&siteId=021_FXX_01
|
||||
export function timeConfigList({siteId,strategyId}) {
|
||||
return request({
|
||||
url: `/strategy/timeConfig/list?siteId=${siteId}&strategyId=${strategyId}`,
|
||||
method: 'get',
|
||||
})
|
||||
}
|
||||
//保存时间配置
|
||||
// http://localhost:8089/strategy/timeConfig
|
||||
export function setTimeConfigList(data) {
|
||||
return request({
|
||||
url: `/strategy/timeConfig`,
|
||||
method: 'post',
|
||||
data
|
||||
})
|
||||
}
|
||||
// 策略曲线图
|
||||
//http://localhost:8089/strategy/curve/list?strategyId=1&siteId=021_FXX_01
|
||||
export function curveList({siteId,strategyId}) {
|
||||
return request({
|
||||
url: `/strategy/curve/list?siteId=${siteId}&strategyId=${strategyId}`,
|
||||
method: 'get',
|
||||
})
|
||||
}
|
||||
|
||||
@ -164,14 +164,14 @@ export const dzjk=[
|
||||
name: 'DzjkClpzClyx',
|
||||
meta: { title: '策略运行',breadcrumb: false,activeMenu: '/dzjk',activeSecondMenuName:'DzjkClpz'},
|
||||
},
|
||||
{
|
||||
path: 'xftg',
|
||||
component: () => import('@/views/ems/dzjk/clpz/xftg/index.vue'),
|
||||
hidden:true,
|
||||
breadcrumb: false,
|
||||
name: 'DzjkClpzXftg',
|
||||
meta: { title: '削峰填谷',breadcrumb: false,activeMenu: '/dzjk',activeSecondMenuName:'DzjkClpz'},
|
||||
}
|
||||
// {
|
||||
// path: 'xftg',
|
||||
// component: () => import('@/views/ems/dzjk/clpz/xftg/index.vue'),
|
||||
// hidden:true,
|
||||
// breadcrumb: false,
|
||||
// name: 'DzjkClpzXftg',
|
||||
// meta: { title: '削峰填谷',breadcrumb: false,activeMenu: '/dzjk',activeSecondMenuName:'DzjkClpz'},
|
||||
// }
|
||||
]
|
||||
}
|
||||
]
|
||||
|
||||
@ -13,6 +13,7 @@ const ems = {
|
||||
deviceTypeOptions:{'TCP':'TCP','RTU':'RTU'},//设备类型
|
||||
ticketStatusOptions:{0:'待处理', 1:'已处理', 2:'处理中'},//工单处理状态
|
||||
strategyStatusOptions:{'0':'未启用', 1:'已运行', 2:'已暂停', 3:'禁用', 4:'删除'},//策略状态
|
||||
chargeStatusOptions:{'1':'充电','2':'待机'},//冲放状态
|
||||
},
|
||||
mutations: {
|
||||
SET_ZD_LIST(state, list) {
|
||||
|
||||
@ -1,28 +1,31 @@
|
||||
|
||||
<template>
|
||||
<div v-loading="loading">
|
||||
<el-button type="primary" plain @click="settingStrategy" style="margin-bottom: 20px;">新增策略</el-button>
|
||||
<cl-container v-for="(item,index) in list" :key="index+'clContainer'" :info="item" class="contain" @update="init" @showSetting="settingStrategy(item)">
|
||||
<template v-slot:default>
|
||||
<div class="cl-items cl-items-main" @click="toDetail(item.mainStrategyId)">
|
||||
<div class="cl-header">主策略</div>
|
||||
<div class="cl-content" >
|
||||
<div class="cl-name">{{item.mainStrategyName}}</div>
|
||||
<template v-if="!showTemp">
|
||||
<el-button v-if="!showTemp" type="primary" plain @click="settingStrategy" style="margin-bottom: 20px;">新增策略</el-button>
|
||||
<cl-container v-for="(item,index) in list" :key="index+'clContainer'" :info="item" :hide-setting-btn="showTemp" class="contain" @update="init" @showSetting="settingStrategy(item)">
|
||||
<template v-slot:default>
|
||||
<div class="cl-items cl-items-main" @click="toDetail(item.mainStrategyId,item.mainStrategyName)">
|
||||
<div class="cl-header">主策略</div>
|
||||
<div class="cl-content" >
|
||||
<div class="cl-name">{{item.mainStrategyName}}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="cl-items" v-show="item.auxStrategyName" @click="toDetail(item.auxStrategyId)">
|
||||
<div class="cl-header">辅助策略</div>
|
||||
<div class="cl-content">
|
||||
<div class="cl-name">{{item.auxStrategyName}}</div>
|
||||
<div class="cl-items" v-show="item.auxStrategyName" @click="toDetail(item.auxStrategyId,item.auxStrategyName)">
|
||||
<div class="cl-header">辅助策略</div>
|
||||
<div class="cl-content">
|
||||
<div class="cl-name">{{item.auxStrategyName}}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</cl-container>
|
||||
<div v-if="list.length === 0">
|
||||
<el-empty :image-size="200" ></el-empty>
|
||||
</div>
|
||||
<setting ref="setting"/>
|
||||
</div>
|
||||
</template>
|
||||
</cl-container>
|
||||
<div v-if="list.length === 0">
|
||||
<el-empty :image-size="200" ></el-empty>
|
||||
</div>
|
||||
</template>
|
||||
<xftg ref="xftgTemp" v-else/>
|
||||
<setting ref="setting"/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
||||
@ -30,13 +33,17 @@
|
||||
import Setting from './../Setting.vue'
|
||||
import ClContainer from './../ClContainer.vue'
|
||||
import getQuerySiteId from '@/mixins/ems/getQuerySiteId'
|
||||
import Xftg from './../xftg/index.vue'
|
||||
import {strategyRunningList} from '@/api/ems/dzjk'
|
||||
export default {
|
||||
name:'DzjkClpzClyx',
|
||||
components:{ClContainer,Setting},
|
||||
components:{ClContainer,Setting,Xftg},
|
||||
mixins: [getQuerySiteId],
|
||||
data() {
|
||||
return {
|
||||
showTemp:false,
|
||||
updateStrategyId:'',
|
||||
updateStrategyName:'',
|
||||
loading:false,
|
||||
list:[],
|
||||
}
|
||||
@ -54,14 +61,20 @@ export default {
|
||||
strategyRunningList(this.siteId).then(response => {
|
||||
this.list =JSON.parse(JSON.stringify(response?.data || {}))
|
||||
}).finally(() => {this.loading=false})
|
||||
this.$nextTick(() => {
|
||||
// 每次切换站点 展示策略运行 清空策略配置的数据
|
||||
this.$refs['xftgTemp'] && this.$refs['xftgTemp'].changeSiteId()
|
||||
this.showTemp=false
|
||||
this.updateStrategyId=''
|
||||
this.updateStrategyName=''
|
||||
})
|
||||
},
|
||||
toDetail(id){
|
||||
id && this.$router.push({
|
||||
path:'/dzjk/clpz/xftg',
|
||||
query:{
|
||||
...this.$route.query,
|
||||
id
|
||||
}
|
||||
toDetail(id,name){
|
||||
this.updateStrategyId=id
|
||||
this.updateStrategyName = name
|
||||
this.showTemp = true
|
||||
this.$nextTick(() => {
|
||||
this.$refs['xftgTemp'].init()
|
||||
})
|
||||
}
|
||||
},
|
||||
|
||||
@ -1,19 +1,21 @@
|
||||
<template>
|
||||
<el-dialog :visible.sync="dialogTableVisible" class="ems-dialog" :title="mode === 'add'?'新增模板':`编辑${editTempName}` ">
|
||||
<el-dialog :visible.sync="dialogTableVisible" class="ems-dialog" :title="mode === 'add'?'新增模板':`编辑模板` ">
|
||||
<el-form ref="addTempForm" :model="formData" :rules="rules" size="medium" label-width="100px">
|
||||
<el-form-item label="模板名称" prop="tempName">
|
||||
<el-input v-model="formData.tempName" placeholder="请输入" clearable :style="{width: '100%'}">
|
||||
<el-form-item label="模板名称" prop="templateName">
|
||||
<el-input v-model="formData.templateName" placeholder="请输入" clearable :style="{width: '100%'}">
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="soc限制" prop="socStatus" required>
|
||||
<el-switch v-model="formData.socStatus"></el-switch>
|
||||
</el-form-item>
|
||||
<el-form-item label="soc下限" prop="min">
|
||||
<el-input v-model="formData.min" placeholder="请输入" clearable :style="{width: '100%'}"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="soc上限" prop="max">
|
||||
<el-input v-model="formData.max" placeholder="请输入" clearable :style="{width: '100%'}"></el-input>
|
||||
<el-form-item label="soc限制" prop="sdcLimit" required>
|
||||
<el-switch :active-value="1" :inactive-value="0" v-model="formData.sdcLimit"></el-switch>
|
||||
</el-form-item>
|
||||
<!-- <template v-if="formData.sdcLimit === 1">-->
|
||||
<el-form-item label="soc下限" prop="sdcDown">
|
||||
<el-input v-model="formData.sdcDown" placeholder="请输入" clearable :style="{width: '100%'}"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="soc上限" prop="sdcUp">
|
||||
<el-input v-model="formData.sdcUp" placeholder="请输入" clearable :style="{width: '100%'}"></el-input>
|
||||
</el-form-item>
|
||||
<!-- </template>-->
|
||||
</el-form>
|
||||
<el-button type="primary" size="mini" @click="addTime">新增</el-button>
|
||||
<!-- 新增时间段表单-->
|
||||
@ -38,17 +40,17 @@
|
||||
:picker-options="{
|
||||
start: '00:00',
|
||||
step: '01:00',
|
||||
end: '24:00',
|
||||
minTime: formInline.startTime
|
||||
end: '23:00',
|
||||
}">
|
||||
<!-- minTime: formInline.startTime-->
|
||||
</el-time-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="冲放功率" prop="cfgl">
|
||||
<el-input v-model="formInline.cfgl" placeholder="请输入"></el-input>
|
||||
<el-form-item label="冲放功率" prop="chargeDischargePower">
|
||||
<el-input v-model="formInline.chargeDischargePower" placeholder="请输入"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="充电状态" prop="powerStatus">
|
||||
<el-select v-model="formInline.powerStatus" placeholder="请选择">
|
||||
<el-option v-for="(item,index) in powerStatusOptions" :key="index+'powerStatusOptions'" :label="item.label" :value="item.value"></el-option>
|
||||
<el-form-item label="充电状态" prop="chargeStatus">
|
||||
<el-select v-model="formInline.chargeStatus" placeholder="请选择">
|
||||
<el-option v-for="(value,key) in chargeStatusOptions" :key="key+'chargeStatusOptions'" :label="value" :value="key"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
@ -72,14 +74,14 @@
|
||||
label="结束时间">
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="cfgl"
|
||||
prop="chargeDischargePower"
|
||||
label="充放功率（kW）">
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="powerStatus"
|
||||
prop="chargeStatus"
|
||||
label="充电状态">
|
||||
<template slot-scope="scope">
|
||||
{{scope.row.powerStatus === 1 ? '充电' :'放电'}}
|
||||
{{chargeStatusOptions[scope.row.chargeStatus]}}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
@ -103,50 +105,39 @@
|
||||
</el-dialog>
|
||||
</template>
|
||||
<script>
|
||||
import {mapState} from 'vuex'
|
||||
import {addStrategyTemp,editStrategyTemp,getStrategyTempDetail} from '@/api/ems/dzjk'
|
||||
export default {
|
||||
props:{
|
||||
mode:{
|
||||
type:String,
|
||||
default:"add"
|
||||
},
|
||||
editTempId:{
|
||||
type:Number,
|
||||
default:''
|
||||
},
|
||||
editTempName:{
|
||||
type:String,
|
||||
default:''
|
||||
}
|
||||
},
|
||||
inject:['$home'],
|
||||
data() {
|
||||
return {
|
||||
mode:'',
|
||||
editTempId:'',
|
||||
dialogTableVisible:false,
|
||||
formData: {
|
||||
tempName: '',
|
||||
socStatus: false,
|
||||
min: '',
|
||||
max: '',
|
||||
templateName: '',
|
||||
sdcLimit: false,
|
||||
sdcDown: '',
|
||||
sdcUp: '',
|
||||
},
|
||||
rules: {
|
||||
tempName: [{
|
||||
required: true,
|
||||
message: '请输入',
|
||||
trigger: 'blur'
|
||||
}],
|
||||
min: [{
|
||||
required: true,
|
||||
message: '请输入',
|
||||
trigger: 'blur'
|
||||
}],
|
||||
max: [{
|
||||
templateName: [{
|
||||
required: true,
|
||||
message: '请输入',
|
||||
trigger: 'blur'
|
||||
}],
|
||||
sdcDown: [
|
||||
{required: true,message: '请输入', trigger: 'blur'},
|
||||
{ pattern: /^(0|[1-9]\d*)(\.\d+)?$/, message: '请输入合法数字或小数' }
|
||||
],
|
||||
sdcUp: [
|
||||
{required: true,message: '请输入', trigger: 'blur'},
|
||||
{ pattern: /^(0|[1-9]\d*)(\.\d+)?$/, message: '请输入合法数字或小数' }
|
||||
],
|
||||
},
|
||||
showAddTime: false,
|
||||
formInline:{
|
||||
startTime:'',endTime:'',cfgl:'',powerStatus:1
|
||||
startTime:'',endTime:'',chargeDischargePower:'',chargeStatus:''
|
||||
},
|
||||
formInlineRule:{
|
||||
startTime: [{
|
||||
@ -159,17 +150,28 @@ export default {
|
||||
message: '请选择结束时间',
|
||||
trigger: 'change'
|
||||
}],
|
||||
cfgl: [{
|
||||
chargeDischargePower: [{
|
||||
required: true,
|
||||
message: '请输入冲放功率',
|
||||
trigger: 'blur'
|
||||
},
|
||||
{ pattern: /^(0|[1-9]\d*)(\.\d+)?$/, message: '请输入合法数字或小数' }
|
||||
],
|
||||
chargeStatus:[{
|
||||
required: true,
|
||||
message: '请输入冲放功率',
|
||||
trigger: 'blur'
|
||||
}],
|
||||
message: '请选择充放状态',
|
||||
trigger: ['blur','change']
|
||||
}
|
||||
]
|
||||
},
|
||||
tableData:[],
|
||||
powerStatusOptions:[{label:'充电',value:1},{label:'放电',value:2}],
|
||||
}
|
||||
},
|
||||
computed: {},
|
||||
computed: {
|
||||
...mapState({
|
||||
chargeStatusOptions: state => state?.ems?.chargeStatusOptions || {},
|
||||
})
|
||||
},
|
||||
watch: {
|
||||
"formInline.startTime":{
|
||||
handler(newVal,oldVal){
|
||||
@ -182,18 +184,61 @@ export default {
|
||||
}
|
||||
},
|
||||
deep:true
|
||||
}
|
||||
},
|
||||
},
|
||||
created() {},
|
||||
mounted() {},
|
||||
methods: {
|
||||
changeSiteId(){
|
||||
this.dialogTableVisible=false
|
||||
this.mode=''
|
||||
this.editTempId=''
|
||||
this.formData={
|
||||
templateName: '',
|
||||
sdcLimit: false,
|
||||
sdcDown: '',
|
||||
sdcUp: '',
|
||||
}
|
||||
this.formInline={
|
||||
startTime:'',endTime:'',chargeDischargePower:'',chargeStatus:''
|
||||
}
|
||||
this.showAddTime = false
|
||||
this.tableData=[]
|
||||
},
|
||||
show({mode = 'add', editTempId = ''}){
|
||||
this.$nextTick(() => {
|
||||
this.dialogTableVisible = true
|
||||
this.mode = mode
|
||||
this.editTempId=editTempId
|
||||
if(mode === 'edit' && editTempId){
|
||||
getStrategyTempDetail(this.editTempId).then(response => {
|
||||
const data=JSON.parse(JSON.stringify(response?.data || []));
|
||||
if(data.length>0){
|
||||
const {templateName,sdcLimit,sdcDown,sdcUp} =JSON.parse(JSON.stringify( data[0]));
|
||||
this.formData.templateName=templateName
|
||||
this.formData.sdcLimit=sdcLimit
|
||||
this.formData.sdcDown=sdcDown
|
||||
this.formData.sdcUp=sdcUp
|
||||
}
|
||||
if(data.length === 1){
|
||||
const {startTime,endTime}=data;
|
||||
if(!startTime || !endTime){
|
||||
this.tableData = []
|
||||
}else{
|
||||
this.tableData= data
|
||||
}
|
||||
}else{
|
||||
this.tableData= data
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
addTime(){
|
||||
this.showAddTime=true
|
||||
},
|
||||
cancelAddTime(){
|
||||
this.$refs.addTimeForm.resetFields()
|
||||
this.showAddTime=false
|
||||
this.formInline = {startTime:'',endTime:'',cfgl:'',powerStatus:1}
|
||||
this.formInline = {startTime:'',endTime:'',chargeDischargePower:'',chargeStatus:''}
|
||||
},
|
||||
saveTime(){
|
||||
//表单校验，校验成功，添加到tableData里
|
||||
@ -209,17 +254,36 @@ export default {
|
||||
saveDialog() {
|
||||
this.$refs.addTempForm.validate(valid => {
|
||||
if (!valid) return
|
||||
this.closeDialog()
|
||||
const {templateName,sdcLimit,sdcDown,sdcUp} = this.formData
|
||||
const {siteId,updateStrategyId} =this.$home
|
||||
const {tableData} = this
|
||||
if(this.mode==='edit'){
|
||||
editStrategyTemp({siteId,strategyId:updateStrategyId,templateId:this.editTempId,templateName,sdcLimit,sdcDown,sdcUp,timeConfigList:tableData}).then(response=>{
|
||||
if(response?.code === 200){
|
||||
this.closeDialog()
|
||||
this.$emit('update')
|
||||
this.$emit('updateTimeSetting')
|
||||
}
|
||||
})
|
||||
}else{
|
||||
addStrategyTemp({siteId,strategyId:updateStrategyId,templateName,sdcLimit,sdcDown,sdcUp,timeConfigList:tableData}).then(response=>{
|
||||
if(response?.code === 200){
|
||||
this.closeDialog()
|
||||
this.$emit('update')
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
})
|
||||
},
|
||||
closeDialog(){
|
||||
// 清空所有数据
|
||||
this.$refs.addTempForm.resetFields()
|
||||
this.formData={
|
||||
tempName: '',
|
||||
socStatus: false,
|
||||
min: '',
|
||||
max: '',
|
||||
templateName: '',
|
||||
sdcLimit:0,
|
||||
sdcDown: '',
|
||||
sdcUp: '',
|
||||
}
|
||||
this.tableData=[]
|
||||
this.cancelAddTime()
|
||||
@ -229,15 +293,3 @@ export default {
|
||||
}
|
||||
|
||||
</script>
|
||||
<style scoped>
|
||||
.ems-dialog{
|
||||
.el-dialog{
|
||||
max-width: 700px;
|
||||
}
|
||||
.add-time-form{
|
||||
.el-input{
|
||||
width: 220px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -12,32 +12,41 @@
|
||||
<script>
|
||||
import * as echarts from 'echarts'
|
||||
import resize from '@/mixins/ems/resize'
|
||||
|
||||
import {curveList} from '@/api/ems/dzjk'
|
||||
export default {
|
||||
inject:['$home'],
|
||||
mixins: [resize],
|
||||
data() {
|
||||
return {
|
||||
chart: null
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.$nextTick(() => {
|
||||
this.initChart()
|
||||
})
|
||||
},
|
||||
beforeDestroy() {
|
||||
if (!this.chart) {
|
||||
return
|
||||
}
|
||||
this.chart.dispose()
|
||||
this.chart = null
|
||||
this.destoryChart()
|
||||
},
|
||||
methods: {
|
||||
initChart() {
|
||||
this.chart = echarts.init(document.querySelector('#tempChart'))
|
||||
this.setOptions()
|
||||
destoryChart(){
|
||||
if (!this.chart) {
|
||||
return
|
||||
}
|
||||
this.chart.dispose()
|
||||
this.chart = null
|
||||
},
|
||||
setOptions() {
|
||||
changeSiteId(){
|
||||
this.destoryChart()
|
||||
},
|
||||
init(){
|
||||
if(!this.chart){
|
||||
this.chart = echarts.init(document.getElementById('tempChart'))
|
||||
}
|
||||
const strategyId = this.$home.updateStrategyId
|
||||
const siteId=this.$home.siteId
|
||||
curveList({strategyId,siteId}).then(response => {
|
||||
this.setOption(response?.data || [])
|
||||
})
|
||||
},
|
||||
setOption(data) {
|
||||
if(!this.chart) return
|
||||
this.chart.setOption({
|
||||
color:['#FFBD00','#3C81FF'],
|
||||
legend: {
|
||||
|
||||
@ -4,104 +4,138 @@
|
||||
<div slot="header">
|
||||
<span class="card-title">新增模板</span>
|
||||
<div style="float: right; padding: 3px 0">
|
||||
<el-button type="primary" size="mini" @click="handlerType = 'add';$refs.addTemplate.dialogTableVisible=true">新增</el-button>
|
||||
<el-button type="warning" size="mini" @click="handlerType = 'edit';$refs.addTemplate.dialogTableVisible=true">编辑</el-button>
|
||||
<el-button type="text" size="mini" @click="back">返回策略运行</el-button>
|
||||
<el-button type="primary" size="mini" @click="addTemp">新增</el-button>
|
||||
<el-button type="warning" size="mini" @click="editTemp">编辑</el-button>
|
||||
<el-button type="primary" class="alarm-btn" size="mini" @click="deleteTemp">删除</el-button>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<el-button-group class="ems-btns-group">
|
||||
<el-button v-for="(item,index) in tempList" :key="index+'tempList'" :class="{'activeBtn' : activeBtn === item.id}" type="small" @click="changeTemp(item.id)">{{item.name}}</el-button>
|
||||
</el-button-group>
|
||||
<el-table
|
||||
:data="tableData"
|
||||
:span-method="tableSpanFilter"
|
||||
border
|
||||
style="width: 100%;margin-top:25px;">
|
||||
<!-- todo 如果要在span-method中使用column.property 在表格中必须定义prop="xxx"属性-->
|
||||
<el-table-column
|
||||
prop="name"
|
||||
label="模板名称"
|
||||
width="180">
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="status"
|
||||
label="SOC限制">
|
||||
<template slot-scope="scope">
|
||||
<el-switch
|
||||
:value="scope.row.status === 1"
|
||||
disabled>
|
||||
</el-switch>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="min"
|
||||
label="SOC下限">
|
||||
<template slot-scope="scope">
|
||||
{{scope.row.min}}%
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="max"
|
||||
label="SOC上限">
|
||||
<template slot-scope="scope">
|
||||
{{scope.row.max}}%
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="startTime"
|
||||
label="开始时间">
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="endTime"
|
||||
label="结束时间">
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="cfgl"
|
||||
label="充放功率（kW）">
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="powerStatus"
|
||||
label="充电状态">
|
||||
</el-table-column>
|
||||
<template v-if="tempList.length>0">
|
||||
<el-button-group class="ems-btns-group">
|
||||
<el-button v-for="(item,index) in tempList" :key="index+'tempList'" :class="{'activeBtn' : activeBtn === item.templateId}" size="small" @click="changeTemp(item.templateId)">{{item.templateName}}</el-button>
|
||||
</el-button-group>
|
||||
<el-table
|
||||
:data="tableData"
|
||||
:span-method="tableSpanFilter"
|
||||
border
|
||||
style="width: 100%;margin-top:25px;">
|
||||
<!-- todo 如果要在span-method中使用column.property 在表格中必须定义prop="xxx"属性-->
|
||||
<el-table-column
|
||||
prop="templateName"
|
||||
label="模板名称"
|
||||
width="180">
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="sdcLimit"
|
||||
label="SOC限制">
|
||||
<template slot-scope="scope">
|
||||
<el-switch disabled :active-value="1" :inactive-value="0" v-model="scope.row.sdcLimit"></el-switch>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="sdcDown"
|
||||
label="SOC下限">
|
||||
<template slot-scope="scope">
|
||||
{{scope.row.sdcDown ? scope.row. sdcDown + '%' : '-'}}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="sdcUp"
|
||||
label="SOC上限">
|
||||
<template slot-scope="scope">
|
||||
{{scope.row.sdcUp ? scope.row.sdcUp + '%' : '-'}}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="startTime"
|
||||
label="开始时间">
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="endTime"
|
||||
label="结束时间">
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="chargeDischargePower"
|
||||
label="充放功率（kW）">
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="chargeStatus"
|
||||
label="充电状态">
|
||||
<template slot-scope="scope">
|
||||
{{chargeStatusOptions[scope.row.chargeStatus]}}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
</el-table>
|
||||
</el-table>
|
||||
</template>
|
||||
<template v-else>
|
||||
<el-empty :image-size="150"></el-empty>
|
||||
</template>
|
||||
</div>
|
||||
<add-template ref="addTemplate" :mode="handlerType" :edit-temp-id="activeTempData.id" :edit-temp-name="activeTempData.name"/>
|
||||
<add-template ref="addTemplate" :mode="handlerType" :editTempId="activeBtn" @update="init" @updateTimeSetting="$emit('updateTimeSetting')"/>
|
||||
</el-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {mapState} from 'vuex'
|
||||
import AddTemplate from "./AddTemplate.vue";
|
||||
import {getTempNameList, getStrategyTempDetail, deleteStrategyTemp} from '@/api/ems/dzjk'
|
||||
export default {
|
||||
components: {AddTemplate},
|
||||
inject:['$home'],
|
||||
data() {
|
||||
return {
|
||||
handlerType:'',
|
||||
activeBtn:1,
|
||||
tempList:[
|
||||
{name:'模板1',id:1},
|
||||
{name:'模板2',id:2},
|
||||
{name:'模板3',id:3},
|
||||
],
|
||||
tableData:[
|
||||
{name:'模板一',status:1,min:10,max:90,startTime:'2023/05/07',endTime:'2030/05/07',cfgl:100,powerStatus:'充电'},
|
||||
{name:'模板一',status:1,min:10,max:90,startTime:'2024/06/07',endTime:'2030/05/07',cfgl:110,powerStatus:'充电'},
|
||||
{name:'模板一',status:1,min:10,max:90,startTime:'2023/07/07',endTime:'2030/05/07',cfgl:120,powerStatus:'充电'},
|
||||
{name:'模板一',status:1,min:10,max:90,startTime:'2023/08/07',endTime:'2030/05/07',cfgl:130,powerStatus:'充电'},
|
||||
{name:'模板一',status:1,min:10,max:90,startTime:'2023/09/07',endTime:'2030/05/07',cfgl:140,powerStatus:'充电'},
|
||||
],
|
||||
mixinPrototype:['name','status','min','max']
|
||||
activeBtn:'',
|
||||
tempList:[],
|
||||
tableData:[],
|
||||
mixinPrototype:['templateName','sdcLimit','sdcDown','sdcUp']
|
||||
}
|
||||
},
|
||||
computed:{
|
||||
...mapState({
|
||||
chargeStatusOptions: state => state?.ems?.chargeStatusOptions || {},
|
||||
}),
|
||||
activeTempData(){
|
||||
return this.tempList.find(item=>item.id === this.activeBtn)
|
||||
return this.tempList.find(item=>item.templateId === this.activeBtn) || {}
|
||||
}
|
||||
},
|
||||
methods:{
|
||||
back(){
|
||||
this.$home.init()
|
||||
},
|
||||
changeSiteId(){
|
||||
this.tempList=[]
|
||||
this.tableData=[]
|
||||
this.handlerType=''
|
||||
this.activeBtn=''
|
||||
this.$refs.addTemplate && this.$refs.addTemplate.changeSiteId()
|
||||
},
|
||||
addTemp(){
|
||||
this.$refs.addTemplate.show({mode:'add',editTempId:''})
|
||||
},
|
||||
editTemp(){
|
||||
this.$refs.addTemplate.show({mode:'edit',editTempId:this.activeBtn})
|
||||
},
|
||||
init(){
|
||||
getTempNameList({strategyId:this.$home.updateStrategyId,siteId:this.$home.siteId}).then(response => {
|
||||
const data = response?.data || [];
|
||||
this.tempList =data
|
||||
if(data.length ===0 && this.activeBtn){
|
||||
this.activeBtn=''
|
||||
}else if(!this.activeBtn && data.length>0){
|
||||
this.activeBtn =data[0].templateId
|
||||
}else if(this.activeBtn && data.length>0 && !data.find(item=>item.templateId === this.activeBtn)){
|
||||
this.activeBtn =data[0].templateId
|
||||
}
|
||||
this.activeBtn && getStrategyTempDetail(this.activeBtn).then(response => {
|
||||
this.tableData=response?.data || [];
|
||||
})
|
||||
})
|
||||
},
|
||||
deleteTemp(){
|
||||
this.$confirm(`确认要删除${this.activeTempData.name}吗?`, {
|
||||
this.$confirm(`确认要删除${this.activeTempData.templateName}吗?`, {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
showClose:false,
|
||||
@ -110,31 +144,35 @@ export default {
|
||||
beforeClose: (action, instance, done) => {
|
||||
if (action === 'confirm') {
|
||||
instance.confirmButtonLoading = true;
|
||||
setTimeout(() => {
|
||||
// todo 调用接口如果关机成功 调用done方法 否则不关闭弹窗
|
||||
done();
|
||||
// setTimeout(() => {
|
||||
deleteStrategyTemp(this.activeBtn).then(response => {
|
||||
if(response?.code === 200){
|
||||
//删除成功
|
||||
done();
|
||||
}
|
||||
}).finally(() => {
|
||||
instance.confirmButtonLoading = false;
|
||||
// }, 300);
|
||||
}, 3000);
|
||||
})
|
||||
} else {
|
||||
done();
|
||||
}
|
||||
}
|
||||
}).then(() => {
|
||||
//只有在故障复位成功的情况下会走到这里
|
||||
//只有删除成功的情况下会走到这里
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: '删除成功!'
|
||||
});
|
||||
this.init()
|
||||
this.$emit('updateTimeSetting')
|
||||
}).catch(() => {
|
||||
//取消复位
|
||||
//取消
|
||||
});
|
||||
},
|
||||
changeTemp(id){
|
||||
changeTemp(id=''){
|
||||
//切换模板 更新数据
|
||||
if(id !== this.activeBtn){
|
||||
this.activeBtn=id;
|
||||
this.init()
|
||||
}
|
||||
},
|
||||
tableSpanFilter({ row, column, rowIndex, columnIndex }){
|
||||
@ -152,8 +190,5 @@ export default {
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted(){
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@ -2,30 +2,112 @@
|
||||
<template>
|
||||
<el-card shadow="always" class="common-card-container" style="margin-top:25px;">
|
||||
<div slot="header">
|
||||
<span class="card-title">策略配置：削峰填谷</span>
|
||||
<span class="card-title">策略配置：{{$home.updateStrategyName}}</span>
|
||||
<div style="float: right; padding: 3px 0">
|
||||
<el-button type="warning" size="mini">编辑</el-button>
|
||||
<el-button type="warning" size="mini" @click="changeEditStatus">{{edit?'保存':'编辑'}}</el-button>
|
||||
<el-button type="default" size="mini" @click="cancelChange" v-show="edit === true">取消</el-button>
|
||||
</div>
|
||||
</div>
|
||||
<el-form :inline="true" class="select-container">
|
||||
<el-form-item label="时间配置">
|
||||
<el-select v-model="timeType" placeholder="请选择" :loading="loading" loading-text="正在加载数据">
|
||||
<el-option :label="item.name" :value="item.id" v-for="(item,index) in timeOptions" :key="index+'timeOptions'"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div style="padding:0 6px 12px 6px;">
|
||||
<div class="cl-items" v-for="item in 12" :key="item+'lclf'">
|
||||
<div class="cl-header">{{item}}月</div>
|
||||
<div class="cl-items" v-for="(item,index) in tableData" :key="index+'lclf'">
|
||||
<div class="cl-header">{{item.month}}月</div>
|
||||
<div class="cl-content">
|
||||
<div class="cl-name">两放两冲</div>
|
||||
<div class="cl-name" v-if="!edit">
|
||||
{{item.templateName || '-'}}
|
||||
</div>
|
||||
<template v-else>
|
||||
<el-select v-model="tableData[index].templateId" :disabled="!edit" class="temp-select" placeholder="请选择" clearable size="mini">
|
||||
<el-option
|
||||
v-for="(item,index) in tempList"
|
||||
:key="index+'sjpz'"
|
||||
:label="item.templateName"
|
||||
:value="item.templateId">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</el-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {timeConfigList, getTempNameList,setTimeConfigList} from '@/api/ems/dzjk'
|
||||
export default {
|
||||
inject:['$home'],
|
||||
data() {
|
||||
return {
|
||||
edit:false,
|
||||
loading:false,
|
||||
tableData:[],
|
||||
tempList:[]
|
||||
}
|
||||
},
|
||||
methods:{
|
||||
changeSiteId(){
|
||||
this.tableData=[]
|
||||
this.tempList=[]
|
||||
this.edit = false
|
||||
},
|
||||
init(){
|
||||
this.getTimeConfigList()
|
||||
},
|
||||
getTempList(){
|
||||
const strategyId = this.$home.updateStrategyId
|
||||
const siteId=this.$home.siteId
|
||||
getTempNameList({strategyId,siteId}).then(response => {
|
||||
this.tempList =response?.data || [];
|
||||
})
|
||||
},
|
||||
getTimeConfigList(){
|
||||
const strategyId = this.$home.updateStrategyId
|
||||
const siteId=this.$home.siteId
|
||||
return timeConfigList({strategyId,siteId}).then(response => {
|
||||
const data = JSON.parse(JSON.stringify(response?.data || []))
|
||||
if(data.length === 0){
|
||||
for(var i=1;i<=12;i++){
|
||||
data.push({
|
||||
month:i,
|
||||
strategyId,
|
||||
siteId,
|
||||
templateId:'',
|
||||
templateName:''
|
||||
})
|
||||
}
|
||||
}
|
||||
this.tableData=data
|
||||
})
|
||||
},
|
||||
cancelChange(){
|
||||
this.edit =false
|
||||
this.getTimeConfigList()
|
||||
},
|
||||
changeEditStatus(){
|
||||
//当前状态是编辑状态
|
||||
if(this.edit){
|
||||
console.log('this.tableData',this.tableData)
|
||||
const strategyId = this.$home.updateStrategyId
|
||||
const siteId=this.$home.siteId
|
||||
this.tableData.forEach(item=>{
|
||||
item.siteId=siteId
|
||||
item.strategyId=strategyId
|
||||
item.templateName = (this.tempList.find(temp=>temp.templateId===item.templateId) || {}).templateName || ''
|
||||
})
|
||||
setTimeConfigList(this.tableData).then(response => {
|
||||
if(response?.code === 200){
|
||||
//更改成功 调用接口更新数据
|
||||
this.getTimeConfigList()
|
||||
this.edit=false;
|
||||
}
|
||||
})
|
||||
}else{
|
||||
this.edit=true;
|
||||
this.getTempList()
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped lang="scss">
|
||||
.cl-items{
|
||||
width: 144px;
|
||||
@ -40,14 +122,14 @@
|
||||
background: #FFE5AC;
|
||||
text-align: center;
|
||||
font-size:16px;
|
||||
line-height: 40px;
|
||||
height: 40px;
|
||||
line-height: 30px;
|
||||
height: 30px;
|
||||
width: 100%;
|
||||
}
|
||||
.cl-content{
|
||||
background-color: #ffffff;
|
||||
position: relative;
|
||||
height: 48px;
|
||||
height: 58px;
|
||||
width: 100%;
|
||||
.cl-name{
|
||||
position: absolute;
|
||||
@ -55,26 +137,13 @@
|
||||
left:50%;
|
||||
transform: translate(-50%,-50%);
|
||||
}
|
||||
.temp-select{
|
||||
width: 90%;
|
||||
position: absolute;
|
||||
top:50%;
|
||||
left:50%;
|
||||
transform: translate(-50%,-50%);
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
loading:false,
|
||||
timeType:1,
|
||||
timeOptions:[
|
||||
{name:'按日',id:1},
|
||||
{name:'按月',id:2},
|
||||
{name:'按年',id:3},
|
||||
]
|
||||
}
|
||||
},
|
||||
methods:{
|
||||
},
|
||||
mounted(){
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@ -1,12 +1,14 @@
|
||||
|
||||
<template>
|
||||
<cl-container :hideSettingBtn="true">
|
||||
<template v-slot:default>
|
||||
<temp-table/>
|
||||
<time-setting/>
|
||||
<temp-power-chart/>
|
||||
</template>
|
||||
</cl-container>
|
||||
<!-- <cl-container :hideSettingBtn="true">-->
|
||||
<!-- <template v-slot:default>-->
|
||||
<div>
|
||||
<temp-table ref="tempTable" @updateTimeSetting="updateTimeSetting"/>
|
||||
<time-setting ref="timeSetting"/>
|
||||
<temp-power-chart ref="tomePowerChart"/>
|
||||
</div>
|
||||
<!-- </template>-->
|
||||
<!-- </cl-container>-->
|
||||
</template>
|
||||
|
||||
|
||||
@ -24,6 +26,25 @@ export default {
|
||||
}
|
||||
},
|
||||
methods:{
|
||||
init(){
|
||||
this.$nextTick(() => {
|
||||
this.$refs.tempTable.init()
|
||||
this.$refs.timeSetting.init()
|
||||
this.$refs.tomePowerChart.init()
|
||||
})
|
||||
},
|
||||
changeSiteId(){
|
||||
this.$nextTick(() => {
|
||||
this.$refs.tempTable.changeSiteId()
|
||||
this.$refs.timeSetting.changeSiteId()
|
||||
this.$refs.tomePowerChart.changeSiteId()
|
||||
})
|
||||
},
|
||||
//在编辑、删除模板后更新时间配置、echart的数据？todo
|
||||
updateTimeSetting(){
|
||||
this.$refs.timeSetting.init()
|
||||
this.$refs.tomePowerChart.init()
|
||||
}
|
||||
},
|
||||
mounted(){
|
||||
|
||||
|
||||
Reference in New Issue
Block a user