@neatui/vue 4.3.0 → 4.5.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@neatui/vue",
-  "version": "4.3.0",
+  "version": "4.5.0",
   "description": "basic component ui",
   "main": "./src/index.ts",
   "license": "MIT",
@@ -27,14 +27,14 @@
   },
   "dependencies": {
     "@fekit/floor": "^3.0.1",
-    "@fekit/follow": "^1.8.0",
+    "@fekit/follow": "^1.7.0",
     "@fekit/itable": "^1.1.6",
     "@fekit/pullload": "^1.3.5",
     "@fekit/scale": "^2.0.1",
     "@fekit/scrollto": "^3.0.3",
     "@fekit/toast": "^2.7.2",
     "@fekit/utils": "^6.0.0",
-    "@neatui/css": "^4.4.0",
+    "@neatui/css": "^4.4.1",
     "@rollup/plugin-commonjs": "^26.0.1",
     "@rollup/plugin-node-resolve": "^15.2.3",
     "@vue/compiler-sfc": "^3.4.30",

package/src/components/basic/IFollowView.vue

@@ -56,7 +56,6 @@
     clickTipHide?: boolean;
     mobile?: boolean;
     title?: string;
-    zIndex?: string | number | null;
   }
 
   // 入参
@@ -74,7 +73,6 @@
     clickTipHide: false,
     mobile: true,
     title: '',
-    zIndex: undefined,
   });
 
   const dom: any = ref(null);
@@ -216,20 +214,13 @@
             }
           }
         },
-        { hideOnScrollOut: false, zIndex: props.zIndex },
+        { hideOnScrollOut: false },
       );
     } else {
       ex.value = null;
     }
   });
 
