子元素拖拽

src/common/js/drag.js

@@ -89,7 +89,7 @@ export default function (Vue) {
         }
       );
       dragElem.onmousedown = function (e) {
-        // e.stopPropagation();
+        e.stopPropagation();
         // e.preventDefault()
         if (e.target.className == "min-solider" || e.target.className == "sm-input sm-input-long"|| e.target.className == "sm-input-long" || e.target.className == "sm-input-right") { //
           e.stopPropagation();
@@ -111,7 +111,7 @@ export default function (Vue) {
         const y = clientY - a.offsetTop;
         document.onmousemove = debounce(function (e) {
           e.preventDefault();
-          // e.stopPropagation();
+          e.stopPropagation();
           l = e.clientX - x;
           t = e.clientY - y;
           if (l < 0 && t < 0) {

src/views/siteselection/index.vue

@@ -1,51 +1,27 @@
 <!--合规性分析-->
-<template>
+<template >
   <div class="ghzc siteselection">
-    <div class="innerContainer leftPane" v-drag>
+    <div class="innerContainer leftPane" v-drag @click.native.stop>
       <h2 class="Pangetitle">
         <span class="pange_text">智能规划选址</span>
       </h2>
-      <el-tabs
-        type="border-card"
-        class="xz_box"
-        v-model="activeTabs"
-        stretch
-        @tab-click="tabClick"
-      >
+      <el-tabs type="border-card" class="xz_box" v-model="activeTabs" stretch @tab-click="tabClick">
         <el-tab-pane label="辅助选址" name="fzxz">
           <FZXZ v-loading="loading" @updateParent="changeData" ref="fzxz"></FZXZ>
         </el-tab-pane>
         <el-tab-pane label="历史记录" name="lsju">
-          <Lsjl
-            :rzBsm="rzBsm"
-            :activeTabs="activeTabs"
-            @updateParent="changeData"
-            type="ghxz"
-            ref="lsju"
-          ></Lsjl>
+          <Lsjl :rzBsm="rzBsm" :activeTabs="activeTabs" @updateParent="changeData" type="ghxz" ref="lsju"></Lsjl>
         </el-tab-pane>
         <!-- :disabled="activeTabs != 'scjg'" -->
-        <el-tab-pane
-          label="选址结果"
-          :disabled="activeTabs != 'scjg'"
-          name="xzjg"
-
-        >
-          <XZJG
-            :activeTabs="activeTabs"
-            :loading="loading"
-            :rwBsm="rwBsm"
-            :rzMc="nowObj.xmmc"
-            v-if="activeTabs == 'xzjg'"
-          ></XZJG>
+        <el-tab-pane label="选址结果" :disabled="activeTabs != 'scjg'" name="xzjg">
+          <div v-drag>
+            <XZJG :activeTabs="activeTabs" :loading="loading" :rwBsm="rwBsm" :rzMc="nowObj.xmmc"
+              v-if="activeTabs == 'xzjg'"></XZJG>
+          </div>
         </el-tab-pane>
       </el-tabs>
     </div>
-    <RzDtails
-      :rzBsm="rzBsm"
-      :rzMc="nowObj.xmmc"
-      @updateParent="changeData"
-    ></RzDtails>
+    <RzDtails :rzBsm="rzBsm" :rzMc="nowObj.xmmc" @updateParent="changeData"></RzDtails>
   </div>
 </template>
 
@@ -72,7 +48,7 @@ export default {
       loading: false,
     };
   },
-  created() {},
+  created() { },
   methods: {
     changeData(name, updata) {
       this[name] = updata;
@@ -83,10 +59,10 @@ export default {
   },
   watch: {
     activeTabs(newValue) {
-      
-      if (newValue != "fzxz")  this.$refs.fzxz.reset();
-      if (newValue != "lsju")  this.$refs.lsju.reset();
-      
+
+      if (newValue != "fzxz") this.$refs.fzxz.reset();
+      if (newValue != "lsju") this.$refs.lsju.reset();
+
       if (newValue == "lsju") {
         this.$refs.lsju.reset();
         this.$refs.lsju.changeForm();
@@ -102,11 +78,13 @@ export default {
     .title {
       padding: 8px;
       margin-bottom: 10px;
+
       span {
         color: #605e5e;
         padding-left: 8px;
         border-left: 3px solid #3a8ee6;
       }
+
       button {
         padding: 0;
         float: right;
@@ -114,28 +92,35 @@ export default {
         min-height: unset;
       }
     }
+
     .el-form-item {
       margin-bottom: 0;
     }
+
     .xz_table {
       height: 180px;
+
       /deep/.el-table__header-wrapper {
         height: 40px;
       }
+
       /deep/.el-table__body-wrapper {
         height: calc(100% - 40px);
         overflow-y: auto;
       }
     }
+
     .xz_type {
       margin-bottom: 10px;
       justify-content: space-evenly;
+
       div {
         i {
           font-size: 36px;
         }
       }
     }
+
     .xz-btn {
       width: 100%;
       // background: #efefef;
@@ -147,16 +132,19 @@ export default {
       display: flex;
       align-items: center;
     }
+
     .jg-box {
       td {
         padding-left: 15px;
       }
+
       .el-collapse-item__header {
         span {
           position: absolute;
           right: 40px;
         }
       }
+
       .el-collapse-item__content {
         padding-bottom: 0;
       }
@@ -175,7 +163,8 @@ export default {
     padding-right: 5px;
     padding-left: 5px;
     border-radius: 5px;
-    > div {
+
+    >div {
       padding: 5px;
       text-align: left;
     }