hy-app 0.1.1 → 0.1.2

package/components/hy-price/hy-price.vue

@@ -8,7 +8,7 @@
     <text
       class="hy-price__text"
       :style="[
-        { 'font-size': `${Number(fontSize) + Number(fontSize) * 0.8}rpx` }
+        { 'font-size': `${Number(fontSize) + Number(fontSize) * 0.8}rpx` },
       ]"
       >{{ priceOne[0] }}
     </text>
@@ -19,9 +19,9 @@
 </template>
 
 <script setup lang="ts">
-import { computed, CSSProperties, toRefs } from "vue";
+import { computed, type CSSProperties, toRefs } from "vue";
 import defaultProps from "./props";
-import IProps from "./typing";
+import type IProps from "./typing";
 import { addUnit } from "../../utils";
 
 const props = withDefaults(defineProps<IProps>(), defaultProps);
@@ -36,7 +36,7 @@ const priceStyle = computed<CSSProperties>(() => {
     color: textColor.value,
     fontWeight: weight.value,
     fontStyle: slant.value ? "oblique" : "",
-    fontSize: addUnit(fontSize.value)
+    fontSize: addUnit(fontSize.value),
   };
 
   return Object.assign(style, customStyle);

package/components/hy-price/props.ts

@@ -1,4 +1,4 @@
-import IProps from "./typing";
+import type IProps from "./typing";
 
 const defaultProps: IProps = {
   text: "0.00",
@@ -7,7 +7,7 @@ const defaultProps: IProps = {
   textColor: "#FE3232",
   fontSize: 22,
   weight: 500,
-  slant: false
+  slant: false,
 };
 
 export default defaultProps;

package/components/hy-price/typing.d.ts

@@ -1,4 +1,4 @@
-import { CSSProperties } from "vue";
+import type { CSSProperties } from "vue";
 
 export default interface IProps {
   /**

package/components/hy-radio/hy-radio.vue

@@ -7,7 +7,7 @@
         :style="radioStyle"
         :class="[
           `hy-radio-label--${iconPlacement}`,
-          borderBottom && placement === 'column' && 'hy-border-bottom'
+          borderBottom && placement === 'column' && 'hy-border-bottom',
         ]"
       >
         <view
@@ -19,12 +19,12 @@
           <slot
             name="icon"
             :iconColor="iconColor"
-            :iconSize="addUnit(iconSize)"
+            :iconSize="addUnit(sizeType[size] ?? iconSize)"
           >
             <HyIcon
               class="hy-radio__icon-wrap__icon"
               :name="IconConfig.CHECK_MASK"
-              :size="addUnit(iconSize)"
+              :size="addUnit(sizeType[size] ?? iconSize)"
               :color="iconColorCom(item.checked)"
             />
           </slot>
@@ -38,7 +38,7 @@
               class="hy-radio__text"
               :style="{
                 color: labelColor,
-                fontSize: labelSize
+                fontSize: addUnit(sizeType[size] ?? labelSize),
               }"
               >{{ item[fieldNames.label] }}</text
             >
@@ -50,10 +50,17 @@
 </template>
 
 <script setup lang="ts">
-import IProps from "./typing";
-import { CheckboxColumnsVo } from "../hy-check-button/typing";
+import type IProps from "./typing";
+import type { CheckboxColumnsVo } from "../hy-check-button/typing";
 import defaultProps from "./props";
-import { computed, CSSProperties, ref, toRefs, watch } from "vue";
+import {
+  computed,
+  type CSSProperties,
+  reactive,
+  ref,
+  toRefs,
+  watch,
+} from "vue";
 import { addUnit, bem, error } from "../../utils";
 import { IconConfig } from "../../config";
 
@@ -73,21 +80,27 @@ const {
   customStyle,
   borderBottom,
   placement,
-  iconColor
+  iconColor,
 } = toRefs(props);
 const emit = defineEmits(["change", "update:modelValue"]);
 
 const columns_1 = ref();
+const sizeType: AnyObject = reactive({
+  small: 14,
+  medium: 18,
+  large: 22,
+});
 
 watch(
   () => modelValue.value,
   (newValue) => {
     columns_1.value = columns.value.map((item: any) => {
-      item[fieldNames.value.checked] = newValue == item[fieldNames.value.value];
+      item[fieldNames.value.checked] =
+        newValue === item[fieldNames.value.value];
       return item;
     });
   },
-  { immediate: true }
+  { immediate: true },
 );
 
 const isDisabled = (disabledVal?: boolean): boolean =>
@@ -116,7 +129,7 @@ const radioStyle = computed(() => {
   const style: CSSProperties = {};
   if (borderBottom.value && placement.value === "row") {
     error(
-      "检测到您将borderBottom设置为true，需要同时将u-checkbox-group的placement设置为column才有效"
+      "检测到您将borderBottom设置为true，需要同时将u-checkbox-group的placement设置为column才有效",
     );
   }
   // 当父组件设置了显示下边框并且排列形式为纵向时，给内容和边框之间加上一定间隔
@@ -162,8 +175,8 @@ const iconWrapStyle = computed(() => {
       temp[fieldNames.value.checked] && !isDisabled(temp?.disabled)
         ? activeColor.value
         : inactiveColor.value;
-    style.width = addUnit(size.value);
-    style.height = addUnit(size.value);
+    style.width = addUnit(sizeType[size.value] ?? size.value);
+    style.height = addUnit(sizeType[size.value] ?? size.value);
     return style;
   };
 });

package/components/hy-radio/props.ts

@@ -1,4 +1,4 @@
-import IProps from "./typing";
+import type IProps from "./typing";
 import { ColorConfig } from "../../config";
 
 const defaultProps: IProps = {
@@ -7,10 +7,10 @@ const defaultProps: IProps = {
   fieldNames: {
     label: "label",
     value: "value",
-    checked: "checked"
+    checked: "checked",
   },
   shape: "circle",
-  size: 20,
+  size: "medium",
   disabled: false,
   activeColor: ColorConfig.primary,
   inactiveColor: "#c8c9cc",
@@ -22,7 +22,7 @@ const defaultProps: IProps = {
   labelSize: "",
   labelColor: "",
   labelDisabled: "",
-  placement: "row"
+  placement: "row",
 };
 
 export default defaultProps;

package/components/hy-radio/typing.d.ts

@@ -1,5 +1,6 @@
 import type { CSSProperties } from "vue";
 import { CheckboxColumnsVo, IFieldNames } from "../hy-check-button/typing";
+import { HyApp } from "@/package/typing/modules/common";
 
 export default interface IProps {
   /**
@@ -25,7 +26,7 @@ export default interface IProps {
   /**
    * @description 整体的大小
    * */
-  size?: string | number;
+  size?: HyApp.SizeType | string | number;
   /**
    * @description 是否默认选中
    * */

package/components/hy-rate/hy-rate.vue

@@ -22,11 +22,11 @@
               disabled
                 ? '#c8c9cc'
                 : Math.floor(activeIndex) > index
-                ? activeColor
-                : inactiveColor
+                  ? activeColor
+                  : inactiveColor
             "
             :custom-style="{
-              padding: `0 ${addUnit(gutter / 2)}`
+              padding: `0 ${addUnit(gutter / 2)}`,
             }"
             :size="size"
           ></HyIcon>
@@ -37,8 +37,8 @@
           class="hy-rate__content__item__icon-wrap hy-rate__content__item__icon-wrap--half"
           :style="[
             {
-              width: addUnit(rateWidth / 2)
-            }
+              width: addUnit(rateWidth / 2),
+            },
           ]"
           ref="hy-rate__content__item__icon-wrap"
         >
