cnhis-design-vue 3.1.34 → 3.1.35-beta.10

package/es/components/keyboard/src/components/NumberPanel.vue.js

@@ -1,24 +1,24 @@
-import { defineComponent, computed, ref, openBlock, createElementBlock, normalizeClass, normalizeStyle, unref, createElementVNode, createVNode, withCtx, Fragment, renderList, toDisplayString, createBlock, createCommentVNode } from 'vue';
+import { defineComponent, computed, ref, watch, openBlock, createElementBlock, normalizeClass, normalizeStyle, unref, createElementVNode, createVNode, withCtx, Fragment, renderList, toDisplayString, createBlock, createCommentVNode } from 'vue';
 import { NSpace, NIcon } from 'naive-ui';
 import { ArrowUndoSharp } from '@vicons/ionicons5';
 import InputNumber from './InputNumber.vue.js';
-import { useRefHistory, useDraggable } from '@vueuse/core';
+import { useDraggable } from '@vueuse/core';
 import { getNumber } from '../utils/index.js';
 import _export_sfc from '../../../../_virtual/plugin-vue_export-helper.js';
 
-const _hoisted_1 = { class: "left" };
-const _hoisted_2 = { class: "keys" };
+const _hoisted_1 = { class: "keys" };
+const _hoisted_2 = ["onClick"];
 const _hoisted_3 = ["onClick"];
