@nutui/nutui 3.1.10 → 3.1.12-beta.1

package/dist/packages/_es/CircleProgress.js

@@ -1,13 +1,13 @@
 /*!
-* @nutui/nutui v3.1.10 Fri Nov 05 2021 19:52:49 GMT+0800 (中国标准时间)
+* @nutui/nutui v3.1.11 Wed Nov 24 2021 14:54:38 GMT+0800 (中国标准时间)
 * (c) 2021 @jdf2e.
 * Released under the MIT License.
 */
-import { computed, openBlock, createElementBlock, normalizeClass, normalizeStyle, createElementVNode, renderSlot, createTextVNode, toDisplayString } from "vue";
+import Taro from "@tarojs/taro";
+import { ref, reactive, watch, onMounted, computed, openBlock, createElementBlock, normalizeClass, normalizeStyle, createElementVNode, toDisplayString } from "vue";
 import { c as createComponent } from "./component.js";
-import { _ as _export_sfc } from "./plugin-vue_export-helper.js";
 const { componentName, create } = createComponent("circleprogress");
-const _sfc_main = create({
+var _sfc_main = create({
   props: {
     progress: {
       type: [Number, String],
@@ -17,10 +17,6 @@ const _sfc_main = create({
       type: [Number, String],
       default: 10
     },
-    isAuto: {
-      tyep: Boolean,
-      default: false
-    },
     progressOption: {
       type: Object,
       default: () => {
@@ -28,12 +24,79 @@ const _sfc_main = create({
     }
   },
   setup(props, { emit }) {
+    const rotateLeft = ref();
+    const rotateRight = ref();
+    const InnerWidth = ref(props.strokeInnerWidth);
+    const isMobile = ref(false);
+    const cricleData = reactive({
+      radius: 50,
+      strokeOutWidth: 10,
+      backColor: "#d9d9d9",
+      progressColor: "red"
+    });
+    const loadPercent = (x, y) => {
+      let rotate = x / y * 360;
+      let rotateRc = 0;
+      let rotateLc = 0;
+      if (rotate < 180) {
+        rotateRc = rotate + -45;
+      } else {
+        rotateRc = 135;
+        rotateLc = rotate - 180 - 45;
+        rotateLeft.value = rotateLc;
+      }
+      rotateRight.value = rotateRc;
+    };
+    watch(() => props.progress, (value) => {
+      loadPercent(value, 100);
+    });
+    onMounted(() => {
+      if (Taro.getEnv() === "WEB") {
+        isMobile.value = true;
+      } else {
+        isMobile.value = false;
+        loadPercent(props.progress, 100);
+        Object.assign(cricleData, props.progressOption);
+      }
+    });
     const classes = computed(() => {
       const prefixCls = componentName;
       return {
         [prefixCls]: true
       };
     });
+    const pieStyle = computed(() => {
+      return {
+        width: (cricleData.radius + cricleData.strokeOutWidth) * 2 + "px",
+        height: (cricleData.radius + cricleData.strokeOutWidth) * 2 + "px"
+      };
+    });
+    const mobileStyle = computed(() => {
+      return {
+        width: "100%",
+        height: "100%"
+      };
+    });
+    const RightStyle = computed(() => {
+      return {
+        transform: `rotate(${rotateRight.value + "deg"})`,
+        transition: `all 0.3s`,
+        borderTop: `${InnerWidth.value + "px"} solid ${cricleData.backColor};`,
+        borderLeft: `${InnerWidth.value + "px"} solid  ${cricleData.backColor};`,
+        borderBottom: `${InnerWidth.value + "px"} solid ${cricleData.progressColor};`,
+        borderRight: `${InnerWidth.value + "px"} solid ${cricleData.progressColor};`
+      };
+    });
+    const LeftStyle = computed(() => {
+      return {
+        transform: `rotate(${rotateLeft.value + "deg"})`,
+        transition: `all 0.3s`,
+        borderTop: `${InnerWidth.value + "px"} solid ${cricleData.backColor};`,
+        borderLeft: `${InnerWidth.value + "px"} solid  ${cricleData.backColor};`,
+        borderBottom: `${InnerWidth.value + "px"} solid ${cricleData.progressColor};`,
+        borderRight: `${InnerWidth.value + "px"} solid ${cricleData.progressColor};`
+      };
+    });
     const option = computed(() => {
       let baseOption = {
         radius: 50,
@@ -57,53 +120,86 @@ const _sfc_main = create({
       return `${progressLength},${circleLength}`;
     });
     return {
+      isMobile,
+      rotateLeft,
+      InnerWidth,
+      rotateRight,
       classes,
+      pieStyle,
+      RightStyle,
+      LeftStyle,
       option,
-      arcLength
+      arcLength,
+      mobileStyle
     };
   }
 });
-const _hoisted_1 = ["height", "width"];
-const _hoisted_2 = ["r", "cx", "cy", "stroke", "stroke-width"];
-const _hoisted_3 = ["r", "cx", "cy", "stroke", "stroke-dasharray", "stroke-width", "transform"];
-const _hoisted_4 = { class: "nut-circleprogress-content" };
+const _hoisted_1 = { class: "nut-circleprogress__right" };
+const _hoisted_2 = { class: "nut-circleprogress__line nut-circleprogress__r" };
+const _hoisted_3 = { class: "nut-circleprogress__progress" };
+const _hoisted_4 = { class: "nut-circleprogress__left" };
+const _hoisted_5 = { class: "nut-circleprogress__line nut-circleprogress__l" };
+const _hoisted_6 = { key: 1 };
+const _hoisted_7 = ["height", "width"];
+const _hoisted_8 = ["r", "cx", "cy", "stroke", "stroke-width"];
+const _hoisted_9 = ["r", "cx", "cy", "stroke", "stroke-dasharray", "stroke-width", "transform"];
+const _hoisted_10 = { class: "nut-circleprogress__progress" };
 function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
   return openBlock(), createElementBlock("div", {
     class: normalizeClass(_ctx.classes),
-    style: normalizeStyle({ height: _ctx.option.size + "px", width: _ctx.option.size + "px" })
+    style: normalizeStyle(_ctx.pieStyle)
   }, [
-    (openBlock(), createElementBlock("svg", {
-      height: _ctx.option.size,
-      width: _ctx.option.size,
-      "x-mlns": "http://www.w3.org/200/svg"
+    !_ctx.isMobile ? (openBlock(), createElementBlock("div", {
+      key: 0,
+      style: normalizeStyle(_ctx.mobileStyle)
     }, [
-      createElementVNode("circle", {
-        r: _ctx.option.radius,
-        cx: _ctx.option.cx,
-        cy: _ctx.option.cy,
-        stroke: _ctx.option.backColor,
-        "stroke-width": _ctx.option.strokeOutWidth,
-        fill: "none"
-      }, null, 8, _hoisted_2),
-      createElementVNode("circle", {
-        r: _ctx.option.radius,
-        cx: _ctx.option.cx,
-        cy: _ctx.option.cy,
-        stroke: _ctx.option.progressColor,
-        "stroke-dasharray": _ctx.arcLength,
-        "stroke-width": _ctx.strokeInnerWidth,
-        fill: "none",
-        transform: _ctx.option.startPosition,
-        "stroke-linecap": "round",
-        style: { "transition": "stroke-dasharray 0.6s ease 0s, stroke 0.6s ease 0s" }
-      }, null, 8, _hoisted_3)
-    ], 8, _hoisted_1)),
-    createElementVNode("div", _hoisted_4, [
-      !_ctx.isAuto ? renderSlot(_ctx.$slots, "default", { key: 0 }, () => [
-        createTextVNode(toDisplayString(_ctx.progress) + "%", 1)
-      ]) : renderSlot(_ctx.$slots, "default", { key: 1 })
-    ])
+      createElementVNode("div", _hoisted_1, [
+        createElementVNode("div", _hoisted_2, [
+          createElementVNode("div", {
+            class: "nut-circleprogress__line__c",
+            style: normalizeStyle(_ctx.RightStyle)
+          }, null, 4)
+        ])
+      ]),
+      createElementVNode("div", _hoisted_3, toDisplayString(_ctx.progress) + " %", 1),
+      createElementVNode("div", _hoisted_4, [
+        createElementVNode("div", _hoisted_5, [
+          createElementVNode("div", {
+            class: "nut-circleprogress__line__c",
+            style: normalizeStyle(_ctx.LeftStyle)
+          }, null, 4)
+        ])
+      ])
+    ], 4)) : (openBlock(), createElementBlock("div", _hoisted_6, [
+      (openBlock(), createElementBlock("svg", {
+        height: _ctx.option.size,
+        width: _ctx.option.size,
+        "x-mlns": "http://www.w3.org/200/svg"
+      }, [
+        createElementVNode("circle", {
+          r: _ctx.option.radius,
+          cx: _ctx.option.cx,
+          cy: _ctx.option.cy,
+          stroke: _ctx.option.backColor,
+          "stroke-width": _ctx.option.strokeOutWidth,
+          fill: "none"
+        }, null, 8, _hoisted_8),
+        createElementVNode("circle", {
+          r: _ctx.option.radius,
+          cx: _ctx.option.cx,
+          cy: _ctx.option.cy,
+          stroke: _ctx.option.progressColor,
+          "stroke-dasharray": _ctx.arcLength,
+          "stroke-width": _ctx.strokeInnerWidth,
+          fill: "none",
+          transform: _ctx.option.startPosition,
+          "stroke-linecap": "round",
+          style: { "transition": "stroke-dasharray 0.6s ease 0s, stroke 0.6s ease 0s" }
+        }, null, 8, _hoisted_9)
+      ], 8, _hoisted_7)),
+      createElementVNode("div", _hoisted_10, toDisplayString(_ctx.progress) + "%", 1)
+    ]))
   ], 6);
 }
-var index = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
-export { index as default };
+_sfc_main.render = _sfc_render;
+export { _sfc_main as default };

package/dist/packages/_es/Col.js

@@ -1,13 +1,12 @@
 /*!
-* @nutui/nutui v3.1.10 Fri Nov 05 2021 19:52:49 GMT+0800 (中国标准时间)
+* @nutui/nutui v3.1.11 Wed Nov 24 2021 14:54:38 GMT+0800 (中国标准时间)
 * (c) 2021 @jdf2e.
 * Released under the MIT License.
 */
 import { inject, computed, openBlock, createElementBlock, normalizeClass, normalizeStyle, renderSlot } from "vue";
 import { c as createComponent } from "./component.js";
-import { _ as _export_sfc } from "./plugin-vue_export-helper.js";
 const { componentName, create } = createComponent("col");
-const _sfc_main = create({
+var _sfc_main = create({
   props: {
     span: {
       type: [String, Number],
@@ -49,5 +48,5 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
     renderSlot(_ctx.$slots, "default")
   ], 6);
 }
-var index = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
-export { index as default };
+_sfc_main.render = _sfc_render;
+export { _sfc_main as default };

package/dist/packages/_es/Collapse.js

@@ -1,13 +1,12 @@
 /*!
-* @nutui/nutui v3.1.10 Fri Nov 05 2021 19:52:49 GMT+0800 (中国标准时间)
+* @nutui/nutui v3.1.11 Wed Nov 24 2021 14:54:38 GMT+0800 (中国标准时间)
 * (c) 2021 @jdf2e.
 * Released under the MIT License.
 */
 import { provide, openBlock, createElementBlock, renderSlot } from "vue";
 import { c as createComponent } from "./component.js";
-import { _ as _export_sfc } from "./plugin-vue_export-helper.js";
 const { create } = createComponent("collapse");
-const _sfc_main = create({
+var _sfc_main = create({
   props: {
     active: {
       type: [String, Number, Array]
@@ -49,20 +48,20 @@ const _sfc_main = create({
     }
   },
   emits: ["update:active", "change"],
-  setup(props, { emit }) {
+  setup(props, { emit, slots }) {
     const changeVal = (val) => {
       emit("update:active", val);
       emit("change", val);
     };
     const changeValAry = (name) => {
       const activeItem = props.active instanceof Object ? Object.values(props.active) : props.active;
-      let index2 = -1;
+      let index = -1;
       activeItem.forEach((item, idx) => {
         if (String(item) == String(name)) {
-          index2 = idx;
+          index = idx;
         }
       });
-      index2 > -1 ? activeItem.splice(index2, 1) : activeItem.push(name);
+      index > -1 ? activeItem.splice(index, 1) : activeItem.push(name);
       changeVal(activeItem);
     };
     const isExpanded = (name) => {
@@ -71,12 +70,38 @@ const _sfc_main = create({
         return typeof active === "number" || typeof active === "string" ? active == name : false;
       }
     };
+    const activeIndex = () => {
+      var _a;
+      const activeCollapse = props.active;
+      const childrenList = (_a = slots.default) == null ? void 0 : _a.call(slots);
+      let act = [];
+      childrenList.forEach((item, index) => {
+        if (typeof activeCollapse == "number" || typeof activeCollapse == "string") {
+          if (item.props.name == activeCollapse) {
+            act.push(item.flag);
+            return act;
+          }
+        } else {
+          let ary = Array.from(activeCollapse);
+          if (ary.includes(String(item.props.name)) || ary.includes(Number(item.props.name))) {
+            act.push(item.flag);
+          }
+        }
+      });
+      return act;
+    };
+    const getParentChildren = () => {
+      var _a;
+      return (_a = slots.default) == null ? void 0 : _a.call(slots);
+    };
     provide("collapseParent", {
       children: [],
       props,
       changeValAry,
       changeVal,
-      isExpanded
+      isExpanded,
+      activeIndex,
+      getParentChildren
     });
   }
 });
@@ -85,5 +110,5 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
     renderSlot(_ctx.$slots, "default")
   ]);
 }
-var index = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
-export { index as default };
+_sfc_main.render = _sfc_render;
+export { _sfc_main as default };

package/dist/packages/_es/CollapseItem.js

@@ -17,16 +17,19 @@ var __spreadValues = (a, b) => {
   return a;
 };
 var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __require = typeof require !== "undefined" ? require : (x) => {
+  throw new Error('Dynamic require of "' + x + '" is not supported');
+};
 /*!
-* @nutui/nutui v3.1.10 Fri Nov 05 2021 19:52:49 GMT+0800 (中国标准时间)
+* @nutui/nutui v3.1.11 Wed Nov 24 2021 14:54:38 GMT+0800 (中国标准时间)
 * (c) 2021 @jdf2e.
 * Released under the MIT License.
 */
-import { inject, reactive, computed, getCurrentInstance, ref, watch, onMounted, toRefs, nextTick, resolveComponent, openBlock, createElementBlock, normalizeClass, createElementVNode, createBlock, createCommentVNode, renderSlot, normalizeStyle } from "vue";
+import { inject, ref, reactive, computed, getCurrentInstance, watch, onMounted, toRefs, nextTick, resolveComponent, openBlock, createElementBlock, normalizeClass, createElementVNode, createBlock, createCommentVNode, renderSlot, normalizeStyle } from "vue";
+import Taro, { eventCenter, getCurrentInstance as getCurrentInstance$1 } from "@tarojs/taro";
 import { c as createComponent } from "./component.js";
-import { _ as _export_sfc } from "./plugin-vue_export-helper.js";
 const { create, componentName } = createComponent("collapse-item");
-const _sfc_main = create({
+var _sfc_main = create({
   props: {
     title: {
       type: String,
@@ -51,6 +54,7 @@ const _sfc_main = create({
   },
   setup(props) {
     const collapse = inject("collapseParent");
+    const conHeight = ref(0);
     const parent = reactive(collapse);
     const classes = computed(() => {
       const prefixCls = componentName;
@@ -69,7 +73,7 @@ const _sfc_main = create({
       icon: parent.props.icon,
       iconSize: parent.props.iconSize,
       iconColor: parent.props.iconColor,
-      openExpanded: false,
+      openExpanded: null,
       iconStyle: {
         transform: "rotate(0deg)",
         marginTop: parent.props.iconHeght ? "-" + parent.props.iconHeght / 2 + "px" : "-10px"
@@ -84,29 +88,33 @@ const _sfc_main = create({
     const wrapperRef = ref(null);
     const contentRef = ref(null);
     const onTransitionEnd = () => {
-      const wrapperRefEle = document.getElementsByClassName("collapse-wrapper")[0];
-      wrapperRefEle.style.willChange = "auto";
+      nextTick(() => {
+        parent.children.forEach((item1, index) => {
+          let ary = Array.from(item1.$el.children);
+          ary.forEach((item2, index2) => {
+            if (item2.className.includes("collapse-wrapper")) {
+              item2.style.willChange = "auto";
+            }
+          });
+        });
+      });
     };
     const animation = () => {
-      const wrapperRefEle = wrapperRef.value;
-      const contentRefEle = contentRef.value;
-      if (!wrapperRefEle || !contentRefEle) {
-        return;
+      if (parent.props.icon && !proxyData.openExpanded) {
+        proxyData.iconStyle["transform"] = "rotate(0deg)";
+      } else {
+        proxyData.iconStyle["transform"] = "rotate(" + parent.props.rotate + "deg)";
       }
-      const offsetHeight = contentRefEle.offsetHeight;
-      if (offsetHeight) {
-        const contentHeight = `${offsetHeight}px`;
-        wrapperRefEle.style.willChange = "height";
-        wrapperRefEle.style.height = !proxyData.openExpanded ? 0 : contentHeight;
-        if (parent.props.icon && !proxyData.openExpanded) {
-          proxyData.iconStyle["transform"] = "rotate(0deg)";
-        } else {
-          proxyData.iconStyle["transform"] = "rotate(" + parent.props.rotate + "deg)";
+      nextTick(() => {
+        const query = Taro.createSelectorQuery();
+        query.selectAll(".collapse-content").boundingClientRect();
+        query.exec((res) => {
+          getH(res[0]);
+        });
+        if (!proxyData.openExpanded) {
+          onTransitionEnd();
         }
-      }
-      if (!proxyData.openExpanded) {
-        onTransitionEnd();
-      }
+      });
     };
     const open = () => {
       proxyData.openExpanded = !proxyData.openExpanded;
@@ -121,7 +129,7 @@ const _sfc_main = create({
     const currentName = computed(() => props.name);
     const toggleOpen = () => {
       if (parent.props.accordion) {
-        parent.children.forEach((item, index2) => {
+        parent.children.forEach((item, index) => {
           if (currentName.value == item.name) {
             item.changeOpen(!item.openExpanded);
           } else {
@@ -152,9 +160,45 @@ const _sfc_main = create({
         proxyData.openExpanded = true;
       }
     });
+    const getH = (list) => {
+      parent.children.forEach((item1, index1) => {
+        let ary = Array.from(item1.$el.children);
+        let _uid = ary[1].children[0]["uid"];
+        let tm = list.filter((item2) => item2.id == _uid);
+        if (tm && tm.length > 0) {
+          let h = tm[0]["height"];
+          item1.conHeight = h;
+        }
+      });
+    };
+    const getH5 = () => {
+      parent.children.forEach((item1, index1) => {
+        let ary = Array.from(item1.$el.children);
+        let h = ary[1].children[0]["offsetHeight"];
+        item1.conHeight = h;
+      });
+    };
+    const getRefHeight = () => {
+      const query = Taro.createSelectorQuery();
+      query.selectAll(".collapse-content").boundingClientRect();
+      query.exec((res) => {
+        if (Taro.getEnv() === "WEB") {
+          getH5();
+        } else {
+          getH(res[0]);
+        }
+      });
+    };
     onMounted(() => {
       const { name } = props;
       const active = parent && parent.props.active;
+      if (Taro.getEnv() === "WEB") {
+        getRefHeight();
+      } else {
+        eventCenter.once(getCurrentInstance$1().router.onReady, () => {
+          getRefHeight();
+        });
+      }
       if (typeof active == "number" || typeof active == "string") {
         if (name == active) {
           defaultOpen();
@@ -169,6 +213,7 @@ const _sfc_main = create({
     return __spreadProps(__spreadValues(__spreadValues(__spreadValues({
       classes
     }, toRefs(proxyData)), toRefs(parent.props)), toRefs(titleIconStyle)), {
+      conHeight,
       wrapperRef,
       contentRef,
       open,
@@ -187,10 +232,6 @@ const _hoisted_4 = {
 };
 const _hoisted_5 = ["innerHTML"];
 const _hoisted_6 = {
-  class: "collapse-wrapper",
-  ref: "wrapperRef"
-};
-const _hoisted_7 = {
   class: "collapse-content",
   ref: "contentRef"
 };
@@ -211,7 +252,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
               name: _ctx.titleIcon,
               size: _ctx.titleIconSize,
               color: _ctx.titleIconColor,
-              class: normalizeClass([_ctx.titleIconPosition == "left" ? "titleIconLeft" : "titleIconRight"])
+              class: normalizeClass(["collapse-title-icon", _ctx.titleIconPosition == "left" ? "titleIconLeft" : "titleIconRight"])
             }, null, 8, ["name", "size", "color", "class"])) : createCommentVNode("", true),
             _ctx.$slots.mTitle ? renderSlot(_ctx.$slots, "mTitle", { key: 1 }) : (openBlock(), createElementBlock("view", {
               key: 2,
@@ -237,12 +278,16 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
         style: normalizeStyle(_ctx.iconStyle)
       }, null, 8, ["name", "size", "color", "class", "style"])) : createCommentVNode("", true)
     ], 2),
-    createElementVNode("view", _hoisted_6, [
-      createElementVNode("view", _hoisted_7, [
+    createElementVNode("view", {
+      class: normalizeClass(["collapse-wrapper", _ctx.openExpanded ? "open-style" : "close-style"]),
+      ref: "wrapperRef",
+      style: normalizeStyle({ height: _ctx.openExpanded ? _ctx.conHeight + "px" : 0 })
+    }, [
+      createElementVNode("view", _hoisted_6, [
         renderSlot(_ctx.$slots, "default")
       ], 512)
-    ], 512)
+    ], 6)
   ], 2);
 }
-var index = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
-export { index as default };
+_sfc_main.render = _sfc_render;
+export { _sfc_main as default };

package/dist/packages/_es/CountDown.js

@@ -17,16 +17,18 @@ var __spreadValues = (a, b) => {
   return a;
 };
 var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __require = typeof require !== "undefined" ? require : (x) => {
+  throw new Error('Dynamic require of "' + x + '" is not supported');
+};
 /*!
-* @nutui/nutui v3.1.10 Fri Nov 05 2021 19:52:49 GMT+0800 (中国标准时间)
+* @nutui/nutui v3.1.11 Wed Nov 24 2021 14:54:38 GMT+0800 (中国标准时间)
 * (c) 2021 @jdf2e.
 * Released under the MIT License.
 */
 import { reactive, computed, watch, toRefs, openBlock, createElementBlock, normalizeClass, renderSlot, toDisplayString, Fragment, createElementVNode, createCommentVNode } from "vue";
 import { c as createComponent } from "./component.js";
-import { _ as _export_sfc } from "./plugin-vue_export-helper.js";
 const { componentName, create } = createComponent("countdown");
-const _sfc_main = create({
+var _sfc_main = create({
   props: {
     modelValue: {
       type: Object,
@@ -220,5 +222,5 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
     ], 64))
   ], 2);
 }
-var index = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
-export { index as default };
+_sfc_main.render = _sfc_render;
+export { _sfc_main as default };