gunter-kgd 1.0.4 → 1.0.6

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

@@ -3,6 +3,7 @@
     <div
         @mousemove.passive="showToast"
         @mouseleave="hideToast"
+        @click.stop="handleClick"
         @mousedown="dragDown($event,'drag')"
         :style="{
                     cursor: DragObject.mouseDown ? 'grabbing' : 'grab',
@@ -30,6 +31,7 @@
                 requestId: '',
                 canShow: false,// 是否可以显示toast ,为了防止触发了mouseout事件后立马触发showToast事件
                 toastClassResolved: '',
+                justDragged: false,
                 DragObject:{
                     startX: 0, // 开始的位置
                     mouseDown: false,// 是否按下了鼠标
@@ -56,6 +58,19 @@
             toastClass: String,
         },
         methods:{
+            handleClick(){
+                if(this.DragObject.mouseDown || this.justDragged){
+                    return;
+                }
+                if(!this.current_data){
+                    return;
+                }
+                emitter.$emit('on-click', {
+                    argument: 'taskBar',
+                    value: this.current_data.gunter_id,
+                    data: JSON.parse(JSON.stringify(this.current_data))
+                });
+            },
             buildToastContent() {
                 if (!this.current_data || !this.current_data.params) {
                     this.toastClassResolved = (this.toastClass || '').trim();
@@ -159,6 +174,7 @@
             dragDown(e,type){
                 if(this.current_data){
                     if(this.current_data.params){
+                        this.justDragged = false;
                         this.DragObject.mouseDown = true;
                         this.DragObject.startX = e.clientX;
                         this.DragObject.move_type = type;
@@ -198,6 +214,7 @@
             // 拖动时间
             doc_move(e){
                 if(this.DragObject.mouseDown){
+                    this.justDragged = true;
                     this.hideToast();
                     let move_mode_width = 0, // 宽度基值
                         move_mode_left = 0; // left基值
@@ -325,6 +342,11 @@
                     move_type: null,
                 };
                 this.hideToast();
+                if(this.justDragged){
+                    setTimeout(() => {
+                        this.justDragged = false;
+                    }, 30);
+                }
             }
         }
     }

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

@@ -13,7 +13,28 @@
                     :time_1px="time_1px"
                     :time_mode="time_mode"
                     :toast-render="toastRender"
-                    :toast-class="toastClass"></ganteGcItemContent>
+                    :toast-class="toastClass"
+                    :instance-id="instanceId"></ganteGcItemContent>
+                <button
+                    v-if="shouldShowLocateStart(item)"
+                    type="button"
+                    class="gc-locate-btn gc-locate-btn--left"
+                    title="定位到开始时间"
+                    @mousedown.stop.prevent
+                    @click.stop="locateItem(item,'start')"
+                    :style="getLocateBtnStyle('left')">
+                    <span class="gc-locate-btn__arrow">&lt;</span>
+                </button>
+                <button
+                    v-if="shouldShowLocateEnd(item)"
+                    type="button"
+                    class="gc-locate-btn gc-locate-btn--right"
+                    title="定位到结束时间"
+                    @mousedown.stop.prevent
+                    @click.stop="locateItem(item,'end')"
+                    :style="getLocateBtnStyle('right')">
+                    <span class="gc-locate-btn__arrow">&gt;</span>
+                </button>
                 <!--<ganteDragCircle :current_data="item"></ganteDragCircle>-->
             </div>
             <ganteview-item
@@ -26,7 +47,8 @@
                 :time_mode="time_mode"
                 :toast-render="toastRender"
                 :toast-class="toastClass"
-                :gante_data="item.children">
+                :gante_data="item.children"
+                :instance-id="instanceId">
                 <span style="display: none">1</span>
             </ganteview-item>
         </div>
@@ -36,6 +58,7 @@
 </template>
 <script>
     import ganteGcItemContent from './gante-gc-item-content'
+    import commitEmit from './commit'
     // import ganteDragCircle from './gante-drag-circle'
     export default {
         name: 'ganteview-item',
@@ -46,6 +69,10 @@
             return {
                 canAnimation: false,
                 bol: false,
+                scrollInfo:{
+                    scrollLeft: 0,
+                    clientWidth: 0,
+                }
             }
         },
         props: {
@@ -57,8 +84,129 @@
             end_time: {},
             toastRender: Function,
             toastClass: String,
+            instanceId: String,
+        },
+        created() {
+            this._onGcScroll = (info = {}) => {
+                if(info && typeof info === 'object' && (!info.instanceId || info.instanceId === this.instanceId)){
+                    this.scrollInfo.scrollLeft = Number(info.scrollLeft) || 0
+                    this.scrollInfo.clientWidth = Number(info.clientWidth) || 0
+                }
+            }
+            commitEmit.$on('gc-scroll', this._onGcScroll)
+        },
+        destroyed() {
+            if(this._onGcScroll){
+                commitEmit.$off('gc-scroll', this._onGcScroll)
+                this._onGcScroll = null
+            }
         },
         methods: {
+            getScroller(){
+                if(this.$el && this.$el.closest){
+                    const found = this.$el.closest('.ganteview')
+                    if(found){
+                        return found
+                    }
+                }
+                return document.getElementsByClassName('ganteview')[0] || null
+            },
+            getItemRange(item){
+                const start = Number(item && item.left) || 0
+                const width = Number(item && item.width) || 0
+                const end = start + width
+                return { start, end }
+            },
+            getLocateBtnStyle(side){
+                const padding = 6
+                const btnWidth = 18
+                const viewLeft = Number(this.scrollInfo.scrollLeft) || 0
+                const viewWidth = Number(this.scrollInfo.clientWidth) || 0
+                if(!viewWidth){
+                    return {}
+                }
+                let left = viewLeft + padding
+                if(side === 'right'){
+                    left = viewLeft + viewWidth - btnWidth - padding
+                    if(left < viewLeft + padding){
+                        left = viewLeft + padding
+                    }
+                }
+                return { left: left + 'px' }
+            },
+            shouldShowLocateStart(item){
+                if(!item || item.left == null || !this.scrollInfo.clientWidth){
+                    return false
+                }
+                const { start, end } = this.getItemRange(item)
+                const barEnd = end || start
+                const padding = 20
+                const viewStart = this.scrollInfo.scrollLeft
+                const viewEnd = viewStart + this.scrollInfo.clientWidth
+                const fullyLeft = barEnd < viewStart
+                const fullyRight = start > viewEnd
+                if(fullyLeft){
+                    return true
+                }
+                if(fullyRight){
+                    return false
+                }
+                return start < viewStart + padding
+            },
+            shouldShowLocateEnd(item){
+                if(!item || item.left == null || !this.scrollInfo.clientWidth){
+                    return false
+                }
+                const { start, end } = this.getItemRange(item)
+                const barEnd = end || start
+                const padding = 20
+                const viewStart = this.scrollInfo.scrollLeft
+                const viewEnd = viewStart + this.scrollInfo.clientWidth
+                const fullyLeft = barEnd < viewStart
+                const fullyRight = start > viewEnd
+                if(fullyRight){
+                    return true
+                }
+                if(fullyLeft){
+                    return false
+                }
+                return barEnd > viewEnd - padding
+            },
+            locateItem(item,edge){
+                const scroller = this.getScroller()
+                if(!scroller){
+                    return
+                }
+                const { start, end } = this.getItemRange(item)
+                const viewStart = scroller.scrollLeft
+                const viewEnd = viewStart + scroller.clientWidth
+                const padding = 20
+                let nextScroll = null
+
+                if(edge === 'start'){
+                    if(start < viewStart + padding || start > viewEnd - padding){
+                        nextScroll = Math.max(start - padding,0)
+                    }
+                }else{
+                    const targetEdge = end || start
+                    if(targetEdge > viewEnd - padding || targetEdge < viewStart + padding){
+                        nextScroll = Math.max(targetEdge - scroller.clientWidth + padding,0)
+                    }
+                }
+                if(nextScroll === null){
+                    return
+                }
+                const maxScroll = Math.max(0,(scroller.scrollWidth || 0) - scroller.clientWidth)
+                const resolved = Math.min(nextScroll,maxScroll)
+                if(Math.abs(resolved - viewStart) < 1){
+                    return
+                }
+                if(scroller.scrollTo){
+                    scroller.scrollTo({left: resolved,behavior:'smooth'})
+                }else{
+                    scroller.scrollLeft = resolved
+                }
+            },
             // 进入到了tr上
             enterTr(ev, tr) {
                 this.$set(tr, 'is_hover', true)
@@ -91,5 +239,38 @@
     .ganteview-content-one.gj_hover_class{
         background: rgba(246, 246, 246, 0.7);
     }
+    .gc-locate-btn{
+        position: absolute;
+        top: 9px;
+        width: 18px;
+        height: 22px;
+        border-radius: 4px;
+        border: 1px solid rgba(0,0,0,0.12);
+        background: rgba(255,255,255,0.92);
+        cursor: pointer;
+        padding: 0;
+        display: inline-flex;
+        align-items: center;
+        justify-content: center;
+        color: #00a578;
+        box-shadow: 0 2px 8px rgba(0,0,0,0.08);
+        z-index: 4;
+        &:hover{
+            background: #fff;
+            border-color: rgba(0,165,120,0.4);
+        }
+        .gc-locate-btn__arrow{
+            font-weight: 700;
+            font-size: 12px;
+            line-height: 1;
+        }
+    }
+    .gc-locate-btn--left{
+        margin-right: 6px;
+    }
+    .gc-locate-btn--right{
+        margin-left: 6px;
+        margin-right: 6px;
+    }
 
 </style>

package/components/gante_test/gante-gc.vue

@@ -3,7 +3,7 @@
     <div ref="ganteview" class="ganteview-box">
         <div @scroll.passive="ganteview_scroll" class="ganteview">
 <!--            <div class="current_move_time">{{current_move_time}}</div>-->
-            <div class="ganteview-header">
+            <div class="ganteview-header" :style="{width: header_width + 'px'}">
                 <div class="ganteview-toptime">
                     <div class="ganteview-headercell" :title="item.date" v-for="item in top_time_data"
                          :style="{width:item.width+'px',left:item.left+'px'}">{{item.date}}
@@ -23,6 +23,7 @@
                 :time_mode="time_mode"
                 :toast-render="toastRender"
                 :toast-class="toastClass"
+                :instance-id="instanceId"
                 :style="{width:header_width+'px'}"
                 v-if="show_item"
                 class="ganteview-content-box"
@@ -73,6 +74,7 @@
             end_time: {},
             toastRender: Function,
             toastClass: String,
+            instanceId: String,
         },
         methods: {
             remove_before(item){
@@ -80,10 +82,18 @@
             },
             ganteview_scroll(e) {
 //        让左侧表格跟随滚动
-                document.getElementsByClassName('gante-tbody')[0].style.top = -(e.target.scrollTop) + 'px'
-                document.getElementsByClassName('ganteview-header')[0].style.left = -(e.target.scrollLeft) + 'px'
+                const container = this.$el && this.$el.closest ? this.$el.closest('.gante-box') : null
+                const tbody = container ? container.querySelector('.gante-tbody') : null
+                const header = this.$el ? this.$el.querySelector('.ganteview-header') : null
+                if(tbody){
+                    tbody.style.top = -(e.target.scrollTop) + 'px'
+                }
+                if(header){
+                    header.style.left = -(e.target.scrollLeft) + 'px'
+                }
                 this.$parent.show_calendar = false
                 let scrollEl = e.target
+                commitEmit.$emit('gc-scroll', { scrollLeft: scrollEl.scrollLeft, clientWidth: scrollEl.clientWidth, instanceId: this.instanceId })
                 if(scrollEl.scrollHeight <= scrollEl.scrollTop + scrollEl.clientHeight && this.requestBol){
                     this.requestBol = false
                     commitEmit.$emit('on-load')
@@ -186,6 +196,12 @@
                 this.get_top_time(mode, this.first_day, time, all_time, time_mode)
                 this.time_1px = time;
                 this.time_mode = time_mode;
+                this.$nextTick(() => {
+                    const el = this.$el && this.$el.querySelector ? this.$el.querySelector('.ganteview') : null
+                    if(el){
+                        commitEmit.$emit('gc-scroll', { scrollLeft: el.scrollLeft, clientWidth: el.clientWidth, instanceId: this.instanceId })
+                    }
+                })
                 return {time: time, start_time: start_time}
             },
             /**
@@ -380,6 +396,7 @@
         height: 25px;
         font-size: 13px;
         z-index: 2;
+        background: #fff;
     }
 
     .ganteview-toptime, .ganteview-bottomtime {

package/components/gante_test/gante-split.vue

@@ -1,11 +1,6 @@
 <!--中间分割线，分割左侧表格和右侧图表-->
 <template>
 	<div @mousedown="down"  ref="split_liu" :style="{left:Number(left)?left+'px':left}" class="gante-split-liu">
-		<!--<div class="gante-split-column">-->
-			<!--<div></div>-->
-			<!--<div></div>-->
-			<!--<div></div>-->
-		<!--</div>-->
 		<div v-show="show_split" :style="{left:split_resize_left+'px'}" class="gante-split-liu-resize"></div>
 	</div>
 </template>
@@ -17,14 +12,23 @@
 			return{
 				show_split:false,
 				split_resize_left:0,
-				mouseDown:false
+				mouseDown:false,
+                rafId: 0,
+                lastResizePayload: null,
 			}
 		},
-		props:['left','th_data'],
+		props:{
+            left: [Number,String],
+            th_data: Object,
+            onSplitResize: Function,
+        },
 		mounted(){
 
 		},
-		methods:{
+        methods:{
+            getContainer(){
+                return this.$el && this.$el.closest ? this.$el.closest('.gante-box') : null;
+            },
 			//      获取元素距离浏览器的距离
 			getPos(ele){
 				var p=ele.offsetParent;
@@ -48,10 +52,15 @@
 			doc_move(e){
 				if(this.mouseDown){
 					var _body = document.getElementsByTagName('body')[0];
+                    const container = this.getContainer();
+                    const tableBox = container ? container.querySelector('.gante-table-box') : null;
+                    const gcBox = container ? container.querySelector('.ganteview-box') : null;
+                    if(!tableBox || !gcBox){
+                        return;
+                    }
 					let _left = e.pageX - this.$refs.split_liu.getBoundingClientRect().left +3, // 移动的距离
-                        _width = document.getElementsByClassName('gante-table-box')[0].offsetWidth, // 表格的宽度
-                        _width_gc = document.getElementsByClassName('ganteview-box')[0].offsetWidth; // 图表的宽度
-					console.log(_left)
+                        _width = tableBox.offsetWidth, // 表格的宽度
+                        _width_gc = gcBox.offsetWidth; // 图表的宽度
 					if(_left + _width <= 480){
                         _left = 480 - _width
                     }
@@ -65,7 +74,13 @@
 			doc_up(){
 				if(this.mouseDown){
 					var _body = document.getElementsByTagName('body')[0]
-					this.$parent.tabe_width = this.split_resize_left + document.getElementsByClassName('gante-table-box')[0].offsetWidth;
+                    const container = this.getContainer();
+                    const tableBox = container ? container.querySelector('.gante-table-box') : null;
+                    const gcBox = container ? container.querySelector('.ganteview-box') : null;
+                    const baseTableWidth = tableBox ? tableBox.offsetWidth : 0;
+                    const baseGanttWidth = gcBox ? gcBox.offsetWidth : 0;
+                    const delta = this.split_resize_left;
+					this.$parent.tabe_width = delta + baseTableWidth;
                     this.find_attr(this.$parent.tabe_width,this.th_data)
 					this.show_split = false
 					this.split_resize_left = 0
@@ -74,8 +89,34 @@
 					_body.style.cursor = null
 					document.removeEventListener('mousemove',this.doc_move,false)
 					document.removeEventListener('mouseup',this.doc_up,false)
+
+                    this.emitResize(this.$parent.tabe_width, baseGanttWidth - delta, true)
 				}
 			},
+            emitResize(tableWidth,ganttWidth,isFinal){
+                if(!isFinal){
+                    return
+                }
+                if(typeof this.onSplitResize !== 'function'){
+                    return
+                }
+                this.lastResizePayload = {
+                    tableWidth,
+                    ganttWidth,
+                    isFinal,
+                }
+                if(this.rafId){
+                    return
+                }
+                this.rafId = requestAnimationFrame(() => {
+                    this.rafId = 0
+                    if(!this.lastResizePayload){
+                        return
+                    }
+                    this.onSplitResize(this.lastResizePayload)
+                    this.lastResizePayload = null
+                })
+            },
 			down(){
 				this.mouseDown = true
 				this.show_split = true

package/components/gante_test/gante-table.vue

@@ -33,6 +33,8 @@
 				},
 				proxy_left:0,
 				show_proxy:false,
+                rafId: 0,
+                lastResizePayload: null,
 			}
 		},
 		props:{
@@ -40,8 +42,53 @@
 			data:Array,
       showLoading:Boolean,
       cellSlots: Object,
+      onColumnResize: Function,
 		},
 		methods:{
+            getContainer(){
+                return this.$el && this.$el.closest ? this.$el.closest('.gante-box') : null;
+            },
+            getTableBox(){
+                const container = this.getContainer();
+                return container ? container.querySelector('.gante-table-box') : null;
+            },
+            collectColumnWidths(changedKey,changedWidth){
+                const columnWidths = {}
+                let tableWidth = 0
+                for(let key in this.th_data){
+                    const th = this.th_data[key] || {}
+                    if(th.show === false){
+                        continue
+                    }
+                    let width = th.width ? Number(th.width) : 80
+                    if(changedKey && key === changedKey && typeof changedWidth === 'number' && !Number.isNaN(changedWidth)){
+                        width = changedWidth
+                    }
+                    columnWidths[key] = width
+                    tableWidth += width
+                }
+                return { columnWidths, tableWidth }
+            },
+            emitColumnResize(payload){
+                if(!payload || payload.isFinal !== true){
+                    return
+                }
+                if(typeof this.onColumnResize !== 'function'){
+                    return
+                }
+                this.lastResizePayload = payload
+                if(this.rafId){
+                    return
+                }
+                this.rafId = requestAnimationFrame(() => {
+                    this.rafId = 0
+                    if(!this.lastResizePayload){
+                        return
+                    }
+                    this.onColumnResize(this.lastResizePayload)
+                    this.lastResizePayload = null
+                })
+            },
 		    //排序
             sortCaret(mode,key){
                 let cla = 'asc',assign_key = key
@@ -97,8 +144,12 @@
           return; // 如果是水平滚动，直接返回不处理
         }
 				let speed = -200
-        let  scrollTop = document.getElementsByClassName('ganteview')[0].scrollTop,
-            ganteview = document.getElementsByClassName('ganteview')[0]
+        const container = this.$el && this.$el.closest ? this.$el.closest('.gante-box') : null
+        const ganteview = container ? container.querySelector('.ganteview') : null
+        if(!ganteview){
+            return;
+        }
+        let  scrollTop = ganteview.scrollTop
         if(e.wheelDelta && e.wheelDelta < 0){//兼容IE,Opera,Chrome
             speed = 200
         }else if(e.detail > 0){
@@ -141,7 +192,11 @@
 			doc_move(e){
 				var _body = document.getElementsByTagName('body')[0]
 				if(this.tTD.mouseDown){
-					var gante_left = this.getPos(this.$refs.gante_table).x,cel = e.clientX,gante_table_box = document.getElementsByClassName('gante-table-box')[0]
+                    const gante_table_box = this.getTableBox()
+                    if(!gante_table_box){
+                        return;
+                    }
+					var gante_left = this.getPos(this.$refs.gante_table).x,cel = e.clientX
 					if(gante_table_box.scrollLeft){
 						cel = cel + gante_table_box.scrollLeft
 					}
@@ -159,7 +214,11 @@
                 if(e.target.tagName === 'SPAN' ||e.target.tagName === 'I'){
                     return;
                 }
-				var table_width = this.getPos(this.$refs.gante_table).x,target=e.target,client_x = e.clientX,gante_table_box = document.getElementsByClassName('gante-table-box')[0]
+                const gante_table_box = this.getTableBox()
+                if(!gante_table_box){
+                    return;
+                }
+				var table_width = this.getPos(this.$refs.gante_table).x,target=e.target,client_x = e.clientX
 				if(target.classList.contains('cell')){
 					target = target.parentNode
 				}
@@ -184,7 +243,9 @@
                     // 设置拖动后的宽度
 					this.th_data[this.tTD.current_index].width = this.old_width+(this.proxy_left - this.oldx)
                     // 获取到左边表格所有td加起来的宽度
-                    let str = 0,_width = document.getElementsByClassName('gante-table-box')[0].offsetWidth;
+                    const gante_table_box = this.getTableBox()
+                    const _width = gante_table_box ? gante_table_box.offsetWidth : 0;
+                    let str = 0;
                     for(let key in this.th_data){
                         if(this.th_data[key].show != false){
                             str += this.th_data[key].width ? Number(this.th_data[key].width) + 1 : 81;
@@ -193,6 +254,12 @@
                     if(str < _width){
                         this.$parent.tabe_width = (str + 2) <= 480 ? 480 : (str + 2) + 'px';
                     }
+                    const widths = this.collectColumnWidths()
+                    this.emitColumnResize({
+                        changedKey: this.tTD.current_index,
+                        isFinal: true,
+                        ...widths
+                    })
 
                     // 初始化所有的值
 					this.tTD.mouseDown = false

package/components/gante_test/gante.vue

@@ -18,7 +18,8 @@
                     @sort="sortGunter"
                     :th_data="th_data"
                     :showLoading="showLoading"
-                    :data="ganteData">
+                    :data="ganteData"
+                    :onColumnResize="onColumnResize">
 
                 </gante-table>
             </div>
@@ -32,9 +33,10 @@
                     :th_data="th_data"
                     :gante_data="ganteData"
                     :toast-render="toastRender"
-                    :toast-class="toastClass"></gante-gc>
+                    :toast-class="toastClass"
+                    :instance-id="instanceId"></gante-gc>
             </div>
-            <gante-split :left="tabe_width" :th_data="th_data"></gante-split>
+            <gante-split :left="tabe_width" :th_data="th_data" :onSplitResize="onSplitResize"></gante-split>
         </div>
         <!--日历-->
         <calendar :left="calendar_left" :choose_date="checkDate" v-model="show_calendar" @change="chooseDate"
@@ -81,6 +83,9 @@
                 onClick: () => {},
                 onLoad: () => {},//懒加载
                 onDragChangeTime: () => {}, // 拖动改变时间
+                onSplitResize: () => {}, // 拖动分割线改变宽度回调
+                onColumnResize: () => {}, // 拖动列宽回调
+                instanceId: `gante-${Math.random().toString(36).slice(2)}`,
                 dropdownOptions: [
                     { value: 1, label: '日' },
                     { value: 2, label: '周' },
@@ -332,7 +337,12 @@
 //      初始化
             init(params,mode = true) {
 
-                Object.assign(this.$data, params);
+                const cloneParams = Object.assign({}, params);
+                if(params.th_data){
+                    cloneParams.th_data = JSON.parse(JSON.stringify(params.th_data));
+                }
+
+                Object.assign(this.$data, cloneParams);
 
                 if(params.ganteData == undefined){
                     let ganteData = JSON.parse(JSON.stringify(this.ganteData));

package/gante.vue

@@ -19,6 +19,7 @@
                     :th_data="th_data"
                     :showLoading="showLoading"
                     :data="ganteData"
+                    :onColumnResize="onColumnResize"
                     :cell-slots="$scopedSlots">
 
                 </gante-table>
@@ -33,9 +34,10 @@
                     :th_data="th_data"
                     :gante_data="ganteData"
                     :toast-render="toastRender"
-                    :toast-class="toastClass"></gante-gc>
+                    :toast-class="toastClass"
+                    :instance-id="instanceId"></gante-gc>
             </div>
-            <gante-split :left="tabe_width" :th_data="th_data"></gante-split>
+            <gante-split :left="tabe_width" :th_data="th_data" :onSplitResize="onSplitResize"></gante-split>
         </div>
         <!--日历-->
         <calendar :left="calendar_left" :choose_date="checkDate" v-model="show_calendar" @change="chooseDate"
@@ -84,6 +86,9 @@
                 onClick: () => {},
                 onLoad: () => {},//懒加载
                 onDragChangeTime: () => {}, // 拖动改变时间
+                onSplitResize: () => {}, // 拖动分割线改变宽度回调
+                onColumnResize: () => {}, // 拖动列宽回调
+                instanceId: `gante-${Math.random().toString(36).slice(2)}`,
                 dropdownOptions: [
                     { value: 1, label: '日' },
                     { value: 2, label: '周' },
@@ -347,7 +352,12 @@
 //      初始化
             init(params,mode = true) {
 
-                Object.assign(this.$data, params);
+                const cloneParams = Object.assign({}, params);
+                if(params.th_data){
+                    cloneParams.th_data = JSON.parse(JSON.stringify(params.th_data));
+                }
+
+                Object.assign(this.$data, cloneParams);
 
                 if(params.ganteData == undefined){
                     let ganteData = JSON.parse(JSON.stringify(this.ganteData));

package/package.json

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