From de2ed1eb602fa3b43622dc8db1509f0d70abf78f Mon Sep 17 00:00:00 2001
From: qq787203167 <787203167@qq.com>
Date: Thu, 2 Jun 2022 14:53:00 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E5=B7=B2=E7=9F=A5bug1?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 jero-web/src/components/OcrTable/DocTable.vue |  2 +-
 jero-web/src/components/OcrTable/index.vue    |  2 +-
 .../src/components/SplitTable/DocTable.vue    |  2 +-
 jero-web/src/components/SplitTable/index.vue  |  2 +-
 jero-web/src/components/tableDate/index.vue   |  2 +-
 jero-web/src/mixins/tableDragResize.js        | 58 +++++++++++++++
 .../components/DocumentLibrary.vue            |  2 +-
 .../components/virtualListDetails.vue         |  2 +-
 .../views/documentTools/virtualList/index.vue | 72 +++++++++++++------
 .../components/listOfRegulations.vue          |  4 +-
 .../components/nonConformance.vue             |  2 +-
 .../projectNonConformance/index.vue           |  2 +-
 jero-web/src/views/system/DictList.vue        | 16 +++--
 jero-web/src/views/system/PermissionList.vue  |  2 +-
 jero-web/src/views/system/UserList.vue        | 10 ++-
 15 files changed, 141 insertions(+), 39 deletions(-)
 create mode 100644 jero-web/src/mixins/tableDragResize.js

diff --git a/jero-web/src/components/OcrTable/DocTable.vue b/jero-web/src/components/OcrTable/DocTable.vue
index 3db485a60..182fe4a57 100644
--- a/jero-web/src/components/OcrTable/DocTable.vue
+++ b/jero-web/src/components/OcrTable/DocTable.vue
@@ -271,7 +271,7 @@
     text-overflow: ellipsis;
     /*! autoprefixer: off */
     -webkit-box-orient: vertical;
-    -webkit-line-clamp: 2;
+    -webkit-line-clamp: 1;
     /*! autoprefixer: on;*/
     text-justify: inter-ideograph;
     word-break: break-all
diff --git a/jero-web/src/components/OcrTable/index.vue b/jero-web/src/components/OcrTable/index.vue
index 0322fdee2..1cfd56cb9 100644
--- a/jero-web/src/components/OcrTable/index.vue
+++ b/jero-web/src/components/OcrTable/index.vue
@@ -263,7 +263,7 @@
     text-overflow: ellipsis;
     /*! autoprefixer: off */
     -webkit-box-orient: vertical;
-    -webkit-line-clamp: 2;
+    -webkit-line-clamp: 1;
     /*! autoprefixer: on;*/
     text-justify: inter-ideograph;
     word-break: break-all
diff --git a/jero-web/src/components/SplitTable/DocTable.vue b/jero-web/src/components/SplitTable/DocTable.vue
index 6a6861442..365347e88 100644
--- a/jero-web/src/components/SplitTable/DocTable.vue
+++ b/jero-web/src/components/SplitTable/DocTable.vue
@@ -268,7 +268,7 @@
     text-overflow: ellipsis;
     /*! autoprefixer: off */
     -webkit-box-orient: vertical;
-    -webkit-line-clamp: 2;
+    -webkit-line-clamp: 1;
     /*! autoprefixer: on;*/
     text-justify: inter-ideograph;
     word-break: break-all
diff --git a/jero-web/src/components/SplitTable/index.vue b/jero-web/src/components/SplitTable/index.vue
index 6c425aa1c..269cb4ae2 100644
--- a/jero-web/src/components/SplitTable/index.vue
+++ b/jero-web/src/components/SplitTable/index.vue
@@ -282,7 +282,7 @@
     text-overflow: ellipsis;
     /*! autoprefixer: off */
     -webkit-box-orient: vertical;