-  watch(
-    () => props.zIndex,
-    (zIndex) => {
-      ex.value?.setOptions({ zIndex });
-    },
-  );
-
   onUnmounted(() => {
     document.removeEventListener('click', cancel, true);
     // 移除触摸事件监听器

package/src/components/form/Cascader.vue

@@ -1,5 +1,5 @@
 <template>
-  <div :ui-form="`@a type:select sz:${sz}`" :ui-form-open="state.show ? 'show' : ''" class="mc-cascader">
+  <div :ui-form="`${theme} type:select sz:${sz}`" :ui-form-open="state.show ? 'show' : ''" class="mc-cascader">
     <IFollowView
       ref="ifollow"
       :tipBoxStyle="`${state.flatOpts.length && state.flatOpts[0]?.length > 0 ? 'min-width: 10em;' : 'min-width: 100%'}`"
@@ -17,7 +17,7 @@
               <template v-if="multiple">
                 <li v-for="(item, idx) of opt" :key="idx" class="ux-hover nx-sm r-ss nowrap" @click="multiSelect(item, optIndex)">
                   <div ui-flex="row xm">
-                    <div ui-form="@a type:checkbox :block`">
+                    <div :ui-form="`${theme} type:checkbox :block`">
                       <input
                         :checked="item.checkedStatus === 'all'"
                         :class="`mr-sm ${item.checkedStatus === 'part' ? 'part-style' : ''}`"
@@ -71,7 +71,7 @@
                 <span>单选</span>
               </p>
             </div>
-            <label v-else class="nx-sm r-ss nowrap" ui-form="@a type:checkbox :block`">
+            <label v-else class="nx-sm r-ss nowrap" :ui-form="`${theme} type:checkbox :block`">
               <input :checked="state.checkAll" name="checkAll" type="checkbox" @change="checkAllChange" />
               <span :class="`${state.checkAll ? 'co-main' : ''}`">全选</span>
             </label>

package/src/components/form/DatePicker.vue

@@ -1,5 +1,5 @@
 <template>
-  <div :ui-form="`@a type:select sz:${sz}`" ui-tips="@a co:well" :ui-tips-view="state.show">
+  <div :ui-form="`${theme} type:select sz:${sz}`" ui-tips="@a co:well" :ui-tips-view="state.show">
     <IFollowView ref="ifollow">
       <Input
         v-bind="{ placeholder, rules, theme, sz, co, block, ready, type, tips, maxlength, minlength, disabled, readonly, clearable, verify, prefix, suffix, interacted }"

package/src/components/form/DateRangePicker.vue

@@ -1,5 +1,5 @@
 <template>
-  <div :ui-form="`@a type:select sz:${sz}`" ui-tips="@a co:well" :ui-tips-view="state.show">
+  <div :ui-form="`${theme} type:select sz:${sz}`" ui-tips="@a co:well" :ui-tips-view="state.show">
     <IFollowView ref="ifollow">
       <InputRange
         v-bind="{ placeholder, rules, theme, sz, co, block, ready, type, tips, maxlength, minlength, disabled, readonly, clearable, verify, prefix, suffix, interacted }"

package/src/components/form/ImgUpload.vue

@@ -11,7 +11,7 @@
     </template>
     <template v-if="(!multiple && files && files.length === 0) || (multiple && (!limit || (limit && files && files.length < limit)))">
       <slot>
-        <div ui-flex="row cm" ui-form="@a type:upload tips:hover" :class="`upload bg-fore b-solid b-case b-xs mb-sl ${uploadClass}`" :style="uploadStyle">
+        <div ui-flex="row cm" :ui-form="`${theme} type:upload tips:hover`" :class="`upload bg-fore b-solid b-case b-xs mb-sl ${uploadClass}`" :style="uploadStyle">
           <div v-if="tips" ui-form-tips>
             {{ tips }}
           </div>
@@ -52,6 +52,7 @@
     multiple?: boolean; // 是否可以上传多个文件
     crop?: boolean; // 是否需要抠图处理
     action?: string; // 上传路径
+    theme?: string;
   }
 
   const props = withDefaults(defineProps<Props>(), {
@@ -64,6 +65,7 @@
     multiple: false,
     crop: false,
     action: '/common/updateFile',
+    theme: '@a',
   });
 
   const emit = defineEmits(['update:modelValue', 'change']);

package/src/components/form/MoreSelect.vue

@@ -1,5 +1,5 @@
 <template>
-  <div :ui-form="`@a type:select ${sz ? 'sz:' + sz : ''}`">
+  <div :ui-form="`${theme} type:select ${sz ? 'sz:' + sz : ''}`">
     <IFollowView ref="ifollow" tipBoxClass="ny-sm nx-no" tipBoxStyle="min-width: 100%">
       <slot>
         <Input
@@ -14,7 +14,7 @@
       </slot>
       <template #tips>
         <div v-if="search" class="ny-sm nx-sl">
-          <Input v-model="state.search" sz="s">
+          <Input v-model="state.search" :theme="theme" sz="s">
             <template #suffix>
               <i ui-form-search="" class="co-note"></i>
             </template>
@@ -23,13 +23,13 @@
         <ul v-if="state.filter?.length" ui-scroll=":y s" class="nx-sm lh-ml" style="min-width: 100%; max-height: 15em">
           <template v-for="(item, idx) of state.filter" :key="idx">
             <li v-if="item.disabled" class="ux-hover nx-sm r-ss o-ms nowrap">
-              <label style="pointer-events: none" ui-form="@a type:checkbox :block">
+              <label style="pointer-events: none" :ui-form="`${theme} type:checkbox :block`">
                 <input type="checkbox" :name="state.name" :checked="state.processedValue?.some((i: any) => `${i}` === `${item.value}`)" />
                 <del class="ml-sm">{{ item.label || item }}</del>
               </label>
             </li>
             <li v-else class="ux-hover nx-sm r-ss nowrap" @click.stop="select(item.value)">
-              <label style="pointer-events: none" ui-form="@a type:checkbox :block">
+              <label style="pointer-events: none" :ui-form="`${theme} type:checkbox :block`">
                 <input type="checkbox" :name="state.name" :checked="state.processedValue?.some((i: any) => `${i}` === `${item.value}`)" />
                 <span class="ml-sm">{{ item.label || item }}</span>
               </label>
@@ -41,7 +41,7 @@
           <li class="my-ss"><div class="o-mm" ui-line="@a"></div></li>
           <li ui-flex="row xm">
             <div class="ux-hover nx-sm ny-ss r-ss nowrap co-main" @click.stop="allselect()">
-              <label style="pointer-events: none" ui-form="@a type:checkbox :block">
+              <label style="pointer-events: none" :ui-form="`${theme} type:checkbox :block`">
                 <input type="checkbox" :name="state.name" :checked="state.all" />
                 <span class="ml-sm">全选({{ state.selectedCount }}/{{ state.availableCount }})</span>
               </label>

package/src/components/form/MoreSelectList.vue

@@ -8,7 +8,7 @@
       class="n-sm r-ss b-solid b-xs"
       @click.stop="select(item.value)"
     >
-      <label ui-form="@a type:checkbox :block" style="pointer-events: none">
+      <label :ui-form="`${theme} type:checkbox :block`" style="pointer-events: none">
         <input :checked="mv?.some((i: any) => `${i}` === `${item.value}`)" :name="field" type="checkbox" />
         <span class="ml-sm">{{ item.label || item }}</span>
       </label>

package/src/components/form/MoreSelectPanel.vue

@@ -1,5 +1,5 @@
 <template>
-  <div :ui-form="`@a type:select ${sz ? 'sz:' + sz : ''}`">
+  <div :ui-form="`${theme} type:select ${sz ? 'sz:' + sz : ''}`">
     <IPickerView ref="ipicker" tipBoxClass="ny-sm nx-no" tipBoxStyle="min-width: 100%">
       <slot>
         <Input
@@ -16,13 +16,13 @@
         <ul v-if="props.options?.length" ui-scroll=":y s" class="nx-sm lh-ml" style="min-width: 100%; max-height: 15em">
           <template v-for="(item, idx) of props.options" :key="idx">
             <li v-if="item.disable" class="ux-hover nx-sm r-ss o-ms">
-              <label style="pointer-events: none" ui-form="@a type:checkbox :block">
+              <label style="pointer-events: none" :ui-form="`${theme} type:checkbox :block`">
                 <input type="checkbox" :name="state.name" :checked="modelValue?.some((i: any) => `${i}` === `${item.value}`)" />
                 <del class="ml-sm">{{ item.label || item }}</del>
               </label>
             </li>
             <li v-else class="ux-hover nx-sm r-ss" @click.stop="select(item.value)">
-              <label style="pointer-events: none" ui-form="@a type:checkbox :block">
+              <label style="pointer-events: none" :ui-form="`${theme} type:checkbox :block`">
                 <input type="checkbox" :name="state.name" :checked="modelValue?.some((i: any) => `${i}` === `${item.value}`)" />
                 <span class="ml-sm">{{ item.label || item }}</span>
               </label>
@@ -34,7 +34,7 @@
           <li class="my-ss"><div class="o-mm" ui-line="@a"></div></li>
           <li ui-flex="row xm">
             <div class="ux-hover nx-sm r-ss nowrap co-main" @click.stop="allselect()">
-              <label style="pointer-events: none" ui-form="@a type:checkbox :block">
+              <label style="pointer-events: none" :ui-form="`${theme} type:checkbox :block`">
                 <input type="checkbox" :name="state.name" :checked="state.all" />
                 <span class="ml-sm">全选({{ props.options?.length || 0 }})</span>
               </label>

package/src/components/form/MoreSelectPicker.vue

@@ -1,5 +1,5 @@
 <template>
-  <div :ui-form="`@a type:select sz:${sz}`" ref="dom">
+  <div :ui-form="`${theme} type:select sz:${sz}`" ref="dom">
     <IPickerView ref="ipicker">
       <Input v-bind="$props" :clearable="false" readonly v-model="state.value">
         <template #suffix><i ui-form-select=""></i></template>
@@ -14,7 +14,7 @@
             <IScrollView class="full n-ms" :pull="false" :load="false">
               <ul v-if="props.options?.length" class="my-sm-sub">
                 <li class="ux-hover n-sm r-ss nowrap b-solid b-case b-xs" v-for="(item, idx) of props.options" :key="idx" @click.stop="select(item.value)">
-                  <label style="pointer-events: none" ui-form="@a type:checkbox :block">
+                  <label style="pointer-events: none" :ui-form="`${theme} type:checkbox :block`">
                     <input type="checkbox" :name="field" :checked="mv?.some((i: any) => `${i}` === `${item.value}`)" />
                     <span class="ml-sm">{{ item.label || item }}</span>
                   </label>

package/src/components/form/PageMoreSelect.vue

@@ -1,5 +1,5 @@
 <template>
-  <div :ui-form="`@a type:select ${sz ? 'sz:' + sz : ''}`" :ui-form-open="state.show ? 'show' : ''" ref="dom">
+  <div :ui-form="`${theme} type:select ${sz ? 'sz:' + sz : ''}`" :ui-form-open="state.show ? 'show' : ''" ref="dom">
     <IFollowView ref="ifollow" tipBoxClass="ny-sm nx-no" tipBoxStyle="min-width: 100%">
       <slot>
         <Input v-bind="$props" :clearable="false" readonly v-model="state.selectd">
@@ -8,7 +8,7 @@
       </slot>
       <template #tips>
         <div v-if="filterable" class="ny-sm nx-sl" style="height: 3em">
-          <div :ui-form="`@a type:input sz:s :block`">
+          <div :ui-form="`${theme} type:input sz:s :block`">
             <input type="text" :placeholder="props.placeholder" v-model="state.search" />
             <div ui-form-suffix="">
               <i ui-form-clean="" v-if="state.search" @click.stop="state.search = ''"></i>
@@ -18,7 +18,7 @@
         </div>
         <ul v-if="props.options?.length" ui-form-dropdown="" ui-scroll=":y s" class="nx-sm lh-ml" style="min-width: 100%; max-height: 15em">
           <li class="ux-hover nx-sm r-ss nowrap" v-for="(item, idx) of props.options" :key="idx" @click.stop="select(item.value)">
-            <label style="pointer-events: none" ui-form="@a type:checkbox :block">
+            <label style="pointer-events: none" :ui-form="`${theme} type:checkbox :block`">
               <input type="checkbox" :name="formName" :checked="modelValue?.some((i: any) => `${i}` === `${item.value}`)" />
               <span class="ml-sm">{{ item.label || item }}</span>
             </label>
@@ -29,7 +29,7 @@
           <li class="my-ss"><div class="o-mm" ui-line="@a"></div></li>
           <li ui-flex="row xm">
             <div class="ux-hover nx-sm r-ss nowrap co-main" @click.stop="allselect()">
-              <label style="pointer-events: none" ui-form="@a type:checkbox :block">
+              <label style="pointer-events: none" :ui-form="`${theme} type:checkbox :block`">
                 <input type="checkbox" :name="formName" :checked="state.all" />
                 <!-- <span class="ml-sm">全选({{ props.options?.length || 0 }})</span> -->
                 <span class="ml-sm">全选</span>
@@ -37,7 +37,7 @@
             </div>
             <div ui-flex="row cm" class="nx-sm">
               <button :ui-btn="`@a xs read :border :square ${state.pageInfo.page > 1 ? '' : ':disabled'}`" @click="prev"><i class="icon icon-prev"></i></button>
-              <div :ui-form="`@a type:input sz:xs`" class="page-input mx-ss">
+              <div :ui-form="`${theme} type:input sz:xs`" class="page-input mx-ss">
                 <input type="number" class="ac" :placeholder="props.placeholder" v-model="state.pageInfo.page" @change="pageChange" />
               </div>
               <button :ui-btn="`@a xs read :border :square ${state.pageInfo.page < pageInfo.pages ? '' : ':disabled'}`" @click="next"><i class="icon icon-next"></i></button>

package/src/components/form/PageSelect.vue

@@ -1,12 +1,12 @@
 <template>
-  <div :ui-form="`@a type:select sz:${sz}`" :ui-form-open="state.show ? 'show' : ''" ref="dom">
+  <div :ui-form="`${theme} type:select sz:${sz}`" :ui-form-open="state.show ? 'show' : ''" ref="dom">
     <IFollowView ref="ifollow" tipBoxClass="ny-sm nx-no" tipBoxStyle="min-width: 100%">
       <Input v-bind="$props" :clearable="false" readonly v-model="state.selectd.label" :interacted="interacted">
         <template #suffix><i ui-form-select=""></i></template>
       </Input>
       <template #tips>
         <div v-if="filterable" class="ny-sm nx-sl" style="height: 3em">
-          <div :ui-form="`@a type:input sz:s :block`">
+          <div :ui-form="`${theme} type:input sz:s :block`">
             <input type="text" :placeholder="props.placeholder" v-model="state.search" />
             <div ui-form-suffix="">
               <i ui-form-clean="" v-if="state.search" @click.stop="state.search = ''"></i>
@@ -25,7 +25,7 @@
           <li ui-flex="row xm">
             <div ui-flex="row cm" class="nx-sm">
               <button :ui-btn="`@a s read :border :square ${state.pageInfo.page > 1 ? '' : ':disabled'}`" @click="prev"><i class="icon icon-prev"></i></button>
-              <div :ui-form="`@a type:input sz:s`" class="page-input mx-ss">
+              <div :ui-form="`${theme} type:input sz:s`" class="page-input mx-ss">
                 <input type="number" class="ac" :placeholder="props.placeholder" v-model="state.pageInfo.page" @change="pageChange" />
               </div>
               <button :ui-btn="`@a s read :border :square ${state.pageInfo.page < pageInfo.pages ? '' : ':disabled'}`" @click="next"><i class="icon icon-next"></i></button>

package/src/components/form/SearchMoreSelect.vue

@@ -1,12 +1,12 @@
 <template>
-  <div :ui-form="`@a type:select sz:${sz}`" :ui-form-open="state.show ? 'show' : ''">
+  <div :ui-form="`${theme} type:select sz:${sz}`" :ui-form-open="state.show ? 'show' : ''">
     <IFollowView ref="ifollow" tipBoxClass="ny-sm nx-no" tipBoxStyle="min-width: 100%" @onshow="onshow" @onhide="onhide">
       <Input v-bind="$props" :clearable="false" readonly v-model="state.selectd" @click="toggle" :interacted="interacted">
         <template #suffix><i ui-form-select=""></i></template>
       </Input>
       <template #tips>
         <div class="ny-sm nx-sl" style="height: 3em">
-          <div :ui-form="`@a type:input sz:s :block`">
+          <div :ui-form="`${theme} type:input sz:s :block`">
             <input type="text" :placeholder="props.placeholder" v-model="state.search" />
             <div ui-form-suffix="">
               <i ui-form-clean="" v-if="state.search" @click.stop="state.search = ''"></i>
@@ -16,7 +16,7 @@
         </div>
         <ul v-if="props.options?.length" ui-form-dropdown="" ui-scroll=":y s" class="nx-sm lh-ml" style="min-width: 100%; max-height: 15em">
           <li class="ux-hover nx-sm r-ss nowrap" v-for="(item, idx) of state.filter" :key="idx" @click.stop="select(item.value)">
-            <label style="pointer-events: none" ui-form="@a type:checkbox :block">
+            <label style="pointer-events: none" :ui-form="`${theme} type:checkbox :block`">
               <input type="checkbox" :name="formName" :checked="modelValue?.some((i: any) => `${i}` === `${item.value}`)" />
               <span class="ml-sm">{{ item.label || item }}</span>
             </label>
@@ -27,7 +27,7 @@
           <li class="my-ss"><div class="o-mm" ui-line="@a"></div></li>
           <li ui-flex="row xm">
             <div class="ux-hover nx-sm r-ss nowrap co-main" @click.stop="allselect()">
-              <label style="pointer-events: none" ui-form="@a type:checkbox :block">
+              <label style="pointer-events: none" :ui-form="`${theme} type:checkbox :block`">
                 <input type="checkbox" :name="formName" :checked="state.all" />
                 <span class="ml-sm">全选({{ state.filter?.length || 0 }})</span>
               </label>

package/src/components/form/SearchSelect.vue

@@ -1,5 +1,5 @@
 <template>
-  <div :ui-form="`@a type:select sz:${sz}`" :ui-form-open="state.show ? 'show' : ''">
+  <div :ui-form="`${theme} type:select sz:${sz}`" :ui-form-open="state.show ? 'show' : ''">
     <IFollowView ref="ifollow" tipBoxClass="ny-sm nx-no" tipBoxStyle="min-width: 100%" @onshow="onshow" @onhide="onhide">
       <Input
         v-bind="{ placeholder, rules, theme, sz, co, block, ready, type, tips, disabled, readonly: true, clearable: false, verify, prefix, suffix, interacted }"
@@ -10,7 +10,7 @@
       </Input>
       <template #tips v-if="!readonly || !disabled">
         <div v-if="search" class="ny-sm nx-sl">
-          <Input v-model="state.search" sz="s">
+          <Input v-model="state.search" :theme="theme" sz="s">
             <template #suffix>
               <i ui-form-search="" class="co-note"></i>
             </template>

package/src/components/form/Select.vue

@@ -1,5 +1,5 @@
 <template>
-  <div :ui-form="`@a type:select sz:${sz}`" :ui-form-open="state.show ? 'show' : ''">
+  <div :ui-form="`${theme} type:select sz:${sz}`" :ui-form-open="state.show ? 'show' : ''">
     <IFollowView ref="ifollow" tipBoxClass="ny-sm nx-no" tipBoxStyle="min-width: 100%" @onshow="onshow" @onhide="onhide">
       <Input
         v-bind="{ placeholder, rules, theme, sz, co, block, ready, type, tips, disabled, readonly: true, clearable: false, verify, prefix, suffix, interacted }"
@@ -13,7 +13,7 @@
       </Input>
       <template #tips v-if="!readonly && !disabled">
         <div v-if="search" class="ny-sm nx-sl">
-          <Input v-model="state.search" :sz="sz">
+          <Input v-model="state.search" :theme="theme" :sz="sz">
             <template #suffix>
               <i ui-form-search="" class="co-note"></i>
             </template>
@@ -38,6 +38,7 @@
               v-model="customInputValue"
               v-bind="other.config || {}"
               :placeholder="other.config?.placeholder || '请输入自定义内容'"
+              :theme="theme"
               sz="s"
               @keyup.enter="confirmCustomInput"
               @blur="confirmCustomInput"

package/src/components/form/SelectList.vue

@@ -7,7 +7,7 @@
       :key="idx"
       @click="mv = item.value === mv ? '' : item.value"
     >
-      <label ui-form="@a type:radio" style="pointer-events: none">
+      <label :ui-form="`${theme} type:radio`" style="pointer-events: none">
         <input type="radio" :name="field" :data-name="field" :checked="item.value === mv" /><span class="lh-ss">{{ item.label || item }}</span>
       </label>
     </li>

package/src/components/form/SelectPicker.vue

@@ -1,5 +1,5 @@
 <template>
-  <div :ui-form="`@a type:select sz:${sz}`" ref="dom">
+  <div :ui-form="`${theme} type:select sz:${sz}`" ref="dom">
     <IPickerView ref="ipicker">
       <Input v-bind="$props" :clearable="false" readonly v-model="state.selectd.label">
         <template #suffix><i ui-form-select=""></i></template>
@@ -14,7 +14,7 @@
             <IScrollView class="full n-ms" :pull="false" :load="false">
               <ul v-if="props.options?.length" class="my-sm-sub">
                 <li class="ux-hover n-sm r-ss b-solid b-case b-xs" v-for="(item, idx) of props.options" :key="idx" @click="mv = item.value">
-                  <label ui-form="@a type:radio">
+                  <label :ui-form="`${theme} type:radio`">
                     <input type="radio" :name="item.field" :checked="item.value === mv" /><span>{{ item.label || item }}</span>
                   </label>
                 </li>

package/src/components/form/SelectTree/SelectTree.vue

@@ -1,5 +1,5 @@
 <template>
-  <div :ui-form="`@a type:select sz:${sz}`" :ui-form-open="state.show ? 'show' : 'hide'">
+  <div :ui-form="`${theme} type:select sz:${sz}`" :ui-form-open="state.show ? 'show' : 'hide'">
     <IFollowView ref="ifollow" v-model="state.show" tipBoxClass="ny-sm nx-no" tipBoxStyle="min-width: 100%" @onshow="onshow" @onhide="onhide">
       <Input
         v-bind="{ placeholder, rules, theme, sz, co, block, ready, type, tips, disabled, readonly: true, clearable: false, verify, prefix, suffix, interacted }"
@@ -10,7 +10,7 @@
       </Input>
       <template #tips v-if="!readonly || !disabled">
         <div v-if="search" class="nb-sm nx-sl">
-          <Input v-model="state.search" sz="s">
+          <Input v-model="state.search" :theme="theme" sz="s">
             <template #suffix>
               <i ui-form-search="" class="co-note"></i>
             </template>

package/src/components/form/Switch.vue

@@ -1,5 +1,5 @@
 <template>
-  <label ui-form="@a type:switch">
+  <label :ui-form="`${theme} type:switch`">
     <input type="checkbox" v-model="internalValue" :disabled="disabled" />
     <slot>
       <span>{{ text }}</span>

package/src/components/form/Upload.vue

@@ -164,7 +164,7 @@
         <label
           class="pr flex-block"
           :class="{ 'ux-disable': disabled }"
-          ui-form="@a type:upload tips:hover"
+          :ui-form="`${theme} type:upload tips:hover`"
           :style="`width: ${isNumber(width) ? width + 'em' : width}`"
           v-bind="itemAttrs"
         >
@@ -209,6 +209,7 @@
     disabled?: boolean;
     width?: number | string;
     ratio?: number;
+    theme?: string;
   }
 
   const props = withDefaults(defineProps<Props>(), {
@@ -226,6 +227,7 @@
     disabled: false,
     width: 10,
     ratio: 100,
+    theme: '@a',
   });
 
   interface UploadFile {

package/src/components/loader/TableLoader/TableLoader.vue

@@ -8,7 +8,7 @@
             <label class="mb-ss" ui-form="@a type:checkbox"><input type="checkbox" v-model="all" /><span></span></label>
           </th>
           <template v-for="(col, idx) in state.table" :key="idx">
-            <th v-if="!col.__close" :min-width="col.fixed" :col-fixed="col.fixed" :col-fixed-side="col.fixed || 'l'" :data-field="col.field">
+            <th v-if="!col.__close" v-bind="colSizeAttrs(col)" :col-fixed="col.fixed" :col-fixed-side="col.fixed || 'l'" :data-field="col.field">
               <slot :name="`thead-${col.field}`" :col="col" :idx="idx">
                 <div :class="!slots.operate && idx === state.__last ? 'ar' : ''" v-bind="col.thead">
                   <span class="ux-none" ui-flex="row rm" v-if="col.order === 0 || col.order === 1 || col.order === 2" @click="fSetOrder(col)">
@@ -82,7 +82,7 @@
               <td
                 v-if="!col.__close"
                 :class="`${!slots.operate && cid === state.__last ? 'ar' : ''}`"
-                :min-width="col.fixed"
+                v-bind="colSizeAttrs(col)"
                 :col-fixed="col.fixed"
                 :col-fixed-side="col.fixed || 'l'"
                 :data-field="col.field"
@@ -165,7 +165,7 @@
   interface JSONRules {
     label: string | (() => string);
     field: string | (() => string);
-    width?: string | (() => string);
+    width?: 'min' | 'max' | string | (() => string);
     fixed?: string | (() => string);
     paths?: string | (() => string);
     thead?: Record<string, any> | ((data: any) => Record<string, any>);
@@ -232,6 +232,16 @@
 
   const name = computed(() => 'confs' + route.path?.replace(/\//g, '_')) || '';
 
+  const colSizeAttrs = (col: TableColumn) => {
+    const raw = isFunction(col.width) ? col.width() : col.width;
+    const width = raw == null ? '' : String(raw).trim();
+    const attrs: Record<string, any> = {};
+    if (width === 'min' || (!width && col.fixed)) attrs['min-width'] = '';
+    if (width === 'max') attrs['max-width'] = '';
+    if (width && width !== 'min' && width !== 'max') attrs.style = { width, minWidth: width, maxWidth: width };
+    return attrs;
+  };
+
   // 全选状态
   const all = computed({
     get() {