feat: 修改设备名称

src/controller/iot/device.ts

@@ -104,6 +104,7 @@ export class DeviceContriller {
 
   static async updateLabel (data: {id: string, deviceLabel: string}) {
     await updateDeviceLabel(data)
+    message.success('修改设备名称成功')
   }
 
   /** 设备统计 */

src/pages/Iot/device/components/overview.vue

@@ -3,7 +3,8 @@
     <a-row  align="middle" style="width: 100%;height: 68px" class="title">
       <a-col  >
         <a-space :size="50" >
-          <span>{{state.deviceDetail?.deviceCode}}<a-button type="primary" @click="state.visible = true" >修改</a-button></span>
+          <span>{{state.deviceDetail?.deviceLabel}}</span>
+          <a-button type="primary" @click="state.visible = true" >修改</a-button>
           <span>{{state.deviceDetail?.deviceStatus}}</span>
           <a-tag style="scale: 1.2;" >
             <span>所属产品：{{state.deviceDetail?.modelLabel}}</span>
@@ -41,16 +42,18 @@
     </a-row>
 
   <modal-pro
-    label="hellp"
+    label="修改设备名称"
     :visible="state.visible"
     @cancel="state.visible = false"
+    @ok="ok"
   >
-
+    <a-input v-model:value="state.deviceLabel"></a-input>
   </modal-pro>
 </template>
 
 <script lang="ts" setup >
-import { CommonController, DeviceContriller } from '@/controller'
+import { DeviceContriller } from '@/controller'
+import { StateEffect } from '@codemirror/state'
 import { onMounted, reactive } from 'vue'
 import { useRoute } from 'vue-router'
 
@@ -63,16 +66,26 @@ interface IProps {
 
 const props = defineProps<IProps>()
 
-const state = reactive<{
+const state = reactive < {
   deviceDetail: IOT.API.DEVICE.Device | null,
-  visible: boolean
-}>({
+  visible: boolean,
+  deviceLabel: string
+} > ({
   deviceDetail: null,
-  visible: false
+  visible: false,
+  deviceLabel: ''
 })
 
+const ok = async () => {
+  await DeviceContriller.updateLabel({ id: props.deviceId, deviceLabel: state.deviceLabel })
+  state.visible = false
+  state.deviceDetail = await DeviceContriller.byId(props.deviceId)
+  state.deviceLabel = state.deviceDetail.deviceLabel
+}
+
 onMounted(async () => {
   state.deviceDetail = await DeviceContriller.byId(props.deviceId)
+  state.deviceLabel = state.deviceDetail.deviceLabel
 })
 
 </script>

src/pages/Iot/device/detail.vue

@@ -57,7 +57,7 @@ const route = useRoute()
 const deviceId = route.query.id as string
 
 const state = reactive({
-  tabsActive: '6',
+  tabsActive: '1',
   deviceId: deviceId
 })
 

src/pages/Iot/device/index.vue

@@ -57,8 +57,7 @@
         <template v-if="column.key === 'action'">
             <a-space>
               <a @click="goDetailPage(record.id)">查看</a>
-              <a>调试</a>
-              <a>冻结</a>
+              <a @click="goDebugPage(record.id)" >调试</a>
                 <a-popconfirm
                   title="确实要删除吗？"
                   ok-text="确定"
@@ -214,6 +213,10 @@ const { resetFields: resetFieldsDevice, validate: validateDevice, validateInfos:
   deviceCode: [{ required: true, message: '请填写设备码' }]
 }))
 
+const goDebugPage = (id: string) => {
+  router.push({ path: '/devOps/onlineTest', query: { id } })
+}
+
 const goDetailPage = (id: string) => {
   router.push({ path: '/device/detail', query: { id } })
 }