样式修改

src/components/edit/edit-dialog.vue

@@ -19,7 +19,7 @@
                     :selectdata="majorList"
                     :placeholder="'请选择'"
                     class="search-select"
-                    width="236"
+                    width="236" isReadOnly
             />
           </div>
           <div class="search">

src/components/edit/left_toolbar.vue

@@ -23,6 +23,7 @@
         </div>
       </li>
     </ul>
+    <div class="border-line"></div>
     <ul class="list-2">
       <li
         v-on:mouseout="mouseoutActive(item)"
@@ -39,8 +40,10 @@
         </div>
       </li>
     </ul>
+    <div class="border-line"></div>
     <!--    提取-->
     <ul class="list-2 border-top">
+
       <li
         v-on:mouseout="mouseoutActive(item)"
         v-on:mouseover="mouseoverActive(item)"
@@ -85,15 +88,16 @@
           <a-spin :spinning="spinning">
             <div class="drawer-model-body" v-if="!isExtract">
               <div class="btn-list">
-                <a-radio-group
-                  v-show="showDrawerItem.type == 'Zone'"
-                  default-value="draw"
-                  button-style="solid"
-                  @change="changeDrawType"
-                >
-                  <a-radio-button value="draw">绘制</a-radio-button>
-                  <a-radio-button value="select">点选</a-radio-button>
-                </a-radio-group>
+<!--                <a-radio-group-->
+<!--                  v-show="showDrawerItem.type == 'Zone'"-->
+<!--                  default-value="draw"-->
+<!--                  button-style="solid"-->
+<!--                  @change="changeDrawType"-->
+<!--                >-->
+<!--                  <a-radio-button value="draw">绘制</a-radio-button>-->
+<!--                  <a-radio-button value="select">点选</a-radio-button>-->
+<!--                </a-radio-group>-->
+                <Tabs type="card"  v-show="showDrawerItem.type == 'Zone'" :data="tabData" v-model="tabActive"/>
               </div>
               <div class="list" v-for="(item,index) in itemList" :key="index">
                 <div class="title">{{item.Name}}</div>
@@ -266,6 +270,11 @@ export default {
       drawerVisible: false,
       spinning: false,
       showDrawerItem: {},
+      tabData:[
+        {name: '绘制', id:'draw'},
+        {name: '点选', id:'select' }
+      ],
+      tabActive:'draw'
     };
   },
   computed: {
@@ -385,7 +394,8 @@ export default {
       bus.$emit("exportByKey", record);
     },
     changeDrawType(v) {
-      bus.$emit("changeDrawType", v.target.value);
+      // bus.$emit("changeDrawType", v.target.value);
+      bus.$emit("changeDrawType", v);
     }
   },
   watch: {
@@ -404,6 +414,9 @@ export default {
       if (this.visible) {
         this.showDrawer(this.showDrawerItem);
       }
+    },
+    tabActive(val){
+      this.changeDrawType(val)
     }
   },
   mounted() {
@@ -445,7 +458,7 @@ export default {
   height: 100% !important;
 }
 #left_toolbar {
-  min-width: 68px;
+  min-width: 80px;
   height: 100%;
   background: rgba(255, 255, 255, 1);
   box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.11);
@@ -462,7 +475,7 @@ export default {
   .list-1 {
     padding-top: 1px;
     box-sizing: border-box;
-    border-bottom: 1px solid #c3c7cb;
+    /*border-bottom: 1px solid #c3c7cb;*/
     li {
       width: 64px;
       min-height: 42px;
@@ -486,7 +499,7 @@ export default {
       }
       &:hover {
         background: #e1f2ff;
-        border-radius: 8px;
+        border-radius: 4px;
         opacity: 0.89;
         color: #fff;
       }
@@ -579,13 +592,17 @@ export default {
     .drawer-model-body {
       width: 100%;
       .btn-list {
+        width: 123px;
         margin: 0 auto;
       }
       .list {
         .title {
-          font-size: 18px;
+          font-size: 16px;
           border-left: 4px solid #0091ff;
           margin-top: 20px;
+          text-indent: 8px;
+          color: #1F2329;
+          margin-bottom: 12px;
         }
         .example {
           width: 100%;
@@ -645,7 +662,13 @@ export default {
     }
   }
   .border-top {
-    border-top: 1px solid #c3c7cb;
+    /*border-top: 1px solid #c3c7cb;*/
+  }
+  .border-line{
+    width: 48px;
+    height: 2px;
+    background: #C3C7CB ;
+    margin: 0 auto;
   }
 }
 </style>

src/components/edit/top_toolbar.vue

@@ -334,6 +334,7 @@ li {
       }
       li:hover {
         background: #f5f6f7;
+        border-radius: 2px;
       }
       .zoom-window {
         border-left: 1px solid #8d9399;
@@ -356,6 +357,10 @@ li {
       cursor: pointer;
     }
   }
+  .btn-list:hover{
+    background: #f5f6f7;
+    border-radius: 2px;
+  }
 }
 /deep/ .ant-dropdown-menu-item {
   display: flex;

src/views/drafts.vue

@@ -4,7 +4,11 @@
       <div class="conent">
         <div class="left-nav">
           <!--        <Tree :data="treeData" @change="change"></Tree>-->
-          <el-tree :data="treeData" :props="defaultProps" @node-click="handleNodeClick"></el-tree>
+          <el-tree :data="treeData" :props="defaultProps" @node-click="handleNodeClick">
+            <span class="span-ellipsis" slot-scope="{ node, data }">
+		<span :title="node.label">{{ node.label }}</span>
+	</span>
+          </el-tree>
         </div>
         <div class="conent-right">
           <div class="conent-tit">
@@ -29,7 +33,7 @@
               </div>
             </div>
             <div v-show="!legend" class="legend-btn" @click="legend = !legend">
-              <a-icon type="right" style="color: #8D9399;font-size: 10px" />
+              <a-icon type="left" style="color: #8D9399;font-size: 10px" />
             </div>
             <div v-show="legend" class="legend-btn legend-btn-close" @click="legend = !legend">
               <a-icon type="right" style="color: #8D9399;font-size: 10px" />
@@ -429,6 +433,12 @@ export default {
           color: #0091ff !important;
         }
       }
+      .span-ellipsis {
+        width: 100%;
+        overflow: hidden;
+        white-space: nowrap;
+        text-overflow: ellipsis;
+      }
     }
     .conent-right {
       flex: 1;
@@ -449,7 +459,7 @@ export default {
           color: rgba(31, 35, 41, 1);
         }
         .tit-right {
-          width: 246px;
+          width: 198px;
           display: flex;
           justify-content: space-between;
           margin-left: auto;