-    -webkit-line-clamp: 2;
+    -webkit-line-clamp: 1;
     /*! autoprefixer: on;*/
     text-justify: inter-ideograph;
     word-break: break-all
diff --git a/jero-web/src/components/tableDate/index.vue b/jero-web/src/components/tableDate/index.vue
index 1137fbc59..5b2a65c70 100644
--- a/jero-web/src/components/tableDate/index.vue
+++ b/jero-web/src/components/tableDate/index.vue
@@ -273,7 +273,7 @@
     text-overflow: ellipsis;
     /*! autoprefixer: off */
     -webkit-box-orient: vertical;
-    -webkit-line-clamp: 2;
+    -webkit-line-clamp: 1;
     /*! autoprefixer: on;*/
     text-justify: inter-ideograph;
     word-break: break-all
diff --git a/jero-web/src/mixins/tableDragResize.js b/jero-web/src/mixins/tableDragResize.js
new file mode 100644
index 000000000..00a8d14c0
--- /dev/null
+++ b/jero-web/src/mixins/tableDragResize.js
@@ -0,0 +1,58 @@
+import Vue from "vue";
+import VueDraggableResizable from "vue-draggable-resizable";
+
+Vue.component("vue-draggable-resizable", VueDraggableResizable);
+function initDrag(columns) {
+  const draggingMap = {};
+  columns.forEach(col => {
+    draggingMap[col.key] = col.width;
+  });
+  const draggingState = Vue.observable(draggingMap);
+  return (h, props, children) => {
+    let thDom = null;
+    const { key, ...restProps } = props;
+    const col = columns.find(col => {
+      const k = col.dataIndex || col.key;
+      return k === key;
+    });
+    if (!col || !col.width) {
+      return <th {...restProps}>{children}</th>;
+    }
+    const onDrag = x => {
+      draggingState[key] = 0;
+      col.width = Math.max(x, 1);
+    };
+
+    const onDragstop = () => {
+      draggingState[key] = thDom.getBoundingClientRect().width;
+    };
+    return (
+      <th {...restProps} v-ant-ref={r => (thDom = r)} width={col.width} class="resize-table-th">
+      {children}
+      <vue-draggable-resizable
+    key={col.dataIndex || col.key}
+  class="table-draggable-handle"
+    w={10}
+    x={draggingState[key] || col.width}
+    z={1}
+    axis="x"
+    draggable={true}
+    resizable={false}
+    onDragging={onDrag}
+    onDragstop={onDragstop}
+      ></vue-draggable-resizable>
+      </th>
+  );
+  };
+}
+export default {
+  methods: {
+    drag(columns) {
+      return {
+        header: {
+          cell: initDrag(columns),
+        },
+      };
+    },
+  },
+};
\ No newline at end of file
diff --git a/jero-web/src/views/documentTools/searchCenter/components/DocumentLibrary.vue b/jero-web/src/views/documentTools/searchCenter/components/DocumentLibrary.vue
index 4b514b79c..8661c251c 100644
--- a/jero-web/src/views/documentTools/searchCenter/components/DocumentLibrary.vue
+++ b/jero-web/src/views/documentTools/searchCenter/components/DocumentLibrary.vue
@@ -896,7 +896,7 @@
     text-overflow: ellipsis;
     /*! autoprefixer: off */
     -webkit-box-orient: vertical;
-    -webkit-line-clamp: 2;
+    -webkit-line-clamp: 1;
     /*! autoprefixer: on;*/
     text-justify: inter-ideograph;
     word-break: break-all
diff --git a/jero-web/src/views/documentTools/virtualList/components/virtualListDetails.vue b/jero-web/src/views/documentTools/virtualList/components/virtualListDetails.vue
index 9a400b167..ea08b9c9a 100644
--- a/jero-web/src/views/documentTools/virtualList/components/virtualListDetails.vue
+++ b/jero-web/src/views/documentTools/virtualList/components/virtualListDetails.vue
@@ -942,7 +942,7 @@
     text-overflow: ellipsis;
     /*! autoprefixer: off */
     -webkit-box-orient: vertical;