@@ -48,11 +48,11 @@
               disabled
                 ? '#c8c9cc'
                 : Math.ceil(activeIndex) > index
-                ? activeColor
-                : inactiveColor
+                  ? activeColor
+                  : inactiveColor
             "
             :custom-style="{
-              padding: `0 ${addUnit(gutter / 2)}`
+              padding: `0 ${addUnit(gutter / 2)}`,
             }"
             :size="size"
           ></HyIcon>
@@ -64,8 +64,8 @@
 
 <script setup lang="ts">
 import { addUnit, getRect, guid, range, sleep } from "../../utils";
-import { ref, watch, toRefs, onMounted, nextTick } from "vue";
-import IProps from "./typing";
+import { ref, watch, toRefs, onMounted, getCurrentInstance } from "vue";
+import type IProps from "./typing";
 import defaultProps from "./props";
 
 // 组件
@@ -79,7 +79,7 @@ const {
   count,
   disabled,
   readonly,
-  allowHalf
+  allowHalf,
 } = toRefs(props);
 const emit = defineEmits(["update:modelValue", "change"]);
 
@@ -96,40 +96,52 @@ watch(
   () => modelValue.value,
   (newValue) => {
     activeIndex.value = newValue;
-  }
+  },
 );
 watch(
   () => activeIndex.value,
   (newVal) => {
     emitEvent();
-  }
+  },
 );
