完成修改服务器名称功能

itbaima-monitor-server/src/main/java/com/example/controller/MonitorController.java

@@ -1,12 +1,12 @@
 package com.example.controller;
 
 import com.example.entity.RestBean;
+import com.example.entity.vo.request.RenameClientVO;
 import com.example.entity.vo.response.ClientPreviewVO;
 import com.example.service.ClientService;
 import jakarta.annotation.Resource;
-import org.springframework.web.bind.annotation.GetMapping;
-import org.springframework.web.bind.annotation.RequestMapping;
-import org.springframework.web.bind.annotation.RestController;
+import jakarta.validation.Valid;
+import org.springframework.web.bind.annotation.*;
 
 import java.util.List;
 
@@ -21,4 +21,10 @@ public class MonitorController {
     public RestBean<List<ClientPreviewVO>> listAllClient() {
         return RestBean.success(service.listClients());
     }
+
+    @PostMapping("/rename")
+    public RestBean<Void> renameClient(@RequestBody @Valid RenameClientVO vo) {
+        service.renameClient(vo);
+        return RestBean.success();
+    }
 }

itbaima-monitor-server/src/main/java/com/example/entity/vo/request/RenameClientVO.java

@@ -0,0 +1,13 @@
+package com.example.entity.vo.request;
+
+import jakarta.validation.constraints.NotNull;
+import lombok.Data;
+import org.hibernate.validator.constraints.Length;
+
+@Data
+public class RenameClientVO {
+    @NotNull
+    int id;
+    @Length(min = 1, max = 10)
+    String name;
+}

itbaima-monitor-server/src/main/java/com/example/service/ClientService.java

@@ -3,6 +3,7 @@ package com.example.service;
 import com.baomidou.mybatisplus.extension.service.IService;
 import com.example.entity.dto.Client;
 import com.example.entity.vo.request.ClientDetailVO;
+import com.example.entity.vo.request.RenameClientVO;
 import com.example.entity.vo.request.RuntimeDetailVO;
 import com.example.entity.vo.response.ClientPreviewVO;
 
@@ -16,4 +17,5 @@ public interface ClientService extends IService<Client> {
     void updateClientDetail(ClientDetailVO vo, Client client);
     void updateRuntimeDetail(RuntimeDetailVO vo, Client client);
     List<ClientPreviewVO> listClients();
+    void renameClient(RenameClientVO vo);
 }

itbaima-monitor-server/src/main/java/com/example/service/impl/ClientServiceImpl.java

@@ -1,9 +1,11 @@
 package com.example.service.impl;
 
+import com.baomidou.mybatisplus.core.toolkit.Wrappers;
 import com.baomidou.mybatisplus.extension.service.impl.ServiceImpl;
 import com.example.entity.dto.Client;
 import com.example.entity.dto.ClientDetail;
 import com.example.entity.vo.request.ClientDetailVO;
+import com.example.entity.vo.request.RenameClientVO;
 import com.example.entity.vo.request.RuntimeDetailVO;
 import com.example.entity.vo.response.ClientPreviewVO;
 import com.example.mapper.ClientDetailMapper;
@@ -81,11 +83,11 @@ public class ClientServiceImpl extends ServiceImpl<ClientMapper, Client> impleme
         }
     }
 
-    private final Map<Client, RuntimeDetailVO> lastRuntime = new HashMap<>();
+    private final Map<Integer, RuntimeDetailVO> lastRuntime = new HashMap<>();
 
     @Override
     public void updateRuntimeDetail(RuntimeDetailVO vo, Client client) {
-        RuntimeDetailVO oldData = lastRuntime.put(client, vo);
+        RuntimeDetailVO oldData = lastRuntime.put(client.getId(), vo);
         if(oldData != null)
             influx.writeRuntimeData(client.getId(), oldData);
     }
