dpzvc3-ui 3.1.4 → 3.1.5
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/dist/types/index.d.ts
CHANGED
|
@@ -66,10 +66,10 @@ export type { ProgressProps } from './components/progress/types'
|
|
|
66
66
|
export { default as DpLoadMore } from './components/loadMore'
|
|
67
67
|
export type { LoadmoreProps } from './components/loadMore/types'
|
|
68
68
|
|
|
69
|
-
export {
|
|
69
|
+
export { CheckBox, CheckBoxGroup } from './components/checkBox'
|
|
70
70
|
export type { CheckBoxProps, CheckBoxGroupProps } from './components/checkBox/types'
|
|
71
71
|
|
|
72
|
-
export {
|
|
72
|
+
export { RadioBox, RadioBoxGroup } from './components/radioBox'
|
|
73
73
|
export type { RadioBoxProps, RadioGroupProps } from './components/radioBox/types'
|
|
74
74
|
|
|
75
75
|
/* ----------------------------------
|
package/package.json
CHANGED
package/src/index.d.ts
CHANGED
|
@@ -66,10 +66,10 @@ export type { ProgressProps } from './components/progress/types'
|
|
|
66
66
|
export { default as DpLoadMore } from './components/loadMore'
|
|
67
67
|
export type { LoadmoreProps } from './components/loadMore/types'
|
|
68
68
|
|
|
69
|
-
export {
|
|
69
|
+
export { CheckBox, CheckBoxGroup } from './components/checkBox'
|
|
70
70
|
export type { CheckBoxProps, CheckBoxGroupProps } from './components/checkBox/types'
|
|
71
71
|
|
|
72
|
-
export {
|
|
72
|
+
export { RadioBox, RadioBoxGroup } from './components/radioBox'
|
|
73
73
|
export type { RadioBoxProps, RadioGroupProps } from './components/radioBox/types'
|
|
74
74
|
|
|
75
75
|
/* ----------------------------------
|
package/src/types/index.d.ts
CHANGED
|
@@ -1,127 +1,127 @@
|
|
|
1
|
-
// src/types/index.d.ts
|
|
2
|
-
|
|
3
|
-
/* ----------------------------------
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
export { default as Badge } from '../components/badge'
|
|
7
|
-
export type { BadgeProps } from '../components/badge/types'
|
|
8
|
-
|
|
9
|
-
export { default as Popup } from '../components/popup'
|
|
10
|
-
export type { PopupProps } from '../components/popup/types'
|
|
11
|
-
export { default as ActionSheet } from '../components/actionSheet'
|
|
12
|
-
export type { ActionSheetProps } from '../components/actionSheet/types'
|
|
13
|
-
|
|
14
|
-
export { default as Card } from '../components/card'
|
|
15
|
-
export type { CardProps } from '../components/card/types'
|
|
16
|
-
|
|
17
|
-
export { default as Rater } from '../components/rater'
|
|
18
|
-
export type { RaterProps } from '../components/rater/types'
|
|
19
|
-
|
|
20
|
-
export { default as Cell } from '../components/cell'
|
|
21
|
-
export type { CellProps } from '../components/cell/types'
|
|
22
|
-
|
|
23
|
-
export { default as CellSwipe } from '../components/cellSwipe'
|
|
24
|
-
export type { CellSwipeProps } from '../components/cellSwipe/types'
|
|
25
|
-
export { default as DpHeader } from '../components/header'
|
|
26
|
-
export type { HeaderProps } from '../components/header/types'
|
|
27
|
-
|
|
28
|
-
export { default as Spinner } from '../components/spinner'
|
|
29
|
-
export type { SpinnerProps } from '../components/spinner/types'
|
|
30
|
-
|
|
31
|
-
export { default as Swipe } from '../components/swipe'
|
|
32
|
-
export type { SwipeProps } from '../components/swipe/types'
|
|
33
|
-
|
|
34
|
-
export { default as DpButton } from '../components/button'
|
|
35
|
-
export type { ButtonProps } from '../components/button/types'
|
|
36
|
-
|
|
37
|
-
export { default as Picker } from '../components/picker'
|
|
38
|
-
export type { PickerProps } from '../components/picker/types'
|
|
39
|
-
export { default as SwitchBar } from '../components/switchbar'
|
|
40
|
-
export type { SwitchBarProps } from '../components/switchbar/types'
|
|
41
|
-
|
|
42
|
-
export { default as Tab } from '../components/tab'
|
|
43
|
-
export type { TabProps } from '../components/tab/types'
|
|
44
|
-
|
|
45
|
-
export { default as TextBar } from '../components/Text'
|
|
46
|
-
export type { TextBarProps } from '../components/Text/types'
|
|
47
|
-
|
|
48
|
-
export { default as Number } from '../components/number'
|
|
49
|
-
export type { NumberProps } from '../components/number/types'
|
|
50
|
-
|
|
51
|
-
export { default as ToTop } from '../components/toTop'
|
|
52
|
-
export type { ToTopProps } from '../components/toTop/types'
|
|
53
|
-
export { default as Upload } from '../components/upload'
|
|
54
|
-
export type { UploadProps } from '../components/upload/types'
|
|
55
|
-
|
|
56
|
-
export { default as SlideBar } from '../components/slideBar'
|
|
57
|
-
export type { SlideBarProps } from '../components/slideBar/types'
|
|
58
|
-
|
|
59
|
-
export { default as DpProgress } from '../components/progress'
|
|
60
|
-
export type { ProgressProps } from '../components/progress/types'
|
|
61
|
-
|
|
62
|
-
export { default as DpLoadMore } from '../components/loadMore'
|
|
63
|
-
export type { LoadmoreProps } from '../components/loadMore/types'
|
|
64
|
-
|
|
65
|
-
export {
|
|
66
|
-
export type { CheckBoxProps, CheckBoxGroupProps } from '../components/checkBox/types'
|
|
67
|
-
|
|
68
|
-
export {
|
|
69
|
-
export type { RadioBoxProps, RadioGroupProps } from '../components/radioBox/types'
|
|
70
|
-
|
|
71
|
-
/* ----------------------------------
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
import type { App } from 'vue'
|
|
75
|
-
import type { ModalInstance } from '../components/modal/types'
|
|
76
|
-
import type { MessageInstance } from '../components/message/types'
|
|
77
|
-
import type { IndicatorInstance } from '../components/Indicator/types'
|
|
78
|
-
import type { PromptInstance } from '../components/prompt/types'
|
|
79
|
-
|
|
80
|
-
declare module 'vue' {
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
}
|
|
116
|
-
|
|
117
|
-
/* ----------------------------------
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
import type { Plugin } from 'vue'
|
|
121
|
-
export const Dpzvc3UI: Plugin
|
|
122
|
-
export default Dpzvc3UI
|
|
123
|
-
|
|
124
|
-
/* ----------------------------------
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
export {}
|
|
1
|
+
// // src/types/index.d.ts
|
|
2
|
+
|
|
3
|
+
// /* ----------------------------------
|
|
4
|
+
// * 1️⃣ 按需导出组件 & props（给 TS import 用）
|
|
5
|
+
// * ---------------------------------- */
|
|
6
|
+
// export { default as Badge } from '../components/badge'
|
|
7
|
+
// export type { BadgeProps } from '../components/badge/types'
|
|
8
|
+
|
|
9
|
+
// export { default as Popup } from '../components/popup'
|
|
10
|
+
// export type { PopupProps } from '../components/popup/types'
|
|
11
|
+
// export { default as ActionSheet } from '../components/actionSheet'
|
|
12
|
+
// export type { ActionSheetProps } from '../components/actionSheet/types'
|
|
13
|
+
|
|
14
|
+
// export { default as Card } from '../components/card'
|
|
15
|
+
// export type { CardProps } from '../components/card/types'
|
|
16
|
+
|
|
17
|
+
// export { default as Rater } from '../components/rater'
|
|
18
|
+
// export type { RaterProps } from '../components/rater/types'
|
|
19
|
+
|
|
20
|
+
// export { default as Cell } from '../components/cell'
|
|
21
|
+
// export type { CellProps } from '../components/cell/types'
|
|
22
|
+
|
|
23
|
+
// export { default as CellSwipe } from '../components/cellSwipe'
|
|
24
|
+
// export type { CellSwipeProps } from '../components/cellSwipe/types'
|
|
25
|
+
// export { default as DpHeader } from '../components/header'
|
|
26
|
+
// export type { HeaderProps } from '../components/header/types'
|
|
27
|
+
|
|
28
|
+
// export { default as Spinner } from '../components/spinner'
|
|
29
|
+
// export type { SpinnerProps } from '../components/spinner/types'
|
|
30
|
+
|
|
31
|
+
// export { default as Swipe } from '../components/swipe'
|
|
32
|
+
// export type { SwipeProps } from '../components/swipe/types'
|
|
33
|
+
|
|
34
|
+
// export { default as DpButton } from '../components/button'
|
|
35
|
+
// export type { ButtonProps } from '../components/button/types'
|
|
36
|
+
|
|
37
|
+
// export { default as Picker } from '../components/picker'
|
|
38
|
+
// export type { PickerProps } from '../components/picker/types'
|
|
39
|
+
// export { default as SwitchBar } from '../components/switchbar'
|
|
40
|
+
// export type { SwitchBarProps } from '../components/switchbar/types'
|
|
41
|
+
|
|
42
|
+
// export { default as Tab } from '../components/tab'
|
|
43
|
+
// export type { TabProps } from '../components/tab/types'
|
|
44
|
+
|
|
45
|
+
// export { default as TextBar } from '../components/Text'
|
|
46
|
+
// export type { TextBarProps } from '../components/Text/types'
|
|
47
|
+
|
|
48
|
+
// export { default as Number } from '../components/number'
|
|
49
|
+
// export type { NumberProps } from '../components/number/types'
|
|
50
|
+
|
|
51
|
+
// export { default as ToTop } from '../components/toTop'
|
|
52
|
+
// export type { ToTopProps } from '../components/toTop/types'
|
|
53
|
+
// export { default as Upload } from '../components/upload'
|
|
54
|
+
// export type { UploadProps } from '../components/upload/types'
|
|
55
|
+
|
|
56
|
+
// export { default as SlideBar } from '../components/slideBar'
|
|
57
|
+
// export type { SlideBarProps } from '../components/slideBar/types'
|
|
58
|
+
|
|
59
|
+
// export { default as DpProgress } from '../components/progress'
|
|
60
|
+
// export type { ProgressProps } from '../components/progress/types'
|
|
61
|
+
|
|
62
|
+
// export { default as DpLoadMore } from '../components/loadMore'
|
|
63
|
+
// export type { LoadmoreProps } from '../components/loadMore/types'
|
|
64
|
+
|
|
65
|
+
// export { CheckBox, CheckBoxGroup } from '../components/checkBox'
|
|
66
|
+
// export type { CheckBoxProps, CheckBoxGroupProps } from '../components/checkBox/types'
|
|
67
|
+
|
|
68
|
+
// export { RadioBox, RadioBoxGroup } from '../components/radioBox'
|
|
69
|
+
// export type { RadioBoxProps, RadioGroupProps } from '../components/radioBox/types'
|
|
70
|
+
|
|
71
|
+
// /* ----------------------------------
|
|
72
|
+
// * 2️⃣ 全局组件声明（给 <template> 用）
|
|
73
|
+
// * ---------------------------------- */
|
|
74
|
+
// import type { App } from 'vue'
|
|
75
|
+
// import type { ModalInstance } from '../components/modal/types'
|
|
76
|
+
// import type { MessageInstance } from '../components/message/types'
|
|
77
|
+
// import type { IndicatorInstance } from '../components/Indicator/types'
|
|
78
|
+
// import type { PromptInstance } from '../components/prompt/types'
|
|
79
|
+
|
|
80
|
+
// declare module 'vue' {
|
|
81
|
+
// interface ComponentCustomProperties {
|
|
82
|
+
// $Modal: ModalInstance
|
|
83
|
+
// $Message: MessageInstance
|
|
84
|
+
// $Indicator: IndicatorInstance
|
|
85
|
+
// $Prompt: PromptInstance
|
|
86
|
+
// }
|
|
87
|
+
|
|
88
|
+
// export interface GlobalComponents {
|
|
89
|
+
// Badge: typeof import('../components/badge')['default']
|
|
90
|
+
// Popup: typeof import('../components/popup')['default']
|
|
91
|
+
// ActionSheet: typeof import('../components/actionSheet')['default']
|
|
92
|
+
// Card: typeof import('../components/card')['default']
|
|
93
|
+
// Rater: typeof import('../components/rater')['default']
|
|
94
|
+
// Cell: typeof import('../components/cell')['default']
|
|
95
|
+
// CellSwipe: typeof import('../components/cellSwipe')['default']
|
|
96
|
+
// DpHeader: typeof import('../components/header')['default']
|
|
97
|
+
// Spinner: typeof import('../components/spinner')['default']
|
|
98
|
+
// Swipe: typeof import('../components/swipe')['default']
|
|
99
|
+
// DpButton: typeof import('../components/button')['default']
|
|
100
|
+
// Picker: typeof import('../components/picker')['default']
|
|
101
|
+
// SwitchBar: typeof import('../components/switchbar')['default']
|
|
102
|
+
// Tab: typeof import('../components/tab')['default']
|
|
103
|
+
// TextBar: typeof import('../components/Text')['default']
|
|
104
|
+
// Number: typeof import('../components/number')['default']
|
|
105
|
+
// ToTop: typeof import('../components/toTop')['default']
|
|
106
|
+
// Upload: typeof import('../components/upload')['default']
|
|
107
|
+
// SlideBar: typeof import('../components/slideBar')['default']
|
|
108
|
+
// DpProgress: typeof import('../components/progress')['default']
|
|
109
|
+
// DpLoadMore: typeof import('../components/loadMore')['default']
|
|
110
|
+
// CheckBox: typeof import('../components/checkBox')['CheckBox']
|
|
111
|
+
// CheckBoxGroup: typeof import('../components/checkBox')['CheckBoxGroup']
|
|
112
|
+
// RadioBox: typeof import('../components/radioBox')['RadioBox']
|
|
113
|
+
// RadioBoxGroup: typeof import('../components/radioBox')['RadioBoxGroup']
|
|
114
|
+
// }
|
|
115
|
+
// }
|
|
116
|
+
|
|
117
|
+
// /* ----------------------------------
|
|
118
|
+
// * 3️⃣ 默认导出整个组件库为 Vue 插件
|
|
119
|
+
// * ---------------------------------- */
|
|
120
|
+
// import type { Plugin } from 'vue'
|
|
121
|
+
// export const Dpzvc3UI: Plugin
|
|
122
|
+
// export default Dpzvc3UI
|
|
123
|
+
|
|
124
|
+
// /* ----------------------------------
|
|
125
|
+
// * 4️⃣ 保证这是 module
|
|
126
|
+
// * ---------------------------------- */
|
|
127
|
+
// export {}
|
package/src/views/CheckBox.vue
CHANGED
|
@@ -38,11 +38,11 @@
|
|
|
38
38
|
|
|
39
39
|
<script lang="ts">
|
|
40
40
|
import { defineComponent, ref } from 'vue'
|
|
41
|
-
|
|
41
|
+
import { CheckBox, CheckBoxGroup } from '../components/checkBox'
|
|
42
42
|
import type { CheckBoxProps, CheckBoxGroupProps } from '../components/checkBox/types'
|
|
43
43
|
export default defineComponent({
|
|
44
44
|
name: 'ViewCheckBox',
|
|
45
|
-
|
|
45
|
+
components: { CheckBox, CheckBoxGroup },
|
|
46
46
|
setup () {
|
|
47
47
|
const data = ref<CheckBoxGroupProps['modelValue']>(['中国'])
|
|
48
48
|
const checked = ref<CheckBoxProps['modelValue']>(false)
|
|
@@ -1,66 +0,0 @@
|
|
|
1
|
-
<template>
|
|
2
|
-
<div :class="classes">
|
|
3
|
-
<slot />
|
|
4
|
-
</div>
|
|
5
|
-
</template>
|
|
6
|
-
|
|
7
|
-
<script>
|
|
8
|
-
import { defineComponent, computed, watch, provide, ref } from 'vue'
|
|
9
|
-
|
|
10
|
-
const prefixCls = 'dpzvc3-radioBoxGroup'
|
|
11
|
-
|
|
12
|
-
export default defineComponent({
|
|
13
|
-
name: 'RadioBoxGroup',
|
|
14
|
-
props: {
|
|
15
|
-
modelValue: {
|
|
16
|
-
type: [String, Boolean, Number],
|
|
17
|
-
default: ''
|
|
18
|
-
},
|
|
19
|
-
vertical: {
|
|
20
|
-
type: Boolean,
|
|
21
|
-
default: false
|
|
22
|
-
}
|
|
23
|
-
},
|
|
24
|
-
emits: ['update:modelValue', 'on-change', 'on-form-change'],
|
|
25
|
-
setup (props, { emit }) {
|
|
26
|
-
const currentValue = ref(props.modelValue)
|
|
27
|
-
|
|
28
|
-
// 提供给子组件
|
|
29
|
-
provide('radioBoxGroup', {
|
|
30
|
-
currentValue,
|
|
31
|
-
change: (val) => {
|
|
32
|
-
currentValue.value = val
|
|
33
|
-
emit('update:modelValue', val)
|
|
34
|
-
emit('on-change', val)
|
|
35
|
-
emit('on-form-change', val)
|
|
36
|
-
}
|
|
37
|
-
})
|
|
38
|
-
|
|
39
|
-
// 监听外部 v-model 改变
|
|
40
|
-
watch(
|
|
41
|
-
() => props.modelValue,
|
|
42
|
-
(val) => {
|
|
43
|
-
currentValue.value = val
|
|
44
|
-
}
|
|
45
|
-
)
|
|
46
|
-
|
|
47
|
-
const classes = computed(() => [
|
|
48
|
-
prefixCls,
|
|
49
|
-
{ [`${prefixCls}-vertical`]: props.vertical }
|
|
50
|
-
])
|
|
51
|
-
|
|
52
|
-
return {
|
|
53
|
-
classes,
|
|
54
|
-
currentValue
|
|
55
|
-
}
|
|
56
|
-
}
|
|
57
|
-
})
|
|
58
|
-
</script>
|
|
59
|
-
|
|
60
|
-
<style scoped>
|
|
61
|
-
.dpzvc3-radioBoxGroup-vertical {
|
|
62
|
-
display: flex;
|
|
63
|
-
justify-content: center;
|
|
64
|
-
flex-direction: column;
|
|
65
|
-
}
|
|
66
|
-
</style>
|
|
@@ -1,89 +0,0 @@
|
|
|
1
|
-
<template>
|
|
2
|
-
<label :class="classes">
|
|
3
|
-
<span :class="wrapperClasses">
|
|
4
|
-
<span :class="innerClasses">
|
|
5
|
-
<input
|
|
6
|
-
type="radio"
|
|
7
|
-
:disabled="disable"
|
|
8
|
-
:checked="isChecked"
|
|
9
|
-
:class="inputClass"
|
|
10
|
-
@change="handleChange"
|
|
11
|
-
>
|
|
12
|
-
</span>
|
|
13
|
-
</span>
|
|
14
|
-
<slot v-if="show"><span ref="slotEl">{{ label }}</span></slot>
|
|
15
|
-
</label>
|
|
16
|
-
</template>
|
|
17
|
-
|
|
18
|
-
<script>
|
|
19
|
-
import { defineComponent, inject, computed, ref, onMounted } from 'vue'
|
|
20
|
-
|
|
21
|
-
const prefixCls = 'dpzvc3-radiobox'
|
|
22
|
-
|
|
23
|
-
export default defineComponent({
|
|
24
|
-
name: 'RadioBox',
|
|
25
|
-
props: {
|
|
26
|
-
label: { type: [String, Number], required: true },
|
|
27
|
-
modelValue: { type: Boolean, default: false },
|
|
28
|
-
disable: { type: Boolean, default: false }
|
|
29
|
-
},
|
|
30
|
-
emits: ['update:modelValue', 'on-change'],
|
|
31
|
-
setup (props, { emit }) {
|
|
32
|
-
const slotEl = ref(null)
|
|
33
|
-
const show = ref(true)
|
|
34
|
-
const group = inject('radioBoxGroup', null) // 如果有group则为对象，没有则为null
|
|
35
|
-
|
|
36
|
-
const isChecked = computed(() => {
|
|
37
|
-
if (group) {
|
|
38
|
-
return group.currentValue.value === props.label
|
|
39
|
-
} else {
|
|
40
|
-
return props.modelValue
|
|
41
|
-
}
|
|
42
|
-
})
|
|
43
|
-
|
|
44
|
-
const classes = computed(() => [prefixCls])
|
|
45
|
-
const wrapperClasses = computed(() => [
|
|
46
|
-
`${prefixCls}-wrapper`,
|
|
47
|
-
{
|
|
48
|
-
[`${prefixCls}-checked`]: isChecked.value,
|
|
49
|
-
[`${prefixCls}-disable`]: props.disable
|
|
50
|
-
}
|
|
51
|
-
])
|
|
52
|
-
const innerClasses = computed(() => [`${prefixCls}-inner`])
|
|
53
|
-
const inputClass = computed(() => [`${prefixCls}-input`])
|
|
54
|
-
|
|
55
|
-
function handleChange (e) {
|
|
56
|
-
if (props.disable) return
|
|
57
|
-
const checked = e.target.checked
|
|
58
|
-
|
|
59
|
-
if (group) {
|
|
60
|
-
group.change(props.label)
|
|
61
|
-
} else {
|
|
62
|
-
// console.log(checked, 'ddadda')
|
|
63
|
-
emit('update:modelValue', checked)
|
|
64
|
-
emit('on-change', checked)
|
|
65
|
-
}
|
|
66
|
-
}
|
|
67
|
-
|
|
68
|
-
onMounted(() => {
|
|
69
|
-
if (!group) {
|
|
70
|
-
// 判断是否有 slot 内容
|
|
71
|
-
if (slotEl.value && !slotEl.value.innerHTML) {
|
|
72
|
-
show.value = false
|
|
73
|
-
}
|
|
74
|
-
}
|
|
75
|
-
})
|
|
76
|
-
|
|
77
|
-
return {
|
|
78
|
-
classes,
|
|
79
|
-
wrapperClasses,
|
|
80
|
-
innerClasses,
|
|
81
|
-
inputClass,
|
|
82
|
-
isChecked,
|
|
83
|
-
handleChange,
|
|
84
|
-
show,
|
|
85
|
-
slotEl
|
|
86
|
-
}
|
|
87
|
-
}
|
|
88
|
-
})
|
|
89
|
-
</script>
|