fix: .

src/components/PointEditor.vue

@@ -3,58 +3,25 @@
     <div class="wrapper">
       <h3>编辑点位数据</h3>
       <p>点位id: {{ initialPointData.id }}</p>
-      <el-form
-        class="form"
-      >
-        <el-form-item
-          :label="'x'"
-        >
-          <el-input
-            v-model="x"
-            type="number"
-            step="any"
-          />
+      <el-form class="form">
+        <el-form-item :label="'x'">
+          <el-input v-model="x" type="number" step="any" />
         </el-form-item>
-        <el-form-item
-          :label="`y`"
-        >
-          <el-input
-            v-model="y"
-            type="number"
-            step="any"
-          />
+        <el-form-item :label="`y`">
+          <el-input v-model="y" type="number" step="any" />
         </el-form-item>
-        <el-form-item
-          :label="`z`"
-        >
-          <el-input
-            v-model="z"
-            type="number"
-            step="any"
-          />
+        <el-form-item :label="`z`">
+          <el-input v-model="z" type="number" step="any" />
         </el-form-item>
-        <el-form-item
-          :label="`weight`"
-        >
-          <el-input
-            v-model="weight"
-            type="number"
-            step="any"
-          />
+        <el-form-item :label="`weight`">
+          <el-input v-model="weight" type="number" step="any" />
         </el-form-item>
-        <el-form-item
-          :label="`ids`"
-        >
-          <el-input
-            v-model="ids"
-          />
+        <el-form-item :label="`ids`">
+          <el-input v-model="ids" />
         </el-form-item>
         <div class="btn-group">
-          <el-button
-            @click="$emit('cancel')"
-          >
-            取消
-          </el-button>
+          <el-button @click="$emit('cancel')"> 取消 </el-button>
+          <el-button type="danger" @click="$emit('delete')"> 删除 </el-button>
           <el-button
             type="primary"
             :disabled="!isDataValid"
@@ -81,45 +48,49 @@ export default {
       y: this.initialPointData.y,
       z: this.initialPointData.z,
       weight: this.initialPointData.weight,
-      ids: this.initialPointData.ids.join(','),
-    }
+      ids: this.initialPointData.ids.join(","),
+    };
   },
   computed: {
     isDataValid() {
-      if (this.x === '' || this.y === '' || this.z === '' || this.weight === '') {
-        return false
+      if (
+        this.x === "" ||
+        this.y === "" ||
+        this.z === "" ||
+        this.weight === ""
+      ) {
+        return false;
       }
-      const idsArray = this.ids.split(',')
+      const idsArray = this.ids.split(",");
       if (idsArray.length !== 8) {
-        return false
+        return false;
       }
       for (const neighboorId of idsArray) {
         if (!Number.isSafeInteger(Number(neighboorId))) {
-          return false
+          return false;
         }
       }
-      return true
-    }
-  },
-  mounted() {
+      return true;
+    },
   },
+  mounted() {},
   methods: {
     onClickConfirm() {
-      this.$emit('confirm', {
+      this.$emit("confirm", {
         id: this.initialPointData.id,
         x: Number(this.x),
         y: Number(this.y),
         z: Number(this.z),
         weight: Number(this.weight),
-        ids: this.ids.split(',')
-      })
-    }
-  }
-}
+        ids: this.ids.split(","),
+      });
+    },
+  },
+};
 </script>
 
 <style scoped>
-.point-editor{
+.point-editor {
   position: absolute;
   left: 0;
   top: 0;
@@ -128,7 +99,7 @@ export default {
   background-color: rgba(0, 0, 0, 0.5);
   backdrop-filter: blur(10px);
 }
-.point-editor .wrapper{
+.point-editor .wrapper {
   width: 500px;
   position: absolute;
   left: 50%;
@@ -142,4 +113,4 @@ export default {
   width: fit-content;
   margin-left: auto;
 }
-</style>
+</style>