doway-coms 2.2.13 → 2.2.14

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "doway-coms",
-  "version": "2.2.13",
+  "version": "2.2.14",
   "description": "doway组件库",
   "author": "dowaysoft",
   "main": "packages/index.js",

package/packages/BaseGantt/src/index.vue

@@ -7,48 +7,31 @@
       <div>
         <a-space>
           <a-radio-group
-              :size="'small'"
-              v-model="timeViewValue"
-              button-style="solid"
-              @change="timeViewChange"
+            :size="'small'"
+            v-model="timeViewValue"
+            button-style="solid"
+            @change="timeViewChange"
           >
-            <a-radio-button value="day">
-              天
-            </a-radio-button>
-            <a-radio-button value="1">
-              1小时
-            </a-radio-button>
-            <a-radio-button value="2">
-              2小时
-            </a-radio-button>
-            <a-radio-button value="4">
-              4小时
-            </a-radio-button>
-            <a-radio-button value="8">
-              8小时
-            </a-radio-button>
-            <a-radio-button value="12">
-              12小时
-            </a-radio-button>
+            <a-radio-button value="day">天</a-radio-button>
+            <a-radio-button value="1">1小时</a-radio-button>
+            <a-radio-button value="2">2小时</a-radio-button>
+            <a-radio-button value="4">4小时</a-radio-button>
+            <a-radio-button value="8">8小时</a-radio-button>
+            <a-radio-button value="12">12小时</a-radio-button>
           </a-radio-group>
         </a-space>
       </div>
     </div>
     <vxe-grid
-        border
-        show-header-overflow
-        ref="headDay"
-        class="head-grid"
-        :size="'small'"
-        header-cell-class-name="header-cell-day"
+      border
+      show-header-overflow
+      ref="headDay"
+      class="head-grid"
+      :size="'small'"
+      header-cell-class-name="header-cell-day"
     >
       <template #customSearchHeader>
-        <vxe-input
-            v-model="searchValue"
-            placeholder="搜索"
-            type="search"
-            @input="onSearch"
-        ></vxe-input>
+        <vxe-input v-model="searchValue" placeholder="搜索" type="search" @input="onSearch"></vxe-input>
       </template>
       <template #dateWeekHeader="{ column }">
         <div>
@@ -58,14 +41,13 @@
       </template>
     </vxe-grid>
     <vxe-grid
-        border
-        show-header-overflow
-        ref="headHour"
-        class="head-grid"
-        :size="'small'"
-        v-show="hourCols.length > 0"
-    >
-    </vxe-grid>
+      border
+      show-header-overflow
+      ref="headHour"
+      class="head-grid"
+      :size="'small'"
+      v-show="hourCols.length > 0"
+    ></vxe-grid>
 
     <!-- <div class="gantt-line-area" ref="lineArea">
       <div
@@ -74,11 +56,11 @@
         :key="loopLine"
         :style="{ left: loopLine + 'px', height: lineHeight + 'px' }"
       ></div>
-    </div> -->
+    </div>-->
     <div
-        class="gantt-bar-tooltip"
-        v-if="ganttBarTooltip.show === true"
-        :style="{
+      class="gantt-bar-tooltip"
+      v-if="ganttBarTooltip.show === true"
+      :style="{
         left: ganttBarTooltip.left + 'px',
         top: ganttBarTooltip.top + 'px'
       }"
@@ -86,47 +68,48 @@
       <slot name="itemTip" :item="ganttBarTooltip.item"></slot>
     </div>
     <vxe-grid
-        border
-        resizable
-        auto-resize
-        ref="bodyGrid"
-        show-overflow
-        class="mytable-scrollbar"
-        :show-header="false"
-        :size="'small'"
-        :height="computedHeight"
-        :row-config="{
+      border
+      resizable
+      auto-resize
+      ref="bodyGrid"
+      show-overflow
+      class="mytable-scrollbar"
+      :show-header="false"
+      :size="'small'"
+      :height="computedHeight"
+      :row-config="{
         isCurrent: isCurrent,
-        isHover: true
+        isHover: true,
       }"
-        :treeConfig="treeConfig"
-        :cell-class-name="cellClassName"
-        :row-class-name="rowClassName"
-        @cell-click="cellClick"
-        @scroll="bodyScroll"
-        :loading="loading"
-        @filter-change="filterChangeEvent"
-        @toggle-tree-expand="toggleTreeExpand"
+      :treeConfig="treeConfig"
+      :cell-class-name="cellClassName"
+      :row-class-name="rowClassName"
+      @cell-click="cellClick"
+      @scroll="bodyScroll"
+      :loading="loading"
+      @filter-change="filterChangeEvent"
+      @toggle-tree-expand="toggleTreeExpand"
+      :checkbox-config="checkboxConfig"
     >
       <template #content="{ row, rowIndex }">
         <div>
           <div class="gantt-line-area" v-if="rowIndex === 0" ref="lineArea">
             <div
