lh-ui-next 0.2.1-beta.1 → 0.2.1-beta.11

package/README.md

@@ -5,7 +5,7 @@ alpha version is use to self-test; beta version is use to public survey.for exam
 1.0.0-alpha.1
 1.0.0-test.2
 ## Official version : "0.2.0",
-## test version : "0.2.1-beta.1,
+## test version : "0.2.1-beta.11,
 ## npmmirror
 When cnpm sync execution is unsuccessful，you can go the website(http://www.npmmirror.com/package/lh-ui-next) and press sync button to
  manual trigger the sync event

package/lib/css/dev.css

@@ -1 +1 @@
-*{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;-webkit-tap-highlight-color:transparent;tap-highlight-color:transparent;outline:0}body,html{margin:0;max-height:100%;height:100%}body{overflow-y:hidden;width:100%;font-family:"Microsoft YaHei";font-size:12px}td，th{font-size:12px}img{width:auto;height:auto}a,a:focus,a:hover{text-decoration:none;outline:0}ul{margin:0;padding:0}li{list-style:none}button:focus{outline:0}select:focus{outline:0}::-ms-clear,::-ms-reveal{display:none}p{margin-block-start:0;margin-block-end:0}input{font-family:"Microsoft YaHei";-webkit-appearance:none;outline:0}input:focus{outline:0}textarea{font-family:"Microsoft YaHei";resize:none;padding:0}textarea:focus{outline:0;resize:none}pre{font-family:"Microsoft YaHei"}body,html{margin:0;max-height:100%;height:100%}body{overflow-y:hidden;width:100%;font-family:"Microsoft YaHei";font-size:12px}.pointer{cursor:pointer}#app{width:100%;height:100%;overflow-y:auto;background-color:#F5F5F6}.date-picker-dialog{padding:16px}.date-picker-dialog .date-bordor{background:#FFF;border:1px solid rgba(0,0,0,.15);opacity:1;border-radius:2px;padding:8px;position:relative}.date-picker-dialog .date-bordor .date-picker-left{width:80px;position:absolute;left:8px;top:1px}.date-picker-dialog .date-bordor .date-picker-right{width:100px;position:absolute;left:116px;top:1px}.date-picker-dialog .date-bordor .icon_component_date{color:rgba(0,0,0,.25);vertical-align:middle;font-size:14px}.date-picker-dialog .date-bordor .lh-input .lh-input-cornInput{border:none}.date-picker-dialog .date-bordor .lh-input__prefix{display:none}.date-picker-dialog .date-bordor .lh-input-cornInput{padding-left:8px}.date-picker-dialog .date-bordor .lh-input.is-prefix.mini .lh-input-cornInput{padding-left:8px}.date-picker-dialog .date-bordor .icon_component_arrow_right{color:rgba(0,0,0,.25);font-size:14px;vertical-align:middle}
+*{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;-webkit-tap-highlight-color:transparent;tap-highlight-color:transparent;outline:0}body,html{margin:0;max-height:100%;height:100%}body{overflow-y:hidden;width:100%;font-family:"Microsoft YaHei";font-size:12px}td，th{font-size:12px}img{width:auto;height:auto}a,a:focus,a:hover{text-decoration:none;outline:0}ul{margin:0;padding:0}li{list-style:none}button:focus{outline:0}select:focus{outline:0}::-ms-clear,::-ms-reveal{display:none}p{margin-block-start:0;margin-block-end:0}input{font-family:"Microsoft YaHei";-webkit-appearance:none;outline:0}input:focus{outline:0}textarea{font-family:"Microsoft YaHei";resize:none;padding:0}textarea:focus{outline:0;resize:none}pre{font-family:"Microsoft YaHei"}input[type=number]{-moz-appearance:textfield}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}body,html{margin:0;max-height:100%;height:100%}body{overflow-y:hidden;width:100%;font-family:"Microsoft YaHei";font-size:12px}.pointer{cursor:pointer}#app{width:100%;height:100%;overflow-y:auto;background-color:#f5f5f6}.date-picker-dialog{padding:16px}.date-picker-dialog .date-bordor{background:#fff;border:1px solid rgba(0,0,0,.15);opacity:1;border-radius:2px;padding:8px;position:relative}.date-picker-dialog .date-bordor .date-picker-left{width:80px;position:absolute;left:8px;top:1px}.date-picker-dialog .date-bordor .date-picker-right{width:100px;position:absolute;left:116px;top:1px}.date-picker-dialog .date-bordor .icon_component_date{color:rgba(0,0,0,.25);vertical-align:middle;font-size:14px}.date-picker-dialog .date-bordor .lh-input .lh-input-cornInput{border:none}.date-picker-dialog .date-bordor .lh-input__prefix{display:none}.date-picker-dialog .date-bordor .lh-input-cornInput{padding-left:8px}.date-picker-dialog .date-bordor .lh-input.is-prefix.mini .lh-input-cornInput{padding-left:8px}.date-picker-dialog .date-bordor .icon_component_arrow_right{color:rgba(0,0,0,.25);font-size:14px;vertical-align:middle}

