releases 4.2.29

examples/App.vue

@@ -86,7 +86,8 @@ const navList = ref<VxeMenuPropTypes.Options>([
   { name: 'BadgeTest', routerLink: { name: 'BadgeTest' } },
   { name: 'AvatarTest', routerLink: { name: 'AvatarTest' } },
   { name: 'SliderTest', routerLink: { name: 'SliderTest' } },
-  { name: 'RateTest', routerLink: { name: 'RateTest' } }
+  { name: 'RateTest', routerLink: { name: 'RateTest' } },
+  { name: 'TableSelect', routerLink: { name: 'TableSelect' } }
 ])
 
 const theme = ref((localStorage.getItem('VXE_THEME') as 'light' | 'dark') || 'light')

examples/main.ts

@@ -10,7 +10,7 @@ import VxeUI from '../packages'
 import enUS from '../packages/language/en-US'
 import '../styles/all.scss'
 
-// import VxeTable from 'vxe-table'
+// import VxeUITable from 'vxe-table'
 // import 'vxe-table/lib/style.css'
 
 declare global {
@@ -44,6 +44,6 @@ const app = createApp(App)
 app.use(router)
 app.use(i18n)
 app.use(VxeUI)
-// app.use(VxeTable)
+// app.use(VxeUITable)
 
 app.mount('#app')

examples/router/index.ts

@@ -279,6 +279,11 @@ const routes: Array<RouteRecordRaw> = [
     path: '/component/rate',
     name: 'RateTest',
     component: () => import('../views/rate/RateTest.vue')
+  },
+  {
+    path: '/component/table-select',
+    name: 'TableSelect',
+    component: () => import('../views/table-select/TableSelect.vue')
   }
 ]
 

examples/views/icon/IconTest.vue

