huiyi-select-table 0.1.20 → 0.1.21

package/huiyi-select-table.mjs

@@ -1,6 +1,6 @@
-import { defineComponent as q, openBlock as y, createElementBlock as E, createElementVNode as V, ref as i, onMounted as O, computed as Z, onUnmounted as ee, resolveComponent as S, createVNode as T, unref as g, isRef as ne, withCtx as I, normalizeClass as te, createBlock as L, Teleport as F, normalizeStyle as le, Fragment as oe, renderList as ae, createCommentVNode as N } from "vue";
+import { defineComponent as q, openBlock as y, createElementBlock as E, createElementVNode as V, ref as i, watch as Z, onMounted as O, computed as ee, onUnmounted as ne, resolveComponent as S, createVNode as T, unref as g, isRef as te, withCtx as I, normalizeClass as le, createBlock as L, Teleport as F, normalizeStyle as oe, Fragment as ae, renderList as re, createCommentVNode as N } from "vue";
 /*! Element Plus Icons Vue v2.3.2 */
-var re = /* @__PURE__ */ q({
+var ue = /* @__PURE__ */ q({
   name: "ArrowDown",
   __name: "arrow-down",
   setup(u) {
@@ -14,8 +14,8 @@ var re = /* @__PURE__ */ q({
       })
     ]));
   }
-}), ue = re;
-const se = /* @__PURE__ */ q({
+}), se = ue;
+const ce = /* @__PURE__ */ q({
   name: "InputSelectCompont",
   __name: "SelectTable",
   props: {
@@ -37,7 +37,7 @@ const se = /* @__PURE__ */ q({
       left: "0px"
       // width: "0px",
     }), l = i(-1), h = i(!1), D = i(!1);
-    watch(
+    Z(
       () => t.value,
       (e) => {
         p.value = e || "";
@@ -57,7 +57,7 @@ const se = /* @__PURE__ */ q({
         left: `${e.left + a}px`
         // width: `${rect.width}px`,
       };
-    }, C = Z(() => {
+    }, C = ee(() => {
       const e = t.column?.map((c) => c.prop) || [
         "name",
         "engname",
@@ -168,7 +168,7 @@ const se = /* @__PURE__ */ q({
     };
     return O(() => {
       window.addEventListener("resize", b), window.addEventListener("scroll", b, !0);
-    }), ee(() => {
+    }), ne(() => {
       window.removeEventListener("resize", b), window.removeEventListener("scroll", b, !0);
     }), (e, n) => {
       const a = S("el-icon"), c = S("el-input"), w = S("el-table-column"), m = S("el-table");
@@ -179,7 +179,7 @@ const se = /* @__PURE__ */ q({
       }, [
         T(c, {
           modelValue: g(p),
-          "onUpdate:modelValue": n[0] || (n[0] = (o) => ne(p) ? p.value = o : p = o),
+          "onUpdate:modelValue": n[0] || (n[0] = (o) => te(p) ? p.value = o : p = o),
           ref_key: "inputValueRef",
           ref: x,
           readonly: t.readonly,
@@ -191,11 +191,11 @@ const se = /* @__PURE__ */ q({
         }, {
           suffix: I(() => [
             T(a, {
-              class: te(["el-input__icon dropdown-arrow", { "dropdown-arrow--open": g(r) }]),
+              class: le(["el-input__icon dropdown-arrow", { "dropdown-arrow--open": g(r) }]),
               onClick: K
             }, {
               default: I(() => [
-                T(g(ue))
+                T(g(se))
               ]),
               _: 1
             }, 8, ["class"])
@@ -208,7 +208,7 @@ const se = /* @__PURE__ */ q({
         }, [
           V("div", {
             class: "dropdown-panel",
-            style: le(g(A)),
+            style: oe(g(A)),
             onMousedown: Y
           }, [
             T(m, {
@@ -222,7 +222,7 @@ const se = /* @__PURE__ */ q({
               style: { width: "100%" }
             }, {
               default: I(() => [
-                (y(!0), E(oe, null, ae(t.column, (o, W) => (y(), L(w, {
+                (y(!0), E(ae, null, re(t.column, (o, W) => (y(), L(w, {
                   key: W,
                   prop: o.prop,
                   label: o.label,
@@ -249,24 +249,24 @@ const se = /* @__PURE__ */ q({
     };
   }
 });
-const ce = (u, f) => {
+const ie = (u, f) => {
   const _ = u.__vccOpts || u;
   for (const [t, d] of f)
     _[t] = d;
   return _;
-}, k = /* @__PURE__ */ ce(se, [["__scopeId", "data-v-7fb91764"]]);
+}, k = /* @__PURE__ */ ie(ce, [["__scopeId", "data-v-5f1ab198"]]);
 k.install = (u) => {
   u.component(k.name, k);
 };
-const ie = [
+const de = [
   k
 ], B = function(u) {
-  B.installed || ie.forEach((f) => {
+  B.installed || de.forEach((f) => {
     u.component(f.name, f);
   });
 };
 typeof window < "u" && window.Vue && B(window.Vue);
-const fe = {
+const pe = {
   // 导出的对象必须具有 install，才能被 Vue.use() 方法安装
   install: B,
   // 以下是具体的组件列表
@@ -274,6 +274,6 @@ const fe = {
 };
 export {
   k as SelectTable,
-  fe as default,
+  pe as default,
   B as install
 };

package/huiyi-select-table.umd.js

@@ -1 +1 @@
-(function(c,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(c=typeof globalThis<"u"?globalThis:c||self,e(c.HuiyiSelectTable={},c.Vue))})(this,function(c,e){"use strict";const $="";/*! Element Plus Icons Vue v2.3.2 */var D=e.defineComponent({name:"ArrowDown",__name:"arrow-down",setup(i){return(p,g)=>(e.openBlock(),e.createElementBlock("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 1024 1024"},[e.createElementVNode("path",{fill:"currentColor",d:"M831.872 340.864 512 652.672 192.128 340.864a30.59 30.59 0 0 0-42.752 0 29.12 29.12 0 0 0 0 41.6L489.664 714.24a32 32 0 0 0 44.672 0l340.288-331.712a29.12 29.12 0 0 0 0-41.728 30.59 30.59 0 0 0-42.752 0z"})]))}}),I=D;const L=e.defineComponent({name:"InputSelectCompont",__name:"SelectTable",props:{options:Array,readonly:Boolean,required:Boolean,value:String,itemIndex:{type:[String,Number,null],default:null},column:Array},emits:["getInputRef","handleChangeSelectValue"],setup(i,{emit:p}){const g=p,o=i;let f=e.ref(),m=e.ref(""),v=e.ref(),T=e.ref(),s=e.ref(!1),B=e.ref({top:"0px",left:"0px"}),l=e.ref(-1),k=e.ref(!1),S=e.ref(!1);watch(()=>o.value,n=>{m.value=n||""},{immediate:!0}),e.onMounted(()=>{nextTick(()=>{g("getInputRef",v.value)})});const b=()=>{if(!T.value)return;const n=T.value.getBoundingClientRect(),t=window.pageYOffset||document.documentElement.scrollTop,r=window.pageXOffset||document.documentElement.scrollLeft;B.value={top:`${n.bottom+t}px`,left:`${n.left+r}px`}},C=e.computed(()=>{const n=o.column?.map(d=>d.prop)||["name","engname","spell","zjm","infoOrder"],t=o.options||[],r=m.value||"";return l.value=-1,nextTick(()=>{const d=o.options||[],_=d.find(y=>y.name===o.value);if(f.value&&f.value.setCurrentRow(_),_){const y=E(n,r,d);l.value=y.findIndex(a=>a.name===_.name)}}),E(n,r,t)}),A=n=>{n?.stopPropagation(),!o.readonly&&(s.value?u():w())},P=()=>{if(o.readonly){u();return}s.value||w(),l.value=-1},w=()=>{o.readonly||S.value||(S.value=!0,s.value=!0,nextTick(()=>{b(),k.value=!1,setTimeout(()=>{S.value=!1},100)}))},u=()=>{s.value=!1,k.value=!1},R=n=>{m.value=n.name,u(),nextTick(()=>{v.value?.focus()}),g("handleChangeSelectValue",{valueCode:n.code,value:n.name,index:o.itemIndex?o.itemIndex:""})},z=n=>{k.value=!0,n.preventDefault()},O=n=>{n.stopPropagation(),u()},q=async()=>{if(console.log("handleInput"),o.readonly){u();return}w(),l.value=-1},F=()=>{if(console.log("handleFocus"),o.readonly){u();return}s.value||w(),l.value=-1},j=()=>{console.log("handleBlur",k.value),setTimeout(()=>{if(k.value){nextTick(()=>{v.value?.focus()});return}u()},150)},K=n=>{C.value.length!==0&&(n.key==="ArrowDown"?(n.preventDefault(),s.value||w(),V(1)):n.key==="ArrowUp"?(n.preventDefault(),s.value||w(),V(-1)):n.key==="Enter"?(n.preventDefault(),s.value?U():w()):(n.key==="Escape"||n.key==="Tab")&&u())},V=n=>{const t=C.value;if(t.length===0)return;l.value===-1?n===1?l.value=0:l.value=t.length-1:(l.value+=n,l.value<0?l.value=t.length-1:l.value>=t.length&&(l.value=0));const r=t[l.value];f.value&&f.value.setCurrentRow(r),H()},U=()=>{const n=C.value;if(n.length===0||l.value===-1)return;const t=n[l.value];R(t)},H=()=>{nextTick(()=>{const n=f.value;if(!n)return;const t=n.$el.querySelector(".el-table__body-wrapper");if(!t)return;const r=t.querySelector(".current-row");r&&r.scrollIntoView({behavior:"smooth",block:"nearest"})})},E=(n,t,r)=>{const d=t.trim().toLowerCase();return d?r.filter(_=>n.some(y=>{const a=_[y];return a==null&&a!==0?!1:String(a).toLowerCase().includes(d)})):r};return e.onMounted(()=>{window.addEventListener("resize",b),window.addEventListener("scroll",b,!0)}),e.onUnmounted(()=>{window.removeEventListener("resize",b),window.removeEventListener("scroll",b,!0)}),(n,t)=>{const r=e.resolveComponent("el-icon"),d=e.resolveComponent("el-input"),_=e.resolveComponent("el-table-column"),y=e.resolveComponent("el-table");return e.openBlock(),e.createElementBlock("div",{class:"custom-dropdown",ref_key:"dropdownRef",ref:T},[e.createVNode(d,{modelValue:e.unref(m),"onUpdate:modelValue":t[0]||(t[0]=a=>e.isRef(m)?m.value=a:m=a),ref_key:"inputValueRef",ref:v,readonly:o.readonly,onInput:q,onKeydown:K,onFocus:F,onBlur:j,onClick:P},{suffix:e.withCtx(()=>[e.createVNode(r,{class:e.normalizeClass(["el-input__icon dropdown-arrow",{"dropdown-arrow--open":e.unref(s)}]),onClick:A},{default:e.withCtx(()=>[e.createVNode(e.unref(I))]),_:1},8,["class"])]),_:1},8,["modelValue","readonly"]),e.unref(s)?(e.openBlock(),e.createBlock(e.Teleport,{key:0,to:"body"},[e.createElementVNode("div",{class:"dropdown-panel",style:e.normalizeStyle(e.unref(B)),onMousedown:z},[e.createVNode(y,{border:"",data:C.value,"highlight-current-row":"",ref_key:"tableRef",ref:f,"max-height":"200px",onRowClick:R,style:{width:"100%"}},{default:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(o.column,(a,Y)=>(e.openBlock(),e.createBlock(_,{key:Y,prop:a.prop,label:a.label,width:a.width,align:a.align,type:a.type,"header-align":a.headerAlign},null,8,["prop","label","width","align","type","header-align"]))),128))]),_:1},8,["data"])],36)])):e.createCommentVNode("",!0),e.unref(s)?(e.openBlock(),e.createBlock(e.Teleport,{key:1,to:"body"},[e.createElementVNode("div",{class:"dropdown-mask",onMousedown:O},null,32)])):e.createCommentVNode("",!0)],512)}}}),X="",h=((i,p)=>{const g=i.__vccOpts||i;for(const[o,f]of p)g[o]=f;return g})(L,[["__scopeId","data-v-7fb91764"]]);h.install=i=>{i.component(h.name,h)};const M=[h],x=function(i){x.installed||M.forEach(p=>{i.component(p.name,p)})};typeof window<"u"&&window.Vue&&x(window.Vue);const N={install:x,SelectTable:h};c.SelectTable=h,c.default=N,c.install=x,Object.defineProperties(c,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});
+(function(c,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(c=typeof globalThis<"u"?globalThis:c||self,e(c.HuiyiSelectTable={},c.Vue))})(this,function(c,e){"use strict";const $="";/*! Element Plus Icons Vue v2.3.2 */var D=e.defineComponent({name:"ArrowDown",__name:"arrow-down",setup(i){return(p,g)=>(e.openBlock(),e.createElementBlock("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 1024 1024"},[e.createElementVNode("path",{fill:"currentColor",d:"M831.872 340.864 512 652.672 192.128 340.864a30.59 30.59 0 0 0-42.752 0 29.12 29.12 0 0 0 0 41.6L489.664 714.24a32 32 0 0 0 44.672 0l340.288-331.712a29.12 29.12 0 0 0 0-41.728 30.59 30.59 0 0 0-42.752 0z"})]))}}),I=D;const L=e.defineComponent({name:"InputSelectCompont",__name:"SelectTable",props:{options:Array,readonly:Boolean,required:Boolean,value:String,itemIndex:{type:[String,Number,null],default:null},column:Array},emits:["getInputRef","handleChangeSelectValue"],setup(i,{emit:p}){const g=p,o=i;let f=e.ref(),m=e.ref(""),v=e.ref(),T=e.ref(),s=e.ref(!1),B=e.ref({top:"0px",left:"0px"}),l=e.ref(-1),k=e.ref(!1),S=e.ref(!1);e.watch(()=>o.value,n=>{m.value=n||""},{immediate:!0}),e.onMounted(()=>{nextTick(()=>{g("getInputRef",v.value)})});const b=()=>{if(!T.value)return;const n=T.value.getBoundingClientRect(),t=window.pageYOffset||document.documentElement.scrollTop,r=window.pageXOffset||document.documentElement.scrollLeft;B.value={top:`${n.bottom+t}px`,left:`${n.left+r}px`}},C=e.computed(()=>{const n=o.column?.map(u=>u.prop)||["name","engname","spell","zjm","infoOrder"],t=o.options||[],r=m.value||"";return l.value=-1,nextTick(()=>{const u=o.options||[],_=u.find(y=>y.name===o.value);if(f.value&&f.value.setCurrentRow(_),_){const y=E(n,r,u);l.value=y.findIndex(a=>a.name===_.name)}}),E(n,r,t)}),A=n=>{n?.stopPropagation(),!o.readonly&&(s.value?d():w())},P=()=>{if(o.readonly){d();return}s.value||w(),l.value=-1},w=()=>{o.readonly||S.value||(S.value=!0,s.value=!0,nextTick(()=>{b(),k.value=!1,setTimeout(()=>{S.value=!1},100)}))},d=()=>{s.value=!1,k.value=!1},R=n=>{m.value=n.name,d(),nextTick(()=>{v.value?.focus()}),g("handleChangeSelectValue",{valueCode:n.code,value:n.name,index:o.itemIndex?o.itemIndex:""})},z=n=>{k.value=!0,n.preventDefault()},O=n=>{n.stopPropagation(),d()},q=async()=>{if(console.log("handleInput"),o.readonly){d();return}w(),l.value=-1},F=()=>{if(console.log("handleFocus"),o.readonly){d();return}s.value||w(),l.value=-1},j=()=>{console.log("handleBlur",k.value),setTimeout(()=>{if(k.value){nextTick(()=>{v.value?.focus()});return}d()},150)},K=n=>{C.value.length!==0&&(n.key==="ArrowDown"?(n.preventDefault(),s.value||w(),V(1)):n.key==="ArrowUp"?(n.preventDefault(),s.value||w(),V(-1)):n.key==="Enter"?(n.preventDefault(),s.value?U():w()):(n.key==="Escape"||n.key==="Tab")&&d())},V=n=>{const t=C.value;if(t.length===0)return;l.value===-1?n===1?l.value=0:l.value=t.length-1:(l.value+=n,l.value<0?l.value=t.length-1:l.value>=t.length&&(l.value=0));const r=t[l.value];f.value&&f.value.setCurrentRow(r),H()},U=()=>{const n=C.value;if(n.length===0||l.value===-1)return;const t=n[l.value];R(t)},H=()=>{nextTick(()=>{const n=f.value;if(!n)return;const t=n.$el.querySelector(".el-table__body-wrapper");if(!t)return;const r=t.querySelector(".current-row");r&&r.scrollIntoView({behavior:"smooth",block:"nearest"})})},E=(n,t,r)=>{const u=t.trim().toLowerCase();return u?r.filter(_=>n.some(y=>{const a=_[y];return a==null&&a!==0?!1:String(a).toLowerCase().includes(u)})):r};return e.onMounted(()=>{window.addEventListener("resize",b),window.addEventListener("scroll",b,!0)}),e.onUnmounted(()=>{window.removeEventListener("resize",b),window.removeEventListener("scroll",b,!0)}),(n,t)=>{const r=e.resolveComponent("el-icon"),u=e.resolveComponent("el-input"),_=e.resolveComponent("el-table-column"),y=e.resolveComponent("el-table");return e.openBlock(),e.createElementBlock("div",{class:"custom-dropdown",ref_key:"dropdownRef",ref:T},[e.createVNode(u,{modelValue:e.unref(m),"onUpdate:modelValue":t[0]||(t[0]=a=>e.isRef(m)?m.value=a:m=a),ref_key:"inputValueRef",ref:v,readonly:o.readonly,onInput:q,onKeydown:K,onFocus:F,onBlur:j,onClick:P},{suffix:e.withCtx(()=>[e.createVNode(r,{class:e.normalizeClass(["el-input__icon dropdown-arrow",{"dropdown-arrow--open":e.unref(s)}]),onClick:A},{default:e.withCtx(()=>[e.createVNode(e.unref(I))]),_:1},8,["class"])]),_:1},8,["modelValue","readonly"]),e.unref(s)?(e.openBlock(),e.createBlock(e.Teleport,{key:0,to:"body"},[e.createElementVNode("div",{class:"dropdown-panel",style:e.normalizeStyle(e.unref(B)),onMousedown:z},[e.createVNode(y,{border:"",data:C.value,"highlight-current-row":"",ref_key:"tableRef",ref:f,"max-height":"200px",onRowClick:R,style:{width:"100%"}},{default:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(o.column,(a,Y)=>(e.openBlock(),e.createBlock(_,{key:Y,prop:a.prop,label:a.label,width:a.width,align:a.align,type:a.type,"header-align":a.headerAlign},null,8,["prop","label","width","align","type","header-align"]))),128))]),_:1},8,["data"])],36)])):e.createCommentVNode("",!0),e.unref(s)?(e.openBlock(),e.createBlock(e.Teleport,{key:1,to:"body"},[e.createElementVNode("div",{class:"dropdown-mask",onMousedown:O},null,32)])):e.createCommentVNode("",!0)],512)}}}),X="",h=((i,p)=>{const g=i.__vccOpts||i;for(const[o,f]of p)g[o]=f;return g})(L,[["__scopeId","data-v-5f1ab198"]]);h.install=i=>{i.component(h.name,h)};const M=[h],x=function(i){x.installed||M.forEach(p=>{i.component(p.name,p)})};typeof window<"u"&&window.Vue&&x(window.Vue);const N={install:x,SelectTable:h};c.SelectTable=h,c.default=N,c.install=x,Object.defineProperties(c,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "huiyi-select-table",
-  "version": "0.1.20",
+  "version": "0.1.21",
   "description": "A Vue.js select table component",
   "main": "huiyi-select-table.umd.js",
   "module": "huiyi-select-table.mjs",

package/style.css

@@ -1 +1 @@
-.custom-dropdown[data-v-7fb91764]{position:relative;width:100%}.dropdown-panel[data-v-7fb91764]{position:fixed;z-index:9999;background:white;border:1px solid #e4e7ed;border-radius:4px;box-shadow:0 2px 12px #0000001a;margin-top:4px;box-sizing:border-box;max-height:200px;overflow:hidden}.dropdown-mask[data-v-7fb91764]{position:fixed;inset:0;z-index:9998;background:transparent}.dropdown-arrow[data-v-7fb91764]{cursor:pointer;transition:transform .3s}.dropdown-arrow--open[data-v-7fb91764]{transform:rotate(180deg)}
+.custom-dropdown[data-v-5f1ab198]{position:relative;width:100%}.dropdown-panel[data-v-5f1ab198]{position:fixed;z-index:9999;background:white;border:1px solid #e4e7ed;border-radius:4px;box-shadow:0 2px 12px #0000001a;margin-top:4px;box-sizing:border-box;max-height:200px;overflow:hidden}.dropdown-mask[data-v-5f1ab198]{position:fixed;inset:0;z-index:9998;background:transparent}.dropdown-arrow[data-v-5f1ab198]{cursor:pointer;transition:transform .3s}.dropdown-arrow--open[data-v-5f1ab198]{transform:rotate(180deg)}