@@ -95,7 +97,7 @@ public class ClientServiceImpl extends ServiceImpl<ClientMapper, Client> impleme
         return clientIdCache.values().stream().map(client -> {
             ClientPreviewVO vo = client.asViewObject(ClientPreviewVO.class);
             BeanUtils.copyProperties(detailMapper.selectById(vo.getId()), vo);
-            RuntimeDetailVO runtime = lastRuntime.get(client);
+            RuntimeDetailVO runtime = lastRuntime.get(client.getId());
             if(runtime != null && System.currentTimeMillis() - runtime.getTimestamp() < 60 * 1000) {
                 BeanUtils.copyProperties(runtime, vo);
                 vo.setOnline(true);
@@ -104,6 +106,12 @@ public class ClientServiceImpl extends ServiceImpl<ClientMapper, Client> impleme
         }).toList();
     }
 
+    @Override
+    public void renameClient(RenameClientVO vo) {
+        this.update(Wrappers.<Client>update().eq("id", vo.getId()).set("name", vo.getName()));
+        this.initClientCache();
+    }
+
     private void addClientCache(Client client) {
         clientIdCache.put(client.getId(), client);
         clientTokenCache.put(client.getToken(), client);

itbaima-monitor-web/src/component/PreviewCard.vue

@@ -1,16 +1,34 @@
 <script setup>
 import {fitToRightByteUnit} from "@/tools";
 import {useClipboard} from "@vueuse/core";
-import {ElMessage} from "element-plus";
+import {ElMessage, ElMessageBox} from "element-plus";
+import {post} from "@/net";
 
 const props = defineProps({
-  data: Object
+  data: Object,
+  update: Function
 })
 
 const { copy } = useClipboard()
 const copyIp = () => {
   copy(props.data.ip).then(() => ElMessage.success('成功复制IP地址到剪贴板'))
 }
+
+const rename = () => ElMessageBox.prompt('请输入新的服务器主机名称', '修改名称', {
+  confirmButtonText: '确认',
+  cancelButtonText: '取消',
+  inputValue: props.data.name,
+  inputPattern:
+      /^[a-zA-Z0-9_\u4e00-\u9fa5]{1,10}$/,
+  inputErrorMessage: '名称只能包含中英文字符、数字和下划线',
+}).then(({ value }) => post('/api/monitor/rename', {
+    id: props.data.id,
+    name: value
+  }, () => {
+    ElMessage.success('主机名称已更新')
+    props.update()
+  })
+)
 </script>
 
 <template>
@@ -20,7 +38,7 @@ const copyIp = () => {
         <div class="title">
           <span :class="`flag-icon flag-icon-${data.location}`"></span>
           <span style="margin: 0 10px">{{ data.name }}</span>
-          <i class="fa-solid fa-pen-to-square"></i>
+          <i @click="rename" class="fa-solid fa-pen-to-square interact-item"></i>
         </div>
         <div class="os">
           操作系统: {{`${data.osName} ${data.osVersion}`}}
@@ -38,7 +56,7 @@ const copyIp = () => {
     <el-divider style="margin: 10px 0"/>
     <div class="network">
       <span style="margin-right: 10px">公网IP: {{data.ip}}</span>
-      <i class="fa-solid fa-copy copy-item" @click="copyIp"></i>
+      <i class="fa-solid fa-copy interact-item" style="color: dodgerblue" @click="copyIp"></i>
     </div>
     <div class="cpu">
       <span style="margin-right: 10px">处理器: {{data.cpuName}}</span>
@@ -99,8 +117,7 @@ const copyIp = () => {
   box-sizing: border-box;
   color: #6b6b6b;
 
-  .copy-item {
-    color: dodgerblue;
+  .interact-item {
     transition: .3s;
 
     &:hover {

itbaima-monitor-web/src/views/main/Manage.vue

@@ -16,7 +16,7 @@ updateList()
     <div class="description">在这里管理所有已经注册的主机实例，实时监控主机运行状态，快速进行管理和操作。</div>
     <el-divider style="margin: 10px 0"/>
     <div class="card-list">
-      <preview-card :data="item" v-for="item in list"/>
+      <preview-card :update="updateList" :data="item" v-for="item in list"/>
     </div>
   </div>
 </template>