@@ -14,7 +14,7 @@ import { ref } from 'vue'
 import { VxeIconPropTypes } from '../../../types'
 
 const iconList = ref<VxeIconPropTypes.Name[]>([
-  'add', 'add-sub', 'add-user', 'add-users', 'align-center', 'align-left', 'align-right', 'alipay', 'arrow-double-left', 'arrow-double-right', 'arrow-down', 'arrow-left', 'arrow-right', 'arrow-up', 'arrows-down', 'arrows-left', 'arrows-right', 'arrows-up', 'association-form', 'bell', 'bell-fill', 'calendar', 'caret-down', 'caret-left', 'caret-right', 'caret-up', 'carousel', 'chart-bar-x', 'chart-bar-y', 'chart-line', 'chart-pie', 'chart-radar', 'chat', 'chat-fill', 'check', 'checkbox-checked', 'checkbox-checked-fill', 'checkbox-indeterminate-fill', 'checkbox-unchecked', 'click-button', 'close', 'cloud-download', 'cloud-upload', 'cloudy', 'comment', 'company', 'copy', 'custom-column', 'cut', 'delete', 'delete-fill', 'dot', 'download', 'drag-handle', 'edit', 'ellipsis-h', 'ellipsis-v', 'empty', 'end-page', 'envelope', 'envelope-fill', 'envelope-open', 'envelope-open-fill', 'error-circle', 'error-circle-fill', 'exclamation', 'eye-fill', 'eye-fill-close', 'feedback', 'file', 'file-excel', 'file-image', 'file-markdown', 'file-pdf', 'file-ppt', 'file-txt', 'file-word', 'file-zip', 'fixed-left', 'fixed-left-fill', 'fixed-right', 'fixed-right-fill', 'flag', 'flag-fill', 'flow-branch', 'folder', 'folder-open', 'fullscreen', 'funnel', 'funnel-clear', 'gitee-fill', 'github-fill', 'goods', 'goods-fill', 'heavy-rain', 'home', 'home-fill', 'home-page', 'indicator', 'info-circle', 'info-circle-fill', 'information', 'input', 'language-switch', 'layout', 'lightning', 'link', 'location', 'location-fill', 'lock', 'lock-fill', 'maximize', 'menu', 'menu-fold', 'menu-unfold', 'merge-cells', 'message-fill', 'microphone', 'microphone-fill', 'minimize', 'minus', 'mobile', 'moon', 'notice-left-fill', 'notice-right-fill', 'num-list', 'number', 'paste', 'pc', 'pct-1-1', 'pct-full', 'picture', 'picture-fill', 'platform', 'print', 'print-batch', 'question', 'question-circle', 'question-circle-fill', 'radio-checked', 'radio-checked-fill', 'radio-unchecked', 'recover', 'refresh', 'repeat', 'rmb', 'rotate-left', 'rotate-right', 'row-col', 'save', 'search', 'search-zoom-in', 'search-zoom-out', 'select', 'send', 'send-fill', 'setting', 'setting-fill', 'share', 'share-fill', 'signature', 'slider', 'sort', 'sort-alpha-asc', 'sort-alpha-desc', 'sort-asc', 'sort-desc', 'sort-numeric-asc', 'sort-numeric-desc', 'spinner', 'square', 'square-caret-right', 'square-caret-right-fill', 'square-checked', 'square-checked-fill', 'square-close', 'square-close-fill', 'square-down', 'square-down-fill', 'square-fill', 'square-left', 'square-left-fill', 'square-minus', 'square-minus-fill', 'square-plus', 'square-plus-fill', 'square-plus-square', 'square-right', 'square-right-fill', 'square-square', 'square-up', 'square-up-fill', 'star', 'star-fill', 'star-half', 'subtable', 'success-circle', 'success-circle-fill', 'sunny', 'swap', 'swap-down', 'swap-left', 'swap-right', 'swap-up', 'switch', 'table', 'tabs', 'text', 'textarea', 'time', 'tree-select', 'undo', 'unlock', 'unlock-fill', 'upload', 'usd', 'user', 'user-fill', 'voice', 'voice-fill', 'warning-circle', 'warning-circle-fill', 'warning-triangle', 'warning-triangle-fill', 'wechat', 'zoom-in', 'zoom-out'
+  'add', 'add-sub', 'add-user', 'add-users', 'align-center', 'align-left', 'align-right', 'alipay', 'arrow-double-left', 'arrow-double-right', 'arrow-down', 'arrow-left', 'arrow-right', 'arrow-up', 'arrows-down', 'arrows-left', 'arrows-right', 'arrows-up', 'association-form', 'bell', 'bell-fill', 'calendar', 'caret-down', 'caret-left', 'caret-right', 'caret-up', 'carousel', 'chart-bar-x', 'chart-bar-y', 'chart-line', 'chart-pie', 'chart-radar', 'chat', 'chat-fill', 'check', 'checkbox-checked', 'checkbox-checked-fill', 'checkbox-indeterminate-fill', 'checkbox-unchecked', 'click-button', 'close', 'cloud-download', 'cloud-upload', 'cloudy', 'comment', 'company', 'copy', 'custom-column', 'cut', 'delete', 'delete-fill', 'dot', 'download', 'drag-handle', 'edit', 'ellipsis-h', 'ellipsis-v', 'empty', 'end-page', 'envelope', 'envelope-fill', 'envelope-open', 'envelope-open-fill', 'error-circle', 'error-circle-fill', 'exclamation', 'eye-fill', 'eye-fill-close', 'feedback', 'file', 'file-excel', 'file-image', 'file-markdown', 'file-pdf', 'file-ppt', 'file-txt', 'file-word', 'file-zip', 'fixed-left', 'fixed-left-fill', 'fixed-right', 'fixed-right-fill', 'flag', 'flag-fill', 'flow-branch', 'folder', 'folder-open', 'fullscreen', 'funnel', 'funnel-clear', 'gitee-fill', 'github-fill', 'goods', 'goods-fill', 'heavy-rain', 'home', 'home-fill', 'home-page', 'indicator', 'info-circle', 'info-circle-fill', 'information', 'input', 'language-switch', 'layout', 'lightning', 'link', 'location', 'location-fill', 'lock', 'lock-fill', 'maximize', 'menu', 'menu-fold', 'menu-unfold', 'merge-cells', 'message-fill', 'microphone', 'microphone-fill', 'minimize', 'minus', 'mobile', 'moon', 'notice-left-fill', 'notice-right-fill', 'num-list', 'number', 'paste', 'pc', 'pct-1-1', 'pct-full', 'picture', 'picture-fill', 'platform', 'print', 'print-batch', 'question', 'question-circle', 'question-circle-fill', 'radio-checked', 'radio-checked-fill', 'radio-unchecked', 'recover', 'refresh', 'repeat', 'rich-text', 'rmb', 'rotate-left', 'rotate-right', 'row-col', 'save', 'search', 'search-zoom-in', 'search-zoom-out', 'select', 'send', 'send-fill', 'setting', 'setting-fill', 'share', 'share-fill', 'signature', 'slider', 'sort', 'sort-alpha-asc', 'sort-alpha-desc', 'sort-asc', 'sort-desc', 'sort-numeric-asc', 'sort-numeric-desc', 'spinner', 'square', 'square-caret-right', 'square-caret-right-fill', 'square-checked', 'square-checked-fill', 'square-close', 'square-close-fill', 'square-down', 'square-down-fill', 'square-fill', 'square-left', 'square-left-fill', 'square-minus', 'square-minus-fill', 'square-plus', 'square-plus-fill', 'square-plus-square', 'square-right', 'square-right-fill', 'square-square', 'square-up', 'square-up-fill', 'star', 'star-fill', 'star-half', 'subtable', 'success-circle', 'success-circle-fill', 'sunny', 'swap', 'swap-down', 'swap-left', 'swap-right', 'swap-up', 'switch', 'table', 'tabs', 'text', 'textarea', 'time', 'tree-select', 'undo', 'unlock', 'unlock-fill', 'upload', 'usd', 'user', 'user-fill', 'voice', 'voice-fill', 'warning-circle', 'warning-circle-fill', 'warning-triangle', 'warning-triangle-fill', 'wechat', 'zoom-in', 'zoom-out'
 ])
 </script>
 

