统一drawer中状态、优先级样式，添加删除节点确认

src/components/TaskDrawerContent.vue

@@ -64,7 +64,15 @@
         <div class="detail-row">
           <span>状态：</span>
           <div  v-if="!isEditing.state"   @click="editEntry('state')" class="detail-value">
-            <span class="state-entry">{{state}}</span>
+            <template v-if="state === '已创建'">
+              <ElTag type="primary">{{state}}</ElTag>
+            </template>
+            <template v-if="state ==='进行中'">
+              <ElTag type="success">{{state}}</ElTag>
+            </template>
+            <template v-if="state ==='已完成'">
+              <ElTag type="info">{{state}}</ElTag>
+            </template>
             <div class="edit-icon" />
           </div>
           <div v-else>
@@ -94,7 +102,15 @@
         <div class="detail-row">
           <span>优先级：</span>
           <div class="detail-value"  v-if="!isEditing.priority"   @click="editEntry('priority')">
-          <span class="state-entry">{{priority}}</span>
+            <template v-if="priority === '紧急'">
+              <ElTag type="warning">{{priority}}</ElTag>
+            </template>
+            <template v-else-if="priority === '一般'">
+              <ElTag>{{priority}}</ElTag>
+            </template>
+            <template v-else-if="priority === '宽松'">
+              <ElTag type="success">{{priority}}</ElTag>
+            </template>
             <div class="edit-icon" />
           </div>
           <div v-else>
@@ -124,7 +140,7 @@
         <div class="detail-row">
           <span>经办人：</span>
           <div class="detail-value"   v-if="!isEditing.userId"  @click="editEntry('userId')">
-          <span class="state-entry">{{userId}}</span>
+          <ElTag>{{userId}}</ElTag>
             <div class="edit-icon" />
           </div>
           <div v-else>

src/components/Tree.vue

@@ -32,8 +32,8 @@
 import TreeNode from './TreeNode.vue';
 
 // 容器宽高
-const HEIGHT = 800;
-const WIDTH = 1100;
+const HEIGHT = 700;
+const WIDTH = 1000;
 const MARGIN_TOP = 80;
 const MARGIN_LEFT = 100;
 const TREE_MAX_HEIGHT = 4;
@@ -171,9 +171,20 @@ export default {
       });
     },
     deleteNode(id) {
-      this.$emit('change', {
-        type: 'deleteNode',
-        id,
+      this.$confirm('是否确认删除该节点?', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning',
+      }).then(() => {
+        this.$emit('change', {
+          type: 'deleteNode',
+          id,
+        });
+      }).catch(() => {
+        this.$message({
+          type: 'info',
+          message: '已取消删除',
+        });
       });
     },
     nodeClick(id) {

src/element-plus.ts

@@ -33,6 +33,8 @@ import {
   ElRadio,
   ElRadioGroup,
   ElTooltip,
+  ElMessage,
+  ElMessageBox,
 } from 'element-plus';
 
 import ZH_CN from 'element-plus/lib/locale/lang/zh-cn';
@@ -77,4 +79,7 @@ export const Components = [
   ElTooltip,
 ];
 
-export const Plugins = [];
+export const Plugins = [
+  ElMessage,
+  ElMessageBox,
+];

src/views/Project/Schedule.vue

@@ -40,7 +40,7 @@ export default {
       parentOfAddingRequirement: null,
       requirementInDrawer: {},
       stateOptions: [{ value: '已完成' }, { value: '进行中' }, { value: '已创建' }],
-      priorityOptions: [{ value: 0, label: '高' }, { value: 1, label: '中' }, { value: 2, label: '低' }],
+      priorityOptions: [{ value: 0, label: '紧急' }, { value: 1, label: '宽松' }, { value: 2, label: '一般' }],
       userOptions: [{ value: 100, label: 'abc' }, { value: 101, label: 'def' }, { value: 102, label: 'gg' }],
     };
   },