@neatui/vue 2.8.5 → 2.9.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@neatui/vue",
-  "version": "2.8.5",
+  "version": "2.9.0",
   "description": "basic component ui",
   "main": "./src/index.ts",
   "license": "MIT",

package/src/components/basic/IFollowView.vue

@@ -55,14 +55,14 @@
     modelValue: 0,
     pos: 'bl',
     event: 'click',
-    btnClass: '',
+    btnClass: 'dib',
     btnStyle: '',
     tipClass: '',
     tipStyle: '',
     tipBoxClass: '',
     tipBoxStyle: '',
     arrow: {},
-    clickTipHide: false
+    clickTipHide: false,
   });
 
   const dom: any = ref(null);
@@ -73,7 +73,7 @@
     show: 0,
     pos: props.pos,
     hover: 0,
-    tipdom: false
+    tipdom: false,
   });
 
   const showTimer: any = ref(null);
@@ -92,7 +92,7 @@
           state.show = 0;
         }, 100);
       }
-    }
+    },
   );
 
   // 开关
@@ -112,7 +112,7 @@
       }
       emits('update:modelValue', state.show);
     },
-    { deep: true }
+    { deep: true },
   );
 
   const hovershow = () => {
@@ -208,13 +208,13 @@
           ex.value.remove();
         }
       }
-    }
+    },
   );
 
   defineExpose({
     toggle,
     show,
     hide,
-    cancel
+    cancel,
   });
 </script>

package/src/components/basic/IScrollView.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="full fekit-ipull-scroll" ui-scroll=":y" ref="root">
+  <div class="fekit-ipull-scroll" :ui-scroll="`:y ${stable ? 'stable' : ''}`" ref="root">
     <div>
       <div class="fs-xs co-text o-mm" fekit-pullload-head="" v-if="pull">
         <div v-show="demo.store.pull < 2" ui-flex="row cm">
@@ -36,12 +36,16 @@
   const props: any = defineProps({
     pull: {
       type: Boolean,
-      default: false
+      default: false,
     },
     load: {
       type: Boolean,
-      default: false
-    }
+      default: false,
+    },
+    stable: {
+      type: Boolean,
+      default: false,
+    },
   });
   const root: any = ref(null);
   const demo: any = ref(null);
@@ -54,16 +58,16 @@
       ? {
           onpull: async () => {
             emits('onpull', demo.value);
-          }
+          },
         }
       : {}),
     ...(props.pull
       ? {
           onload: async () => {
             emits('onload', demo.value);
-          }
+          },
         }