-    -webkit-line-clamp: 2;
+    -webkit-line-clamp: 1;
     /*! autoprefixer: on;*/
     text-justify: inter-ideograph;
     word-break: break-all
diff --git a/jero-web/src/views/documentTools/virtualList/index.vue b/jero-web/src/views/documentTools/virtualList/index.vue
index f731a5ab4..f52fd2748 100644
--- a/jero-web/src/views/documentTools/virtualList/index.vue
+++ b/jero-web/src/views/documentTools/virtualList/index.vue
@@ -2,34 +2,34 @@
   <a-card :bordered="false">
     <div class="table-page-search-wrapper">
       <a-form layout="inline" @keyup.enter.native="searchQuery">
-      <a-row :gutter="24">
-        <a-col :md="6" :sm="8">
-          <div class="box-title-text">
-            <div class="title-text" :title="$t('VirtualListName')">
-              <span>{{$t('VirtualListName')}}</span>
+        <a-row :gutter="24">
+          <a-col :md="6" :sm="8">
+            <div class="box-title-text">
+              <div class="title-text" :title="$t('VirtualListName')">
+                <span>{{$t('VirtualListName')}}</span>
+              </div>
+              <j-input class="box-input" :placeholder="$t('PleaseEnter')+$t('VirtualListName')"
+                       v-model="queryParam.name"></j-input>
             </div>
-            <j-input class="box-input" :placeholder="$t('PleaseEnter')+$t('VirtualListName')"
-                     v-model="queryParam.name"></j-input>
-          </div>
-        </a-col>
-        <a-col :md="6" :sm="8">
-          <div class="box-title-text">
-            <div class="title-text" :title="$t('listStatus')">
-              <span>{{$t('listStatus')}}</span>
+          </a-col>
+          <a-col :md="6" :sm="8">
+            <div class="box-title-text">
+              <div class="title-text" :title="$t('listStatus')">
+                <span>{{$t('listStatus')}}</span>
+              </div>
+              <j-dict-select-tag class="box-input" v-model="queryParam.state"
+                                 :placeholder="$t('PleaseSelect')+$t('listStatus')"
+                                 :type="'select'"
+                                 :triggerChange="false" :dictCode="'dummy_inventory_state'"/>
             </div>
-            <j-dict-select-tag class="box-input" v-model="queryParam.state"
-                               :placeholder="$t('PleaseSelect')+$t('listStatus')"
-                               :type="'select'"
-                               :triggerChange="false" :dictCode="'dummy_inventory_state'"/>
-          </div>
-        </a-col>
-        <span style="float: right;overflow: hidden;margin-right: 11px" class="table-page-search-submitButtons">
+          </a-col>
+          <span style="float: right;overflow: hidden;margin-right: 11px" class="table-page-search-submitButtons">
                <a-col :md="6" :sm="24">
                   <a-button class="box-button" type="primary" @click="searchQuery">{{$t('query')}}</a-button>
                   <a-button class="box-button" style="margin-left: 8px" @click="searchReset">{{$t('reset')}}</a-button>
                </a-col>
       </span>
-      </a-row>
+        </a-row>
       </a-form>
     </div>
     <div class="table-operator">
@@ -43,12 +43,13 @@
       </div>
     </div>
     <div>
+      <!--       :components="drag(columns)"   bordered-->
       <a-table
         ref="table"
         size="middle"
         :loading="loading"
         :pagination="false"
-        :scroll="{x: true}"
+        :scroll="{x: '100%'}"
         rowKey="id"
         :data-source="dataSource"
         :row-selection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }"
@@ -133,9 +134,16 @@
 <script>
   import { getAction, postAction, downloadFile } from '@/api/manage'
   import eventBUs from '../../../common/event'
