自动模式初步接口

src/components.d.ts

@@ -19,10 +19,12 @@ declare module 'vue' {
     ElPagination: typeof import('element-plus/es')['ElPagination']
     ElScrollbar: typeof import('element-plus/es')['ElScrollbar']
     ElSlider: typeof import('element-plus/es')['ElSlider']
-    ElSwitch: typeof import('element-plus/es')['ElSwitch']
     ElTimePicker: typeof import('element-plus/es')['ElTimePicker']
     Pagination: typeof import('./components/Pagination/index.vue')['default']
     RouterLink: typeof import('vue-router')['RouterLink']
     RouterView: typeof import('vue-router')['RouterView']
   }
+  export interface ComponentCustomProperties {
+    vLoading: typeof import('element-plus/es')['ElLoadingDirective']
+  }
 }

src/views/AutomaticMode/index.vue

@@ -16,22 +16,16 @@
             </div>
 
             <!-- 主体区域 -->
-            <div class="control-content">
+            <div class="control-content" element-loading-text="加载中..." v-loading="startTaskLoading || stopTaskLoading || middleTaskLoading" element-loading-background="rgba(122, 122, 122, 0.8)">
                 <div class="power-section">
                     <div class="tabBox">
-                        <div class="tabItem selected">
+                        <div class="tabItem" :class="{ selected: item === deviceMode }" v-for="item in [0, 1, 2]" @click="changeViewMode(item)">
-                            模式1
+                            模式{{ item + 1 }}
-                        </div>
-                        <div class="tabItem">
-                            模式2
-                        </div>
-                        <div class="tabItem">
-                            模式3
                         </div>
                     </div>
                     <div class="power-params">
-                        <div class="energy-card" v-for="item in 3">
+                        <div class="energy-card" v-for="(item, index) in ['开始任务', '结束任务', '中间任务']">
-                            <div class="energy-name"><span>开</span><span>始</span><span>任</span><span>务</span></div>
+                            <div class="energy-name"><span>{{ item.substring(0, 1) }}</span><span>{{ item.substring(1, 2) }}</span><span>{{ item.substring(2, 3) }}</span><span>{{ item.substring(3) }}</span></div>
                             <div class="param-list">
                                 <div class="item">
                                     <div>通道</div>
@@ -40,16 +34,16 @@
                                 </div>
                                 <div class="item" v-for="ele in 10">
                                     <div>{{ ele }}</div>
-                                    <div>通</div>
+                                    <div>{{ tasks[index].turnOn ? '通' : '断' }}</div>
-                                    <div>0</div>
+                                    <div>{{ tasks[index].pwm }}</div>
                                 </div>
                             </div>
                             <div class="time">
                                 <div>定时时间</div>
-                                <div>18:00:00</div>
+                                <div>{{ tasks[index].execTime ? dayjs(tasks[index].execTime).format('HH:mm:ss') : '' }}</div>
                             </div>
                             <div class="iconBox">
-                                <el-icon @click="settingDialogVisible = true">
+                                <el-icon @click="openSettingDialog(item, index)">
                                     <Setting />
                                 </el-icon>
                             </div>
@@ -68,14 +62,14 @@
                             </el-icon>
                             控制模式
                         </div>
-                        <el-button class="mode-button active" @click="modeDialogVisible = true">自动模式1</el-button>
+                        <el-button class="mode-button active" @click="changeMode">自动模式{{ currentMode + 1 }}</el-button>
                     </div>
 
                     <div class="buttonBox">
                         <el-button icon="RefreshRight" style="margin-left: 0;" class="mode-button" @click="restartSystem">远程重启</el-button>
-                        <el-button icon="Refresh" style="margin-left: 0;" class="brightness-button">刷新</el-button>
+                        <el-button icon="Refresh" style="margin-left: 0;" class="brightness-button" @click="getTask">刷新</el-button>
-                        <el-button icon="Plus" style="margin-left: 0;" class="brightness-button add" @click="addDialogVisible = true">新增</el-button>
+                        <!-- <el-button icon="Plus" style="margin-left: 0;" class="brightness-button add" @click="addDialogVisible = true">新增</el-button>
-                        <el-button icon="Delete" style="margin-left: 0;" class="brightness-button del" @click="delMode">删除</el-button>
+                        <el-button icon="Delete" style="margin-left: 0;" class="brightness-button del" @click="delMode">删除</el-button> -->
                     </div>
                 </div>
             </div>