+const instance = getCurrentInstance();
 
 onMounted(() => {
   init();
 });
 
 const init = () => {
-  sleep(200).then(() => {
-    getRateItemRect();
-    getRateIconWrapRect();
+  sleep(300).then(async () => {
+    await getRateItemRect();
+    await getRateIconWrapRect();
   });
 };
 
-// 获取评分组件盒子的布局信息
+/**
+ * @description 获取评分组件盒子的布局信息
+ * */
 const getRateItemRect = async () => {
   await sleep();
   // #ifndef APP-NVUE
-  const res: UniApp.NodeInfo = (await getRect(`#${elId}`)) as UniApp.NodeInfo;
+  const res: UniApp.NodeInfo = (await getRect(
+    `#${elId}`,
+    false,
+    instance,
+  )) as UniApp.NodeInfo;
   rateBoxLeft.value = res.left || 0;
   // #endif
 };
-// 获取单个星星的尺寸
+
+/**
+ * @description 获取单个星星的尺寸
+ * */
 const getRateIconWrapRect = async () => {
   // uView封装的获取节点的方法，详见文档
   // #ifndef APP-NVUE
   const res: UniApp.NodeInfo = (await getRect(
-    `.${elClass}`
+    `.${elClass}`,
+    false,
+    instance,
   )) as UniApp.NodeInfo;
   rateWidth.value = res.width || 0;
   // #endif

package/components/hy-rate/props.ts

@@ -1,18 +1,19 @@
 import { ColorConfig, IconConfig } from "../../config";
+import type IProps from "./typing";
 
-const defaultProps = {
+const defaultProps: IProps = {
   modelValue: 1,
   count: 5,
   disabled: false,
   readonly: false,
   size: 18,
   inactiveColor: "#b2b2b2",
-  activeColor: ColorConfig.primary,
+  activeColor: "#FFF00D",
   gutter: 4,
   minCount: 1,
   allowHalf: false,
   activeIcon: IconConfig.STAR_FILL,
   inactiveIcon: IconConfig.STAR,
-  touchable: true
+  touchable: true,
 };
 export default defaultProps;

package/components/hy-rate/typing.d.ts

@@ -1,4 +1,4 @@
-import { CSSProperties } from "vue";
+import type { CSSProperties } from "vue";
 
 export default interface IProps {
   /**

package/components/hy-search/hy-search.vue

@@ -4,9 +4,9 @@
     @tap="clickHandler"
     :style="[
       {
-        margin: margin
+        margin: margin,
       },
-      customStyle
+      customStyle,
     ]"
   >
     <view
@@ -14,7 +14,7 @@
       :style="{
         backgroundColor: bgColor,
         borderRadius: shape == 'circle' ? '100px' : '4px',
-        borderColor: borderColor
+        borderColor: borderColor,
       }"
     >
       <template v-if="$slots.label || label !== null">
@@ -53,9 +53,9 @@
             textAlign: inputAlign,
             color: color,
             backgroundColor: bgColor,
-            height: addUnit(height)
+            height: addUnit(height),
           },
-          inputStyle
+          inputStyle,
         ]"
       />
       <view
@@ -68,7 +68,7 @@
           size="11"
           color="#ffffff"
           :customStyle="{
-            lineHeight: '12px'
+            lineHeight: '12px',
           }"
         ></HyIcon>
       </view>
@@ -86,8 +86,8 @@
 <script setup lang="ts">
 import { computed, nextTick, toRefs, ref, watch } from "vue";
 import defaultProps from "./props";
-import IProps from "./typing";
-import { addUnit, sleep } from "../../utils";
+import type IProps from "./typing";
+import { sleep, addUnit } from "../../utils";
 import { IconConfig } from "../../config";
 import HyIcon from "../hy-icon/hy-icon.vue";
 
@@ -103,7 +103,7 @@ const emit = defineEmits([
   "confirm",
   "change",
   "focus",
-  "blur"
+  "blur",
 ]);
 
 const keyword = ref<string>("");
@@ -118,7 +118,7 @@ watch(
   (newValue: string) => {
     emit("update:modelValue", newValue);
     emit("change", newValue);
-  }
+  },
 );
 
 watch(
@@ -126,7 +126,7 @@ watch(
   (newValue: string) => {
     keyword.value = newValue;
   },
-  { immediate: true }
+  { immediate: true },
 );
 
 const showActionBtn = computed<boolean>(() => {

package/components/hy-search/props.ts

@@ -1,4 +1,4 @@
-import IProps from "./typing";
+import type IProps from "./typing";
 
 const defaultProps: IProps = {
   modelValue: "",
@@ -23,7 +23,7 @@ const defaultProps: IProps = {
   height: 32,
   label: null,
   adjustPosition: true,
-  autoBlur: true
+  autoBlur: true,
 };
 
 export default defaultProps;

package/components/hy-search/typing.d.ts

@@ -1,5 +1,4 @@
-import { CSSProperties } from "vue";
-import { b } from "vite/dist/node/types.d-aGj9QkWt";
+import type { CSSProperties } from "vue";
 
 export default interface IProps {
   /**

package/components/hy-slider/hy-slider.vue

@@ -14,7 +14,7 @@
           height:
             isRange && showValue
               ? addUnit(Number(blockSize) + 24)
-              : addUnit(blockSize)
+              : addUnit(blockSize),
         }"
       >
         <view
@@ -23,8 +23,8 @@
           :style="[
             {
               height: height,
-              backgroundColor: inactiveColor
-            }
+              backgroundColor: inactiveColor,
+            },
           ]"
         >
         </view>
@@ -36,8 +36,8 @@
             {
               height: height,
               marginTop: '-' + height,
-              backgroundColor: activeColor
-            }
+              backgroundColor: activeColor,
+            },
           ]"
         >
         </view>
@@ -49,8 +49,8 @@
             {
               height: height,
               marginTop: '-' + height,
-              backgroundColor: inactiveColor
-            }
+              backgroundColor: inactiveColor,
+            },
           ]"
         >
         </view>
@@ -58,7 +58,7 @@
           v-if="isRange && showValue"
           class="hy-slider__show-range-value"
           :style="{
-            left: blockLeft(barStyle?.width, blockSize)
+            left: blockLeft(barStyle?.width, blockSize),
           }"
         >
           {{ rangeValue[0] }}
@@ -67,7 +67,7 @@
           v-if="isRange && showValue"
           class="hy-slider__show-range-value"
           :style="{
-            left: blockLeft(barStyle?.width, blockSize)
+            left: blockLeft(barStyle?.width, blockSize),
           }"
         >
           {{ rangeValue[1] }}
@@ -80,7 +80,7 @@
             @touchend="onTouchEnd($event, 0)"
             @touchcancel="onTouchEnd($event, 0)"
             :style="{
-              left: blockLeft(barStyle?.width, blockSize)
+              left: blockLeft(barStyle?.width, blockSize),
             }"
           >
             <slot name="min" v-if="$slots.min || $slots.$min" />
@@ -92,8 +92,8 @@
                 {
                   height: addUnit(blockSize),
                   width: addUnit(blockSize),
-                  backgroundColor: blockColor
-                }
+                  backgroundColor: blockColor,
+                },
               ]"
             ></view>
           </view>
@@ -105,7 +105,7 @@
           @touchend="onTouchEnd"
           @touchcancel="onTouchEnd"
           :style="{
-            left: blockLeft(barStyle?.width, blockSize)
+            left: blockLeft(barStyle?.width, blockSize),
           }"
         >
           <slot name="max" v-if="isRange && ($slots.max || $slots.$max)" />
@@ -118,8 +118,8 @@
               {
                 height: addUnit(blockSize),
                 width: addUnit(blockSize),
-                backgroundColor: blockColor
-              }
+                backgroundColor: blockColor,
+              },
             ]"
           ></view>
         </view>
@@ -154,12 +154,11 @@ import {
   onMounted,
   ref,
   toRefs,
-  watch
+  watch,
 } from "vue";
 import defaultProps from "./props";
-import IProps from "./typing";
+import type IProps from "./typing";
 import { addUnit, error, getRect, sleep } from "../../utils";
-import NodeInfo = UniNamespace.NodeInfo;
 
 const props = withDefaults(defineProps<IProps>(), defaultProps);
 const { modelValue, rangeValue, useNative, isRange, disabled, step, min, max } =
@@ -174,20 +173,20 @@ const startValue0 = ref(0);
 const startValue = ref(0);
 const barStyle0 = ref<CSSProperties>();
 const barStyle = ref<CSSProperties>();
-const sliderRect = ref<NodeInfo>({
+const sliderRect = ref<UniNamespace.NodeInfo>({
   left: 0,
-  width: 0
+  width: 0,
 });
 
 const blockLeft = computed(() => {
   return (
     slideWidth: string | number | undefined,
-    blockWidth: string | number
+    blockWidth: string | number,
   ): string => {
     if (slideWidth) {
       return addUnit(
         parseInt(slideWidth.toString().replace("px", "")) +
-          Number(blockWidth) / 2
+          Number(blockWidth) / 2,
       );
     }
     return "0px";
@@ -199,7 +198,7 @@ watch(
   (newValue) => {
     // 只有在非滑动状态时，才可以通过value更新滑块值，这里监听，是为了让用户触发
     if (status.value === "end") updateValue(newValue, false);
-  }
+  },
 );
 
 watch(
@@ -210,14 +209,16 @@ watch(
       updateValue(newValue[1], false, 1);
     }
   },
-  { deep: true }
+  { deep: true },
 );
 
 onMounted(async () => {
   // 获取滑块条的尺寸信息
   if (!useNative.value) {
     // #ifndef APP-NVUE
-    sliderRect.value = (await getRect(".hy-slider__base")) as NodeInfo;
+    sliderRect.value = (await getRect(
+      ".hy-slider__base",
+    )) as UniNamespace.NodeInfo;
     // console.log('sliderRect', sliderRect.value)
     if (sliderRect.value.width == 0) {
       error("如在弹窗等元素中使用，请使用v-if来显示滑块，否则无法计算长度。");
@@ -359,10 +360,10 @@ const updateValue = (value: number, drag: boolean, index: number = 1) => {
   let width = Math.min(
     ((valueFormat - min.value) / (max.value - min.value)) *
       sliderRect.value.width!,
-    sliderRect.value.width!
+    sliderRect.value.width!,
   );
   let barStyle_1: CSSProperties = {
-    width: width + "px"
+    width: width + "px",
   };
   // 移动期间无需过渡动画
   if (drag == true) {
@@ -404,8 +405,8 @@ const format = (value: number, index = 1): number => {
           Math.round(
             Math.max(
               min.value,
-              Math.min(value, rangeValue.value[1] - step.value, max.value)
-            ) / step.value
+              Math.min(value, rangeValue.value[1] - step.value, max.value),
+            ) / step.value,
           ) * step.value
         );
       case 1:
@@ -414,8 +415,8 @@ const format = (value: number, index = 1): number => {
             Math.max(
               min.value,
               rangeValue.value[0] + step.value,
-              Math.min(value, max.value)
-            ) / step.value
+              Math.min(value, max.value),
+            ) / step.value,
           ) * step.value
         );
       default:

package/components/hy-slider/props.ts

@@ -1,4 +1,4 @@
-import IProps from "./typing";
+import type IProps from "./typing";
 import { ColorConfig } from "../../config";
 
 const defaultProps: IProps = {
@@ -15,7 +15,7 @@ const defaultProps: IProps = {
   useNative: false,
   height: "2px",
   rangeValue: [0, 0],
-  isRange: false
+  isRange: false,
 };
 
 export default defaultProps;