hy-app 0.5.3 → 0.5.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components/hy-avatar/hy-avatar.vue +4 -3
- package/components/hy-badge/hy-badge.vue +3 -3
- package/components/hy-badge/index.scss +0 -1
- package/components/hy-badge/props.ts +6 -1
- package/components/hy-coupon/index.scss +7 -2
- package/components/hy-coupon/props.ts +7 -4
- package/components/hy-coupon/typing.d.ts +1 -1
- package/components/hy-datetime-picker/props.ts +1 -3
- package/components/hy-folding-panel/props.ts +1 -1
- package/components/hy-folding-panel/typing.d.ts +0 -38
- package/components/hy-folding-panel-item/hy-folding-panel-item.vue +2 -3
- package/components/hy-folding-panel-item/typing.d.ts +14 -0
- package/components/hy-icon/hy-icon.vue +3 -8
- package/components/hy-list/props.ts +1 -1
- package/components/hy-notice-bar/typing.d.ts +2 -0
- package/components/hy-popup/hy-popup.vue +0 -1
- package/components/hy-qrcode/hy-qrcode.vue +70 -4
- package/components/hy-qrcode/index.scss +3 -4
- package/components/hy-qrcode/qrcode.js +138 -0
- package/components/hy-signature/hy-signature.vue +25 -22
- package/components/hy-signature/index.scss +0 -4
- package/components/hy-tabbar/hy-tabbar.vue +137 -0
- package/components/{hy-tabBar → hy-tabbar}/index.scss +30 -30
- package/components/hy-tabbar/props.ts +59 -0
- package/components/hy-tabbar/typing.d.ts +61 -0
- package/components/hy-tabbar-group/README.md +326 -0
- package/components/hy-tabbar-group/hy-tabbar-group.vue +87 -0
- package/components/hy-tabbar-group/index.scss +57 -0
- package/components/hy-tabbar-group/props.ts +78 -0
- package/components/hy-tabbar-group/typing.ts +16 -0
- package/components/hy-tabbar-item/hy-tabbar-item.vue +103 -0
- package/components/hy-tabbar-item/index.scss +43 -0
- package/components/hy-tabbar-item/props.ts +24 -0
- package/components/hy-tabbar-item/typing.ts +22 -0
- package/components/hy-tag/props.ts +8 -2
- package/components/hy-text/props.ts +8 -2
- package/components/hy-textarea/props.ts +4 -1
- package/components/hy-tooltip/props.ts +1 -3
- package/components/hy-upload/props.ts +1 -1
- package/components/index.ts +177 -177
- package/global.d.ts +87 -85
- package/package.json +2 -2
- package/web-types.json +1 -1
- package/components/hy-tabBar/hy-tabBar.vue +0 -109
- package/components/hy-tabBar/props.ts +0 -13
- package/components/hy-tabBar/typing.d.ts +0 -54
|
@@ -1,109 +0,0 @@
|
|
|
1
|
-
<template>
|
|
2
|
-
<view class="hy-tabBar--placeholder"></view>
|
|
3
|
-
<view class="hy-tabBar">
|
|
4
|
-
<view class="hy-tabBar--box" :style="{ backgroundColor: barBgColor }">
|
|
5
|
-
<view class="hy-tabBar--container">
|
|
6
|
-
<view
|
|
7
|
-
:class="[
|
|
8
|
-
'hy-tabBar--container__item',
|
|
9
|
-
'list',
|
|
10
|
-
current === i ? 'is-active' : ''
|
|
11
|
-
]"
|
|
12
|
-
v-for="(item, i) in list"
|
|
13
|
-
:key="i"
|
|
14
|
-
@click="checkItem(i)"
|
|
15
|
-
>
|
|
16
|
-
<view class="hy-tabBar--container__item--bar">
|
|
17
|
-
<view class="icon">
|
|
18
|
-
<hy-badge
|
|
19
|
-
:value="item?.badge"
|
|
20
|
-
absolute
|
|
21
|
-
:offset="[-13, 25]"
|
|
22
|
-
:max="badge?.max"
|
|
23
|
-
:is-dot="badge?.isDot"
|
|
24
|
-
:inverted="badge?.inverted"
|
|
25
|
-
:bg-color="badge?.bgColor"
|
|
26
|
-
:type="badge?.type"
|
|
27
|
-
:number-type="badge?.numberType"
|
|
28
|
-
:shape="badge?.shape"
|
|
29
|
-
:show-zero="badge?.showZero"
|
|
30
|
-
:show="!!item?.badge"
|
|
31
|
-
></hy-badge>
|
|
32
|
-
<hy-icon :name="item.icon" :color="color" size="25"></hy-icon>
|
|
33
|
-
</view>
|
|
34
|
-
<text class="text" :style="[{ color: color }]">{{ item.name }}</text>
|
|
35
|
-
<text class="circle"></text>
|
|
36
|
-
</view>
|
|
37
|
-
</view>
|
|
38
|
-
<view
|
|
39
|
-
class="hy-tabBar--indicator"
|
|
40
|
-
:style="{
|
|
41
|
-
'--num': `translateX(calc(((100vw - 110rpx - ${list.length} * 70rpx) / ${list.length - 1} + 70rpx) * ${current}))`,
|
|
42
|
-
background: activeColor
|
|
43
|
-
}"
|
|
44
|
-
></view>
|
|
45
|
-
</view>
|
|
46
|
-
</view>
|
|
47
|
-
</view>
|
|
48
|
-
</template>
|
|
49
|
-
|
|
50
|
-
<script lang="ts">
|
|
51
|
-
export default {
|
|
52
|
-
name: 'hy-switch',
|
|
53
|
-
options: {
|
|
54
|
-
addGlobalClass: true,
|
|
55
|
-
virtualHost: true,
|
|
56
|
-
styleIsolation: 'shared'
|
|
57
|
-
}
|
|
58
|
-
}
|
|
59
|
-
</script>
|
|
60
|
-
|
|
61
|
-
<script setup lang="ts">
|
|
62
|
-
import { ref, toRefs, watch } from 'vue'
|
|
63
|
-
import defaultProps from './props'
|
|
64
|
-
import type IProps from './typing'
|
|
65
|
-
|
|
66
|
-
// 组件
|
|
67
|
-
import HyIcon from '../hy-icon/hy-icon.vue'
|
|
68
|
-
import HyBadge from '../hy-badge/hy-badge.vue'
|
|
69
|
-
|
|
70
|
-
/**
|
|
71
|
-
* 一般用于导航轮播,广告展示等场景,可开箱即用
|
|
72
|
-
* @displayName hy-swiper
|
|
73
|
-
*/
|
|
74
|
-
defineOptions({})
|
|
75
|
-
|
|
76
|
-
const props = withDefaults(defineProps<IProps>(), defaultProps)
|
|
77
|
-
const { modelValue, baseBgColor } = toRefs(props)
|
|
78
|
-
const emit = defineEmits(['clickTab'])
|
|
79
|
-
|
|
80
|
-
const baseBackgroundColor = baseBgColor.value ? baseBgColor.value : 'var(--hy-background)'
|
|
81
|
-
const current = ref(0)
|
|
82
|
-
watch(
|
|
83
|
-
() => modelValue.value,
|
|
84
|
-
(newVal) => {
|
|
85
|
-
current.value = newVal
|
|
86
|
-
}
|
|
87
|
-
)
|
|
88
|
-
|
|
89
|
-
const checkItem = (index: number) => {
|
|
90
|
-
current.value = index
|
|
91
|
-
emit('clickTab', index)
|
|
92
|
-
}
|
|
93
|
-
</script>
|
|
94
|
-
|
|
95
|
-
<style lang="scss" scoped>
|
|
96
|
-
@import './index.scss';
|
|
97
|
-
.hy-tabBar {
|
|
98
|
-
background: v-bind(baseBackgroundColor);
|
|
99
|
-
&--indicator {
|
|
100
|
-
border: 12rpx solid v-bind(baseBackgroundColor);
|
|
101
|
-
&::before {
|
|
102
|
-
box-shadow: 1px -15rpx 0 v-bind(baseBackgroundColor);
|
|
103
|
-
}
|
|
104
|
-
&::after {
|
|
105
|
-
box-shadow: -1px -15rpx 0 v-bind(baseBackgroundColor);
|
|
106
|
-
}
|
|
107
|
-
}
|
|
108
|
-
}
|
|
109
|
-
</style>
|
|
@@ -1,54 +0,0 @@
|
|
|
1
|
-
import type HyBadgeProps from "../hy-badge/typing";
|
|
2
|
-
|
|
3
|
-
export interface TabListVo {
|
|
4
|
-
/**
|
|
5
|
-
* @description 标题
|
|
6
|
-
* */
|
|
7
|
-
name: string;
|
|
8
|
-
/**
|
|
9
|
-
* @description icon图标或者图片
|
|
10
|
-
* */
|
|
11
|
-
icon: string;
|
|
12
|
-
/**
|
|
13
|
-
* @description 徽标值
|
|
14
|
-
* */
|
|
15
|
-
badge?: number;
|
|
16
|
-
}
|
|
17
|
-
|
|
18
|
-
export default interface HyTabBarProps {
|
|
19
|
-
/**
|
|
20
|
-
* @description tab当前值
|
|
21
|
-
* */
|
|
22
|
-
modelValue: number;
|
|
23
|
-
/**
|
|
24
|
-
* @description 导航栏值
|
|
25
|
-
* {
|
|
26
|
-
* name: 中文名,
|
|
27
|
-
* icon: uview-plus里面的矢量图标库
|
|
28
|
-
* }
|
|
29
|
-
* */
|
|
30
|
-
list: TabListVo[];
|
|
31
|
-
/**
|
|
32
|
-
* @description 文字颜色
|
|
33
|
-
* */
|
|
34
|
-
color?: string;
|
|
35
|
-
/**
|
|
36
|
-
* @description 底部导航栏底部背景颜色(颜色设置必须要和页面背景颜色一样,才有重合感觉)
|
|
37
|
-
* 支持渐变色--linear-gradient(155deg, #192b6e, #a6307c)
|
|
38
|
-
* */
|
|
39
|
-
baseBgColor?: string;
|
|
40
|
-
/**
|
|
41
|
-
* @description 底部导航栏背景颜色
|
|
42
|
-
* 支持渐变色--linear-gradient(155deg, #192b6e, #a6307c)
|
|
43
|
-
* */
|
|
44
|
-
barBgColor?: string;
|
|
45
|
-
/**
|
|
46
|
-
* @description 点击突出按钮的背景颜色
|
|
47
|
-
* 支持渐变色--linear-gradient(0deg, #ffa576,#0951eb)
|
|
48
|
-
* */
|
|
49
|
-
activeColor?: string;
|
|
50
|
-
/**
|
|
51
|
-
* @description 徽标属性集合
|
|
52
|
-
* */
|
|
53
|
-
badge?: Partial<HyBadgeProps>;
|
|
54
|
-
}
|