From ef561e204ee6fd7df25477b456b0d466b026550e Mon Sep 17 00:00:00 2001
From: loulijun2021 <1694218219@qq.com>
Date: 星期一, 30 一月 2023 15:28:32 +0800
Subject: [PATCH] 1.tagView标签新增可拖动功能

---
 src/views/jcsz/jsqd.vue |   59 ++++++++++++++++++++++++++++++++++++++++-------------------
 1 files changed, 40 insertions(+), 19 deletions(-)

diff --git a/src/views/jcsz/jsqd.vue b/src/views/jcsz/jsqd.vue
index 0288111..48844a5 100644
--- a/src/views/jcsz/jsqd.vue
+++ b/src/views/jcsz/jsqd.vue
@@ -19,10 +19,10 @@
           :model="form"
           label-width="100px"
           inline
-          style="display: flex;justify-content: space-between"
+          style="display: flex;"
         >
           <div class="elForm">
-            <el-form-item label-width="70px" label="瑙掕壊缂栫爜" style=" display: flex;">
+            <el-form-item label="瑙掕壊缂栫爜" style=" display: flex;">
               <el-input v-model="form.RoleCode" placeholder="璇疯緭鍏�" style="width: 200px" />
             </el-form-item>
             <el-form-item label="瑙掕壊鍚嶇О" style=" display: flex;">
@@ -49,7 +49,10 @@
               <el-input v-model="form.UserName" style="width: 200px" placeholder="璇疯緭鍏�" />
             </el-form-item>
           </div>
-          <div class="bodySearchReset" :style="{marginLeft:$store.state.app.sidebar.opened?'5%':'10%'}">
+          <div
+            class="bodySearchReset"
+            :style="{marginLeft:$store.state.app.sidebar.opened? $store.state.settings.menuIsHorizontal?'15%':'3%':'10%'}"
+          >
             <el-button type="primary" icon="el-icon-search" @click="search">鏌ヨ</el-button>
             <el-button type="info" icon="el-icon-refresh" @click="reset">閲嶇疆</el-button>
           </div>
@@ -224,6 +227,7 @@
 
     <!--    鏂板淇敼瀵硅瘽妗�-->
     <el-dialog
+      v-el-drag-dialog
       :title="operation==='add'?'鏂板':'缂栬緫'"
       :visible.sync="dialogVisible"
       width="800px"
@@ -273,6 +277,7 @@
     </el-dialog>
     <!--    璁剧疆鎸夐挳瀵硅瘽妗�-->
     <el-dialog
+      v-el-drag-dialog
       title="璁剧疆"
       :visible.sync="settingDialogVisible"
       width="800px"
@@ -364,6 +369,7 @@
     </el-dialog>
     <!--    鍏宠仈鐢ㄦ埛瀵硅瘽妗�-->
     <el-dialog
+      v-el-drag-dialog
       title="瑙掕壊鍏宠仈鐢ㄦ埛"
       :visible.sync="userDialogVisible"
       width="900px"
@@ -530,6 +536,7 @@
     </el-dialog>
     <!--    鍒嗛厤鏉冮檺瀵硅瘽妗�-->
     <el-dialog
+      v-el-drag-dialog
       title="瑙掕壊鍏宠仈鏉冮檺"
       :visible.sync="dialogVisibleRight"
       width="800px"
@@ -557,29 +564,32 @@
           @click="myCheckboxClick(item)"
         >
 
-          <input
-            class="myCheckboxInput"
-            type="checkbox"
-            :disabled="rightFrom.usercode==='S001'"
-            :value="item.code"
-            :name="item.name"
-            :style="{color:item.isSelected2?'#42b983':'#fff'}"
-            @click="myCheckboxInputClick(item)"
-          >{{ item.name }}
+          <!--          <input-->
+          <!--            class="myCheckboxInput"-->
+          <!--            type="checkbox"-->
+          <!--            :disabled="rightFrom.usercode==='S001'"-->
+          <!--            :value="item.code"-->
+          <!--            :name="item.name"-->
+          <!--            :style="{color:item.isSelected2?'#42b983':'#fff'}"-->
+          <!--            @click="myCheckboxInputClick(item)"-->
+          <!--          >{{ item.name }}-->
 
-          <!--          :style="{color:item.isSelected2?'#42b983':'#fff'}"-->
           <!--            鐖跺瓙鐐瑰嚮浜嬩欢涓嶅奖鍝�-->
           <!--            onClick="event.cancelBubble = true"-->
           <!--鏄庡ぉ鍐嶇湅涓�涓媔nput鍜宔l-checkbox涔嬮棿鐨勫尯鍒�-->
+
           <el-checkbox
+            :key="item.code"
             v-model="item.isSelected2"
             class="myCheckboxInput"
             :value="item.code"
             :name="item.name"
             :disabled="rightFrom.usercode==='S001'"
-          >{{ item.name }}
-          </el-checkbox>
-
+            :checked="item.isSelected2"
+            :label="item.name"
+            @change="myCheckboxInputClick(item)"
+          />
+          <div class="myCheckboxInputLabel">{{ item.name }}</div>
         </div>
       </div>
       <el-divider />
@@ -651,12 +661,14 @@
 import { getCookie } from '@/utils/auth'
 import $ from 'jquery'
 import clearAllChildren, { validateCode } from '@/utils/global'
+import elDragDialog from '@/directive/el-drag-dialog'
 
 export default {
   name: 'JSQD',
   components: {
     Pagination, ImportPicker
   },
+  directives: { elDragDialog },
   data() {
     return {
       isIpad: false,
@@ -1551,8 +1563,8 @@
     },
     // 灏忕洅瀛愮偣鍑讳簨浠�
     myCheckboxInputClick(val) {
-      console.log(val, 777777)
-      val.isSelected2 = !val.isSelected2
+      val.isSelected2 = !!val.isSelected2
+
       this.dialogFormRight.rightCurrentCode = val.code
 
       // 1.绗竴绉嶆儏鍐�  灏忕洅瀛愪粠娌￠�変腑鍒伴�変腑
@@ -1708,17 +1720,26 @@
       //border: 1px solid $main_color;
       border: 1px solid #eee;
       display: flex;
-      min-width: 110px;
+      min-width: 100px;
       padding: 10px;
       margin: 10px 30px 0 0;
       border-radius: 5px;
       cursor: default;
+      position: relative;
 
       .myCheckboxInput {
         margin: 1px 5px 0 0;
         cursor: pointer;
       }
 
+      .myCheckboxInputLabel {
+        position: absolute;
+        left: 29px;
+        padding: 5px;
+        top: 6px;
+        color: transparent;
+      }
+
     }
 
     input[type=checkbox] {

--
Gitblit v1.9.3