-                class="gantt-line"
-                v-for="loopLine in lines"
-                :key="loopLine"
-                :style="{ left: loopLine + 'px', height: lineHeight + 'px' }"
+              class="gantt-line"
+              v-for="loopLine in lines"
+              :key="loopLine"
+              :style="{ left: loopLine + 'px', height: lineHeight + 'px' }"
             ></div>
           </div>
           <div
-              v-for="loopItem in row.items"
-              :key="loopItem.id"
-              :name="'gantt-bar'+loopItem.taskId"
-              :id="'gantt-bar'+loopItem.id"
-              class="gantt-bar"
-              @mouseenter="ganttBarMouseEnter($event, loopItem, rowIndex)"
-              @mouseleave="ganttBarMouseLeave($event, loopItem)"
-              :style="{
+            v-for="loopItem in row.items"
+            :key="loopItem.id"
+            :name="'gantt-bar'+loopItem.taskId"
+            :id="'gantt-bar'+loopItem.id"
+            class="gantt-bar"
+            @mouseenter="ganttBarMouseEnter($event, loopItem, rowIndex)"
+            @mouseleave="ganttBarMouseLeave($event, loopItem)"
+            :style="{
               marginLeft: loopItem.left + 'px',
               width: loopItem.width + 'px'
             }"
@@ -144,22 +127,22 @@
 
 <script>
 import { Space, Radio } from "ant-design-vue";