package/lib/lh-ui-next.mjs

@@ -199,12 +199,7 @@ const kt = {
 }, _t = ["type", "name", "placeholder", "required", "min", "max", "step", "pattern", "title", "minlength", "maxlength", "disabled", "readonly", "autofocus"], vt = ["title"], xt = ["title"];
 function St(e, t, i, s, l, n) {
   return r(), d("span", {
-    class: f(["lh-input", [
-      i.disabled ? "lh-input-disabled" : "",
-      i.size,
-      i.prefixIcon ? "is-prefix" : "",
-      i.suffixIcon ? "is-suffix" : ""
-    ]])
+    class: f(["lh-input", [i.disabled ? "lh-input-disabled" : "", i.size, i.prefixIcon ? "is-prefix" : "", i.suffixIcon ? "is-suffix" : ""]])
   }, [
     v(h("input", {
       class: "lh-input-cornInput",
@@ -1017,6 +1012,11 @@ const Ue = /* @__PURE__ */ x(Mt, [["render", Ft]]), Et = {
       type: Boolean,
       required: !1,
       default: !0
+    },
+    //item点击之前的事件
+    itemClickPreEvent: {
+      type: [Function, String],
+      default: ""
     }
   },
   data() {
@@ -1114,7 +1114,7 @@ const Ue = /* @__PURE__ */ x(Mt, [["render", Ft]]), Et = {
     },
     //点击li的时候
     itemClick(e) {
-      if (e.disabled)
+      if (e.disabled || typeof this.itemClickPreEvent == "function" && !this.itemClickPreEvent(e))
         return !1;
       this.selectType == 1 && (this.manualStatus = !1), this.changeClick(e.value), this.$emit("itemClick", e);
     },
@@ -2389,6 +2389,11 @@ const Zi = {
     indeterminate: {
       type: Boolean,
       default: !1
+    },
+    appearance: {
+      type: String,
+      default: "square"
+      //square 正方形  circle圆圈
     }
   },
   watch: {
@@ -2416,7 +2421,7 @@ const Zi = {
 }, Qi = { class: "lh-checkbox-outbox" }, $i = ["disabled"], el = { class: "lh-checkbox-text" };
 function tl(e, t, i, s, l, n) {
   return r(), d("label", {
-    class: f(["lh-checkbox", [i.size == "mini" ? "mini" : "", i.disabled ? "disabled" : "", l.myValue ? "checked" : ""]])
+    class: f(["lh-checkbox", [i.size == "mini" ? "mini" : "", i.size == "big" ? "big" : "", i.disabled ? "disabled" : "", l.myValue ? "checked" : "", i.appearance]])
   }, [
     h("span", Qi, [
       h("span", {
@@ -6419,11 +6424,21 @@ const ra = {
     },
     //改变年份
     yearClick(e) {
-      this.type === "year" ? (this.showDate.year = e, this.selectDate = e.toString(), this.$emit("yearClick", this.selectDate)) : (this.showDate.year = e, this.dateType = "month"), this.headerValueChange();
+      if (this.type === "year") {
+        if (this.yearDisable(e))
+          return;
+        this.showDate.year = e, this.selectDate = e.toString(), this.$emit("yearClick", this.selectDate);
+      } else
+        this.showDate.year = e, this.dateType = "month";
+      this.headerValueChange();
     },
     //改变月份
     monthClick(e) {
       this.type === "month" ? (this.selectDate = this.showDate.year.toString() + "-" + (e > 9 ? e : "0" + e.toString()), this.$emit("monthClick", this.selectDate)) : (this.showDate.month = e, this.dateType = "date"), this.headerValueChange();
+    },
+    //根据pickerOptions中的disabledYear函数来确定年份可点击状态
+    yearDisable(e) {
+      return typeof this.pickerOptions.disabledYear == "function" ? this.pickerOptions.disabledYear(e) : !1;
     }
   },
   computed: {
@@ -6541,7 +6556,7 @@ function Ma(e, t, i, s, l, n) {
         h("tbody", null, [
           (r(!0), d(g, null, y(n.decadesList, (a) => (r(), d("tr", null, [
             (r(!0), d(g, null, y(a, (o) => (r(), d("td", {
-              class: f({ selected: o === e.showDate.year }),
+              class: f({ selected: o === e.showDate.year, disabled: n.yearDisable(o) }),
               onClick: E((c) => n.yearClick(o), ["stop"])
             }, [
               h("a", za, b(o), 1)
@@ -8916,7 +8931,7 @@ Se.install = function(e) {
 const _r = {
   name: "lhSlider",
   componentName: "lhSlider",
-  emits: ["update:modelValue"],
+  emits: ["update:modelValue", "dragEndCallback"],
   props: {
     modelValue: {
       type: [Number, Array],
@@ -8972,7 +8987,19 @@ const _r = {
   watch: {
     modelValue: {
       deep: !0,
-      handler() {
+      handler: function(e) {
+        if (e === "" || e === null) {
+          this.$emit("update:modelValue", this.min);
+          return;
+        }
+        if (e > this.max) {
+          this.$emit("update:modelValue", this.max);
+          return;
+        }
+        if (e < this.min) {
+          this.$emit("update:modelValue", this.min);
+          return;
+        }
         this.buttonPosition(), this.formatTooltipEvent();
       }
     }
@@ -9005,24 +9032,32 @@ const _r = {
     },
     //拖动结束
     dragEnd: function(e) {
-      document.onmousemove = null;
-      for (let t = 0; t < this.$refs.sliderButtonWrapper1.classList.length; t++)
-        this.$refs.sliderButtonWrapper1.classList[t] == "grabbing" && this.$refs.sliderButtonWrapper1.classList.remove("grabbing");
-      for (let t = 0; t < this.$refs.sliderButtonWrapper2.classList.length; t++)
-        this.$refs.sliderButtonWrapper2.classList[t] == "grabbing" && this.$refs.sliderButtonWrapper2.classList.remove("grabbing");
+      if (document.onmousemove = null, this.$refs.sliderButtonWrapper1)
+        for (let t = 0; t < this.$refs.sliderButtonWrapper1.classList.length; t++)
+          this.$refs.sliderButtonWrapper1.classList[t] == "grabbing" && this.$refs.sliderButtonWrapper1.classList.remove("grabbing");
+      if (this.$refs.sliderButtonWrapper2)
+        for (let t = 0; t < this.$refs.sliderButtonWrapper2.classList.length; t++)
+          this.$refs.sliderButtonWrapper2.classList[t] == "grabbing" && this.$refs.sliderButtonWrapper2.classList.remove("grabbing");
+      this.dragEndCallback();
     },
     //点击轨道移动滑块
     clickRunway() {
       if (!this.disabled) {
-        let e = e || window.event, t = this.$refs.sliderRunway, i = this.vertical ? this.height.substring(0, this.height.length - 2) * 1 - e.clientY + t.getBoundingClientRect().top : e.clientX - t.getBoundingClientRect().left;
+        let e = window.event, t = this.$refs.sliderRunway, i = this.vertical ? this.height.substring(0, this.height.length - 2) * 1 - e.clientY + t.getBoundingClientRect().top : e.clientX - t.getBoundingClientRect().left;
         if (typeof this.modelValue == "number")
           this.moveSlider(i, 1);
         else {
           let s = this.vertical ? this.drag1.style.bottom.substring(0, this.drag1.style.bottom.length - 2) * 1 : this.drag1.style.left.substring(0, this.drag1.style.left.length - 2) * 1, l = this.vertical ? this.drag2.style.bottom.substring(0, this.drag2.style.bottom.length - 2) * 1 : this.drag2.style.left.substring(0, this.drag2.style.left.length - 2) * 1, n = Math.abs(s - i), a = Math.abs(l - i);
-          n <= a ? this.moveSlider(i, 1) : this.moveSlider(i, 2);
+          n <= a ? (this.moveSlider(i, 1), this.dragEndCallback()) : (this.moveSlider(i, 2), this.dragEndCallback());
         }
       }
     },
+    //拖拽以及点击结束之后的回调事件
+    dragEndCallback() {
+      setTimeout(() => {
+        this.$emit("dragEndCallback", this.modelValue);
+      }, 0);
+    },
     //移动滑块
     moveSlider(e, t) {
       let i = "";