@@ -145,13 +139,13 @@
         <el-dialog v-model="modeDialogVisible" title="选择模式" width="600px" :modal="true" class="brightness-dialog">
             <div class="setting-content">
                 <div class="modeBox">
-                    <el-button v-for="item in 3" :class="item === modeActive ? 'mode-button active' : 'brightness-button'" @click="modeActive = item">模式{{ item }}</el-button>
+                    <el-button v-for="(item, index) in 3" :class="index === modeActive ? 'mode-button active' : 'brightness-button'" @click="modeActive = index">模式{{ item }}</el-button>
                 </div>
             </div>
             <template #footer>
                 <div class="dialog-footer">
                     <el-button @click="modeDialogVisible = false">取消</el-button>
-                    <el-button type="primary" @click="modeDialogVisible = false">确认</el-button>
+                    <el-button type="primary" @click="confirmMode">确认</el-button>
                 </div>
             </template>
         </el-dialog>
@@ -175,20 +169,23 @@
             <div class="setting-content">
                 <div class="loopBox">
                     <div class="title">
-                        <div class="left">通道回路 <span class="selectAll" @click="selectAll">全选</span></div>
+                        <div class="left">通道回路
-                        <div class="right">通道回路 <el-switch v-model="switchValue" inline-prompt active-text="通" inactive-text="不通" /></div>
+                            <!-- <span class="selectAll" @click="selectAll">全选</span> -->
+                        </div>
+                        <!-- <div class="right">通道回路 <el-switch v-model="switchValue" inline-prompt active-text="通" inactive-text="断" /></div> -->
                     </div>
                     <div class="selectBox">
                         <el-checkbox-group v-model="selectBoxValue">
-                            <el-checkbox v-for="item in 10" :label="'通道回路' + item" :value="'通道回路' + item" border />
+                            <el-checkbox v-for="item in 10" :label="'通道回路' + item" :value="'通道回路'" border />
                         </el-checkbox-group>
                     </div>
                 </div>
-                <div style="margin:10px 0 "><el-button type="primary" @click="brightnessDialogVisible = true">一键调光</el-button></div>
+                <!-- <div style="margin:10px 0 "><el-button type="primary" @click="brightnessDialogVisible = true">一键调光</el-button></div> -->
+                <div style="margin-bottom: 10px;">调光通道</div>
                 <div class="lightBox">
                     <div class="item" v-for="item in 10">
                         <div class="title">调光通道{{ item }}</div>
-                        <el-input-number style="width: 95%;" v-model="lightFrom[item]" :min="0" :max="100">
+                        <el-input-number style="width: 95%;" v-model="currentTask.pwm" :min="0" :max="100">
                             <template #suffix>
                                 <span>%</span>
                             </template>
@@ -197,13 +194,13 @@
                 </div>
                 <div class="timeBox">
                     <span>时间</span>
-                    <el-time-picker v-model="timeValue" placeholder="请选择" />
+                    <el-time-picker v-model="currentTask.execTime" placeholder="请选择" />
                 </div>
             </div>
             <template #footer>
                 <div class="dialog-footer">
                     <el-button @click="settingDialogVisible = false">取消</el-button>
-                    <el-button type="primary" @click="settingDialogVisible = false">确认</el-button>
+                    <el-button type="primary" @click="confirmSetting">确认</el-button>
                 </div>
             </template>
         </el-dialog>
@@ -215,6 +212,7 @@ import { ref, onMounted, onUnmounted, watch } from 'vue'
 import { useRouter } from 'vue-router'
 import RPC from '@/utils/rpc'
 import dayjs from 'dayjs'
+const commit_uid = localStorage.getItem('central_control_comm_uid')
 
 const switchValue = ref(true)
 const selectBoxValue = ref([])
@@ -222,6 +220,118 @@ const lightFrom = ref({})
 const timeValue = ref('')
 const modeName = ref('')
 