-import XEUtils from 'xe-utils'
-import moment from 'moment'
-import draggable from 'vuedraggable'
-import resizeDetector from 'element-resize-detector';
+import XEUtils from "xe-utils";
+import moment from "moment";
+import draggable from "vuedraggable";
+import resizeDetector from "element-resize-detector";
 export default {
   name: "BaseGantt",
   components: {
     draggable,
-    'a-space': Space,
-    'a-radio-button': Radio.Button,
-    'a-radio-group': Radio.Group,
+    "a-space": Space,
+    "a-radio-button": Radio.Button,
+    "a-radio-group": Radio.Group
   },
   data() {
     return {
-      searchValue: '',
-      timeViewValue: 'day',
+      searchValue: "",
+      timeViewValue: "day",
       loading: false,
       rowColData: {},
       minDate: null,
@@ -181,11 +164,11 @@ export default {
         left: 0,
         top: 0,
         item: {},
-        color: ''
+        color: ""
       },
       rows: [],
-      weekDay: ['周一', '周二', '周三', '周四', '周五', '周六', '周日']
-    }
+      weekDay: ["周一", "周二", "周三", "周四", "周五", "周六", "周日"]
+    };
   },
   props: {
     showSeachHeader: {
@@ -198,15 +181,15 @@ export default {
     },
     timeValue: {
       type: String,
-      default: 'day'
+      default: "day"
     },
     height: {
-      default: 'auto'
+      default: "auto"
     },
     leftCols: {
       type: Array,
       default: function() {
-        return [{ field: 'eqp', width: 100, fixed: 'left' }]
+        return [{ field: "eqp", width: 100, fixed: "left" }];
       }
     },
     cellClassName: {
@@ -217,34 +200,35 @@ export default {
       type: Function,
       default: function() {}
     },
-    treeConfig:{
+    treeConfig: {
       type: Object,
       default: function() {
-        return null
+        return null;
       }
     }
   },
   computed: {
     computedHeight: function() {
-      return this.height - this.headerHeight
+      return this.height - this.headerHeight;
     }
   },
   mounted() {
-
     let erd = resizeDetector({
-      strategy: 'scroll'
+      strategy: "scroll"
     });
-    let gridBodyDiv = this.$refs.bodyGrid.$el.getElementsByClassName('vxe-table--body')[0]
-    let vm  = this
+    let gridBodyDiv = this.$refs.bodyGrid.$el.getElementsByClassName(
+      "vxe-table--body"
+    )[0];
+    let vm = this;
     erd.listenTo(gridBodyDiv, () => {
-             vm.lineHeight = gridBodyDiv.clientHeight
+      vm.lineHeight = gridBodyDiv.clientHeight;
     });
-    this.timeViewValue = this.timeValue
+    this.timeViewValue = this.timeValue;
   },
   created() {},
   methods: {
-    toggleTreeExpand(scope){
-        // console.debug(this.$refs.bodyGrid.$el.getElementsByClassName('vxe-table--body')[0].clientHeight)
+    toggleTreeExpand(scope) {
+      // console.debug(this.$refs.bodyGrid.$el.getElementsByClassName('vxe-table--body')[0].clientHeight)
     },
     filterChangeEvent({ column }) {},
     //   headerDayCellStyle({ column, columnIndex }){
@@ -257,28 +241,28 @@ export default {
      * 视图改变后初始化表头
      */
     setLoading(b) {
-      this.loading = b
+      this.loading = b;
     },
     timeViewChange() {
-      this.initHeaders(this.dateRange)
-      this.initContent()
+      this.initHeaders(this.dateRange);
+      this.initContent();
     },
     initHeaders(dateRange) {
-      this.dateRange = dateRange
-      let contentWidth = 0
-      let minDate = moment(this.dateRange[0])
-      let maxDate = moment(this.dateRange[1])
-      let splitCount = 1
-      let diffDays = maxDate.diff(minDate, 'day')
-      this.monthCols = []
-      this.dayCols = []
-      this.hourCols = []
-      this.lines = []
-      let bodyCols = []
-      this.fixedColWidth = 0
+      this.dateRange = dateRange;
+      let contentWidth = 0;
+      let minDate = moment(this.dateRange[0]);
+      let maxDate = moment(this.dateRange[1]);
+      let splitCount = 1;
+      let diffDays = maxDate.diff(minDate, "day");
+      this.monthCols = [];
+      this.dayCols = [];
+      this.hourCols = [];
+      this.lines = [];
+      let bodyCols = [];
+      this.fixedColWidth = 0;
       for (let i = 0; i < this.leftCols.length; i++) {
-        if (this.leftCols[i].fixed == 'left') {
-          this.fixedColWidth = this.fixedColWidth + this.leftCols[i].width
+        if (this.leftCols[i].fixed == "left") {
+          this.fixedColWidth = this.fixedColWidth + this.leftCols[i].width;
         }
         let obj = {
           field: this.leftCols[i].field,
@@ -287,15 +271,15 @@ export default {
           width: this.leftCols[i].width
           // filters:[{data:null}],
           // filterRender:{name: 'input'}
-        }
-        if(this.leftCols[i].treeNode===true){
-          obj['treeNode'] = true
+        };
+        if (this.leftCols[i].treeNode === true) {
+          obj["treeNode"] = true;
         }
 
         if (this.leftCols[i].slots) {
-          obj.slots = this.leftCols[i].slots
+          obj.slots = this.leftCols[i].slots;
         }
-        this.monthCols.push()
+        this.monthCols.push();
 
         // tmp.filters=undefined
         // tmp.filterRender=undefined
@@ -306,155 +290,155 @@ export default {
         // this.dayCols.push(tmp)
         // obj.filters=[{data:null}]
         // obj.filterRender={name:'input'}
-        bodyCols.push(obj)
-        if (this.timeViewValue !== 'day') {
-          this.splitHour = parseInt(this.timeViewValue)
-          this.hourCols.push(obj)
-          this.colWidth = 60
-          splitCount = 24 / this.splitHour
+        bodyCols.push(obj);
+        if (this.timeViewValue !== "day") {
+          this.splitHour = parseInt(this.timeViewValue);
+          this.hourCols.push(obj);
+          this.colWidth = 60;
+          splitCount = 24 / this.splitHour;
         } else {
-          this.splitHour = 24
-          this.colWidth = 130
-          splitCount = 1
+          this.splitHour = 24;
+          this.colWidth = 130;
+          splitCount = 1;
         }
       }
 
       let tmp = {
-        type: 'seq',
-        fixed: 'left',
-        title: '',
+        type: "seq",
+        fixed: "left",
+        title: "",
 
         width: this.fixedColWidth
-      }
+      };
       if (this.showSeachHeader) {
         tmp.slots = {
-          header: 'customSearchHeader'
-        }
+          header: "customSearchHeader"
+        };
       }
-      this.dayCols.push(tmp)
+      this.dayCols.push(tmp);
 
-      let tempYearMonthCol = null
+      let tempYearMonthCol = null;
       for (let i = 0; i <= diffDays; i++) {
         if (tempYearMonthCol === null) {
           tempYearMonthCol = {
-            title: minDate.format('YYYY-MM'),
-            field: minDate.format('YYYY-MM'),
+            title: minDate.format("YYYY-MM"),
+            field: minDate.format("YYYY-MM"),
             width: this.colWidth * splitCount
-          }
-          this.monthCols.push(tempYearMonthCol)
+          };
+          this.monthCols.push(tempYearMonthCol);
         } else {
           tempYearMonthCol.width =
-              tempYearMonthCol.width + this.colWidth * splitCount
+            tempYearMonthCol.width + this.colWidth * splitCount;
         }
 
         //添加天数
         let tempDayCol = {
-          title: minDate.format('YYYY年MM月DD日'),
-          field: minDate.format('YYYY-MM-DD'),
+          title: minDate.format("YYYY年MM月DD日"),
+          field: minDate.format("YYYY-MM-DD"),
           width: this.colWidth * splitCount,
-          align: 'center',
+          align: "center",
           slots: {
-            header: 'dateWeekHeader'
+            header: "dateWeekHeader"
           },
           params: {
-            date: minDate.format('YYYY年MM月DD日'),
-            week: this.weekDay[minDate.format('E') - 1]
+            date: minDate.format("YYYY年MM月DD日"),
+            week: this.weekDay[minDate.format("E") - 1]
           }
-        }
-        this.dayCols.push(tempDayCol)
+        };
+        this.dayCols.push(tempDayCol);
         //添加小时
-        if (this.timeViewValue !== 'day') {
+        if (this.timeViewValue !== "day") {
           for (let j = 0; j < splitCount; j++) {
-            let tempHour = j * this.splitHour
-            tempHour = '000' + tempHour
-            tempHour = tempHour.substr(tempHour.length - 2, 2)
-            contentWidth = contentWidth + this.colWidth
+            let tempHour = j * this.splitHour;
+            tempHour = "000" + tempHour;
+            tempHour = tempHour.substr(tempHour.length - 2, 2);
+            contentWidth = contentWidth + this.colWidth;
             this.hourCols.push({
-              field: minDate.format('YYYY-MM-DD') + ' ' + tempHour + ':00:00',
+              field: minDate.format("YYYY-MM-DD") + " " + tempHour + ":00:00",
               title: tempHour,
               width: this.colWidth
-            })
+            });
           }
         } else {
-          contentWidth = contentWidth + tempDayCol.width
+          contentWidth = contentWidth + tempDayCol.width;
         }
-        minDate.add(1, 'day')
-        if (minDate.format('YYYY-MM') !== tempYearMonthCol.field) {
-          tempYearMonthCol = null
+        minDate.add(1, "day");
+        if (minDate.format("YYYY-MM") !== tempYearMonthCol.field) {
+          tempYearMonthCol = null;
         }
       }
-      let colLength = this.dayCols.length
+      let colLength = this.dayCols.length;
       //   this.$refs.headMonth.reloadColumn(this.monthCols)
-      this.$refs.headDay.reloadColumn(this.dayCols)
-      if (this.timeViewValue !== 'day') {
-        this.headerHeight = 160
-        colLength = this.hourCols.length
-        this.$refs.headHour.reloadColumn(this.hourCols)
+      this.$refs.headDay.reloadColumn(this.dayCols);
+      if (this.timeViewValue !== "day") {
+        this.headerHeight = 160;
+        colLength = this.hourCols.length;
+        this.$refs.headHour.reloadColumn(this.hourCols);
       } else {
-        this.headerHeight = 120
+        this.headerHeight = 120;
       }
       for (let i = 0; i < colLength; i++) {
-        this.lines.push(i * this.colWidth)
+        this.lines.push(i * this.colWidth);
       }
       bodyCols.push({
-        field: 'content',
-        title: '内容',
+        field: "content",
+        title: "内容",
         width: contentWidth,
-        className: 'custom-cell',
+        className: "custom-cell",
         slots: {
-          default: 'content'
+          default: "content"
         }
-      })
-      this.$refs.bodyGrid.reloadColumn(bodyCols)
+      });
+      this.$refs.bodyGrid.reloadColumn(bodyCols);
       //   this.$refs.lineArea.style.marginLeft =
       //       ((this.fixedColWidth-this.colWidth)) + 'px'
     },
     loadData(rows) {
-      this.rows = rows
-      this.initContent()
+      this.rows = rows;
+      this.initContent();
     },
     initContent() {
-      let splitMinutes = XEUtils.multiply(this.splitHour, 60)
-      let minDateTime = this.dateRange[0]
+      let splitMinutes = XEUtils.multiply(this.splitHour, 60);
+      let minDateTime = this.dateRange[0];
       for (let i = 0; i < this.rows.length; i++) {
-        this.rows[i]['content'] = ''
+        this.rows[i]["content"] = "";
         for (let j = 0; j < this.rows[i].items.length; j++) {
           let diffMiniutes = moment(this.rows[i].items[j].start).diff(
-              moment(minDateTime),
-              'minutes'
-          )
+            moment(minDateTime),
+            "minutes"
+          );
           let tempLeft = XEUtils.divide(
-              XEUtils.multiply(this.colWidth, diffMiniutes),
-              splitMinutes
-          )
+            XEUtils.multiply(this.colWidth, diffMiniutes),
+            splitMinutes
+          );
           //计算左边距
-          this.rows[i].items[j]['left'] = tempLeft
+          this.rows[i].items[j]["left"] = tempLeft;
           //计算宽度
           let ordMinutes = moment(this.rows[i].items[j].end).diff(
-              moment(this.rows[i].items[j].start),
-              'minutes'
-          )
+            moment(this.rows[i].items[j].start),
+            "minutes"
+          );
           let tempWidth = XEUtils.divide(
-              XEUtils.multiply(this.colWidth, ordMinutes),
-              splitMinutes
-          )
-          this.rows[i].items[j]['width'] = tempWidth
+            XEUtils.multiply(this.colWidth, ordMinutes),
+            splitMinutes
+          );
+          this.rows[i].items[j]["width"] = tempWidth;
         }
       }
-      this.lineHeight = this.rows.length * 40
-      this.$refs.bodyGrid.reloadData(this.rows)
+      this.lineHeight = this.rows.length * 40;
+      this.$refs.bodyGrid.reloadData(this.rows);
     },
     ganttBarMouseEnter(evt, ordInfo, rowIndex) {
-      this.ganttBarTooltip.left = evt.clientX //ordInfo.left + this.eqpWidth
+      this.ganttBarTooltip.left = evt.clientX; //ordInfo.left + this.eqpWidth
       this.ganttBarTooltip.top =
-          evt.clientY + evt.target.offsetHeight - evt.offsetY // (rowIndex + 1) * this.rowHeight
-      this.ganttBarTooltip.item = ordInfo
-      this.ganttBarTooltip.show = true
-      this.$emit('mouseEnter',ordInfo)
+        evt.clientY + evt.target.offsetHeight - evt.offsetY; // (rowIndex + 1) * this.rowHeight
+      this.ganttBarTooltip.item = ordInfo;
+      this.ganttBarTooltip.show = true;
+      this.$emit("mouseEnter", ordInfo);
     },
     ganttBarMouseLeave(evt, ordInfo) {
-      this.ganttBarTooltip.show = false
-      this.$emit('mouseLeave',ordInfo)
+      this.ganttBarTooltip.show = false;
+      this.$emit("mouseLeave", ordInfo);
     },
     bodyScroll(scrollInfo) {
       if (scrollInfo.isX === true) {
@@ -462,27 +446,27 @@ export default {
         //   (scrollInfo.scrollLeft-(this.fixedColWidth-this.colWidth)) * -1 + 'px'
 
         // this.$refs.headMonth.scrollTo(scrollInfo.scrollLeft)
-        this.$refs.headDay.scrollTo(scrollInfo.scrollLeft)
-        this.$refs.headHour.scrollTo(scrollInfo.scrollLeft)
+        this.$refs.headDay.scrollTo(scrollInfo.scrollLeft);
+        this.$refs.headHour.scrollTo(scrollInfo.scrollLeft);
       }
     },
     setCurrentRow(row) {
-      this.$refs.bodyGrid.setCurrentRow(row)
+      this.$refs.bodyGrid.setCurrentRow(row);
     },
     getTableData() {
-      return this.$refs.bodyGrid.getTableData().fullData
+      return this.$refs.bodyGrid.getTableData().fullData;
     },
     cellClick(scope) {
-      this.$emit('cellClick', scope)
+      this.$emit("cellClick", scope);
     },
     onSearch() {
-      this.$emit('search', this.searchValue)
+      this.$emit("search", this.searchValue);
     },
     scrollRow(row) {
-      this.$refs.bodyGrid.scrollToRow(row)
+      this.$refs.bodyGrid.scrollToRow(row);
     }
   }
-}
+};
 </script>
 
 <style lang="scss">
@@ -494,10 +478,10 @@ export default {
   padding-right: 0px !important;
 }
 .head-grid
-.vxe-table
-.vxe-table--render-wrapper
-.vxe-table--main-wrapper
-.vxe-table--body-wrapper {
+  .vxe-table
+  .vxe-table--render-wrapper
+  .vxe-table--main-wrapper
+  .vxe-table--body-wrapper {
   height: 0px !important;
 }
 .head-grid .vxe-table .vxe-table--empty-content {