hy-app 0.5.9 → 0.5.11

package/components/hy-pagination/hy-pagination.vue

@@ -1,135 +1,135 @@
-<template>
-    <view class="hy-pagination" :style="customStyle" v-if="!(hideIfOnePage && totalPageNum === 1)">
-        <view class="hy-pagination__content">
-            <hy-button
-                :plain="modelValue > 1"
-                type="info"
-                size="small"
-                :disabled="modelValue <= 1"
-                shape="circle"
-                class="hy-pagination__nav"
-                @click="sub"
-            >
-                <text v-if="!showIcon">{{ prevText }}</text>
-                <hy-icon
-                    v-else
-                    :class="`hy-pagination__left hy-pagination__icon ${
-                        modelValue <= 1
-                            ? 'hy-pagination__nav--disabled'
-                            : 'hy-pagination__nav--active'
-                    }`"
-                    :name="IconConfig.LEFT"
-                ></hy-icon>
-            </hy-button>
-            <view class="hy-pagination__size">
-                <text class="hy-pagination__current">{{ modelValue }}</text>
-                <text class="hy-pagination__separator">/</text>
-                <text>{{ totalPageNum }}</text>
-            </view>
-            <hy-button
-                :plain="modelValue < totalPageNum"
-                type="info"
-                size="small"
-                :disabled="modelValue >= totalPageNum"
-                shape="circle"
-                @click="add"
-            >
-                <text v-if="!showIcon">{{ nextText }}</text>
-                <hy-icon
-                    v-else
-                    :custom-class="`hy-pagination__icon ${
-                        modelValue >= totalPageNum
-                            ? 'hy-pagination__nav--disabled'
-                            : 'hy-pagination__nav--active'
-                    }`"
-                    :name="IconConfig.RIGHT"
-                ></hy-icon>
-            </hy-button>
-        </view>
-        <view class="hy-pagination__message" v-if="showMessage">
-            <text>当前页：{{ modelValue }}，</text>
-            <text v-if="total">当前数据：{{ total }}，</text>
-            <text>分页大小：{{ pageSize }}</text>
-        </view>
-    </view>
-</template>
-
-<script lang="ts">
-export default {
-    name: 'hy-pagination',
-    options: {
-        virtualHost: true,
-        addGlobalClass: true,
-        styleIsolation: 'shared'
-    }
-}
-</script>
-
-<script lang="ts" setup>
-import { ref, watch } from 'vue'
-import type { IPaginationEmits } from './typing'
-import { IconConfig } from '../../libs'
-import paginationProps from './props'
-// 组件
-import HyIcon from '../hy-icon/hy-icon.vue'
-import HyButton from '../hy-button/hy-button.vue'
-
-/**
- * 当数据量过多时，使用分页分解数据。
- * @displayName hy-pagination
- */
-defineOptions({})
-
-const props = defineProps(paginationProps)
-const emit = defineEmits<IPaginationEmits>()
-
-const totalPageNum = ref<number>(0) // 总页数
-
-watch(
-    () => props.totalPage,
-    (newValue) => {
-        if (!totalPageNum.value && newValue) {
-            totalPageNum.value = totalPageNum.value
-        }
-    },
-    { immediate: true, deep: true }
-)
-
-watch(
-    () => props.total,
-    () => {
-        updateTotalPage()
-    },
-    { immediate: true, deep: true }
-)
-
-/**
- * @description 加数
- * */
-const add = () => {
-    const { modelValue } = props
-    if (modelValue > totalPageNum.value - 1) {
-        return
-    }
-    emit('change', { value: modelValue + 1 })
-    emit('update:modelValue', modelValue + 1)
-}
-
-const sub = () => {
-    const { modelValue } = props
-    if (modelValue < 2) {
-        return
-    }
-    emit('change', { value: modelValue - 1 })
-    emit('update:modelValue', modelValue - 1)
-}
-
-function updateTotalPage() {
-    const { total, pageSize } = props
-    totalPageNum.value = Math.ceil(total / pageSize)
-}
-</script>
-
-<style lang="scss" scoped>
-@import './index.scss';
-</style>
+<template>
+    <view class="hy-pagination" :style="customStyle" v-if="!(hideIfOnePage && totalPageNum === 1)">
+        <view class="hy-pagination__content">
+            <hy-button
+                :plain="modelValue > 1"
+                type="info"
+                size="small"
+                :disabled="modelValue <= 1"
+                shape="circle"
+                class="hy-pagination__nav"
+                @click="sub"
+            >
+                <text v-if="!showIcon">{{ prevText }}</text>
+                <hy-icon
+                    v-else
+                    :class="`hy-pagination__left hy-pagination__icon ${
+                        modelValue <= 1
+                            ? 'hy-pagination__nav--disabled'
+                            : 'hy-pagination__nav--active'
+                    }`"
+                    :name="IconConfig.LEFT"
+                ></hy-icon>
+            </hy-button>
+            <view class="hy-pagination__size">
+                <text class="hy-pagination__current">{{ modelValue }}</text>
+                <text class="hy-pagination__separator">/</text>
+                <text>{{ totalPageNum }}</text>
+            </view>
+            <hy-button
+                :plain="modelValue < totalPageNum"
+                type="info"
+                size="small"
+                :disabled="modelValue >= totalPageNum"
+                shape="circle"
+                @click="add"
+            >
+                <text v-if="!showIcon">{{ nextText }}</text>
+                <hy-icon
+                    v-else
+                    :custom-class="`hy-pagination__icon ${
+                        modelValue >= totalPageNum
+                            ? 'hy-pagination__nav--disabled'
+                            : 'hy-pagination__nav--active'
+                    }`"
+                    :name="IconConfig.RIGHT"
+                ></hy-icon>
+            </hy-button>
+        </view>
+        <view class="hy-pagination__message" v-if="showMessage">
+            <text>当前页：{{ modelValue }}，</text>
+            <text v-if="total">当前数据：{{ total }}，</text>
+            <text>分页大小：{{ pageSize }}</text>
+        </view>
+    </view>
+</template>
+
+<script lang="ts">
+export default {
+    name: 'hy-pagination',
+    options: {
+        virtualHost: true,
+        addGlobalClass: true,
+        styleIsolation: 'shared'
+    }
+}
+</script>
+
+<script lang="ts" setup>
+import { ref, watch } from 'vue'
+import type { IPaginationEmits } from './typing'
+import { IconConfig } from '../../libs'
+import paginationProps from './props'
+// 组件
+import HyIcon from '../hy-icon/hy-icon.vue'
+import HyButton from '../hy-button/hy-button.vue'
+
+/**
+ * 当数据量过多时，使用分页分解数据。
+ * @displayName hy-pagination
+ */
+defineOptions({})
+
+const props = defineProps(paginationProps)
+const emit = defineEmits<IPaginationEmits>()
+
+const totalPageNum = ref<number>(0) // 总页数
+
+watch(
+    () => props.totalPage,
+    (newValue) => {
+        if (!totalPageNum.value && newValue) {
+            totalPageNum.value = totalPageNum.value
+        }
+    },
+    { immediate: true, deep: true }
+)
+
+watch(
+    () => props.total,
+    () => {
+        updateTotalPage()
+    },
+    { immediate: true, deep: true }
+)
+
+/**
+ * @description 加数
+ * */
+const add = () => {
+    const { modelValue } = props
+    if (modelValue > totalPageNum.value - 1) {
+        return
+    }
+    emit('change', { value: modelValue + 1 })
+    emit('update:modelValue', modelValue + 1)
+}
+
+const sub = () => {
+    const { modelValue } = props
+    if (modelValue < 2) {
+        return
+    }
+    emit('change', { value: modelValue - 1 })
+    emit('update:modelValue', modelValue - 1)
+}
+
+function updateTotalPage() {
+    const { total, pageSize } = props
+    totalPageNum.value = Math.ceil(total / pageSize)
+}
+</script>
+
+<style lang="scss" scoped>
+@import './index.scss';
+</style>

package/components/hy-pagination/props.ts

@@ -1,55 +1,55 @@
-import type { CSSProperties, PropType } from 'vue'
-
-const paginationProps = {
-    /** 当前页 */
-    modelValue: {
-        type: Number,
-        default: 1
-    },
-    /** 总页数，如果有total，则优先使用total计算页数 */
-    totalPage: {
-        type: Number,
-        default: 1
-    },
-    /** 是否展示分页为Icon图标 */
-    showIcon: {
-        type: Boolean,
-        default: false
-    },
-    /** 是否展示总条数 */
-    showMessage: {
-        type: Boolean,
-        default: false
-    },
-    /** 总条数 */
-    total: {
-        type: Number,
-        default: 0
-    },
-    /** 每页条数 */
-    pageSize: {
-        type: Number,
-        default: 10
-    },
-    /** 上一页文本 */
-    prevText: {
-        type: String,
-        default: '上一页'
-    },
-    /** 下一页文本 */
-    nextText: {
-        type: String,
-        default: '下一页'
-    },
-    /** 总页数只有一页时是否隐藏 */
-    hideIfOnePage: {
-        type: Boolean,
-        default: true
-    },
-    /** 定义需要用到的外部样式 */
-    customStyle: {
-        type: Object as PropType<CSSProperties>
-    }
-}
-
-export default paginationProps
+import type { CSSProperties, PropType } from 'vue'
+
+const paginationProps = {
+    /** 当前页 */
+    modelValue: {
+        type: Number,
+        default: 1
+    },
+    /** 总页数，如果有total，则优先使用total计算页数 */
+    totalPage: {
+        type: Number,
+        default: 1
+    },
+    /** 是否展示分页为Icon图标 */
+    showIcon: {
+        type: Boolean,
+        default: false
+    },
+    /** 是否展示总条数 */
+    showMessage: {
+        type: Boolean,
+        default: false
+    },
+    /** 总条数 */
+    total: {
+        type: Number,
+        default: 0
+    },
+    /** 每页条数 */
+    pageSize: {
+        type: Number,
+        default: 10
+    },
+    /** 上一页文本 */
+    prevText: {
+        type: String,
+        default: '上一页'
+    },
+    /** 下一页文本 */
+    nextText: {
+        type: String,
+        default: '下一页'
+    },
+    /** 总页数只有一页时是否隐藏 */
+    hideIfOnePage: {
+        type: Boolean,
+        default: true
+    },
+    /** 定义需要用到的外部样式 */
+    customStyle: {
+        type: Object as PropType<CSSProperties>
+    }
+}
+
+export default paginationProps

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

@@ -1,10 +1,10 @@
-type PaginationVo = {
-    value: number
-}
-
-export interface IPaginationEmits {
-    /** 改变值触发 */
-    (e: 'change', param: PaginationVo): void
-    /** 改变值触发 */
-    (e: 'update:modelValue', value: PaginationVo['value']): void
-}
+type PaginationVo = {
+    value: number
+}
+
+export interface IPaginationEmits {
+    /** 改变值触发 */
+    (e: 'change', param: PaginationVo): void
+    /** 改变值触发 */
+    (e: 'update:modelValue', value: PaginationVo['value']): void
+}

package/components/hy-picker/hy-picker.vue

@@ -218,11 +218,13 @@ const inputLabelValue = computed((): string => {
         innerColumns.value.map((ite, i) => {
             res.push(
                 ...innerColumns.value[i]?.filter((item) => {
-                    return isArray(props.modelValue) && props.modelValue.includes(item['id'])
+                    return (
+                        isArray(props.modelValue) && props.modelValue.includes(item[props.valueKey])
+                    )
                 })
             )
         })
-        res = res.map((item) => item[props.keyName])
+        res = res.map((item) => item[props.labelKey])
         return res.join(props.separator)
     } else {
         //用户确定的值，才显示到输入框
@@ -243,7 +245,7 @@ const inputValue = computed(() => {
     if (items[0] && Object.prototype.toString.call(items[0]) === '[object Object]') {
         //对象数组返回id集合
         items.forEach((element) => {
-            res.push(element && element['id'])
+            res.push(element && element[props.valueKey])
         })
     } else {
         //非对象数组返回元素集合
@@ -267,8 +269,8 @@ const onShowByClickInput = () => {
  * 获取item需要显示的文字，判别为对象还是文本
  * */
 const getItemText = (item: any) => {
-    if (Object.prototype.toString.call(item) === '[object Object]' && props.keyName) {
-        return item[props.keyName]
+    if (Object.prototype.toString.call(item) === '[object Object]' && props.labelKey) {
+        return item[props.labelKey]
     } else {
         return item
     }

package/components/hy-picker/props.ts

@@ -68,9 +68,14 @@ const pickerProps = {
         default: 5
     },
     /** 显示到选项对象中，需要展示的属性键名 */
-    keyName: {
+    labelKey: {
         type: String,
-        default: 'text'
+        default: 'label'
+    },
+    /** 显示到选项对象中，需要展示的属性键名 */
+    valueKey: {
+        type: String,
+        default: 'value'
     },
     /** 是否允许点击遮罩关闭选择器 */
     closeOnClickOverlay: {

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

@@ -1,12 +1,16 @@
-export interface PickerColumnVo extends AnyObject {
+export interface PickerColumnVo {
     /**
-     * @description id必填
+     * value必填,回填根据这个值判断
      * */
-    id: string
+    value: string | number
     /**
-     * @description 显示文本
+     * 显示文本
      * */
-    text?: string
+    label?: string
+    /**
+     * 任意数据
+     * */
+    [key: string]: any
 }
 
 export type SelectValueVo = {