vxe-pc-ui 3.0.1 → 3.0.2

package/packages/select/src/select.ts

@@ -302,6 +302,11 @@ export default defineVxeComponent({
       const $xeSelect = this
       $xeSelect.$emit(type, createEvent(evnt, { $select: $xeSelect }, params))
     },
+    emitModel  (value: any) {
+      const $xeSelect = this
+
+      $xeSelect.$emit('modelValue', value)
+    },
     isPanelVisible () {
       const $xeSelect = this
       const reactData = $xeSelect.reactData
@@ -632,6 +637,13 @@ export default defineVxeComponent({
         }
         if (!reactData.initialized) {
           reactData.initialized = true
+          const btnTransfer = $xeSelect.computeBtnTransfer
+          const panelElem = $xeSelect.$refs.refOptionPanel as HTMLElement
+          if (btnTransfer) {
+            if (panelElem) {
+              document.body.appendChild(panelElem)
+            }
+          }
         }
         reactData.isActivated = true
         reactData.isAniVisible = true
@@ -670,8 +682,8 @@ export default defineVxeComponent({
       const $xeForm = $xeSelect.$xeForm
       const formItemInfo = $xeSelect.formItemInfo
 
+      $xeSelect.emitModel(selectValue)
       if (selectValue !== props.value) {
-        $xeSelect.$emit('modelValue', selectValue)
         $xeSelect.dispatchEvent('change', { value: selectValue }, evnt)
         // 自动更新校验状态
         if ($xeForm && formItemInfo) {
@@ -1314,6 +1326,10 @@ export default defineVxeComponent({
   beforeDestroy () {
     const $xeSelect = this
 
+    const panelElem = $xeSelect.$refs.refOptionPanel as HTMLElement | undefined
+    if (panelElem && panelElem.parentNode) {
+      panelElem.parentNode.removeChild(panelElem)
+    }
     globalEvents.off($xeSelect, 'mousewheel')
     globalEvents.off($xeSelect, 'mousedown')
     globalEvents.off($xeSelect, 'keydown')

package/packages/select/src/util.ts

@@ -1,7 +1,7 @@
 import XEUtils from 'xe-utils'
 import { OptionInfo } from './option-info'
 
-import type { VxeOptionInstance, VxeOptgroupInstance, VxeSelectConstructor } from '../../../types'
+import type { VxeOptionConstructor, VxeOptgroupConstructor, VxeSelectConstructor } from '../../../types'
 
 export interface XEOptionProvide {
   optionConfig: OptionInfo;
@@ -15,8 +15,9 @@ export function createOption ($xeSelect: VxeSelectConstructor, _vm: any) {
   return isOption(_vm) ? _vm : new OptionInfo($xeSelect, _vm)
 }
 
-export function watchOption (_vm: VxeOptionInstance | VxeOptgroupInstance, option: OptionInfo) {
-  ['value', 'label', 'visible', 'className', 'disabled'].forEach(name => {
+export function watchOption (_vm: VxeOptionConstructor | VxeOptgroupConstructor, option: OptionInfo) {
+  const optionPropKeys = ['value', 'label', 'visible', 'className', 'disabled']
+  optionPropKeys.forEach(name => {
     _vm.$watch(name, (val) => {
       option.update(name, val)
     })

package/packages/switch/src/switch.ts

@@ -108,6 +108,12 @@ export default defineVxeComponent({
       const $xeSwitch = this
       $xeSwitch.$emit(type, createEvent(evnt, { $switch: $xeSwitch }, params))
     },
+    emitModel  (value: any) {
+      const $xeSwitch = this
+
+      $xeSwitch.$emit('input', value)
+      $xeSwitch.$emit('modelValue', value)
+    },
     focus () {
       const $xeSwitch = this
       const reactData = $xeSwitch.reactData
@@ -144,8 +150,7 @@ export default defineVxeComponent({
         clearTimeout(internalData.atTimeout)
         const value = isChecked ? props.closeValue : props.openValue
         reactData.hasAnimat = true
-        $xeSwitch.$emit('input', value)
-        $xeSwitch.$emit('modelValue', value)
+        $xeSwitch.emitModel(value)
         $xeSwitch.dispatchEvent('change', { value }, evnt)
         // 自动更新校验状态
         if ($xeForm && formItemInfo) {

package/packages/tabs/src/tabs.ts

@@ -93,6 +93,12 @@ export default defineVxeComponent({
       const $xeTabs = this
       $xeTabs.$emit(type, createEvent(evnt, { $tabs: $xeTabs }, params))
     },
+    emitModel  (value: any) {
+      const $xeTabs = this
+
+      $xeTabs.$emit('input', value)
+      $xeTabs.$emit('modelValue', value)
+    },
     prev () {
       const $xeTabs = this
 
@@ -214,7 +220,7 @@ export default defineVxeComponent({
         if (!validVal) {
           activeName = list[0].name
           $xeTabs.addInitName(activeName, null)
-          $xeTabs.$emit('input', activeName)
+          $xeTabs.emitModel(activeName)
         }
       }
       reactData.activeName = activeName
@@ -234,7 +240,7 @@ export default defineVxeComponent({
       }
       const value = name
       reactData.activeName = name
-      $xeTabs.$emit('input', value)
+      $xeTabs.emitModel(value)
       $xeTabs.dispatchEvent('tab-click', { name }, evnt)
       $xeTabs.addInitName(name, evnt)
       if (name !== activeName) {
@@ -377,7 +383,7 @@ export default defineVxeComponent({
           const name = item.name
           const value = name
           reactData.activeName = name
-          $xeTabs.$emit('input', value)
+          $xeTabs.emitModel(value)
           $xeTabs.addInitName(name, null)
         }
       }

package/packages/textarea/src/textarea.ts

@@ -171,6 +171,11 @@ export default defineVxeComponent({
       const $xeTextarea = this
       $xeTextarea.$emit(type, createEvent(evnt, { $textarea: $xeTextarea }, params))
     },
+    emitModel  (value: any) {
+      const $xeTextarea = this
+
+      $xeTextarea.$emit('modelValue', value)
+    },
     focus () {
       const $xeTextarea = this
 
@@ -249,7 +254,7 @@ export default defineVxeComponent({
       const value = reactData.inputValue
       $xeTextarea.dispatchEvent(evnt.type, { value }, evnt)
     },
-    emitUpdate (value: string, evnt: Event) {
+    handleChange (value: string, evnt: Event) {
       const $xeTextarea = this
       const props = $xeTextarea
       const reactData = $xeTextarea.reactData
@@ -257,7 +262,7 @@ export default defineVxeComponent({
       const formItemInfo = $xeTextarea.formItemInfo
 
       reactData.inputValue = value
-      $xeTextarea.$emit('modelValue', value)
+      $xeTextarea.emitModel(value)
       if (XEUtils.toValueString(props.value) !== value) {
         $xeTextarea.dispatchEvent('change', { value }, evnt)
         // 自动更新校验状态
@@ -276,7 +281,7 @@ export default defineVxeComponent({
       const value = textElem.value
       reactData.inputValue = value
       if (immediate) {
-        $xeTextarea.emitUpdate(value, evnt)
+        $xeTextarea.handleChange(value, evnt)
       }
       $xeTextarea.dispatchEvent('input', { value }, evnt)
       $xeTextarea.handleResize()
@@ -290,7 +295,7 @@ export default defineVxeComponent({
       if (immediate) {
         $xeTextarea.triggerEvent(evnt)
       } else {
-        $xeTextarea.emitUpdate(reactData.inputValue, evnt)
+        $xeTextarea.handleChange(reactData.inputValue, evnt)
       }
     },
     blurEvent (evnt: Event & { type: 'blur' }) {
@@ -301,7 +306,7 @@ export default defineVxeComponent({
       const { immediate } = props
       const { inputValue } = reactData
       if (!immediate) {
-        $xeTextarea.emitUpdate(inputValue, evnt)
+        $xeTextarea.handleChange(inputValue, evnt)
       }
       $xeTextarea.dispatchEvent('blur', { value: inputValue }, evnt)
     },

package/packages/tooltip/src/tooltip.ts

@@ -84,6 +84,12 @@ export default defineVxeComponent({
       const $xeTooltip = this
       $xeTooltip.$emit(type, createEvent(evnt, { $tooltip: $xeTooltip }, params))
     },
+    emitModel  (value: any) {
+      const $xeTooltip = this
+
+      $xeTooltip.$emit('input', value)
+      $xeTooltip.$emit('modelValue', value)
+    },
     open (target?: HTMLElement | null, content?: VxeTooltipPropTypes.Content) {
       const $xeTooltip = this
       const reactData = $xeTooltip.reactData
@@ -170,7 +176,7 @@ export default defineVxeComponent({
       if (value !== reactData.visible) {
         reactData.visible = value
         reactData.isUpdate = true
-        $xeTooltip.$emit('input', value)
+        $xeTooltip.emitModel(value)
       }
     },
     updateZindex () {

package/packages/tree/index.ts

@@ -0,0 +1,16 @@
+import { VueConstructor } from 'vue'
+import { VxeUI } from '@vxe-ui/core'
+import VxeTreeComponent from './src/tree'
+import { dynamicApp } from '../dynamics'
+
+export const VxeTree = Object.assign({}, VxeTreeComponent, {
+  install (app: VueConstructor) {
+    app.component(VxeTreeComponent.name as string, VxeTreeComponent)
+  }
+})
+
+dynamicApp.use(VxeTree)
+VxeUI.component(VxeTreeComponent)
+
+export const Tree = VxeTree
+export default VxeTree