-      : {})
+      : {}),
   });
 
   onMounted(() => {

package/src/components/basic/Icon.vue

@@ -7,48 +7,48 @@
   const icons: any = {
     'arrow-left': {
       path: [
-        'M655.2 844c-12 0-24-4.8-32-13.6L336.8 544c-8.8-8.8-13.6-20-13.6-32s4.8-24 13.6-32l286.4-287.2c8.8-8 20-12.8 32-12.8s24 4.8 32 13.6c8.8 8.8 13.6 20 13.6 32s-4.8 23.2-12.8 32L432.8 512l254.4 254.4c8.8 8.8 13.6 20 13.6 32s-4.8 23.2-13.6 32c-8 8.8-20 13.6-32 13.6z'
-      ]
+        'M655.2 844c-12 0-24-4.8-32-13.6L336.8 544c-8.8-8.8-13.6-20-13.6-32s4.8-24 13.6-32l286.4-287.2c8.8-8 20-12.8 32-12.8s24 4.8 32 13.6c8.8 8.8 13.6 20 13.6 32s-4.8 23.2-12.8 32L432.8 512l254.4 254.4c8.8 8.8 13.6 20 13.6 32s-4.8 23.2-13.6 32c-8 8.8-20 13.6-32 13.6z',
+      ],
     },
     'arrow-right': {
       path: [
-        'M368.8 844c-12 0-24-4.8-32-13.6-8.8-8.8-13.6-20-13.6-32s4.8-24 13.6-32L591.2 512 336.8 256.8c-8-8.8-12.8-20-12.8-32s4.8-23.2 13.6-32c8-8 20-13.6 32-13.6s23.2 4.8 32 12.8L688 479.2c8.8 8.8 13.6 20 13.6 32s-4.8 24-13.6 32l-286.4 286.4c-9.6 9.6-20.8 14.4-32.8 14.4z'
-      ]
+        'M368.8 844c-12 0-24-4.8-32-13.6-8.8-8.8-13.6-20-13.6-32s4.8-24 13.6-32L591.2 512 336.8 256.8c-8-8.8-12.8-20-12.8-32s4.8-23.2 13.6-32c8-8 20-13.6 32-13.6s23.2 4.8 32 12.8L688 479.2c8.8 8.8 13.6 20 13.6 32s-4.8 24-13.6 32l-286.4 286.4c-9.6 9.6-20.8 14.4-32.8 14.4z',
+      ],
     },
     'double-arrow-left': {
       path: [
         'M518.4 836.8c-11.2 0-22.4-4.8-31.2-12.8L205.6 541.6c-8.8-8.8-12.8-20-12.8-32s4.8-23.2 12.8-32l281.6-282.4c8.8-8.8 20-12.8 32-12.8s23.2 4.8 32 12.8c8.8 8.8 12.8 20 12.8 32s-4.8 23.2-12.8 32L300.8 509.6 551.2 760c8 8.8 12.8 20 12.8 32s-4.8 23.2-12.8 31.2-20 13.6-32.8 13.6z',
-        'M786.4 840.8c-11.2 0-22.4-4.8-31.2-12.8L473.6 546.4c-8-8-12.8-20-12.8-32s4.8-23.2 12.8-32L755.2 200c8.8-8.8 20-12.8 32-12.8s23.2 4.8 32 12.8c8.8 8.8 12.8 20 12.8 32s-4.8 23.2-12.8 32L568 514.4l250.4 250.4c8 8.8 12.8 20 12.8 32s-4.8 23.2-12.8 31.2c-8.8 8-20 12.8-32 12.8z'
-      ]
+        'M786.4 840.8c-11.2 0-22.4-4.8-31.2-12.8L473.6 546.4c-8-8-12.8-20-12.8-32s4.8-23.2 12.8-32L755.2 200c8.8-8.8 20-12.8 32-12.8s23.2 4.8 32 12.8c8.8 8.8 12.8 20 12.8 32s-4.8 23.2-12.8 32L568 514.4l250.4 250.4c8 8.8 12.8 20 12.8 32s-4.8 23.2-12.8 31.2c-8.8 8-20 12.8-32 12.8z',
+      ],
     },
     'double-arrow-right': {
       path: [
         'M504.8 836.8c-12 0-23.2-4.8-31.2-12.8s-12.8-19.2-12.8-31.2 4-23.2 12.8-31.2l250.4-250.4-250.4-252c-8.8-8.8-12.8-20-12.8-32s4.8-23.2 12.8-32c8.8-8.8 20-12.8 32-12.8s23.2 4.8 32 12.8l281.6 282.4c8 8 12.8 20 12.8 32s-4.8 23.2-12.8 32L536.8 824c-8.8 8-20 12.8-32 12.8 0.8 0 0 0 0 0z',
-        'M237.6 840.8c-12 0-23.2-4.8-31.2-12.8s-12.8-19.2-12.8-31.2 4-23.2 12.8-31.2L456 514.4 205.6 264c-8.8-8.8-12.8-20-12.8-32s4.8-23.2 12.8-32c8.8-8.8 20-12.8 32-12.8s23.2 4.8 32 12.8l281.6 282.4c8.8 8.8 12.8 20 12.8 32s-4.8 23.2-12.8 32l-281.6 282.4c-9.6 8-20 12-32 12z'
-      ]
+        'M237.6 840.8c-12 0-23.2-4.8-31.2-12.8s-12.8-19.2-12.8-31.2 4-23.2 12.8-31.2L456 514.4 205.6 264c-8.8-8.8-12.8-20-12.8-32s4.8-23.2 12.8-32c8.8-8.8 20-12.8 32-12.8s23.2 4.8 32 12.8l281.6 282.4c8.8 8.8 12.8 20 12.8 32s-4.8 23.2-12.8 32l-281.6 282.4c-9.6 8-20 12-32 12z',
+      ],
     },
     more: {
       path: [
         'M512 512m-116.363636 0a116.363636 116.363636 0 1 0 232.727272 0 116.363636 116.363636 0 1 0-232.727272 0Z',
         'M116.363636 512m-93.090909 0a93.090909 93.090909 0 1 0 186.181818 0 93.090909 93.090909 0 1 0-186.181818 0Z',
-        'M907.636364 512m-93.090909 0a93.090909 93.090909 0 1 0 186.181818 0 93.090909 93.090909 0 1 0-186.181818 0Z'
-      ]
+        'M907.636364 512m-93.090909 0a93.090909 93.090909 0 1 0 186.181818 0 93.090909 93.090909 0 1 0-186.181818 0Z',
+      ],
     },
     setting: {
       path: [
-        'M512 998.4c-22.4 0-44.8-3.2-67.2-6.4-35.2-6.4-67.2-32-76.8-64-16-54.4-64-89.6-121.6-89.6-9.6 0-19.2 0-28.8 3.2-6.4 0-12.8 3.2-19.2 3.2-28.8 0-54.4-12.8-73.6-35.2-25.6-35.2-51.2-73.6-67.2-115.2-12.8-35.2-6.4-73.6 19.2-99.2 44.8-48 44.8-121.6 0-172.8-25.6-25.6-32-64-19.2-99.2 19.2-38.4 41.6-76.8 70.4-112 19.2-22.4 44.8-35.2 73.6-35.2 6.4 0 12.8 0 19.2 3.2 9.6 3.2 19.2 3.2 28.8 3.2 54.4 0 102.4-35.2 118.4-89.6 9.6-35.2 41.6-60.8 76.8-64 22.4-3.2 44.8-3.2 67.2-3.2 22.4 0 44.8 0 67.2 3.2 35.2 6.4 67.2 32 76.8 64 9.6 32 28.8 57.6 57.6 70.4 19.2 9.6 41.6 16 64 16 9.6 0 19.2 0 28.8-3.2 6.4 0 12.8-3.2 19.2-3.2 28.8 0 54.4 12.8 73.6 35.2 25.6 35.2 48 76.8 67.2 118.4 12.8 32 6.4 73.6-19.2 99.2-44.8 48-44.8 121.6 0 172.8 25.6 25.6 32 64 19.2 99.2-16 41.6-38.4 80-67.2 115.2-19.2 22.4-44.8 35.2-73.6 35.2-6.4 0-12.8 0-19.2-3.2-9.6-3.2-19.2-3.2-28.8-3.2-54.4 0-102.4 35.2-118.4 89.6-9.6 35.2-41.6 60.8-76.8 64-25.6 3.2-48 3.2-70.4 3.2z m-265.6-236.8c89.6 0 169.6 57.6 198.4 144 3.2 6.4 6.4 9.6 12.8 9.6 19.2 3.2 35.2 3.2 54.4 3.2 12.8 0 25.6 0 38.4-3.2h22.4c6.4-3.2 9.6-6.4 9.6-9.6 16-51.2 48-92.8 92.8-115.2 32-19.2 67.2-25.6 102.4-25.6 16 0 32 3.2 44.8 6.4h3.2c3.2 0 9.6-3.2 12.8-3.2 22.4-28.8 41.6-60.8 57.6-96 3.2-6.4 0-12.8-3.2-16-70.4-80-70.4-198.4 0-275.2 3.2-6.4 3.2-12.8 3.2-19.2-12.8-35.2-32-67.2-57.6-96-6.4-6.4-9.6-9.6-12.8-9.6h-3.2c-16 3.2-28.8 6.4-44.8 6.4-35.2 0-70.4-9.6-102.4-25.6-44.8-25.6-76.8-67.2-92.8-115.2 0-6.4-6.4-9.6-9.6-9.6-19.2-3.2-38.4-3.2-57.6-3.2s-38.4 0-57.6 3.2c-6.4 3.2-9.6 6.4-9.6 9.6-16 51.2-48 92.8-92.8 115.2-32 19.2-67.2 25.6-102.4 25.6-16 0-32-3.2-44.8-6.4h-3.2c-9.6 3.2-12.8 3.2-16 6.4-22.4 28.8-41.6 60.8-57.6 96-3.2 6.4 0 12.8 3.2 16 70.4 80 70.4 198.4 0 275.2-3.2 3.2-3.2 9.6-3.2 16 12.8 35.2 32 67.2 54.4 96 3.2 3.2 9.6 6.4 16 6.4 12.8-3.2 28.8-6.4 44.8-6.4z m256-67.2c-48 0-92.8-19.2-128-54.4S320 560 320 512c0-99.2 83.2-182.4 182.4-182.4 102.4 0 182.4 83.2 182.4 182.4 0 102.4-80 182.4-182.4 182.4z m0-284.8c-57.6 0-102.4 48-102.4 105.6 0 57.6 48 105.6 105.6 105.6 57.6 0 105.6-48 102.4-105.6 0-60.8-48-105.6-105.6-105.6v-3.2 3.2z'
-      ]
+        'M512 998.4c-22.4 0-44.8-3.2-67.2-6.4-35.2-6.4-67.2-32-76.8-64-16-54.4-64-89.6-121.6-89.6-9.6 0-19.2 0-28.8 3.2-6.4 0-12.8 3.2-19.2 3.2-28.8 0-54.4-12.8-73.6-35.2-25.6-35.2-51.2-73.6-67.2-115.2-12.8-35.2-6.4-73.6 19.2-99.2 44.8-48 44.8-121.6 0-172.8-25.6-25.6-32-64-19.2-99.2 19.2-38.4 41.6-76.8 70.4-112 19.2-22.4 44.8-35.2 73.6-35.2 6.4 0 12.8 0 19.2 3.2 9.6 3.2 19.2 3.2 28.8 3.2 54.4 0 102.4-35.2 118.4-89.6 9.6-35.2 41.6-60.8 76.8-64 22.4-3.2 44.8-3.2 67.2-3.2 22.4 0 44.8 0 67.2 3.2 35.2 6.4 67.2 32 76.8 64 9.6 32 28.8 57.6 57.6 70.4 19.2 9.6 41.6 16 64 16 9.6 0 19.2 0 28.8-3.2 6.4 0 12.8-3.2 19.2-3.2 28.8 0 54.4 12.8 73.6 35.2 25.6 35.2 48 76.8 67.2 118.4 12.8 32 6.4 73.6-19.2 99.2-44.8 48-44.8 121.6 0 172.8 25.6 25.6 32 64 19.2 99.2-16 41.6-38.4 80-67.2 115.2-19.2 22.4-44.8 35.2-73.6 35.2-6.4 0-12.8 0-19.2-3.2-9.6-3.2-19.2-3.2-28.8-3.2-54.4 0-102.4 35.2-118.4 89.6-9.6 35.2-41.6 60.8-76.8 64-25.6 3.2-48 3.2-70.4 3.2z m-265.6-236.8c89.6 0 169.6 57.6 198.4 144 3.2 6.4 6.4 9.6 12.8 9.6 19.2 3.2 35.2 3.2 54.4 3.2 12.8 0 25.6 0 38.4-3.2h22.4c6.4-3.2 9.6-6.4 9.6-9.6 16-51.2 48-92.8 92.8-115.2 32-19.2 67.2-25.6 102.4-25.6 16 0 32 3.2 44.8 6.4h3.2c3.2 0 9.6-3.2 12.8-3.2 22.4-28.8 41.6-60.8 57.6-96 3.2-6.4 0-12.8-3.2-16-70.4-80-70.4-198.4 0-275.2 3.2-6.4 3.2-12.8 3.2-19.2-12.8-35.2-32-67.2-57.6-96-6.4-6.4-9.6-9.6-12.8-9.6h-3.2c-16 3.2-28.8 6.4-44.8 6.4-35.2 0-70.4-9.6-102.4-25.6-44.8-25.6-76.8-67.2-92.8-115.2 0-6.4-6.4-9.6-9.6-9.6-19.2-3.2-38.4-3.2-57.6-3.2s-38.4 0-57.6 3.2c-6.4 3.2-9.6 6.4-9.6 9.6-16 51.2-48 92.8-92.8 115.2-32 19.2-67.2 25.6-102.4 25.6-16 0-32-3.2-44.8-6.4h-3.2c-9.6 3.2-12.8 3.2-16 6.4-22.4 28.8-41.6 60.8-57.6 96-3.2 6.4 0 12.8 3.2 16 70.4 80 70.4 198.4 0 275.2-3.2 3.2-3.2 9.6-3.2 16 12.8 35.2 32 67.2 54.4 96 3.2 3.2 9.6 6.4 16 6.4 12.8-3.2 28.8-6.4 44.8-6.4z m256-67.2c-48 0-92.8-19.2-128-54.4S320 560 320 512c0-99.2 83.2-182.4 182.4-182.4 102.4 0 182.4 83.2 182.4 182.4 0 102.4-80 182.4-182.4 182.4z m0-284.8c-57.6 0-102.4 48-102.4 105.6 0 57.6 48 105.6 105.6 105.6 57.6 0 105.6-48 102.4-105.6 0-60.8-48-105.6-105.6-105.6v-3.2 3.2z',
+      ],
     },
     'tableloader-setting': {
       path: [
-        'M372 981.6c-80 0-154.4-43.2-195.2-112L35.2 624.8c-40-68.8-40-155.2 0-224.8l141.6-244.8c40-69.6 115.2-112 195.2-112h282.4c80 0 154.4 43.2 195.2 112L991.2 400c40 68.8 40 155.2 0 224.8l-141.6 244.8c-40 69.6-115.2 112-195.2 112H372z m0-825.6c-39.2 0-76.8 21.6-96.8 56L134.4 456c-20 34.4-20 76.8 0 112l140.8 244.8c20 34.4 56.8 55.2 96.8 55.2h282.4c39.2 0 76.8-21.6 96.8-56l140.8-244.8c20-34.4 20-76.8 0-112L751.2 211.2c-20-34.4-56.8-55.2-96.8-55.2H372z m140.8 552.8c-108.8 0-196.8-88-196.8-196.8 0-108.8 88-196.8 196.8-196.8 108.8 0 196.8 88 196.8 196.8 0.8 108.8-88 196.8-196.8 196.8z m0-280c-45.6 0-83.2 37.6-83.2 83.2s37.6 83.2 83.2 83.2c22.4 0 43.2-8.8 59.2-24 16-16 24-36.8 24-59.2 0-45.6-37.6-83.2-83.2-83.2z'
-      ]
-    }
+        'M372 981.6c-80 0-154.4-43.2-195.2-112L35.2 624.8c-40-68.8-40-155.2 0-224.8l141.6-244.8c40-69.6 115.2-112 195.2-112h282.4c80 0 154.4 43.2 195.2 112L991.2 400c40 68.8 40 155.2 0 224.8l-141.6 244.8c-40 69.6-115.2 112-195.2 112H372z m0-825.6c-39.2 0-76.8 21.6-96.8 56L134.4 456c-20 34.4-20 76.8 0 112l140.8 244.8c20 34.4 56.8 55.2 96.8 55.2h282.4c39.2 0 76.8-21.6 96.8-56l140.8-244.8c20-34.4 20-76.8 0-112L751.2 211.2c-20-34.4-56.8-55.2-96.8-55.2H372z m140.8 552.8c-108.8 0-196.8-88-196.8-196.8 0-108.8 88-196.8 196.8-196.8 108.8 0 196.8 88 196.8 196.8 0.8 108.8-88 196.8-196.8 196.8z m0-280c-45.6 0-83.2 37.6-83.2 83.2s37.6 83.2 83.2 83.2c22.4 0 43.2-8.8 59.2-24 16-16 24-36.8 24-59.2 0-45.6-37.6-83.2-83.2-83.2z',
+      ],
+    },
   };
   const props: any = defineProps({
     name: {
       type: String,
-      default: ''
-    }
+      default: '',
+    },
   });
 </script>

