releases 4.2.4

x-extends · Sep 24, 2024 · 8955819 · 8955819
1 parent d091be9
commit 8955819
Show file tree

Hide file tree

Showing 17 changed files with 50 additions and 43 deletions.
diff --git a/.github/ISSUE_TEMPLATE/bug_report.yml b/.github/ISSUE_TEMPLATE/bug_report.yml
@@ -47,14 +47,14 @@ body:
   id: issue_vxe_ui_version
   attributes:
     label: "vxe-pc-ui 版本："
-    placeholder: "例如：4.0.49"
+    placeholder: "例如：4.2.2"
   validations:
     required: true
 - type: input
   id: issue_vxe_table_version
   attributes:
     label: "vxe-table 版本："
-    placeholder: "例如：4.7.45"
+    placeholder: "例如：4.7.81"
   validations:
     required: true
 - type: checkboxes

diff --git a/examples/views/pulldown/PulldownTest.vue b/examples/views/pulldown/PulldownTest.vue
@@ -15,7 +15,7 @@
         </template>
       </vxe-pulldown>
 
-      <vxe-pulldown ref="xDown2">
+      <vxe-pulldown ref="xDown2" destroyOnClose>
         <template #default>
           <vxe-input v-model="demo2.value2" placeholder="可搜索的大数据下拉框" @focus="focusEvent2" @keyup="keyupEvent2"></vxe-input>
         </template>

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "vxe-pc-ui",
-  "version": "4.2.2",
+  "version": "4.2.4",
   "description": "A vue based PC component library",
   "scripts": {
     "update": "npm install --legacy-peer-deps",

diff --git a/packages/button/src/button.ts b/packages/button/src/button.ts
@@ -113,7 +113,7 @@ export default defineComponent({
     const reactData = reactive<ButtonReactData>({
       initialized: false,
       visiblePanel: false,
-      visibleAnimate: false,
+      isAniVisible: false,
       isActivated: false,
       panelIndex: 0,
       panelStyle: {},
@@ -316,7 +316,7 @@ export default defineComponent({
         reactData.visiblePanel = false
         setTimeout(() => {
           if (!panelElem || panelElem.dataset.active !== 'Y') {
-            reactData.visibleAnimate = false
+            reactData.isAniVisible = false
           }
         }, 350)
         dispatchEvent('dropdown-click', { name: targetElem.getAttribute('name'), $event: evnt }, evnt)
@@ -327,7 +327,7 @@ export default defineComponent({
       const panelElem = refBtnPanel.value
       if (panelElem) {
         panelElem.dataset.active = 'Y'
-        reactData.visibleAnimate = true
+        reactData.isAniVisible = true
         setTimeout(() => {
           if (panelElem.dataset.active === 'Y') {
             reactData.visiblePanel = true
@@ -385,7 +385,7 @@ export default defineComponent({
           if (panelElem.dataset.active === 'Y') {
             mouseenterDropdownEvent()
           } else {
-            reactData.visibleAnimate = false
+            reactData.isAniVisible = false
           }
         }, trigger === 'click' ? 50 : 250)
       }
@@ -402,13 +402,13 @@ export default defineComponent({
             reactData.visiblePanel = false
             setTimeout(() => {
               if (panelElem.dataset.active !== 'Y') {
-                reactData.visibleAnimate = false
+                reactData.isAniVisible = false
               }
             }, 350)
           }
         }, 100)
       } else {
-        reactData.visibleAnimate = false
+        reactData.isAniVisible = false
         reactData.visiblePanel = false
       }
       return nextTick()
@@ -506,7 +506,7 @@ export default defineComponent({
 
     const renderVN = () => {
       const { className, popupClassName, align, trigger, title, routerLink, type, destroyOnClose, name, loading } = props
-      const { initialized, visiblePanel } = reactData
+      const { initialized, isAniVisible, visiblePanel } = reactData
       const isFormBtn = computeIsFormBtn.value
       const btnMode = computeBtnMode.value
       const btnStatus = computeBtnStatus.value
@@ -595,13 +595,13 @@ export default defineComponent({
               ref: refBtnPanel,
               class: ['vxe-button--dropdown-panel', popupClassName ? (XEUtils.isFunction(popupClassName) ? popupClassName({ $button: $xeButton }) : popupClassName) : '', {
                 [`size--${vSize}`]: vSize,
-                'ani--leave': reactData.visibleAnimate,
+                'ani--leave': isAniVisible,
                 'ani--enter': visiblePanel
               }],
               placement: reactData.panelPlacement,
               style: reactData.panelStyle,
               ...panelOns
-            }, initialized
+            }, initialized && (visiblePanel || isAniVisible)
               ? [
                   h('div', {
                     class: 'vxe-button--dropdown-wrapper',

diff --git a/packages/date-picker/src/date-picker.ts b/packages/date-picker/src/date-picker.ts
@@ -2018,7 +2018,7 @@ export default defineComponent({
             }],
             placement: panelPlacement,
             style: panelStyle
-          }, renders)
+          }, initialized && (visiblePanel || isAniVisible) ? renders : [])
         ])
       }
       return createCommentVNode()

diff --git a/packages/icon-picker/src/icon-picker.ts b/packages/icon-picker/src/icon-picker.ts
@@ -475,7 +475,7 @@ export default defineComponent({
 
     const renderVN = () => {
       const { className, popupClassName, clearable } = props
-      const { initialized, isActivated, visiblePanel, selectIcon } = reactData
+      const { initialized, isActivated, isAniVisible, visiblePanel, selectIcon } = reactData
       const vSize = computeSize.value
       const isDisabled = computeIsDisabled.value
       const btnTransfer = computeBtnTransfer.value
@@ -552,13 +552,13 @@ export default defineComponent({
             class: ['vxe-table--ignore-clear vxe-ico-picker--panel', popupClassName ? (XEUtils.isFunction(popupClassName) ? popupClassName({ $iconPicker: $xeIconPicker }) : popupClassName) : '', {
               [`size--${vSize}`]: vSize,
               'is--transfer': btnTransfer,
-              'ani--leave': reactData.isAniVisible,
+              'ani--leave': isAniVisible,
               'ani--enter': visiblePanel
             }],
             placement: reactData.panelPlacement,
             style: reactData.panelStyle
           }, [
-            initialized
+            initialized && (visiblePanel || isAniVisible)
               ? h('div', {
                 class: 'vxe-ico-picker--panel-wrapper'
               }, [

diff --git a/packages/input/src/input.ts b/packages/input/src/input.ts
@@ -2298,7 +2298,7 @@ export default defineComponent({
             }],
             placement: panelPlacement,
             style: panelStyle
-          }, renders)
+          }, visiblePanel || isAniVisible ? renders : [])
         ])
       }
       return createCommentVNode()

diff --git a/packages/pulldown/src/pulldown.ts b/packages/pulldown/src/pulldown.ts
@@ -57,7 +57,7 @@ export default defineComponent({
       panelStyle: {},
       panelPlacement: null,
       visiblePanel: false,
-      visibleAnimate: false,
+      isAniVisible: false,
       isActivated: false
     })
 
@@ -197,7 +197,7 @@ export default defineComponent({
             clearTimeout(internalData.hpTimeout)
           }
           reactData.isActivated = true
-          reactData.visibleAnimate = true
+          reactData.isAniVisible = true
           setTimeout(() => {
             reactData.visiblePanel = true
             emit('update:modelValue', true)
@@ -222,9 +222,9 @@ export default defineComponent({
       reactData.visiblePanel = false
       emit('update:modelValue', false)
       return new Promise<void>(resolve => {
-        if (reactData.visibleAnimate) {
+        if (reactData.isAniVisible) {
           internalData.hpTimeout = window.setTimeout(() => {
-            reactData.visibleAnimate = false
+            reactData.isAniVisible = false
             nextTick(() => {
               resolve()
             })
@@ -357,7 +357,7 @@ export default defineComponent({
 
     const renderVN = () => {
       const { className, options, popupClassName, showPopupShadow, destroyOnClose, disabled } = props
-      const { initialized, isActivated, visibleAnimate, visiblePanel, panelStyle, panelPlacement } = reactData
+      const { initialized, isActivated, isAniVisible, visiblePanel, panelStyle, panelPlacement } = reactData
       const btnTransfer = computeBtnTransfer.value
       const vSize = computeSize.value
       const defaultSlot = slots.default
@@ -389,17 +389,16 @@ export default defineComponent({
               [`size--${vSize}`]: vSize,
               'is--shadow': showPopupShadow,
               'is--transfer': btnTransfer,
-              'ani--leave': visibleAnimate,
+              'ani--leave': isAniVisible,
               'ani--enter': visiblePanel
             }],
             placement: panelPlacement,
             style: panelStyle
           }, [
             h('div', {
               class: 'vxe-pulldown--panel-wrapper'
-            }, !initialized || (destroyOnClose && !visiblePanel && !visibleAnimate)
-              ? []
-              : [
+            }, initialized && (destroyOnClose ? (visiblePanel || isAniVisible) : true)
+              ? [
                   headerSlot
                     ? h('div', {
                       class: 'vxe-pulldown--panel-header'
@@ -417,7 +416,8 @@ export default defineComponent({
                       class: 'vxe-pulldown--panel-footer'
                     }, footerSlot({ $pulldown: $xePulldown }))
                     : createCommentVNode()
-                ])
+                ]
+              : [])
           ])
         ])
       ])

diff --git a/packages/select/src/select.ts b/packages/select/src/select.ts
@@ -983,7 +983,7 @@ export default defineComponent({
 
     const renderVN = () => {
       const { className, popupClassName, loading, filterable } = props
-      const { initialized, isActivated, visiblePanel } = reactData
+      const { initialized, isActivated, isAniVisible, visiblePanel } = reactData
       const vSize = computeSize.value
       const isDisabled = computeIsDisabled.value
       const selectLabel = computeSelectLabel.value
@@ -1052,12 +1052,12 @@ export default defineComponent({
             class: ['vxe-table--ignore-clear vxe-select--panel', popupClassName ? (XEUtils.isFunction(popupClassName) ? popupClassName({ $select: $xeSelect }) : popupClassName) : '', {
               [`size--${vSize}`]: vSize,
               'is--transfer': btnTransfer,
-              'ani--leave': !loading && reactData.isAniVisible,
+              'ani--leave': !loading && isAniVisible,
               'ani--enter': !loading && visiblePanel
             }],
             placement: reactData.panelPlacement,
             style: reactData.panelStyle
-          }, initialized
+          }, initialized && (visiblePanel || isAniVisible)
             ? [
                 filterable
                   ? h('div', {

diff --git a/packages/tree-select/src/tree-select.ts b/packages/tree-select/src/tree-select.ts
@@ -86,7 +86,7 @@ export default defineComponent({
       panelPlacement: null,
       triggerFocusPanel: false,
       visiblePanel: false,
-      visibleAnimate: false,
+      isAniVisible: false,
       isActivated: false
     })
 
@@ -343,7 +343,7 @@ export default defineComponent({
           reactData.initialized = true
         }
         reactData.isActivated = true
-        reactData.visibleAnimate = true
+        reactData.isAniVisible = true
         setTimeout(() => {
           reactData.visiblePanel = true
         }, 10)
@@ -355,7 +355,7 @@ export default defineComponent({
     const hideOptionPanel = () => {
       reactData.visiblePanel = false
       internalData.hpTimeout = window.setTimeout(() => {
-        reactData.visibleAnimate = false
+        reactData.isAniVisible = false
       }, 350)
     }
 
@@ -475,7 +475,7 @@ export default defineComponent({
 
     const renderVN = () => {
       const { className, modelValue, multiple, options, popupClassName, loading } = props
-      const { initialized, isActivated, visiblePanel } = reactData
+      const { initialized, isActivated, isAniVisible, visiblePanel } = reactData
       const vSize = computeSize.value
       const isDisabled = computeIsDisabled.value
       const selectLabel = computeSelectLabel.value
@@ -548,12 +548,12 @@ export default defineComponent({
             class: ['vxe-table--ignore-clear vxe-tree-select--panel', popupClassName ? (XEUtils.isFunction(popupClassName) ? popupClassName({ $treeSelect: $xeTreeSelect }) : popupClassName) : '', {
               [`size--${vSize}`]: vSize,
               'is--transfer': btnTransfer,
-              'ani--leave': !loading && reactData.visibleAnimate,
+              'ani--leave': !loading && isAniVisible,
               'ani--enter': !loading && visiblePanel
             }],
             placement: reactData.panelPlacement,
             style: reactData.panelStyle
-          }, initialized
+          }, initialized && (visiblePanel || isAniVisible)
             ? [
                 h('div', {
                   class: 'vxe-tree-select--panel-wrapper'

diff --git a/packages/ui/index.ts b/packages/ui/index.ts
@@ -222,7 +222,9 @@ setConfig({
     controls: true
   },
   printPageBreak: {},
-  pulldown: {},
+  pulldown: {
+    destroyOnClose: true
+  },
   radio: {
     strict: true
   },

diff --git a/styles/components/col.scss b/styles/components/col.scss
@@ -33,4 +33,5 @@ $colSpanList: 4.16667%, 8.33333%, 12.5%, 16.66667%, 20.83333%, 25%, 29.16667%, 3
 .vxe-col--inner {
   display: flex;
   flex-direction: column;
+  width: 100%;
 }
diff --git a/types/components/button.d.ts b/types/components/button.d.ts
@@ -126,7 +126,7 @@ export interface VxeButtonPrivateComputed extends ButtonPrivateComputed { }
 export interface ButtonReactData {
   initialized: boolean
   visiblePanel: boolean
-  visibleAnimate: boolean
+  isAniVisible: boolean
   isActivated: boolean
   panelIndex: number
   panelStyle: VxeComponentStyleType

diff --git a/types/components/form-view.d.ts b/types/components/form-view.d.ts
@@ -32,7 +32,7 @@ export namespace VxeFormViewPropTypes {
   export type ViewRender = {
     name?: string
   }
-  export type FormOptions = Omit<VxeFormProps<D>, 'data' | 'items'>
+  export type FormOptions<D = any> = Omit<VxeFormProps<D>, 'data' | 'items'>
   export type CreateFormConfig = (params: VxeFormViewDefines.CreateFormConfigParams) => VxeFormProps
   export type Size = VxeComponentSizeType
 }

diff --git a/types/components/pulldown.d.ts b/types/components/pulldown.d.ts
@@ -77,7 +77,7 @@ export interface PulldownReactData {
   panelStyle: VxeComponentStyleType
   panelPlacement: string | null
   visiblePanel: boolean
-  visibleAnimate: boolean
+  isAniVisible: boolean
   isActivated: boolean
 }
 

diff --git a/types/components/table.d.ts b/types/components/table.d.ts
@@ -74,6 +74,7 @@ export namespace VxeTablePropTypes {
   export type Resizable = boolean
   export type Stripe = boolean
   export type Round = boolean
+  export type Padding = boolean
   export type Border = boolean | 'default' | 'full' | 'outer' | 'inner' | 'none' | ''
   export type Loading = boolean
   export type Align = 'left' | 'center' | 'right' | '' | null
@@ -1729,6 +1730,10 @@ export interface VxeTableProps<D = any> {
    * 是否带有斑马纹（需要注意的是，在可编辑表格场景下，临时插入的数据不会有斑马纹样式）
    */
   stripe?: VxeTablePropTypes.Stripe
+  /**
+   * 单元格是否有边距
+   */
+  padding?: VxeTablePropTypes.Padding
   /**
    * 是否为圆角边框
    */
@@ -4055,7 +4060,6 @@ export interface VxeTableListeners<D = any> {
    * 当表格被激活且键盘被按下开始时会触发的事件
    */
   keydownStart?: VxeTableEvents.KeydownStart<D>
-  keydownStart?: VxeTableEvents.KeydownStart<D>
   /**
    * 当表格被激活且键盘被按下时会触发的事件
    */

diff --git a/types/components/tree-select.d.ts b/types/components/tree-select.d.ts
@@ -106,7 +106,7 @@ export interface TreeSelectReactData {
   panelPlacement: any
   triggerFocusPanel: boolean
   visiblePanel: boolean
-  visibleAnimate: boolean
+  isAniVisible: boolean
   isActivated: boolean
 }