vxe-pc-ui 4.8.8 → 4.8.10

package/packages/color-picker/src/color-picker.ts

@@ -832,6 +832,9 @@ export default defineVxeComponent({
                     maxLength: 3,
                     placeholder: '',
                     modelValue: rValue,
+                    controlConfig: {
+                      showButton: false
+                    },
                     'onUpdate:modelValue' (val) {
                       reactData.rValue = val
                     },
@@ -846,6 +849,9 @@ export default defineVxeComponent({
                     maxLength: 3,
                     placeholder: '',
                     modelValue: gValue,
+                    controlConfig: {
+                      showButton: false
+                    },
                     'onUpdate:modelValue' (val) {
                       reactData.gValue = val
                     },
@@ -860,6 +866,9 @@ export default defineVxeComponent({
                     maxLength: 3,
                     placeholder: '',
                     modelValue: bValue,
+                    controlConfig: {
+                      showButton: false
+                    },
                     'onUpdate:modelValue' (val) {
                       reactData.bValue = val
                     },
@@ -875,6 +884,9 @@ export default defineVxeComponent({
                     maxLength: 4,
                     placeholder: '',
                     modelValue: aValue,
+                    controlConfig: {
+                      showButton: false
+                    },
                     'onUpdate:modelValue' (val) {
                       reactData.aValue = val
                     },

package/packages/components.ts

@@ -33,6 +33,7 @@ import VxeForm from './form'
 import VxeFormGather from './form-gather'
 import VxeFormGroup from './form-group'
 import VxeFormItem from './form-item'
+import VxeGantt from './gantt'
 import VxeIcon from './icon'
 import VxeIconPicker from './icon-picker'
 import VxeImage from './image'
@@ -118,6 +119,7 @@ const components = [
   VxeFormGather,
   VxeFormGroup,
   VxeFormItem,
+  VxeGantt,
   VxeIcon,
   VxeIconPicker,
   VxeImage,
@@ -224,6 +226,7 @@ export * from './form'
 export * from './form-gather'
 export * from './form-group'
 export * from './form-item'
+export * from './gantt'
 export * from './icon'
 export * from './icon-picker'
 export * from './image'

package/packages/form/src/form.ts

@@ -1,4 +1,4 @@
-import { h, ref, Ref, provide, computed, inject, reactive, watch, nextTick, PropType, onMounted } from 'vue'
+import { h, ref, Ref, provide, computed, inject, reactive, watch, nextTick, PropType, onMounted, onUnmounted } from 'vue'
 import { defineVxeComponent } from '../../ui/src/comp'
 import XEUtils from 'xe-utils'
 import { getConfig, validators, renderer, createEvent, useSize } from '../../ui'
@@ -140,6 +140,18 @@ function checkRuleStatus (rule: VxeFormDefines.FormRule, val: any) {
   return true
 }
 
+function createInternalData (): FormInternalData {
+  return {
+    meTimeout: undefined,
+    stTimeout: undefined,
+    tooltipStore: {
+      item: null,
+      visible: false
+    },
+    itemFormatCache: {}
+  }
+}
+
 export default defineVxeComponent({
   name: 'VxeForm',
   props: {
@@ -246,15 +258,7 @@ export default defineVxeComponent({
       formItems: []
     })
 
-    const internalData = reactive<FormInternalData>({
-      meTimeout: undefined,
-      stTimeout: undefined,
-      tooltipStore: {
-        item: null,
-        visible: false
-      },
-      itemFormatCache: {}
-    })
+    const internalData = createInternalData()
 
     const refElem = ref<HTMLFormElement>()
     const refTooltip = ref() as Ref<VxeTooltipInstance>
@@ -870,6 +874,10 @@ export default defineVxeComponent({
       })
     })
 
+    onUnmounted(() => {
+      XEUtils.assign(internalData, createInternalData())
+    })
+
     if (props.items) {
       loadItem(props.items)
     }

package/packages/gantt/index.ts

@@ -0,0 +1,16 @@
+import { App } from 'vue'
+import { VxeUI } from '@vxe-ui/core'
+import VxeGanttComponent from './src/gantt'
+import { dynamicApp } from '../dynamics'
+
+export const VxeGantt = Object.assign({}, VxeGanttComponent, {
+  install (app: App) {
+    app.component(VxeGanttComponent.name as string, VxeGanttComponent)
+  }
+})
+
+dynamicApp.use(VxeGantt)
+VxeUI.component(VxeGanttComponent)
+
+export const Gantt = VxeGantt
+export default VxeGantt

package/packages/gantt/src/gantt.ts

@@ -0,0 +1,87 @@
+import { ref, h, reactive, PropType, onUnmounted } from 'vue'
+import { defineVxeComponent } from '../../ui/src/comp'
+import { getConfig, createEvent } from '../../ui'
+import XEUtils from 'xe-utils'
+
+import type { GanttReactData, VxeGanttEmits, VxeGanttPropTypes, GanttPrivateRef, GanttInternalData, ValueOf, GanttMethods, GanttPrivateMethods, VxeGanttPrivateComputed, VxeGanttConstructor, VxeGanttPrivateMethods } from '../../../types'
+import type { VxeTableInstance } from '../../../types/components/table'
+
+function createInternalData (): GanttInternalData {
+  return {
+  }
+}
+
+export default defineVxeComponent({
+  name: 'VxeGantt',
+  props: {
+    size: {
+      type: String as PropType<VxeGanttPropTypes.Size>,
+      default: () => getConfig().gantt.size || getConfig().size
+    }
+  },
+  emits: [
+  ] as VxeGanttEmits,
+  setup (props, context) {
+    const { emit } = context
+
+    const xID = XEUtils.uniqueId()
+
+    const refElem = ref<HTMLDivElement>()
+    const refTable = ref<VxeTableInstance>()
+
+    const reactData = reactive<GanttReactData>({
+    })
+
+    const internalData = createInternalData()
+
+    const refMaps: GanttPrivateRef = {
+      refElem,
+      refTable
+    }
+
+    const computeMaps: VxeGanttPrivateComputed = {
+    }
+
+    const $xeGantt = {
+      xID,
+      props,
+      context,
+      reactData,
+      internalData,
+
+      getRefMaps: () => refMaps,
+      getComputeMaps: () => computeMaps
+    } as unknown as VxeGanttConstructor & VxeGanttPrivateMethods
+
+    const dispatchEvent = (type: ValueOf<VxeGanttEmits>, params: Record<string, any>, evnt: Event | null) => {
+      emit(type, createEvent(evnt, { $gantt: $xeGantt }, params))
+    }
+
+    const ganttMethods: GanttMethods = {
+      dispatchEvent
+    }
+
+    const ganttPrivateMethods: GanttPrivateMethods = {
+    }
+
+    Object.assign($xeGantt, ganttMethods, ganttPrivateMethods)
+
+    const renderVN = () => {
+      return h('div', {
+        ref: refElem,
+        class: 'vxe-gantt'
+      })
+    }
+
+    onUnmounted(() => {
+      XEUtils.assign(internalData, createInternalData())
+    })
+
+    $xeGantt.renderVN = renderVN
+
+    return $xeGantt
+  },
+  render () {
+    return this.renderVN()
+  }
+})

package/packages/list/src/list.ts

@@ -7,6 +7,22 @@ import VxeLoadingComponent from '../../loading/src/loading'
 
 import type { VxeListConstructor, VxeListPropTypes, VxeListEmits, ListReactData, ListInternalData, ValueOf, ListMethods, ListPrivateRef, VxeListMethods } from '../../../types'
 
+function createInternalData (): ListInternalData {
+  return {
+    resizeObserver: undefined,
+    fullData: [],
+    lastScrollLeft: 0,
+    lastScrollTop: 0,
+    scrollYStore: {
+      startIndex: 0,
+      endIndex: 0,
+      visibleSize: 0,
+      offsetSize: 0,
+      rowHeight: 0
+    }
+  }
+}
+
 export default defineVxeComponent({
   name: 'VxeList',
   props: {
@@ -49,19 +65,7 @@ export default defineVxeComponent({
       items: []
     })
 
-    const internalData: ListInternalData = {
-      resizeObserver: undefined,
-      fullData: [],
-      lastScrollLeft: 0,
-      lastScrollTop: 0,
-      scrollYStore: {
-        startIndex: 0,
-        endIndex: 0,
-        visibleSize: 0,
-        offsetSize: 0,
-        rowHeight: 0
-      }
-    }
+    const internalData = createInternalData()
 
     const refElem = ref() as Ref<HTMLDivElement>
     const refVirtualWrapper = ref() as Ref<HTMLDivElement>
@@ -322,6 +326,49 @@ export default defineVxeComponent({
 
     Object.assign($xeList, listMethods)
 
+    const renderVN = () => {
+      const { className, loading } = props
+      const { bodyHeight, topSpaceHeight, items } = reactData
+      const defaultSlot = slots.default
+      const vSize = computeSize.value
+      const styles = computeStyles.value
+      return h('div', {
+        ref: refElem,
+        class: ['vxe-list', className ? (XEUtils.isFunction(className) ? className({ $list: $xeList }) : className) : '', {
+          [`size--${vSize}`]: vSize,
+          'is--loading': loading
+        }]
+      }, [
+        h('div', {
+          ref: refVirtualWrapper,
+          class: 'vxe-list--virtual-wrapper',
+          style: styles,
+          onScroll: scrollEvent
+        }, [
+          h('div', {
+            class: 'vxe-list--y-space',
+            style: {
+              height: bodyHeight ? `${bodyHeight}px` : ''
+            }
+          }),
+          h('div', {
+            ref: refVirtualBody,
+            class: 'vxe-list--body',
+            style: {
+              marginTop: topSpaceHeight ? `${topSpaceHeight}px` : ''
+            }
+          }, defaultSlot ? defaultSlot({ items, $list: $xeList }) : [])
+        ]),
+        /**
+         * 加载中
+         */
+        h(VxeLoadingComponent, {
+          class: 'vxe-list--loading',
+          modelValue: loading
+        })
+      ])
+    }
+
     const dataFlag = ref(0)
     watch(() => props.data ? props.data.length : -1, () => {
       dataFlag.value++
@@ -377,51 +424,9 @@ export default defineVxeComponent({
         resizeObserver.disconnect()
       }
       globalEvents.off($xeList, 'resize')
+      XEUtils.assign(internalData, createInternalData())
     })
 
-    const renderVN = () => {
-      const { className, loading } = props
-      const { bodyHeight, topSpaceHeight, items } = reactData
-      const defaultSlot = slots.default
-      const vSize = computeSize.value
-      const styles = computeStyles.value
-      return h('div', {
-        ref: refElem,
-        class: ['vxe-list', className ? (XEUtils.isFunction(className) ? className({ $list: $xeList }) : className) : '', {
-          [`size--${vSize}`]: vSize,
-          'is--loading': loading
-        }]
-      }, [
-        h('div', {
-          ref: refVirtualWrapper,
-          class: 'vxe-list--virtual-wrapper',
-          style: styles,
-          onScroll: scrollEvent
-        }, [
-          h('div', {
-            class: 'vxe-list--y-space',
-            style: {
-              height: bodyHeight ? `${bodyHeight}px` : ''
-            }
-          }),
-          h('div', {
-            ref: refVirtualBody,
-            class: 'vxe-list--body',
-            style: {
-              marginTop: topSpaceHeight ? `${topSpaceHeight}px` : ''
-            }
-          }, defaultSlot ? defaultSlot({ items, $list: $xeList }) : [])
-        ]),
-        /**
-         * 加载中
-         */
-        h(VxeLoadingComponent, {
-          class: 'vxe-list--loading',
-          modelValue: loading
-        })
-      ])
-    }
-
     $xeList.renderVN = renderVN
 
     return $xeList

package/packages/number-input/src/number-input.ts

@@ -592,7 +592,7 @@ export default defineVxeComponent({
     const keydownEvent = (evnt: KeyboardEvent & { type: 'keydown' }) => {
       const { type, exponential, controls } = props
       const controlOpts = computeControlOpts.value
-      const { showButton } = controlOpts
+      const { isArrow } = controlOpts
       const inputReadonly = computeInputReadonly.value
       const isControlKey = hasControlKey(evnt)
       const isShiftKey = evnt.shiftKey
@@ -609,7 +609,7 @@ export default defineVxeComponent({
       if (isEsc) {
         afterCheckValue()
       } else if (isUpArrow || isDwArrow) {
-        if (isEnableConf(controlOpts) && (controls === false ? controls : showButton) && !inputReadonly) {
+        if (isEnableConf(controlOpts) && (controls === false ? controls : isArrow) && !inputReadonly) {
           numberKeydownEvent(evnt)
         }
       }

package/packages/select/src/select.ts

@@ -19,6 +19,31 @@ function getOptUniqueId () {
   return XEUtils.uniqueId('opt_')
 }
 
+function createInternalData (): SelectInternalData {
+  return {
+    synchData: [],
+    fullData: [],
+    afterVisibleList: [],
+    optAddMaps: {},
+    optGroupKeyMaps: {},
+    optFullValMaps: {},
+    remoteValMaps: {},
+
+    lastScrollLeft: 0,
+    lastScrollTop: 0,
+    scrollYStore: {
+      startIndex: 0,
+      endIndex: 0,
+      visibleSize: 0,
+      offsetSize: 0,
+      rowHeight: 0
+    },
+
+    lastScrollTime: 0,
+    hpTimeout: undefined
+  }
+}
+
 export default defineVxeComponent({
   name: 'VxeSelect',
   props: {
@@ -157,28 +182,7 @@ export default defineVxeComponent({
       isActivated: false
     })
 
-    const internalData: SelectInternalData = {
-      synchData: [],
-      fullData: [],
-      afterVisibleList: [],
-      optAddMaps: {},
-      optGroupKeyMaps: {},
-      optFullValMaps: {},
-      remoteValMaps: {},
-
-      lastScrollLeft: 0,
-      lastScrollTop: 0,
-      scrollYStore: {
-        startIndex: 0,
-        endIndex: 0,
-        visibleSize: 0,
-        offsetSize: 0,
-        rowHeight: 0
-      },
-
-      lastScrollTime: 0,
-      hpTimeout: undefined
-    }
+    const internalData = createInternalData()
 
     const refMaps: SelectPrivateRef = {
       refElem
@@ -1498,6 +1502,7 @@ export default defineVxeComponent({
       globalEvents.off($xeSelect, 'keydown')
       globalEvents.off($xeSelect, 'blur')
       globalEvents.off($xeSelect, 'resize')
+      XEUtils.assign(internalData, createInternalData())
     })
 
     provide('$xeSelect', $xeSelect)

package/packages/tree/src/tree.ts

@@ -17,6 +17,34 @@ function getNodeUniqueId () {
   return XEUtils.uniqueId('node_')
 }
 
+function createInternalData (): TreeInternalData {
+  return {
+    // initialized: false,
+    // lastFilterValue: '',
+    treeFullData: [],
+    afterTreeList: [],
+    afterVisibleList: [],
+    nodeMaps: {},
+    selectCheckboxMaps: {},
+    indeterminateRowMaps: {},
+    treeExpandedMaps: {},
+    treeExpandLazyLoadedMaps: {},
+
+    lastScrollLeft: 0,
+    lastScrollTop: 0,
+    scrollYStore: {
+      startIndex: 0,
+      endIndex: 0,
+      visibleSize: 0,
+      offsetSize: 0,
+      rowHeight: 0
+    },
+
+    lastScrollTime: 0
+    // hpTimeout: undefined
+  }
+}
+
 export default defineVxeComponent({
   name: 'VxeTree',
   props: {
@@ -170,31 +198,7 @@ export default defineVxeComponent({
       updateCheckboxFlag: 1
     })
 
-    const internalData: TreeInternalData = {
-      // initialized: false,
-      // lastFilterValue: '',
-      treeFullData: [],
-      afterTreeList: [],
-      afterVisibleList: [],
-      nodeMaps: {},
-      selectCheckboxMaps: {},
-      indeterminateRowMaps: {},
-      treeExpandedMaps: {},
-      treeExpandLazyLoadedMaps: {},
-
-      lastScrollLeft: 0,
-      lastScrollTop: 0,
-      scrollYStore: {
-        startIndex: 0,
-        endIndex: 0,
-        visibleSize: 0,
-        offsetSize: 0,
-        rowHeight: 0
-      },
-
-      lastScrollTime: 0
-      // hpTimeout: undefined
-    }
+    const internalData = createInternalData()
 
     const refMaps: TreePrivateRef = {
       refElem
@@ -823,10 +827,13 @@ export default defineVxeComponent({
       return nextTick()
     }
 
-    const loadYData = (evnt: Event) => {
+    const loadYData = () => {
       const { scrollYStore } = internalData
       const { startIndex, endIndex, visibleSize, offsetSize, rowHeight } = scrollYStore
-      const scrollBodyElem = evnt.target as HTMLDivElement
+      const scrollBodyElem = refVirtualWrapper.value
+      if (!scrollBodyElem) {
+        return
+      }
       const scrollTop = scrollBodyElem.scrollTop
       const toVisibleIndex = Math.floor(scrollTop / rowHeight)
       const offsetStartIndex = Math.max(0, toVisibleIndex - 1 - offsetSize)
@@ -849,7 +856,7 @@ export default defineVxeComponent({
       internalData.lastScrollTop = scrollTop
       internalData.lastScrollLeft = scrollLeft
       if (reactData.scrollYLoad) {
-        loadYData(evnt)
+        loadYData()
       }
       internalData.lastScrollTime = Date.now()
       dispatchEvent('scroll', { scrollLeft, scrollTop, isX, isY }, evnt)
@@ -1483,7 +1490,8 @@ export default defineVxeComponent({
       },
       setAllExpandNode (expanded) {
         const { transform } = props
-        const { treeExpandedMaps } = internalData
+        const { scrollYLoad } = reactData
+        const { scrollYStore, treeExpandedMaps } = internalData
         const childrenField = computeChildrenField.value
         const mapChildrenField = computeMapChildrenField.value
         if (expanded) {
@@ -1499,9 +1507,17 @@ export default defineVxeComponent({
           internalData.treeExpandedMaps = {}
         }
         reactData.updateExpandedFlag++
+        reactData.topSpaceHeight = 0
+        scrollYStore.startIndex = 0
+        scrollYStore.endIndex = 1
         handleTreeToList()
         handleData()
-        return recalculate()
+        return recalculate().then(() => {
+          if (scrollYLoad) {
+            loadYData()
+          }
+          return recalculate()
+        })
       },
       reloadExpandNode (node) {
         const { lazy } = props
@@ -1955,12 +1971,8 @@ export default defineVxeComponent({
       if (resizeObserver) {
         resizeObserver.disconnect()
       }
-
-      internalData.treeExpandedMaps = {}
-      internalData.indeterminateRowMaps = {}
-      internalData.nodeMaps = {}
-
       globalEvents.off($xeTree, 'resize')
+      XEUtils.assign(internalData, createInternalData())
     })
 
     loadData(props.data || [])

package/packages/tree-select/src/tree-select.ts

@@ -17,6 +17,14 @@ function getOptUniqueId () {
   return XEUtils.uniqueId('node_')
 }
 
+function createInternalData (): TreeSelectInternalData {
+  return {
+    // hpTimeout: undefined,
+    fullOptionList: [],
+    fullNodeMaps: {}
+  }
+}
+
 export default defineVxeComponent({
   name: 'VxeTreeSelect',
   props: {
@@ -127,11 +135,7 @@ export default defineVxeComponent({
       isActivated: false
     })
 
-    const internalData: TreeSelectInternalData = {
-      // hpTimeout: undefined,
-      fullOptionList: [],
-      fullNodeMaps: {}
-    }
+    const internalData = createInternalData()
 
     const refMaps: TreeSelectPrivateRef = {
       refElem
@@ -865,6 +869,7 @@ export default defineVxeComponent({
       globalEvents.off($xeTreeSelect, 'mousedown')
       globalEvents.off($xeTreeSelect, 'blur')
       globalEvents.off($xeTreeSelect, 'resize')
+      XEUtils.assign(internalData, createInternalData())
     })
 
     provide('$xeTreeSelect', $xeTreeSelect)

package/packages/ui/index.ts

@@ -157,6 +157,7 @@ setConfig({
   formGroup: {},
   formItem: {},
   formView: {},
+  gantt: {},
   icon: {},
   iconPicker: {
     icons: ['home', 'company', 'comment', 'setting', 'send', 'envelope', 'envelope-open', 'bell', 'search', 'print', 'pc', 'goods', 'chart-line', 'edit', 'delete', 'save', 'folder', 'microphone', 'flag', 'link', 'location', 'sunny', 'rmb', 'usd', 'user', 'add-user', 'add-users', 'star', 'unlock', 'time', 'text', 'feedback', 'calendar', 'association-form', 'cloud-download', 'cloud-upload', 'file', 'subtable', 'chart-bar-x', 'chart-bar-y', 'chart-line', 'chart-pie', 'chart-radar']
@@ -256,7 +257,8 @@ setConfig({
       enabled: true,
       layout: 'right',
       showButton: true,
-      isWheel: true
+      isWheel: true,
+      isArrow: true
     }
   },
   optgroup: {},

package/styles/all.scss

@@ -30,6 +30,7 @@
 @use './components/form-gather.scss';
 @use './components/form-group.scss';
 @use './components/form-item.scss';
+@use './components/gantt.scss';
 @use './components/icon.scss';
 @use './components/icon-picker.scss';
 @use './components/image.scss';

package/styles/components/color-picker.scss

@@ -351,13 +351,10 @@
   flex-direction: column;
   overflow: hidden;
   .vxe-color-picker--input-wrapper {
-    & > .vxe-input {
+    & > .vxe-number-input {
       width: 23%;
       margin-left: 2%;
-      .vxe-input--control-icon {
-        min-width: 1.6em;
-      }
-      .vxe-input--inner {
+      .vxe-number-input--input {
         padding: 0 0 0 0.15em;
       }
     }

package/types/all.d.ts

@@ -31,6 +31,7 @@ import VxeForm from './components/form'
 import VxeFormGather from './components/form-gather'
 import VxeFormGroup from './components/form-group'
 import VxeFormItem from './components/form-item'
+import VxeGantt from './components/gantt'
 import VxeIcon from './components/icon'
 import VxeIconPicker from './components/icon-picker'
 import VxeImage from './components/image'
@@ -130,6 +131,7 @@ interface AllComponents {
   VxeFormGather: typeof VxeFormGather
   VxeFormGroup: typeof VxeFormGroup
   VxeFormItem: typeof VxeFormItem
+  VxeGantt: typeof VxeGantt
   VxeIcon: typeof VxeIcon
   VxeIconPicker: typeof VxeIconPicker
   VxeImage: typeof VxeImage
@@ -238,6 +240,7 @@ export * from './components/form'
 export * from './components/form-gather'
 export * from './components/form-group'
 export * from './components/form-item'
+export * from './components/gantt'
 export * from './components/icon'
 export * from './components/icon-picker'
 export * from './components/image'