package/src/components/form/Input@v3.vue

@@ -113,7 +113,7 @@
     verify: false,
     prefix: () => [],
     suffix: () => [],
-    interacted: false
+    interacted: false,
   });
 
   const state: any = reactive({
@@ -122,7 +122,7 @@
     // 值
     value: props.modelValue,
     // 错误
-    error: {}
+    error: {},
   });
   // 外部传入交互标识，主要用于外部没有输入但点击了提交
   watch(
@@ -132,7 +132,7 @@
         state.interacted = interacted;
       }
     },
-    { deep: true, immediate: true }
+    { deep: true, immediate: true },
   );
 
   // 监听外部数据
@@ -207,7 +207,7 @@
         state.error = { tips: props.tips, ontips: props.tips ? 'show' : '', verify: '', co: '' };
       }
     },
-    { deep: true, immediate: true }
+    { deep: true, immediate: true },
   );
 
   // 清空

package/src/components/form/Upload.vue

@@ -4,8 +4,8 @@
       <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 bk-case b-xs r-sm" ui-flex="col cm">
           <!-- 删除按钮 -->
-          <div class="pa ot-ss or-ss bg-fore co-risk lh-xs r-xl parent-hover:show z-ls" @click="remove(idx)">
-            <svg class="block" viewBox="0 0 1024 1024" style="width: 1em; height: 1em">
+          <div class="pa w-xs h-xs ot-ss or-ss bg-fore co-risk lh-xs r-xl parent-hover:show 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"
                 fill="currentColor"