-const _hoisted_4 = ["onClick"];
-const _hoisted_5 = { class: "btns" };
-const _hoisted_6 = ["onClick"];
-const _hoisted_7 = { class: "inputs" };
-const _hoisted_8 = { class: "inputs-right" };
-const _hoisted_9 = /* @__PURE__ */ createElementVNode("hr", null, null, -1);
+const _hoisted_4 = { class: "btns" };
+const _hoisted_5 = ["onClick"];
+const _hoisted_6 = { class: "inputs" };
+const _hoisted_7 = { class: "inputs-right" };
+const _hoisted_8 = /* @__PURE__ */ createElementVNode("hr", null, null, -1);
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "NumberPanel",
   props: {
     defaultValue: { type: Number },
+    value: { type: Number },
     mode: { type: String },
     positionInitialValue: { type: Object, default: () => ({ x: 0, y: 0 }) },
     moveOffset: { type: Object, default: () => ({ x: 0, y: 0 }) },
@@ -29,10 +29,12 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     const props = __props;
     const NUMBERKEYS = "1234567890.";
     const DAYS = [3, 7, 14, 30];
+    const DOSENUMBERKEYS = "123/456*789-0.+";
+    const CALCULATIONSYMBOLS = ["+", "-", "*", "/"];
     const isNumber = computed(() => props.mode === "number");
     const isDay = computed(() => props.mode === "day" && !isNumber.value);
     const isDose = computed(() => props.mode === "dose" && !isNumber.value);
-    const numberKeys = ref(NUMBERKEYS.split(""));
+    const numberKeys = computed(() => (isDose.value ? DOSENUMBERKEYS : NUMBERKEYS).split(""));
     const days = ref(DAYS);
     const doses = ref([2, 3, 4, 5, 6, 7, 8]);
     const inputValue = ref("");
@@ -43,7 +45,6 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     const numeratorValueStatus = ref("success");
     const denominatorValueStatus = ref("success");
     const keyboardRef = ref(null);
-    const { history, undo, redo } = useRefHistory(inputValue);
     const style = init();
     function init() {
       if (props.defaultValue) {
@@ -65,23 +66,71 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       var _a, _b;
       switch (key) {
         case "Undo": {
-          undo();
+          doDelete();
           setInputValueStatus();
           break;
         }
-        case "Enter":
-          emit("change", +inputValue.value);
+        case "Enter": {
+          if (!validator()) {
+            inputValueStatus.value = "error";
+            return;
+          }
+          emit("change", eval(inputValue.value));
           break;
+        }
         default:
           if (typeof key === "number") {
             inputValue.value = key.toString();
           } else {
-            inputValue.value = (((_b = (_a = inputValue.value) == null ? void 0 : _a.toString) == null ? void 0 : _b.call(_a)) || "") + key;
+            if (CALCULATIONSYMBOLS.includes(key) && CALCULATIONSYMBOLS.includes(inputValue.value.at(-1))) {
+              const arr = inputValue.value.split("");
+              arr.splice(-1, 1, key);
+              inputValue.value = arr.join("");
+            } else {
+              inputValue.value = (((_b = (_a = inputValue.value) == null ? void 0 : _a.toString) == null ? void 0 : _b.call(_a)) || "") + key;
+            }
           }
           setInputValueStatus();
           break;
       }
     }
+    function validator() {
+      if (!inputValue.value)
+        return false;
+      if (CALCULATIONSYMBOLS.slice(2).includes(inputValue.value.at(0))) {
+        return false;
+      }
+      if (CALCULATIONSYMBOLS.includes(inputValue.value.at(-1))) {
+        return false;
+      }
+      const arr = [];
+      let _arr = [];
+      const values = inputValue.value.split("");
+      values.forEach((str, index) => {
+        if (CALCULATIONSYMBOLS.includes(str)) {
+          arr.push(_arr.join(""));
+          _arr = [];
+        } else {
+          _arr.push(str);
+          if (index === values.length - 1)
+            arr.push(_arr.join(""));
+        }
+      });
+      const isSuccess = arr.every((value, index) => {
+        if (index === 0 && !value)
+          return true;
+        return /^\d*(.\d+)?$/.test(value);
+      });
+      if (!isSuccess)
+        return false;
+      return true;
+    }
+    function doDelete() {
+      if (!inputValue.value)
+        return;
+      const value = inputValue.value;
+      inputValue.value = value.slice(0, value.length - 1);
+    }
     function updateFraction(value) {
       if (!setInputStatus(inputValue, inputValueStatus))
         return;
@@ -105,6 +154,13 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     function setInputValueStatus() {
       inputValueStatus.value = !inputValue.value ? "error" : "success";
     }
+    watch(
+      () => props.value,
+      (value) => inputValue.value = (value || "").toString(),
+      {
+        immediate: true
+      }
+    );
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", {
         class: normalizeClass(["c-keyboard", { isFixed: __props.drag }]),
@@ -112,22 +168,24 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         ref: keyboardRef,
         style: normalizeStyle(unref(style))
       }, [
-        createElementVNode("div", _hoisted_1, [
+        createElementVNode("div", {
+          class: normalizeClass(["left", { isDose: unref(isDose) }])
+        }, [
           createVNode(InputNumber, {
             modelValue: inputValue.value,
             "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => inputValue.value = $event),
             status: inputValueStatus.value,
             "onUpdate:status": _cache[1] || (_cache[1] = ($event) => inputValueStatus.value = $event)
           }, null, 8, ["modelValue", "status"]),
-          createElementVNode("div", _hoisted_2, [
+          createElementVNode("div", _hoisted_1, [
             createVNode(unref(NSpace), null, {
               default: withCtx(() => [
-                (openBlock(true), createElementBlock(Fragment, null, renderList(numberKeys.value, (key) => {
+                (openBlock(true), createElementBlock(Fragment, null, renderList(unref(numberKeys), (key2) => {
                   return openBlock(), createElementBlock("span", {
-                    key,
-                    class: normalizeClass(key === "0" ? "is-0" : ""),
-                    onClick: ($event) => keydown(key)
-                  }, toDisplayString(key), 11, _hoisted_3);
+                    key: key2,
+                    class: normalizeClass(key2 === "0" ? "is-0" : ""),
+                    onClick: ($event) => keydown(key2)
+                  }, toDisplayString(key2), 11, _hoisted_2);
                 }), 128))
               ]),
               _: 1
@@ -148,7 +206,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
               _: 1
             })
           ])
-        ]),
+        ], 2),
         unref(isDay) ? (openBlock(), createBlock(unref(NSpace), {
           key: 0,
           class: "right-days",
@@ -161,7 +219,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                 class: "btn",
                 key: day,
                 onClick: ($event) => keydown(day)
-              }, toDisplayString(day) + "\u5929", 9, _hoisted_4);
+              }, toDisplayString(day) + "\u5929", 9, _hoisted_3);
             }), 128))
           ]),
           _: 1