+const currentTaskName = ref('开始任务')
+const currentTask = ref({})
+
+const openSettingDialog = (item, index) => {
+    currentTaskName.value = item
+    currentTask.value = tasks.value[index]
+    if (currentTask.value.turnOn) {
+        selectBoxValue.value = ['通道回路']
+    } else {
+        selectBoxValue.value = []
+    }
+    settingDialogVisible.value = true
+}
+
+const confirmSetting = () => {
+    const params = {
+        "comm_uid": commit_uid,
+        "mode": deviceMode.value,
+        "execTime": dayjs(currentTask.value.execTime).format('YYYY-MM-DD HH:mm:ss'),
+        "turnOn": selectBoxValue.value.length > 0,
+        "pwm": currentTask.value.pwm
+    }
+    const middleParams = {
+        "comm_uid": commit_uid,
+        "mode": deviceMode.value,
+        "controlTaskList": [
+            {
+                "execTime": dayjs(currentTask.value.execTime).format('YYYY-MM-DD HH:mm:ss'),
+                "turnOn": selectBoxValue.value.length > 0,
+                "pwm": currentTask.value.pwm
+            }
+        ]
+    }
+    if (currentTaskName.value === '开始任务') {
+        RPC.post('/m9z/setStartTask2', params).then(res => {
+            settingDialogVisible.value = false
+            ElMessage.success('修改成功')
+            getTask()
+        })
+    }
+    if (currentTaskName.value === '结束任务') {
+        RPC.post('/m9z/setStopTask2', params).then(res => {
+            settingDialogVisible.value = false
+            ElMessage.success('修改成功')
+            getTask()
+        })
+    }
+    if (currentTaskName.value === '中间任务') {
+        RPC.post('/m9z/setMiddleTask2', middleParams).then(res => {
+            settingDialogVisible.value = false
+            ElMessage.success('修改成功')
+            getTask()
+        })
+    }
+}
+
+
+const startTask = ref({})
+const stopTask = ref({})
+const middleTask = ref({})
+const startTaskLoading = ref(false)
+const stopTaskLoading = ref(false)
+const middleTaskLoading = ref(false)
+
+const tasks = computed(() => [startTask.value, stopTask.value, middleTask.value])
+
+const deviceMode = ref(0)
+const currentMode = ref(0)
+RPC.post('/m9z/getDeviceMode', { comm_uid: commit_uid }).then(res => {
+    currentMode.value = res
+})
+
+const changeMode = () => {
+    modeActive.value = currentMode.value
+    modeDialogVisible.value = true
+}
+
+const confirmMode = () => {
+    RPC.post('/m9z/setDeviceMode', { comm_uid: commit_uid, mode: modeActive.value }).then(res => {
+        currentMode.value = modeActive.value
+        ElMessage.success('操作成功')
+        modeDialogVisible.value = false
+    })
+}
+
+const changeViewMode = index => {
+    deviceMode.value = index
+    getTask()
+}
+
+const getTask = () => {
+    startTaskLoading.value = true
+    stopTaskLoading.value = true
+    middleTaskLoading.value = true
+    RPC.post('/m9z/getStartTask2', { comm_uid: commit_uid, mode: deviceMode.value }).then(res => {
+        startTask.value = res
+    }).finally(() => {
+        startTaskLoading.value = false
+    })
+    RPC.post('/m9z/getStopTask2', { comm_uid: commit_uid, mode: deviceMode.value }).then(res => {
+        stopTask.value = res
+    }).finally(() => {
+        stopTaskLoading.value = false
+    })
+    RPC.post('/m9z/getMiddleTask2', { comm_uid: commit_uid, mode: deviceMode.value }).then(res => {
+        middleTask.value = res.controlTaskList[0]
+    }).finally(() => {
+        middleTaskLoading.value = false
+    })
+}
+getTask()
+
 const selectAll = () => {
     if (selectBoxValue.value.length !== 10) {
         selectBoxValue.value = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10].map(item => '通道回路' + item)
@@ -230,8 +340,6 @@ const selectAll = () => {
     }
 }
 
-const commit_uid = localStorage.getItem('central_control_comm_uid')
-
 const router = useRouter()
 const currentTime = ref('')
 const systemRuntime = ref('38分钟')
@@ -514,7 +622,6 @@ const delMode = () => {
     flex-direction: column;
     justify-content: center;
     align-items: center;
-    margin-bottom: 15px;
     background-color: #212329;
     width: 30px;
     height: 100%;