@@ -162,7 +162,7 @@
       <slot name="btn">
         <label class="pr" ui-form="@a type:upload tips:hover" :style="`width: ${isNumber(width) ? width + 'em' : width}`">
           <div class="w-full pr" :style="`box-sizing: content-box; padding-top: ${ratio}%`">
-            <div ui-flex="row cm" :class="`pa ot-no ol-no full upload n-sl bg-fore b-dashed bk-note-lm b-xs r-sm ${uploadClass}`" :style="uploadStyle">
+            <div ui-flex="row cm" :class="`pa ot-no ol-no full upload n-sl bg-fore b-solid bk-case b-xs r-sm ${uploadClass}`" :style="uploadStyle">
               <div v-if="tips" ui-form-tips>
                 {{ tips }}
               </div>

package/src/components/icon/OrderIcon.vue

@@ -0,0 +1,113 @@
+<template>
+  <span class="pr full" ui-flex="row cm">
+    <span :ui-order="`@b ${status}`" :style="{ width: size + '%', height: size + '%' }">
+      <i></i>
+      <b></b>
+      <u></u>
+    </span>
+  </span>
+</template>
+<script setup lang="ts">
+  // 类型
+  interface Props {
+    status?: number;
+    size?: number;
+  }
+  withDefaults(defineProps<Props>(), {
+    status: 0,
+    size: 100,
+  });
+</script>
+<style lang="scss">
+  [ui-order~='@b'] {
+    position: relative;
+    cursor: pointer;
+    overflow: hidden;
+
+    i,
+    b,
+    u {
+      position: absolute;
+      display: block;
+      width: 100%;
+      height: 100%;
+      left: 0;
+      top: 0;
+    }
+
+    i {
+      opacity: 0;
+
+      &::before,
+      &::after {
+        display: block;
+        content: '';
+        position: absolute;
+        width: 100%;
+        height: 100%;
+        left: 0;
+        top: 0;
+      }
+
+      &::before {
+        background:
+          linear-gradient(45deg, transparent 48%, currentColor 53%, currentColor 67%, transparent 72%) no-repeat 28.7% 95% / 30% 35%,
+          linear-gradient(-45deg, transparent 48%, currentColor 53%, currentColor 67%, transparent 72%) no-repeat 71.3% 95% / 30% 35%;
+        transform: translateY(-50%);
+      }
+
+      &::after {
+        background:
+          linear-gradient(135deg, transparent 48%, currentColor 53%, currentColor 67%, transparent 72%) no-repeat 28.5% 10% / 30% 35%,
+          linear-gradient(-135deg, transparent 48%, currentColor 53%, currentColor 67%, transparent 72%) no-repeat 71.3% 10% / 30% 35%;
+        transform: translateY(50%);
+      }
+    }
+
+    b {
+      background:
+        linear-gradient(45deg, transparent 48%, currentColor 53%, currentColor 67%, transparent 72%) no-repeat 28.7% 95% / 30% 35%,
+        linear-gradient(-45deg, transparent 48%, currentColor 53%, currentColor 67%, transparent 72%) no-repeat 71.3% 95% / 30% 35%,
+        linear-gradient(90deg, transparent 35%, currentColor 40%, currentColor 60%, transparent 65%) no-repeat 50% 45% / 33% 70%;
+      transform: translateY(-110%);
+    }
+
+    u {
+      background:
+        linear-gradient(135deg, transparent 48%, currentColor 53%, currentColor 67%, transparent 72%) no-repeat 28.5% 10% / 30% 35%,
+        linear-gradient(-135deg, transparent 48%, currentColor 53%, currentColor 67%, transparent 72%) no-repeat 71.3% 10% / 30% 35%,
+        linear-gradient(90deg, transparent 35%, currentColor 40%, currentColor 60%, transparent 65%) no-repeat 50% 45% / 33% 70%;
+      transform: translateY(110%);
+    }
+
+    &[ui-order~='0'] i {
+      opacity: 0.3;
+
+      &::before {
+        background:
+          linear-gradient(45deg, transparent 48%, currentColor 53%, currentColor 67%, transparent 72%) no-repeat 28.7% 95% / 30% 35%,
+          linear-gradient(-45deg, transparent 48%, currentColor 53%, currentColor 67%, transparent 72%) no-repeat 71.3% 95% / 30% 35%;
+        transform: translateY(0%);
+        transition: all 0.2s cubic-bezier(0.65, 0, 0.35, 1);
+      }
+
+      &::after {
+        background:
+          linear-gradient(135deg, transparent 48%, currentColor 53%, currentColor 67%, transparent 72%) no-repeat 28.5% 15% / 30% 35%,
+          linear-gradient(-135deg, transparent 48%, currentColor 53%, currentColor 67%, transparent 72%) no-repeat 71.3% 15% / 30% 35%;
+        transform: translateY(0%);
+        transition: all 0.2s cubic-bezier(0.65, 0, 0.35, 1);
+      }
+    }
+
+    &[ui-order~='1'] u {
+      transform: translateY(5%);
+      transition: transform 0.3s cubic-bezier(0.65, 0, 0.35, 1);
+    }
+
+    &[ui-order~='2'] b {
+      transform: translateY(0%);
+      transition: transform 0.3s cubic-bezier(0.65, 0, 0.35, 1);
+    }
+  }
+</style>

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

@@ -13,7 +13,7 @@
                 <div 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)">
                     <span>{{ col.label }}</span>
-                    <span ui-btn="@a none xs :square" :ui-order="col.__order"></span>
+                    <span ui-btn="@a none xs :square" :ui-order="`@a ${col.__order}`"></span>
                   </span>
                   <span v-else>{{ col.label }}</span>
                   <!-- 设置 -->
@@ -153,6 +153,7 @@
   import { itable } from '@fekit/itable';
   import TableRender from './TableRender.vue';
   import { isFunction, isObject, hasOwnProp, deepcopy } from '@fekit/utils';
+
   const route = useRoute();
   const router = useRouter();
   // 外部插槽