gunter-kgd 1.0.10 → 1.0.12

package/components/gante_test/gante-gc-item-content.vue

@@ -9,7 +9,7 @@
         :style="{
                     cursor: DragObject.mouseDown ? 'grabbing' : 'grab',
                     width:current_data.width?current_data.width+'px':0,
-                    transform: `translate3d(${current_data.left?current_data.left+'px':0},10px,0)`,
+                    transform: `translate3d(${current_data.left?current_data.left+'px':0},15px,0)`,
                     transition: !DragObject.mouseDown ? 'width .5s linear, opacity .2s ease' : 'null',
                     background:current_data.bg_color?current_data.bg_color:'#FD8A25',
                     borderColor: current_data.bg_color ? `${current_data.bg_color} ${current_data.bg_color} transparent`: '#00b0ff #00b0ff transparent'}"
@@ -82,7 +82,7 @@
             buildToastContent() {
                 if (!this.current_data || !this.current_data.params) {
                     this.toastClassResolved = (this.toastClass || '').trim();
-                    return '';
+                    return { content: '', canShow: false };
                 }
                 let list = '';
                 for (let i in this.th_data) {
@@ -114,7 +114,8 @@
                 }
 
                 this.toastClassResolved = resolvedClass;
-                return resolvedContent;
+                const canShow = resolvedContent !== '';
+                return { content: resolvedContent, canShow };
             },
             showToast(e) {
                 this.canShow = true;
@@ -124,7 +125,14 @@
                     if(this.current_data && this.canShow){
                         if(this.current_data.params){
                             let toast = document.createElement('div'), add_toast = true
-                            const content = this.buildToastContent();
+                            const toastInfo = this.buildToastContent();
+                            if(!toastInfo.canShow){
+                                if (document.getElementsByClassName('gante-toast-liu')[0]) {
+                                    document.getElementsByClassName('gante-toast-liu')[0].style.display = 'none';
+                                }
+                                return;
+                            }
+                            const content = toastInfo.content;
                             const toastClass = `gante-toast-liu${this.toastClassResolved ? ' ' + this.toastClassResolved : ''}`
                             toast.setAttribute('class', toastClass)
                             if (document.getElementsByClassName('gante-toast-liu')[0]) {
@@ -300,9 +308,14 @@
                     if (document.getElementsByClassName('gante-toast-liu')[0]) {
                         toast = document.getElementsByClassName('gante-toast-liu')[0]
                         toast.style.display = 'block';
-                        const content = this.buildToastContent();
-                        if(toast.innerHTML != content || content == ''){
-                            toast.innerHTML = content
+                        const toastInfo = this.buildToastContent();
+                        if(!toastInfo.canShow){
+                            toast.style.display = 'none';
+                            return;
+                        }
+                        const content = toastInfo.content;
+                        if(toast.innerHTML != content){
+                            toast.innerHTML = content;
                         }
                     }
                 }

package/components/gante_test/gante-gc-item.vue

@@ -247,7 +247,7 @@
     }
     .gc-locate-btn{
         position: absolute;
-        top: 9px;
+        top: 13px;
         width: 18px;
         height: 22px;
         border-radius: 4px;

package/components/gante_test/gante-gc.vue

@@ -239,30 +239,109 @@
                 this.todayInfo.left = (new Date(new Date().toLocaleDateString()).getTime() - first_time.getTime())/time;
 
                 var list = [];
-                for (let i = 0; i <= all_width;) {
-                    var old_time = first_time;
-                    var date = '';
+                if (time_mode == 1) {
+                    const dayMs = 24 * 60 * 60 * 1000;
+                    let cursor = new Date(first_time);
+                    while (cursor.getTime() <= all_width) {
+                        const monthEnd = new Date(cursor.getFullYear(), cursor.getMonth() + 1, 1);
+                        const remainingDays = Math.ceil((monthEnd.getTime() - cursor.getTime()) / dayMs);
+                        if (remainingDays < 7 && list.length) {
+                            const prev = list[list.length - 1];
+                            const extraWidth = (monthEnd.getTime() - cursor.getTime()) / time;
+                            prev.width += extraWidth;
+                            this.header_width += extraWidth;
+                            cursor = monthEnd;
+                            continue;
+                        }
+                        let next = new Date(cursor.getFullYear(), cursor.getMonth(), cursor.getDate() + 7);
+                        if (next.getTime() > monthEnd.getTime()) {
+                            next = monthEnd;
+                        }
+                        const width = (next.getTime() - cursor.getTime()) / time;
+                        this.header_width += width;
+                        list.push({
+                            left: (cursor.getTime() - this.first_day.getTime()) / time,
+                            width: width,
+                            date: this.format(cursor, 2)
+                        });
+                        cursor = next;
+                        this.future_time = cursor.getTime();
+                    }
+                } else if (time_mode == 2) {
+                    const weekMs = 7 * 24 * 60 * 60 * 1000;
+                    let cursor = new Date(first_time);
+                    while (cursor.getTime() <= all_width) {
+                        const yearEnd = new Date(cursor.getFullYear() + 1, 0, 1);
+                        const remainingWeeks = Math.ceil((yearEnd.getTime() - cursor.getTime()) / weekMs);
+                        if (remainingWeeks < 4 && list.length) {
+                            const prev = list[list.length - 1];
+                            const extraWidth = (yearEnd.getTime() - cursor.getTime()) / time;
+                            prev.width += extraWidth;
+                            this.header_width += extraWidth;
+                            cursor = yearEnd;
+                            continue;
+                        }
+                        let next = new Date(cursor.getFullYear(), cursor.getMonth(), cursor.getDate() + 28);
+                        if (next.getTime() > yearEnd.getTime()) {
+                            next = yearEnd;
+                        }
+                        const width = (next.getTime() - cursor.getTime()) / time;
+                        this.header_width += width;
+                        list.push({
+                            left: (cursor.getTime() - this.first_day.getTime()) / time,
+                            width: width,
+                            date: this.format(cursor, 5)
+                        });
+                        cursor = next;
+                        this.future_time = cursor.getTime();
+                    }
+                } else if (time_mode == 3) {
+                    let cursor = new Date(first_time);
+                    while (cursor.getTime() <= all_width) {
+                        const yearEnd = new Date(cursor.getFullYear() + 1, 0, 1);
+                        const remainingMonths = (yearEnd.getFullYear() - cursor.getFullYear()) * 12 + (yearEnd.getMonth() - cursor.getMonth());
+                        if (remainingMonths < 3 && list.length) {
+                            const prev = list[list.length - 1];
+                            const extraWidth = (yearEnd.getTime() - cursor.getTime()) / time;
+                            prev.width += extraWidth;
+                            this.header_width += extraWidth;
+                            cursor = yearEnd;
+                            continue;
+                        }
+                        let next = new Date(cursor.getFullYear(), cursor.getMonth() + 3, 1);
+                        if (next.getTime() > yearEnd.getTime()) {
+                            next = yearEnd;
+                        }
+                        const width = (next.getTime() - cursor.getTime()) / time;
+                        this.header_width += width;
+                        list.push({
+                            left: (cursor.getTime() - this.first_day.getTime()) / time,
+                            width: width,
+                            date: this.format(cursor, 5)
+                        });
+                        cursor = next;
+                        this.future_time = cursor.getTime();
+                    }
+                } else {
+                    for (let i = 0; i <= all_width;) {
+                        var old_time = first_time;
+                        var date = '';
 
-                    if (time_mode == 1) {
-                        // 月的形式，保留月份显示
-                        date = this.format(old_time, 2); // 格式: YYYY-MM
-                        first_time = new Date(first_time.getFullYear(), first_time.getMonth() + 1, 1);
-                    } else {
                         // 年的形式，只展示年份
                         date = this.format(old_time, 5); // 格式: YYYY
                         first_time = new Date(first_time.getFullYear() + 1, 0, 1);
-                    }
 
-                    var width = (first_time.getTime() - old_time.getTime()) / time;
-                    this.header_width += width;
-                    list.push({
-                        left: (old_time.getTime() - this.first_day.getTime()) / time,
-                        width: width,
-                        date: date
-                    });
+                        var width = (first_time.getTime() - old_time.getTime()) / time;
+                        this.header_width += width;
+                        list.push({
+                            left: (old_time.getTime() - this.first_day.getTime()) / time,
+                            width: width,
+                            date: date
+                        });
 
-                    i = first_time.getTime();
-                    this.future_time = i;
+                        i = first_time.getTime();
+                        this.future_time = i;
+                    }
                 }
 
                 this.top_time_data = list;
@@ -404,6 +483,9 @@
         line-height: 25px;
         position: relative;
         background: #fff;
+        font-size: 14px;
+        font-weight: 800;
+        color: #000000D9;
         /*display: flex;*/
         /*justify-content: flex-start;*/
     }
@@ -415,7 +497,7 @@
 
     .ganteview-toptime .ganteview-headercell {
         padding-left: 4px;
-        text-align: left;
+        text-align: center;
     }
 
     .ganteview-bottomtime .ganteview-headercell {
@@ -437,12 +519,11 @@
         height: calc(100% - 54px);
         z-index: 0;
         box-sizing: border-box;
-        background: #dcecfe;
+        background: #5396e2;
     }
 
     .ganteview-headercell {
         box-sizing: border-box;
-        color: #666;
         border-right: 1px solid #ebeef5;
         border-bottom: 1px solid #ebeef5;
         overflow: hidden;

package/components/gante_test/gante-table.vue

@@ -332,8 +332,11 @@
 		-ms-user-select: none;
 		user-select: none;
 		text-align: left;
-        background: #fff;
-        box-sizing: border-box;
+    background: #fff;
+    box-sizing: border-box;
+    font-size: 14px;
+    font-weight: 800;
+    color: #000000D9;
 	}
 	/*.gante-tr{*/
 		/*display: table-row;*/

package/gante.vue

@@ -99,82 +99,86 @@
             }
         },
         created() {
+        this.initEmit()
+        },
+        mounted() {
+            this.init(this.getInitParams(), true)
+            this.$nextTick(function () {
+                setTimeout(() => {
+                    // 获取到左边表格所有td加起来的宽度
+                    this.find_attr(document.getElementsByClassName('gante-table-box')[0].clientWidth, this.th_data)
+                })
+            })
+
+        },
+        watch: {
+            $attrs: {
+                handler() {
+                    this.init(this.getInitParams(), true)
+                },
+                deep: true
+            }
+        },
+        methods: {
+          //初始化emit
+          initEmit() {
             commitEmit.$off('change')
             commitEmit.$on('change', (data) => {
-                this.change(data)
+              this.change(data)
             });
             commitEmit.$off('change-calendar')
             commitEmit.$on('change-calendar', (data) => {
-                this.change_calendar(data)
+              this.change_calendar(data)
             });
             // 某个单元格的点击事件
             commitEmit.$off('on-click')
             commitEmit.$on('on-click', (data) => {
-                this.onclick(data)
+              this.onclick(data)
             });
             // 拖动改变时间
             commitEmit.$off('onDragChangeTime')
             commitEmit.$on('onDragChangeTime', (oldData,data) => {
-                const resolves = (bol)=>{
-                    if(!bol){
-                        this.resetTask(this.ganteData,oldData);
-                    }
+              const resolves = (bol)=>{
+                if(!bol){
+                  this.resetTask(this.ganteData,oldData);
                 }
-                this.onDragChangeTime(data,resolves)
+              }
+              this.onDragChangeTime(data,resolves)
             });
 
 
             //懒加载
             commitEmit.$off('on-load')
             commitEmit.$on('on-load', () => {
-                /**
-                 *
-                 * @type {Function}
-                 * requestBol: 是否显示加载图标
-                 * data： 加载的数据
-                 * start_time： 最小开始时间
-                 * end_time： 最大的结束时间
-                 */
-                const resolve = ((requestBol, data, start_time, end_time) => {
-                    if (!requestBol) {
-                        this.showLoading = false
-                    }
-                    this.ganteData.push(...data)
-                    this.start_time = start_time
-                    this.end_time = end_time
-                    this.init({ganteData: this.ganteData, start_time: this.start_time, end_time: this.end_time},false)
-                    this.$nextTick(function () {
-                        this.$refs.gante_gc.requestBol = requestBol
-                    })
+              /**
+               *
+               * @type {Function}
+               * requestBol: 是否显示加载图标
+               * data： 加载的数据
+               * start_time： 最小开始时间
+               * end_time： 最大的结束时间
+               */
+              const resolve = ((requestBol, data, start_time, end_time) => {
+                if (!requestBol) {
+                  this.showLoading = false
+                }
+                this.ganteData.push(...data)
+                this.start_time = start_time
+                this.end_time = end_time
+                this.init({ganteData: this.ganteData, start_time: this.start_time, end_time: this.end_time},false)
+                this.$nextTick(function () {
+                  this.$refs.gante_gc.requestBol = requestBol
                 })
-                this.onLoad(resolve)
+              })
+              this.onLoad(resolve)
             });
 
 
             commitEmit.$off('triggerInit');
             commitEmit.$on('triggerInit', (start_time,end_time) =>{
-                this.init({start_time: start_time, end_time: end_time},false)
-            })
-        },
-        mounted() {
-            this.init(this.getInitParams(), true)
-            this.$nextTick(function () {
-                setTimeout(() => {
-                    // 获取到左边表格所有td加起来的宽度
-                    this.find_attr(document.getElementsByClassName('gante-table-box')[0].clientWidth, this.th_data)
-                })
+              this.init({start_time: start_time, end_time: end_time},false)
             })
-
-        },
-        watch: {
-            $attrs: {
-                handler() {
-                    this.init(this.getInitParams(), true)
-                },
-                deep: true
-            }
-        },
-        methods: {
+          },
             getInitParams(){
                 return Object.assign({}, this.$attrs)
             },
@@ -475,7 +479,7 @@
           display: flex;
           align-items: center;
           justify-content: space-between;
-          z-index: 99999;
+          z-index: 999;
           gap: 10px;
           .today{
             padding: 6px 10px;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "gunter-kgd",
-  "version": "1.0.10",
+  "version": "1.0.12",
   "main": "gante-vue.common.js",
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1"