+  import Vue from 'vue'
+  import VueDraggableResizable from 'vue-draggable-resizable'
+  import tableDragResize from '@/mixins/tableDragResize'
 
   export default {
     name: 'index',
+    components: {
+      VueDraggableResizable
+    },
+    mixins: [tableDragResize],
     data() {
       return {
         loading: false,
@@ -186,16 +194,19 @@
             title: this.$t('VirtualListName'),
             align: 'center',
             dataIndex: 'name',
+            width: 640,
             scopedSlots: { customRender: 'VirtualListName' }
           },
           {
             title: this.$t('listStatus'),
             align: 'center',
+            width: 180,
             dataIndex: 'state_dictText'
           },
           {
             title: this.$t('creater'),
             align: 'center',
+            width: 180,
             dataIndex: 'createBy'
           },
           {
@@ -525,4 +536,21 @@
     background: #fff;
     border-radius: 0 0 2px 2px;
   }
+</style>
+<style lang="less">
+  .resize-table-th {
+    position: relative;
+
+    .table-draggable-handle {
+      transform: none !important;
+      position: absolute;
+      height: 100% !important;
+      bottom: 0;
+      left: auto !important;
+      right: -5px;
+      cursor: col-resize;
+      touch-action: none;
+      will-change: transform !important;
+    }
+  }
 </style>
\ No newline at end of file
diff --git a/jero-web/src/views/projectManagement/components/listOfRegulations.vue b/jero-web/src/views/projectManagement/components/listOfRegulations.vue
index 4507df672..de6be6cd0 100644
--- a/jero-web/src/views/projectManagement/components/listOfRegulations.vue
+++ b/jero-web/src/views/projectManagement/components/listOfRegulations.vue
@@ -134,7 +134,7 @@
         ref="table"
         :loading="loading"
         :pagination="false"
-        :scroll="{x: '100%',y:'calc(100vh - 200px)'}"
+        :scroll="{x: '100%',y:'calc(100vh - 420px)'}"
         rowKey="id"
         :data-source="dataSource"
         :row-selection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }"
@@ -1569,7 +1569,7 @@
     text-overflow: ellipsis;
     /*! autoprefixer: off */
     -webkit-box-orient: vertical;
-    -webkit-line-clamp: 2;
+    -webkit-line-clamp: 1;
     /*! autoprefixer: on;*/
     text-justify: inter-ideograph;
     word-break: break-all
diff --git a/jero-web/src/views/projectManagement/components/nonConformance.vue b/jero-web/src/views/projectManagement/components/nonConformance.vue
index 96cf86727..0bf23974e 100644
--- a/jero-web/src/views/projectManagement/components/nonConformance.vue
+++ b/jero-web/src/views/projectManagement/components/nonConformance.vue
@@ -335,7 +335,7 @@
     text-overflow: ellipsis;
     /*! autoprefixer: off */
     -webkit-box-orient: vertical;
-    -webkit-line-clamp: 2;
+    -webkit-line-clamp: 1;
     /*! autoprefixer: on;*/
     text-justify: inter-ideograph;
     word-break: break-all
diff --git a/jero-web/src/views/projectManagement/projectNonConformance/index.vue b/jero-web/src/views/projectManagement/projectNonConformance/index.vue
index 74f866e3d..2b15b7b1f 100644
--- a/jero-web/src/views/projectManagement/projectNonConformance/index.vue
+++ b/jero-web/src/views/projectManagement/projectNonConformance/index.vue
@@ -464,7 +464,7 @@
     text-overflow: ellipsis;
     /*! autoprefixer: off */
     -webkit-box-orient: vertical;
-    -webkit-line-clamp: 2;
+    -webkit-line-clamp: 1;
     /*! autoprefixer: on;*/
     text-justify: inter-ideograph;
     word-break: break-all
diff --git a/jero-web/src/views/system/DictList.vue b/jero-web/src/views/system/DictList.vue
index 2dfa37371..852a42dd9 100644
--- a/jero-web/src/views/system/DictList.vue
+++ b/jero-web/src/views/system/DictList.vue
@@ -63,6 +63,7 @@
         ref="table"
         rowKey="id"
         size="middle"
+        :scroll="{x: '100%'}"
         :columns="columns"
         :dataSource="dataSource"
         :pagination="ipagination"
@@ -117,7 +118,7 @@
             title: '#',
             dataIndex: '',
             key: 'rowIndex',
-            width: 120,
+            width: 80,
             align: 'center',
             customRender: function(t, r, index) {
               return parseInt(index) + 1
@@ -126,7 +127,9 @@
           {
             title: this.$t('DictionaryName'),
             align: 'center',
-            dataIndex: 'dictName'
+            dataIndex: 'dictName',
+            width: '25%',
+            ellipsis: true,
           },
           // {
           //   title: this.$t('DictionaryEnName'),
@@ -137,17 +140,22 @@
           {
             title: this.$t('DictionaryNumber'),
             align: 'center',
-            dataIndex: 'dictCode'
+            dataIndex: 'dictCode',
+            width: '25%',
+            ellipsis: true,
           },
           {
             title: this.$t('describe'),
             align: 'center',
-            dataIndex: 'description'
+            dataIndex: 'description',
+            width: '25%',
+            ellipsis: true,
           },
           {
             title: this.$t('operation'),
             dataIndex: 'action',
             align: 'center',
+            fixed: 'right',
             width: 430,
             scopedSlots: { customRender: 'action' }
           }
diff --git a/jero-web/src/views/system/PermissionList.vue b/jero-web/src/views/system/PermissionList.vue
index 5c4b494bb..fa08be07d 100644
--- a/jero-web/src/views/system/PermissionList.vue
+++ b/jero-web/src/views/system/PermissionList.vue
@@ -28,7 +28,7 @@
 
       <a-table
         :columns="columns"
-        :scroll="{x: 1500}"
+        :scroll="{x: '100%'}"
         size="middle"
         :pagination="false"
         :dataSource="dataSource"
diff --git a/jero-web/src/views/system/UserList.vue b/jero-web/src/views/system/UserList.vue
index 04842ec5b..35324c22e 100644
--- a/jero-web/src/views/system/UserList.vue
+++ b/jero-web/src/views/system/UserList.vue
@@ -97,6 +97,7 @@
       <a-table
         ref="table"
         rowKey="id"
+        :scroll="{x: '100%'}"
         :columns="columns"
         :dataSource="dataSource"
         :pagination="ipagination"
@@ -178,7 +179,8 @@
             title: this.$t('serialNumber'),
             dataIndex: '',
             key: 'rowIndex',
-            width: 20,
+            width: 50,
+            ellipsis: true,
             align: 'center',
             customRender: function(t, r, index) {
               return parseInt(index) + 1
@@ -188,6 +190,7 @@
             title: this.$t('userAccount'),
             align: 'center',
             dataIndex: 'username',
+            ellipsis: true,
             width: 120,
             sorter: true
           },
@@ -195,24 +198,28 @@
             title: this.$t('userName'),
             align: 'center',
             width: 100,
+            ellipsis: true,
             dataIndex: 'realname'
           },
           {
             title: this.$t('EmployeeNumber'),
             align: 'center',
             width: 100,
+            ellipsis: true,
             dataIndex: 'workNo'
           },
           {
             title: this.$t('EmployeeType'),
             align: 'center',
             width: 100,
+            ellipsis: true,
             dataIndex: 'workerType_dictText'
           },
           {
             title: this.$t('department'),
             align: 'center',
             width: 180,
+            ellipsis: true,
             dataIndex: 'orgCodeTxt'
           },
           // {
@@ -231,6 +238,7 @@
             title: this.$t('status'),
             align: 'center',
             width: 80,
+            ellipsis: true,
             dataIndex: 'status_dictText'
           },
           {