diff --git a/frontend/src/views/switchQuantity/index.vue b/frontend/src/views/switchQuantity/index.vue
index d5f1c22..f073f1a 100644
--- a/frontend/src/views/switchQuantity/index.vue
+++ b/frontend/src/views/switchQuantity/index.vue
@@ -1,12 +1,14 @@
 <script setup lang="ts">
 import { computed, onMounted } from 'vue'
 import { usePlatformStore } from '../../stores/platform'
+import {ElMessageBox, ElMessage} from 'element-plus'
+import { controlSwitch } from '@/api/platform'
 
 const { state, bootstrap } = usePlatformStore()
 
 const inputStates = computed(() => {
     if (!state.realtime?.switch) {
-        return [true, false, true, false, true, false, true, false, true, false, true, false]
+        return [false, false, false, false, false, false, false, false, false, false, false, false]
     }
     return Array.from({ length: 12 }, (_, i) => {
         const key = `di${i + 1}`
@@ -16,7 +18,7 @@ const inputStates = computed(() => {
 
 const outputStates = computed(() => {
     if (!state.realtime?.switch) {
-        return [false, true, false, true, false, true, false, true, false, true, false, true]
+        return [false, false, false, false, false, false, false, false, false, false, false, false]
     }
     return Array.from({ length: 12 }, (_, i) => {
         const key = `do${i + 1}`
@@ -53,7 +55,23 @@ const tableData = computed(() => {
     return reslist
   })
 })
+function outputChange(item:any,index:any){
+    ElMessageBox.confirm('确认更改当前开出状态吗？', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+    }).then(() => {
+      controlSwitch(index + 1, item ? 0 : 1).then(res => {
+        if (res.data.control_status === '执行成功') {
+          ElMessage.success('操作成功')
+        }
+        else {
+          ElMessage.error('操作失败')
+        }
+      })
+    })
 
+}
 onMounted(() => {
     void bootstrap()
 })
@@ -71,9 +89,9 @@ onMounted(() => {
                     </div>
                     <div class="state-grid">
                         <div v-for="(state, index) in inputStates" :key="`input-${index}`" class="state-item">
-                            <img v-if="state" src="@/assets/images/menuicon/on.png" style="width: 34px; height: 36px;"
+                            <img v-if="state" src="@/assets/images/menuicon/off.png" style="width: 34px; height: 36px;"
                                 alt="">
-                            <img v-else src="@/assets/images/menuicon/off.png" alt=""
+                            <img v-else src="@/assets/images/menuicon/on.png" alt=""
                                 style="width: 34px; height: 36px;">
                             <div class="label">开入{{ index + 1 }}</div>
                         </div>
@@ -85,10 +103,10 @@ onMounted(() => {
                         <div class="column-title-text">开出状态</div>
                     </div>
                     <div class="state-grid">
-                        <div v-for="(state, index) in outputStates" :key="`output-${index}`" class="state-item">
-                            <img v-if="state" src="@/assets/images/menuicon/on2.png" style="width: 46px; height: 24px;"
+                        <div v-for="(state, index) in outputStates" :key="`output-${index}`" class="state-item" >
+                            <img v-if="state" src="@/assets/images/menuicon/off2.png" @click="outputChange(state,index)" style="width: 46px; height: 24px;cursor: pointer;"
                                 alt="">
-                            <img v-else src="@/assets/images/menuicon/off2.png" style="width: 46px; height: 24px;"
+                            <img v-else src="@/assets/images/menuicon/on2.png" @click="outputChange(state,index)" style="width: 46px; height: 24px;cursor: pointer;"
                                 alt="">
                             <div class="label">开出{{ index + 1 }}</div>
                         </div>
@@ -96,20 +114,6 @@ onMounted(() => {
                 </div>
             </div>
         </div>
-<!-- 
-        <div class="switch-container-bottom">
-            <div class="top-title">报警信息</div>
-            <div class="container-bottom-box">
-                <div v-for="(item, index) in tableData" :key="index" class="container-bottom-box-line1">
-                    <div style="width: 8%;text-align: center;">{{ index + 1 }}</div>
-                    <div style="width: 14%;text-align: center;">{{ item.name }}</div>
-                    <div style="width: 20%;text-align: center;">{{ item.typeName }}</div>
-                    <div style="width: 8%;text-align: center;">{{ item.level }}</div>
-                    <div style="width: 30%;text-align: center;">{{ item.content }}</div>
-                    <div style="width: 20%;text-align: center;">{{ item.time }}</div>
-                </div>
-            </div>
-        </div> -->
     </div>
 </template>