策略运行

src/api/ems/dzjk.js

@@ -183,16 +183,16 @@ export function strategyRunningList(siteId) {
   })
 }
 //停止策略
-export function stopStrategyRunning(siteId) {
+export function stopStrategyRunning(id) {
   return request({
-    url: `/system/strategyRunning/stop?siteId=${siteId}`,
+    url: `/system/strategyRunning/stop?id=${id}`,
     method: 'get'
   })
 }
 // 获取所有主策略
-export function getMainStrategyList(siteId) {
+export function getMainStrategyList() {
   return request({
-    url: `/system/strategyRunning/getMainStrategyList?siteId=${siteId}`,
+    url: `/system/strategyRunning/getMainStrategyList`,
     method: 'get'
   })
 }
@@ -211,3 +211,4 @@ export function configStrategy(data) {
     data
   })
 }
+

src/router/ems.js

@@ -167,6 +167,8 @@ export const dzjk=[
               {
                 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'},
               }

src/views/ems/dzjk/clpz/ClContainer.vue

@@ -1,32 +1,41 @@
 <template>
   <el-container class="clyx-container">
     <el-header class="clyx-header">
-      <div class="clyx-title">策略状态：<span class="clyx-status save">已运行</span></div>
+      <div class="clyx-title">策略状态：<span class="clyx-status save">{{strategyStatusOptions[info.status]}}</span></div>
       <div class="clyx-btns">
-        <el-button v-if="!hideSettingBtn" size="small" @click="$refs.setting.dialogFormVisible = true">配置</el-button>
+        <el-button v-if="!hideSettingBtn" size="small" @click="$emit('showSetting')">配置</el-button>
-        <el-button type="warning" class="alarm-btn" size="small" @click='close'>停止策略</el-button>
+        <el-button v-if="info.status === '1'" type="warning" class="alarm-btn" size="small" @click='close'>停止策略</el-button>
       </div>
     </el-header>
     <el-main class="clyx-main">
       <slot name="default"></slot>
-      <setting ref="setting"/>
     </el-main>
   </el-container>
 </template>
 
 <script>
-import Setting from './Setting.vue'
+import {mapState} from "vuex";
+import {stopStrategyRunning} from '@/api/ems/dzjk'
 export default {
   name:'DzjkClpzClContainer',
-  components:{Setting},
   props:{
     hideSettingBtn:{
       type:Boolean,
       default:false
+    },
+    info:{
+      type:Object,
+      default:()=>{return {}},
     }
   },
+  computed:{
+    ...mapState({
+        strategyStatusOptions: state => state.ems.strategyStatusOptions,
+      })
+  },
   data() {
     return {
+      loading:true
     }
   },
   methods:{
@@ -40,13 +49,13 @@ export default {
         beforeClose: (action, instance, done) => {
           if (action === 'confirm') {
             instance.confirmButtonLoading = true;
-            setTimeout(() => {
+            this.loading = true
-              // todo 调用接口如果关机成功 调用done方法 否则不关闭弹窗
+            stopStrategyRunning(this.info.id).then(response => {
-              done();
+              response.code === 200 && done();
-              // setTimeout(() => {
+            }).finally(() => {
+              this.loading = false
               instance.confirmButtonLoading = false;
-              // }, 300);
+            })
-            }, 3000);
           } else {
             done();
           }
@@ -57,6 +66,7 @@ export default {
           type: 'success',
           message: '停止策略成功!'
         });
+        this.$emit('update')
       }).catch(() => {
         //取消复位
       });

src/views/ems/dzjk/clpz/Setting.vue

@@ -4,58 +4,99 @@
     custom-class="ems-dialog"
     :visible.sync="dialogFormVisible"
     width="420px"
+    destroy-on-close
+    lock-scroll
+    append-to-body
     :close-on-click-modal="false"
     :close-on-press-escape="false"
     @close="cancel"
   >
-    <el-form :model="form" label-width="100px">
+    <el-form ref="form" :model="form" :rules='rule' label-width="100px" v-loading="loading > 0">
-      <el-form-item label="主策略">
+      <el-form-item label="主策略" prop="mainStrategyId">
-        <el-select v-model="form.main" placeholder="请选择">
+        <el-select v-model="form.mainStrategyId" placeholder="请选择">
-          <el-option label="主策略一" value="1"></el-option>
+          <el-option :label="item.strategyName" :value="item.id" v-for="(item,index) in mainStrategyList" :key="index+'mainStrategyList'"></el-option>
-          <el-option label="主策略二" value="2"></el-option>
         </el-select>
       </el-form-item>
-      <el-form-item label="辅助策略">
+      <el-form-item label="辅助策略" prop="auxStrategyId">
-        <el-select v-model="form.assis" placeholder="请选择">
+        <el-select v-model="form.auxStrategyId" placeholder="请选择" clearable>
-          <el-option label="辅助策略一" value="1"></el-option>
+          <el-option :label="item.strategyName" :value="item.id" v-for="(item,index) in auxStrategyList" :key="index+'auxStrategyList'"></el-option>
-          <el-option label="辅助策略二" value="2"></el-option>
         </el-select>
       </el-form-item>
     </el-form>
     <div slot="footer" class="dialog-footer">
-      <el-button @click="dialogFormVisible=false">取 消</el-button>
+      <el-button @click="cancel">取 消</el-button>
-      <el-button type="primary" :loading="loading" @click="sure">确 定</el-button>
+      <el-button type="primary" :loading="loading > 0" @click="sure">确 定</el-button>
     </div>
   </el-dialog>
 </template>
 
 <script>
+import {getMainStrategyList, getAuxStrategyList, configStrategy} from '@/api/ems/dzjk'
 export default {
+  inject:['$home'],
   data(){
     return {
-      loading:false,
+      info:{},
+      loading:0,
       dialogFormVisible:false,
+      mainStrategyList:[],
+      auxStrategyList:[],
       form:{
-        main:'',
+        mainStrategyId:'',
-        assis:''
+        auxStrategyId:''
+      },
+      rule:{
+        mainStrategyId:[
+          { required: true, message: '请选择主策略', trigger: ['blur','change'] },
+        ]
       }
     }
   },
   methods:{
+    showSettingDialog(item){
+      console.log('打开弹窗',item)
+      this.dialogFormVisible = true
+      this.info = item || {}
+      const {auxStrategyId = '',mainStrategyId = ''} = item
+      this.form.auxStrategyId=auxStrategyId
+      this.form.mainStrategyId=mainStrategyId
+      this.init()
+    },
+    init(){
+      this.loading+=2
+      this.mainStrategyList=[]
+      this.auxStrategyList=[]
+      getMainStrategyList().then(response => {
+        this.mainStrategyList=response?.data || []
+      }).finally(()=>{this.loading-=1})
+      getAuxStrategyList().then(response => {
+        this.auxStrategyList=response?.data || []
+      }).finally(()=>{this.loading-=1})
+    },
     cancel(){
-      this.form.main='';
+      this.$refs.form.resetFields()
-      this.form.assis='';
+      this.form={
+        mainStrategyId:'',
+        auxStrategyId:''
+      }
+      this.dialogFormVisible = false;
     },
     sure(){
-      if(this.form.main===''||this.form.assis===''){
+      this.$refs['form'].validate(valid => {
-        return this.$alert('请选择正确的策略');
+        if (!valid) return
-      }
+        console.log('this.$home',this.$home)
-      this.loading = true
+        this.loading +=1
-      setTimeout(()=>{
+        const {mainStrategyId='', auxStrategyId=''} = this.form
-        this.loading = false
+        configStrategy({mainStrategyId,auxiliaryStrategyId:auxStrategyId,siteId:this.$home.siteId,id:this.info?.id || ''}).then(response => {
-        //如果接口调用成功 关闭弹窗
+          if(response?.code === 200){
-        this.dialogFormVisible = false;
+            this.$home.init()
-      },3000)
+            this.cancel()
+          }
+        }).finally(()=>{
+          this.loading -=1
+        })
+      })
+
     }
   }
 }

src/views/ems/dzjk/clpz/clyx/index.vue

@@ -1,49 +1,81 @@
 
 <template>
- <cl-container>
+   <div v-loading="loading">
-   <template v-slot:default>
+     <el-button type="primary" plain @click="settingStrategy" style="margin-bottom: 20px;">新增策略</el-button>
-     <div class="cl-items cl-items-main">
+     <cl-container v-for="(item,index) in list" :key="index+'clContainer'" :info="item" class="contain" @update="init" @showSetting="settingStrategy(item)">
-       <div class="cl-header">主策略</div>
+       <template v-slot:default>
-       <div class="cl-content">
+         <div class="cl-items cl-items-main" @click="toDetail(item.mainStrategyId)">
-         <div class="cl-name">削峰填谷</div>
+           <div class="cl-header">主策略</div>
-       </div>
+           <div class="cl-content" >
+             <div class="cl-name">{{item.mainStrategyName}}</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>
+         </div>
+       </template>
+     </cl-container>
+     <div v-if="list.length === 0">
+       <el-empty :image-size="200" ></el-empty>
      </div>
-     <div class="cl-items">
+     <setting ref="setting"/>
-       <div class="cl-header">辅助策略</div>
+   </div>
-       <div class="cl-content">
-         <div class="cl-name">需量控制</div>
-       </div>
-     </div>
-   </template>
- </cl-container>
 </template>
 
 
 <script>
+import Setting from './../Setting.vue'
 import ClContainer from './../ClContainer.vue'
 import getQuerySiteId from '@/mixins/ems/getQuerySiteId'
+import {strategyRunningList} from '@/api/ems/dzjk'
 export default {
   name:'DzjkClpzClyx',
-  components:{ClContainer},
+  components:{ClContainer,Setting},
   mixins: [getQuerySiteId],
   data() {
     return {
-
+      loading:false,
+      list:[],
     }
   },
-  methods:{
+  provide(){
-    init(){}
+    return {$home:this}
+  },
+  methods:{
+    settingStrategy(item=''){
+      this.$refs.setting.showSettingDialog(item)
+    },
+    init(){
+      this.loading = true
+      this.list = []
+      strategyRunningList(this.siteId).then(response => {
+        this.list =JSON.parse(JSON.stringify(response?.data || {}))
+      }).finally(() => {this.loading=false})
+    },
+    toDetail(id){
+      id && this.$router.push({
+        path:'/dzjk/clpz/xftg',
+        query:{
+          ...this.$route.query,
+          id
+        }
+      })
+    }
   },
-  mounted(){
-
-  }
 }
 </script>
 
 <style scoped lang="scss">
+.contain{
+  margin-bottom: 20px;
+}
   .clyx-main{
     padding:0 12px 0 12px;
     .cl-items{
+      cursor: pointer;
       width: 228px;
       height: 156px;
       display: inline-block;

src/views/ems/dzjk/clpz/index.vue

@@ -25,7 +25,7 @@
 
 <script>
 import { dzjk } from '@/router/ems'
-const childrenRoute = dzjk[0].children[0].children.find(item=> item.name==='DzjkClpz').children//获取到统计报表下面的字路由
+const childrenRoute = dzjk[0].children[0].children.find(item=> item.name==='DzjkClpz').children.filter(item=>!item?.hidden)//获取到统计报表下面的字路由
 console.log('设备监控子路由',childrenRoute)
 export default {
   name:'DzjkClpz',