@neatui/vue 4.2.5 → 4.4.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@neatui/vue",
-  "version": "4.2.5",
+  "version": "4.4.0",
   "description": "basic component ui",
   "main": "./src/index.ts",
   "license": "MIT",
@@ -27,14 +27,14 @@
   },
   "dependencies": {
     "@fekit/floor": "^3.0.1",
-    "@fekit/follow": "^1.7.0",
+    "@fekit/follow": "^1.8.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.2.5",
+    "@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,6 +56,7 @@
     clickTipHide?: boolean;
     mobile?: boolean;
     title?: string;
+    zIndex?: string | number | null;
   }
 
   // 入参
@@ -73,6 +74,7 @@
     clickTipHide: false,
     mobile: true,
     title: '',
+    zIndex: undefined,
   });
 
   const dom: any = ref(null);
@@ -214,13 +216,20 @@
             }
           }
         },
-        { hideOnScrollOut: false },
+        { hideOnScrollOut: false, zIndex: props.zIndex },
       );
     } else {
       ex.value = null;
     }
   });
 
+  watch(
+    () => props.zIndex,
+    (zIndex) => {
+      ex.value?.setOptions({ zIndex });
+    },
+  );
+
   onUnmounted(() => {
     document.removeEventListener('click', cancel, true);
     // 移除触摸事件监听器

package/src/components/form/Upload.vue

@@ -4,7 +4,7 @@
       <div class="w-full pr" :style="`box-sizing: content-box; padding-top: ${ratio}%`">
         <div class="pa full ot-no ol-no bg-fore n-sm b-solid b-case b-xs r-sm" ui-flex="col cm">
           <!-- 删除按钮 -->
-          <div v-if="!disabled" class="pa w-sl h-sl ot-ss or-ss bg-fore co-risk lh-xs r-xl parent-hover:show z-ls" ui-flex="row cm" @click="remove(idx)">
+          <div v-if="!disabled" class="pa w-sl h-sl ot-ss or-ss bg-fore co-risk lh-xs r-xl sub-hover z-ls" ui-flex="row cm" @click="remove(idx)">
             <svg class="block" style="width: 1.2em; height: 1.2em" viewBox="0 0 1024 1024">
               <path
                 d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm165.4 618.2l-66 0.3L512 563.4l-99.3 118.4-66.1-0.3c-4.4 0-8-3.5-8-8 0-1.9 0.7-3.7 1.9-5.2l130.1-155L340.5 359c-1.2-1.5-1.9-3.3-1.9-5.2 0-4.4 3.6-8 8-8l66.1 0.3L512 464.6l99.3-118.4 66-0.3c4.4 0 8 3.5 8 8 0 1.9-0.7 3.7-1.9 5.2L553.5 514l130 155c1.2 1.5 1.9 3.3 1.9 5.2 0 4.4-3.6 8-8 8z"

package/src/components/loader/LayerLoader/LayerLoader.vue

@@ -24,7 +24,7 @@
           <slot name="suffix" :item="item" :path="paths(idx)"></slot>
         </div>
         <slot name="tools" :data="data" :item="item" :path="paths(idx)">
-          <div ui-flex="row rm" class="layer-loader-tool parent-hover:show fs-sm" :data-model="item.model">
+          <div ui-flex="row rm" class="layer-loader-tool sub-hover fs-sm" :data-model="item.model">
             <div ui-tips="@a co:well ux:hover">
               <button ui-btn="@a none s :square">
                 <i class="icon icon-add"></i>
@@ -47,7 +47,7 @@
             </div>
             <button ui-btn="@a none s :square" @click="fDelNode(item, data, idx)"><i class="icon icon-delete"></i></button>
           </div>
-          <button ui-btn="@a none s :square" class="layer-loader-tool fs-sm" :class="item?.attrs?.hide ? '' : 'parent-hover:show'" @click="fhideNode(item)">
+          <button ui-btn="@a none s :square" class="layer-loader-tool fs-sm" :class="item?.attrs?.hide ? '' : 'sub-hover'" @click="fhideNode(item)">
             <i class="icon" :class="item?.attrs?.hide ? 'icon-hide' : 'icon-view'"></i>
           </button>
         </slot>

package/src/components/loader/MoveLoader/MoveLoader.vue

@@ -434,7 +434,7 @@
     &:hover {
       box-shadow: inset 0 0 0 100em var(--co-fore) !important;
 
-      & > .parent-hover\:show {
+      & > .sub-hover {
         opacity: 0 !important;
       }
     }

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() {