examples/views/table-select/TableSelect.vue

@@ -0,0 +1,25 @@
+<template>
+  <div>
+    <vxe-table-select v-model="val1" :options="opts1" :columns="columns1"></vxe-table-select>
+  </div>
+</template>
+
+<script lang="ts" setup>
+import { ref } from 'vue'
+import { VxeTableSelectPropTypes } from '../../../types'
+
+const val1 = ref('')
+const columns1 = ref<VxeTableSelectPropTypes.Columns>([
+  { field: 'name', title: 'Name' },
+  { field: 'role', title: 'Role' },
+  { field: 'sex', title: 'Sex' }
+])
+const opts1 = ref([
+  { name: 'Test1', role: 'Test', sex: 'man', label: 'Test1', value: 1 },
+  { name: 'Test2', role: 'Test', sex: 'man', label: 'Test2', value: 2 },
+  { name: 'Test3', role: 'Test', sex: 'man', label: 'Test3', value: 3 },
+  { name: 'Test4', role: 'Test', sex: 'man', label: 'Test4', value: 4 },
+  { name: 'Test5', role: 'Test', sex: 'man', label: 'Test5', value: 5 },
+  { name: 'Test6', role: 'Test', sex: 'man', label: 'Test6', value: 6 }
+])
+</script>

gulpfile.js

@@ -98,6 +98,7 @@ const componentList = [
   'steps',
   'switch',
   'tab-pane',
+  'table-select',
   'tabs',
   'tag',
   'text-ellipsis',
@@ -313,7 +314,7 @@ gulp.task('build_icon', () => {
       .pipe(gulp.dest('lib'))
       .pipe(gulp.dest('lib/icon/style'))
       .pipe(gulp.dest('es'))
-      .pipe(gulp.dest('es/icon/style'))
+      .pipe(gulp.dest('es/icon'))
   )
 })
 

package.json

@@ -1,6 +1,6 @@
 {
   "name": "vxe-pc-ui",
-  "version": "4.2.26",
+  "version": "4.2.29",
   "description": "A vue based PC component library",
   "scripts": {
     "update": "npm install --legacy-peer-deps",
@@ -63,7 +63,7 @@
     "vue": "3.5.5",
     "vue-i18n": "^9.13.1",
     "vue-router": "^4.3.2",
-    "vxe-table": "^4.7.90"
+    "vxe-table": "^4.7.94"
   },
   "vetur": {
     "tags": "helper/vetur/tags.json",

packages/components.ts

@@ -69,6 +69,7 @@ import VxeSlider from './slider'
 import VxeSteps from './steps'
 import VxeSwitch from './switch'
 import VxeTabPane from './tab-pane'
+import VxeTableSelect from './table-select'
 import VxeTabs from './tabs'
 import VxeTag from './tag'
 import VxeTextEllipsis from './text-ellipsis'
@@ -151,6 +152,7 @@ const components = [
   VxeSteps,
   VxeSwitch,
   VxeTabPane,
+  VxeTableSelect,
   VxeTabs,
   VxeTag,
   VxeTextEllipsis,
@@ -254,6 +256,7 @@ export * from './slider'
 export * from './steps'
 export * from './switch'
 export * from './tab-pane'
+export * from './table-select'
 export * from './tabs'
 export * from './tag'
 export * from './/text-ellipsis'

packages/form/render/index.ts

@@ -393,6 +393,19 @@ renderer.mixin({
       ]
     }
   },
+  VxeTableSelect: {
+    renderFormItemContent (renderOpts: any, params: any) {
+      const { data, field } = params
+      const { options, optionProps } = renderOpts
+      const itemValue = XEUtils.get(data, field)
+      return [
+        h(getDefaultComponent(renderOpts), {
+          ...getComponentFormItemProps(renderOpts, params, itemValue, { options, optionProps }),
+          ...getItemOns(renderOpts, params)
+        })
+      ]
+    }
+  },
   VxeIconPicker: {
     renderFormItemContent: defaultFormItemRender
   },

packages/table-select/index.ts

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