再次调整组织架构

fhKeeper/formulahousekeeper/timesheet/src/common/js/tensile.js

@@ -1,102 +1,102 @@
 export default {
-    data() {
-      return {
-        defaultDragArr: [{
-          // 目前只有 LR 模式；也就是left right； 左右拉扯模式
-          type: 'LR',
-          domClass: {
-            // 中间分割线的名字
-            resize: 'line-line',
-            // 左侧盒子的名字
-            left: 'box-left',
-            // 右侧盒子的名字
-            right: 'box-right',
-            // 父级的名字
-            box: 'box-father',
-          },
-          otherInfo: {
-            // 限制左边栏最低宽度
-            leftWidth: 324
-          }
-        }]
-      }
+  data() {
+    return {
+      defaultDragArr: [{
+        // 目前只有 LR 模式；也就是left right； 左右拉扯模式
+        type: 'LR',
+        domClass: {
+          // 中间分割线的名字
+          resize: 'line-line',
+          // 左侧盒子的名字
+          left: 'box-left',
+          // 右侧盒子的名字
+          right: 'box-right',
+          // 父级的名字
+          box: 'box-father',
+        },
+        otherInfo: {
+          // 限制左边栏最低宽度
+          leftWidth: 324
+        }
+      }]
+    }
+  },
+  methods: {
+    // 处理参数 进行dom节点选中
+    handleBoxInfo(boxInfo) {
+      for (const key in boxInfo)
+        if (Object.hasOwnProperty.call(boxInfo, key))
+          boxInfo[key] = document.getElementsByClassName(boxInfo[key])
+      return boxInfo
     },
-    methods: {
-      // 处理参数 进行dom节点选中
-      handleBoxInfo(boxInfo) {
-        for (const key in boxInfo)
-          if (Object.hasOwnProperty.call(boxInfo, key))
-            boxInfo[key] = document.getElementsByClassName(boxInfo[key])
-        return boxInfo
-      },
-      // 左右拉伸盒子处理函数
-      dragControllerDiv(boxInfo, otherInfo, cb) {
-        const {
-          leftWidth: oLeftWidth
-        } = otherInfo;
-        const {
-          resize,
-          left,
-          right,
-          box
-        } = this.handleBoxInfo(JSON.parse(JSON.stringify(boxInfo)))
-        console.dir(left)
-        const getOffsetLeftAndClientWidth = arr => arr.map(dom => [
-          dom[0].offsetLeft || 0,
-          dom[0].clientWidth || 0
-        ])
-        for (let i = 0; i < resize.length; i++) {
-          resize[i].onmousedown = (e) => {
-            const [
-              [leftOffset],
-              [, resizeWidth],
-              [rightLeftOffset, rightLeftWidth],
-              [boxLeftOffset]
-            ] = getOffsetLeftAndClientWidth([left, resize, right, box])
-            // 父级盒子距离右侧屏幕的margin宽度
-            const rightAllMargin = window.innerWidth - rightLeftWidth - rightLeftOffset
-  
-            const startX = e.clientX;
-            // 这里设置选中时候的 偏移 量
-            resize[i].left = resize[i].offsetLeft;
-            const boxWidth = window.innerWidth - box[i].clientWidth;
-            document.onmousemove = (e) => {
-              const endX = e.clientX;
-              // 分割线到左边的距离 + 鼠标位移了多少 - 屏幕宽度减去父级盒子宽度后的结果 - 左盒子到屏幕左侧的长度（此刻不会计算margin属性） + 分割线长度并居中恰好1.5倍（但是计算了右侧的margin则变为0.25倍）（确认拉伸时候鼠标对齐分割线） + 父级盒子距离左侧屏幕的margin宽度 + 父级盒子距离右侧屏幕的margin宽度
-              let leftWidth = resize[i].left + (endX - startX) - boxWidth - leftOffset + (resizeWidth * 0.25) + boxLeftOffset + rightAllMargin;
-              const maxT = box[i].clientWidth - (resize[i].offsetWidth - boxWidth);
-              if (leftWidth < oLeftWidth) leftWidth = oLeftWidth;
-              if (leftWidth > maxT - 50) leftWidth = maxT;
-  
-              // resize[i].style.flex = leftWidth;
-              for (let j = 0; j < left.length; j++) {
-                left[j].style.flex = `0 0 ${leftWidth}px`;
-                right[j].style.flex = `1`;
-              }
+    // 左右拉伸盒子处理函数
+    dragControllerDiv(boxInfo, otherInfo, cb) {
+      const {
+        leftWidth: oLeftWidth
+      } = otherInfo;
+      const {
+        resize,
+        left,
+        right,
+        box
+      } = this.handleBoxInfo(JSON.parse(JSON.stringify(boxInfo)))
+      console.dir(left)
+      const getOffsetLeftAndClientWidth = arr => arr.map(dom => [
+        dom[0].offsetLeft || 0,
+        dom[0].clientWidth || 0
+      ])
+      for (let i = 0; i < resize.length; i++) {
+        resize[i].onmousedown = (e) => {
+          const [
+            [leftOffset],
+            [, resizeWidth],
+            [rightLeftOffset, rightLeftWidth],
+            [boxLeftOffset]
+          ] = getOffsetLeftAndClientWidth([left, resize, right, box])
+          // 父级盒子距离右侧屏幕的margin宽度
+          const rightAllMargin = window.innerWidth - rightLeftWidth - rightLeftOffset
+
+          const startX = e.clientX;
+          // 这里设置选中时候的 偏移 量
+          resize[i].left = resize[i].offsetLeft;
+          const boxWidth = window.innerWidth - box[i].clientWidth;
+          document.onmousemove = (e) => {
+            const endX = e.clientX;
+            // 分割线到左边的距离 + 鼠标位移了多少 - 屏幕宽度减去父级盒子宽度后的结果 - 左盒子到屏幕左侧的长度（此刻不会计算margin属性） + 分割线长度并居中恰好1.5倍（但是计算了右侧的margin则变为0.25倍）（确认拉伸时候鼠标对齐分割线） + 父级盒子距离左侧屏幕的margin宽度 + 父级盒子距离右侧屏幕的margin宽度
+            let leftWidth = resize[i].left + (endX - startX) - boxWidth - leftOffset + (resizeWidth * 0.25) + boxLeftOffset + rightAllMargin;
+            const maxT = box[i].clientWidth - (resize[i].offsetWidth - boxWidth);
+            if (leftWidth < oLeftWidth) leftWidth = oLeftWidth;
+            if (leftWidth > maxT - 50) leftWidth = maxT;
+            if (leftWidth > 402) leftWidth = 402
+            // resize[i].style.flex = leftWidth;
+            for (let j = 0; j < left.length; j++) {
+              left[j].style.flex = `0 0 ${leftWidth}px`;
+              right[j].style.flex = `1`;
             }
-            this.eventOnmouseup(resize, i, cb)
-            return false;
           }
+          this.eventOnmouseup(resize, i, cb)
+          return false;
         }
-      },
-      eventOnmouseup(resize, i, cb) {
-        document.onmouseup = () => {
-          document.onmousemove = null;
-          document.onmouseup = null;
-          resize[i].releaseCapture && resize[i].releaseCapture();
-          cb && cb()
-        }
-        resize[i].setCapture && resize[i].setCapture();
-      },
-      initDrag(dragArr = this.defaultDragArr) {
-        /* 
-          dragArr: [{ domClass, otherInfo, fn }]
-          type: LR // 左右拉扯（flex布局才能成功） 
-        */
-        const fn = item => ({
-          'LR': this.dragControllerDiv
-        } [item.type] || (() => {}));
-        this.$nextTick(() => dragArr.forEach((item) => fn(item)(item.domClass, item.otherInfo)))
       }
     },
-  }
+    eventOnmouseup(resize, i, cb) {
+      document.onmouseup = () => {
+        document.onmousemove = null;
+        document.onmouseup = null;
+        resize[i].releaseCapture && resize[i].releaseCapture();
+        cb && cb()
+      }
+      resize[i].setCapture && resize[i].setCapture();
+    },
+    initDrag(dragArr = this.defaultDragArr) {
+      /* 
+        dragArr: [{ domClass, otherInfo, fn }]
+        type: LR // 左右拉扯（flex布局才能成功） 
+      */
+      const fn = item => ({
+        'LR': this.dragControllerDiv
+      } [item.type] || (() => {}));
+      this.$nextTick(() => dragArr.forEach((item) => fn(item)(item.domClass, item.otherInfo)))
+    }
+  },
+}

fhKeeper/formulahousekeeper/timesheet/src/views/team/index.vue

@@ -14,7 +14,7 @@
             <div class="tree" :style="'height:'+ (tableHeight + 83) + 'px'">
                 <!-- <el-tree :data="data" :props="defaultProps" @node-click="handleNodeClick" accordion></el-tree> -->
                 <el-tree :data="data" :props="defaultProps" :expand-on-click-node="false" accordion @node-click="handleNodeClick" :default-expanded-keys="jDarr" @node-expand="jieDian" @node-collapse="shutDown" @current-change="chufa">
-                    <span class="custom-tree-node" style="position: relative;box-sizing: border-box;width: 10%;max-width: 140px" slot-scope="{ node }" @mouseleave= mouseleave(data,$event) @mouseover= mouseover(data,$event)>
+                    <span class="custom-tree-node" style="position: relative;box-sizing: border-box;width: 10%;" slot-scope="{ node }" @mouseleave= mouseleave(data,$event) @mouseover= mouseover(data,$event)>
 
                         <span style="padding-right: 50px;box-sizing: border-box;overflow:hidden;text-overflow:ellipsis;line-height: 36px; display: inline-block;">{{ node.label }}</span>