@@ -172,13 +230,13 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           "wrap-item": false
         }, {
           default: withCtx(() => [
-            createElementVNode("div", _hoisted_5, [
+            createElementVNode("div", _hoisted_4, [
               (openBlock(true), createElementBlock(Fragment, null, renderList(doses.value, (dose) => {
                 return openBlock(), createElementBlock("span", {
                   class: "btn",
                   key: dose,
                   onClick: ($event) => updateFraction(dose)
-                }, "1/" + toDisplayString(dose), 9, _hoisted_6);
+                }, "1/" + toDisplayString(dose), 9, _hoisted_5);
               }), 128))
             ]),
             createVNode(unref(NSpace), {
@@ -186,13 +244,13 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
               vertical: ""
             }, {
               default: withCtx(() => [
-                createElementVNode("div", _hoisted_7, [
+                createElementVNode("div", _hoisted_6, [
                   createVNode(InputNumber, {
                     integer: "",
                     modelValue: integerValue.value,
                     "onUpdate:modelValue": _cache[4] || (_cache[4] = ($event) => integerValue.value = $event)
                   }, null, 8, ["modelValue"]),
-                  createElementVNode("div", _hoisted_8, [
+                  createElementVNode("div", _hoisted_7, [
                     createVNode(InputNumber, {
                       integer: "",
                       modelValue: numeratorValue.value,
@@ -200,7 +258,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                       status: numeratorValueStatus.value,
                       "onUpdate:status": _cache[6] || (_cache[6] = ($event) => numeratorValueStatus.value = $event)
                     }, null, 8, ["modelValue", "status"]),
-                    _hoisted_9,
+                    _hoisted_8,
                     createVNode(InputNumber, {
                       integer: "",
                       modelValue: denominatorValue.value,

package/es/components/keyboard/style/index.css

@@ -1 +1 @@
-.c-keyboard span,.c-keyboard-english .keys span{cursor:pointer}.c-keyboard{background:#fff;display:flex;height:160px}.c-keyboard.isFixed{position:fixed;z-index:1}.c-keyboard .btn{align-items:center;background:linear-gradient(180deg,#fff,#f2f2f2);border-radius:2px;box-shadow:0 2px 2px #00000036;box-sizing:border-box;display:inline-flex;font-size:14px;justify-content:center;text-align:center}.c-keyboard .btn:hover{background:#2474ff33;border:1px solid #2474ff}.c-keyboard .btn:active{background:#2474ff;color:#fff}.c-keyboard .btn:hover{box-shadow:none}.c-keyboard .left{box-sizing:border-box;padding:6px;width:130px}.c-keyboard .left .n-input{height:28px;width:100%}.c-keyboard .left .n-input .n-input__input-el{height:28px}.c-keyboard .left .keys{display:flex;margin-top:5px}.c-keyboard .left .keys .n-space{gap:4px 4px!important}.c-keyboard .left .keys span{align-items:center;background-color:#e8e8e8;border-radius:2px;box-sizing:border-box;display:inline-flex;font-size:14px;height:26px;justify-content:center;text-align:center;width:26px}.c-keyboard .left .keys span:hover{background:#2474ff33;border:1px solid #2474ff}.c-keyboard .left .keys span:active{background:#2474ff;color:#fff}.c-keyboard .left .keys span.opt{height:56px}.c-keyboard .left .keys span.is-0{width:56px}.c-keyboard .right-days,.c-keyboard .right-dose{border-left:1px solid #d5d5d5}.c-keyboard .right-days{padding:0 12px}.c-keyboard .right-days .btn{height:26px;width:56px}.c-keyboard .right-dose{gap:8px 8px!important;padding:5px 12px 5px 5px}.c-keyboard .right-dose .btn{height:32px;width:100px}.c-keyboard .right-dose .btns{display:flex;flex-flow:column nowrap;height:100%;overflow-y:scroll;padding-right:6px}.c-keyboard .right-dose .btns .btn{height:20px;margin-top:4px;width:40px}.c-keyboard .right-dose .btns::-webkit-scrollbar{height:1px;width:2px}.c-keyboard .right-dose .btns::-webkit-scrollbar-track{background:#d8d8d8;border-radius:2px;box-shadow:inset 0 0 5px #fff}.c-keyboard .right-dose .btns::-webkit-scrollbar-thumb{background:#535353;border-radius:2px;box-shadow:inset 0 0 5px #fff}.c-keyboard .right-dose .inputs{align-items:center;display:flex;gap:8px}.c-keyboard .right-dose .inputs .n-input{height:32px;width:46px}.c-keyboard .right-dose .inputs .n-input .n-input__input-el{height:32px}.c-keyboard .n-input .n-input-wrapper{padding-right:5px}.c-keyboard .n-input .n-input-wrapper .n-input__suffix{line-height:0}.c-keyboard .n-input .n-input-wrapper .n-input__suffix .n-space{gap:0 0!important}.c-keyboard .n-input .n-input-wrapper .n-input__suffix .n-space .n-icon{cursor:pointer}.c-keyboard-english{background:#fff;box-sizing:border-box;padding:10px 6px;width:308px}.c-keyboard-english.isFixed{position:fixed;z-index:1}.c-keyboard-english .n-space span{font-size:12px}.c-keyboard-english .n-space .n-icon{cursor:pointer}.c-keyboard-english .keys{display:flex;flex-flow:row wrap;gap:4px 4px;margin-top:5px}.c-keyboard-english .keys span{align-items:center;background-color:#e8e8e8;border-radius:2px;box-sizing:border-box;display:inline-flex;font-size:14px;height:26px;justify-content:center;text-align:center;width:26px}.c-keyboard-english .keys span:hover{background:#2474ff33;border:1px solid #2474ff}.c-keyboard-english .keys span:active{background:#2474ff;color:#fff}.c-keyboard-english .keys span.key10,.c-keyboard-english .keys span.key27{margin-left:16px}.c-keyboard-english .keys span.key26{margin-right:25px}.c-keyboard-english .keys span.key19{margin-left:31px}.c-keyboard-english .keys span.key28{width:146px}.c-keyboard-english .keys span.key30{width:56px}
+.c-keyboard span,.c-keyboard-english .keys span{cursor:pointer}.c-keyboard{background:#fff;display:flex;height:160px}.c-keyboard.isFixed{position:fixed;z-index:1}.c-keyboard .btn{align-items:center;background:linear-gradient(180deg,#fff,#f2f2f2);border-radius:2px;box-shadow:0 2px 2px #00000036;box-sizing:border-box;display:inline-flex;font-size:14px;justify-content:center;text-align:center}.c-keyboard .btn:hover{background:#2474ff33;border:1px solid #2474ff}.c-keyboard .btn:active{background:#2474ff;color:#fff}.c-keyboard .btn:hover{box-shadow:none}.c-keyboard .left{box-sizing:border-box;padding:6px;width:128px}.c-keyboard .left.isDose{width:158px}.c-keyboard .left .n-input{height:28px;width:100%}.c-keyboard .left .n-input .n-input__input-el{height:28px}.c-keyboard .left .keys{display:flex;margin-top:5px}.c-keyboard .left .keys .n-space{gap:4px 4px!important}.c-keyboard .left .keys span{align-items:center;background-color:#e8e8e8;border-radius:2px;box-sizing:border-box;display:inline-flex;font-size:14px;height:26px;justify-content:center;text-align:center;width:26px}.c-keyboard .left .keys span:hover{background:#2474ff33;border:1px solid #2474ff}.c-keyboard .left .keys span:active{background:#2474ff;color:#fff}.c-keyboard .left .keys span.opt{height:56px}.c-keyboard .left .keys span.is-0{width:56px}.c-keyboard .right-days,.c-keyboard .right-dose{border-left:1px solid #d5d5d5}.c-keyboard .right-days{padding:0 12px}.c-keyboard .right-days .btn{height:26px;width:56px}.c-keyboard .right-dose{gap:8px 8px!important;padding:5px 12px 5px 5px}.c-keyboard .right-dose .btn{height:32px;width:100px}.c-keyboard .right-dose .btns{display:flex;flex-flow:column nowrap;height:100%;overflow-y:scroll;padding-right:6px}.c-keyboard .right-dose .btns .btn{height:20px;margin-top:4px;width:40px}.c-keyboard .right-dose .btns::-webkit-scrollbar{height:1px;width:2px}.c-keyboard .right-dose .btns::-webkit-scrollbar-track{background:#d8d8d8;border-radius:2px;box-shadow:inset 0 0 5px #fff}.c-keyboard .right-dose .btns::-webkit-scrollbar-thumb{background:#535353;border-radius:2px;box-shadow:inset 0 0 5px #fff}.c-keyboard .right-dose .inputs{align-items:center;display:flex;gap:8px}.c-keyboard .right-dose .inputs .n-input{height:32px;width:46px}.c-keyboard .right-dose .inputs .n-input .n-input__input-el{height:32px}.c-keyboard .n-input .n-input-wrapper{padding-right:5px}.c-keyboard .n-input .n-input-wrapper .n-input__suffix{line-height:0}.c-keyboard .n-input .n-input-wrapper .n-input__suffix .n-space{gap:0 0!important}.c-keyboard .n-input .n-input-wrapper .n-input__suffix .n-space .n-icon{cursor:pointer}.c-keyboard-english{background:#fff;box-sizing:border-box;padding:10px 6px;width:308px}.c-keyboard-english.isFixed{position:fixed;z-index:1}.c-keyboard-english .n-space span{font-size:12px}.c-keyboard-english .n-space .n-icon{cursor:pointer}.c-keyboard-english .keys{display:flex;flex-flow:row wrap;gap:4px 4px;margin-top:5px}.c-keyboard-english .keys span{align-items:center;background-color:#e8e8e8;border-radius:2px;box-sizing:border-box;display:inline-flex;font-size:14px;height:26px;justify-content:center;text-align:center;width:26px}.c-keyboard-english .keys span:hover{background:#2474ff33;border:1px solid #2474ff}.c-keyboard-english .keys span:active{background:#2474ff;color:#fff}.c-keyboard-english .keys span.key10,.c-keyboard-english .keys span.key27{margin-left:16px}.c-keyboard-english .keys span.key26{margin-right:25px}.c-keyboard-english .keys span.key19{margin-left:31px}.c-keyboard-english .keys span.key28{width:146px}.c-keyboard-english .keys span.key30{width:56px}

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "cnhis-design-vue",
-	"version": "3.1.34",
+	"version": "3.1.35-beta.10",
 	"license": "ISC",
 	"module": "./es/components/index.js",
 	"main": "./es/components/index.js",
@@ -61,5 +61,5 @@
 		"iOS 7",
 		"last 3 iOS versions"
 	],
-	"gitHead": "abde72ffa7f0c842a8674101ec3656e6c906489d"
+	"gitHead": "9658d752799ec597e0b67572018a9f9af0fc6a97"
 }