策略
This commit is contained in:
@ -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>
|
||||
|
||||
Reference in New Issue
Block a user