thzxcx/uni
1
0
Fork 0
generated from thzxcx/vue3
Code Pull Requests Packages Releases Activity

feat: 卡片等组件

Browse Source
This commit is contained in:
赵劲奉
2023-07-10 19:26:19 +08:00
parent ec2f619775
commit d1e7778644
28 changed files with 1108 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
.storybook/preview.ts
View File

@ -2,13 +2,12 @@
* @Author: zhaojinfeng 121016171@qq.com
* @Date: 2023-06-15 13:22:59
* @LastEditors: zhaojinfeng 121016171@qq.com
* @LastEditTime: 2023-06-21 10:16:53
* @FilePath: \tianheng-design\.storybook\preview.ts
* @LastEditTime: 2023-07-10 17:52:15
* @FilePath: \uni\.storybook\preview.ts
* @Description:
*
*/
import type { Preview } from "@storybook/vue3"
import 'uno.css'
const preview: Preview = {

19
dev/Image.vue Normal file
View File

@ -0,0 +1,19 @@
<!--
* @Author: zhaojinfeng 121016171@qq.com
* @Date: 2023-07-10 14:39:45
* @LastEditors: zhaojinfeng 121016171@qq.com
* @LastEditTime: 2023-07-10 18:34:50
* @FilePath: \uni\dev\image.vue
* @Description:
*
-->
<template>
<img :src="src" :alt="alt">
</template>
<script setup lang="ts" name="Image">
defineProps<{
alt?: string
src?: string
}>()
</script>

8
dev/Text.vue Normal file
View File

@ -0,0 +1,8 @@
<template>
<span>
<slot />
</span>
</template>
<script setup lang="ts" name="Span">
</script>

17
dev/View.vue Normal file
View File

@ -0,0 +1,17 @@
<!--
* @Author: zhaojinfeng 121016171@qq.com
* @Date: 2023-07-10 17:23:35
* @LastEditors: zhaojinfeng 121016171@qq.com
* @LastEditTime: 2023-07-10 18:34:34
* @FilePath: \uni\dev\v iew.vue
* @Description:
*
-->
<template>
<div>
<slot />
</div>
</template>
<script setup lang="ts" name="View">
</script>

1
package.json
View File

@ -83,6 +83,7 @@
"ts-node": "^10.9.1",
"typescript": "4.9.3",
"unocss": "^0.53.1",
"unocss-applet": "^0.5.3",
"unplugin-auto-import": "^0.16.4",
"unplugin-vue-components": "^0.25.1",
"vite": "^4.3.9",

48
packages/card-actions/index.vue Normal file
View File

@ -0,0 +1,48 @@
<!--
* @Author: peerless_hero peerless_hero@outlook.com
* @Date: 2023-07-08 01:44:59
* @LastEditors: peerless_hero peerless_hero@outlook.com
* @LastEditTime: 2023-07-10 04:27:19
* @FilePath: \uni\packages\card-actions\index.vue
* @Description:
*
-->
<template>
<view class="th-card-actions" color="#3b82f6" w-full flex flex-row items-center justify-center overflow-hidden>
<view h-1px bg="#dcdcdc" />
<view
v-for="(action, index) in actions"
:key="index"
active="bg-#f2f7ff"
fs-26
h-106rpx
leh-106
cursor-pointer
flex-grow
text-center
@click="emit('select', index)"
>
{{ action.text }}
<Image v-if="action.icon" :src="action.icon" mode="scaleToFill" />
</view>
</view>
</template>
<script lang="ts" setup name="CardActions">
defineProps<{
actions?: Array<{
/** 按钮文字 */
text?: string
/** 图标 */
icon?: string
}>
}>()
const emit = defineEmits<{
(event: 'select',
/** 单击的索引值 */
index: number): void
}>()
emit('select', 0)
</script>

8
packages/card-item/index.vue Normal file
View File

@ -0,0 +1,8 @@
<template>
<view>
CardItem
</view>
</template>
<script lang="ts" setup name="CardItem">
</script>

8
packages/card-subtitle/index.vue Normal file
View File

@ -0,0 +1,8 @@
<template>
<view>
CardSubtitle
</view>
</template>
<script lang="ts" setup name="CardSubtitle">
</script>

45
packages/card-text/index.vue Normal file
View File

@ -0,0 +1,45 @@
<!--
* @Author: peerless_hero peerless_hero@outlook.com
* @Date: 2023-07-08 01:44:46
* @LastEditors: zhaojinfeng 121016171@qq.com
* @LastEditTime: 2023-07-10 19:07:56
* @FilePath: \uni\packages\card-text\index.vue
* @Description:
*
-->
<template>
<View mx-24rpx break-all mt-16rpx flex>
<View color="#909399" shrink-0>
<slot name="label">
{{ label }}
<template v-if="label">
：
</template>
</slot>
</View>
<View color="#3a3a3a" flex-grow>
<slot name="text">
<Text>
{{ text }}
</Text>
</slot>
</View>
<View>
<View h-48rpx w-128rpx rounded-8rpx border-solid color="#f3a73f" border="#f6ddb8" bg="#fff6e8" border-2rpx fs-24 leh-48 text-center>
试试
</View>
</View>
</View>
</template>
<script lang="ts" setup name="CardText">
withDefaults(defineProps<{
/** 标签文字，可用插槽 */
label?: string
/** 文字，可用插槽 */
text?: string
}>(), {
label: '',
text: '',
})
</script>

21
packages/card-title/index.vue Normal file
View File

@ -0,0 +1,21 @@
<!--
* @Author: zhaojinfeng 121016171@qq.com
* @Date: 2023-07-10 14:39:45
* @LastEditors: zhaojinfeng 121016171@qq.com
* @LastEditTime: 2023-07-10 17:25:59
* @FilePath: \uni\packages\card-title\index.vue
* @Description:
*
-->
<template>
<View fs-30 font-500 leh-42 mx-24rpx mt-24rpx mb-12rpx color="#3A3A3A">
<slot>{{ title }}</slot>
</View>
</template>
<script lang="ts" setup name="CardTitle">
defineProps<{
/** 标题，支持插槽 */
title?: string
}>()
</script>

444
packages/card/index.vue Normal file
View File

@ -0,0 +1,444 @@
<!--
* @Author: peerless_hero peerless_hero@outlook.com
* @Date: 2023-07-08 01:36:19
* @LastEditors: zhaojinfeng 121016171@qq.com
* @LastEditTime: 2023-07-10 18:43:32
* @FilePath: \uni\packages\card\index.vue
* @Description:
*
-->
<template>
<View class="th-card" bg-white rounded-16rpx m-24rpx max-w-702rpx overflow-hidden>
<slot />
<View v-if="noCardActions" h-16rpx />
</View>
</template>
<script lang="ts" setup name="Card">
/** 不存在操作栏组件时，自动增加底部的内边距 */
const noCardActions = useSlots().default().every(({ type }) =>
typeof type !== 'object' || !('name' in type) || type.name !== 'CardActions',
)
</script>
<style lang="scss">
.th-card {
box-shadow: 0px 1px 6px 0px rgba(216,216,216,0.5);
}
.group_1 {
--at-apply: p-24rpx box-shadow: 0px 1px 6px 0px #d8d8d880;
background-color: #ffffff;
border-radius: 8px;
position: relative;
align-self: center;
}
.text_5 {
--at-apply: leh-42 m-24rpx fs-30 overflow-wrap: break-word;
color: #3a3a3a;
font-weight: 500;
text-align: left;
white-space: nowrap;
}
.block_6 {
--at-apply: m-16rpx
}
.text-wrapper_2 {
--at-apply: p-6rpx background-color: rgba(242, 247, 255, 1);
border-radius: 4px;
border: 1px solid rgba(188, 221, 255, 1);
padding: 6rpx 18rpx 4rpx 18rpx;
}
.text_6 {
overflow-wrap: break-word;
color: rgba(41, 121, 255, 1);
font-size: 24rpx;
font-weight: 500;
text-align: left;
white-space: nowrap;
line-height: 34rpx;
}
.text-wrapper_3 {
border-radius: 4px;
border: 1px solid rgba(251, 199, 199, 1);
padding: 6rpx 18rpx 4rpx 18rpx;
}
.text_7 {
overflow-wrap: break-word;
color: rgba(228, 61, 51, 1);
font-size: 24rpx;
font-weight: 500;
text-align: left;
white-space: nowrap;
line-height: 34rpx;
}
.text_8 {
--at-apply: m-16rpx fs-24 leh-36 width: 654rpx;
height: 108rpx;
overflow-wrap: break-word;
color: rgba(106, 106, 106, 1);
font-size: 24rpx;
text-align: left;
line-height: 36rpx;
margin: 16rpx 0 0 24rpx;
}
.text-wrapper_19 {
--at-apply: m-16rpx width: 504rpx;
margin: 16rpx 150rpx 0 24rpx;
}
.text_9 {
--at-apply: fs-24 leh-34 overflow-wrap: break-word;
color: rgba(144, 147, 153, 1);
font-size: 24rpx;
text-align: left;
white-space: nowrap;
line-height: 34rpx;
}
.text_10 {
--at-apply: fs-24 leh-36 height: 34rpx;
overflow-wrap: break-word;
color: rgba(106, 106, 106, 1);
font-size: 24rpx;
text-align: left;
white-space: nowrap;
line-height: 36rpx;
}
.text-wrapper_20 {
--at-apply: m-16rpx width: 244rpx;
margin: 16rpx 410rpx 0 24rpx;
}
.text_11 {
--at-apply: fs-24 leh-36 overflow-wrap: break-word;
color: rgba(144, 147, 153, 1);
font-size: 24rpx;
text-align: left;
white-space: nowrap;
line-height: 34rpx;
}
.text_12 {
--at-apply: fs-24 leh-36 height: 34rpx;
overflow-wrap: break-word;
color: rgba(106, 106, 106, 1);
font-size: 24rpx;
text-align: left;
white-space: nowrap;
line-height: 36rpx;
}
.text-wrapper_21 {
--at-apply: m-16rpx
}
.text_13 {
--at-apply: fs-24 leh-34 overflow-wrap: break-word;
color: rgba(144, 147, 153, 1);
font-size: 24rpx;
text-align: left;
white-space: nowrap;
line-height: 34rpx;
}
.text_14 {
--at-apply: fs-24 leh-34 height: 34rpx;
overflow-wrap: break-word;
color: rgba(106, 106, 106, 1);
font-size: 24rpx;
text-align: left;
white-space: nowrap;
line-height: 36rpx;
}
.block_7 {
width: 602rpx;
margin: 24rpx 76rpx 0 0;
}
.group_2 {
background-color: rgba(242, 247, 255, 1);
border-radius: 0px 0px 0px 8px;
position: relative;
padding: 36rpx 124rpx 34rpx 124rpx;
}
.image-text_9 {
width: 102rpx;
}
.thumbnail_11 {
width: 34rpx;
height: 34rpx;
margin-bottom: 2rpx;
}
.text-group_1 {
--at-apply: fs-26 leh-34 overflow-wrap: break-word;
color: rgba(41, 121, 255, 1);
font-size: 26rpx;
text-align: right;
white-space: nowrap;
line-height: 36rpx;
}
.image_1 {
position: absolute;
left: 24rpx;
top: 0;
width: 654rpx;
height: 2rpx;
}
.image-text_10 {
width: 152rpx;
margin: 36rpx 0 34rpx 0;
}
.thumbnail_12 {
width: 32rpx;
height: 32rpx;
margin: 2rpx 0 2rpx 0;
}
.text-group_2 {
--at-apply: fs-24 leh-36 overflow-wrap: break-word;
color: rgba(41, 121, 255, 1);
font-size: 26rpx;
text-align: left;
white-space: nowrap;
line-height: 36rpx;
}
</style>
<!-- <style lang="scss">
// html {
// font-size: 37.5px;
// }
.group_1 {
box-shadow: 0px 1px 6px 0px rgba(216, 216, 216, 0.5);
background-color: rgba(255, 255, 255, 1);
border-radius: 8px;
position: relative;
height: 7.12rem;
align-self: center;
padding-right: 0.32rem;
}
.text_5 {
overflow-wrap: break-word;
color: rgba(58, 58, 58, 1);
font-size: 0.4rem;
font-weight: 500;
text-align: left;
white-space: nowrap;
line-height: 0.56rem;
// margin: 0.32rem 3.12rem 0 0.32rem;
}
.block_6 {
width: 2.88rem;
margin: 0.214rem 5.84rem 0 0.32rem;
}
.text-wrapper_2 {
background-color: rgba(242, 247, 255, 1);
border-radius: 4px;
border: 1px solid rgba(188, 221, 255, 1);
padding: 0.08rem 0.24rem 0.054rem 0.24rem;
}
.text_6 {
overflow-wrap: break-word;
color: rgba(41, 121, 255, 1);
font-size: 0.32rem;
font-weight: 500;
text-align: left;
white-space: nowrap;
line-height: 0.454rem;
}
.text-wrapper_3 {
border-radius: 4px;
border: 1px solid rgba(251, 199, 199, 1);
padding: 0.08rem 0.24rem 0.054rem 0.24rem;
}
.text_7 {
overflow-wrap: break-word;
color: rgba(228, 61, 51, 1);
font-size: 0.32rem;
font-weight: 500;
text-align: left;
white-space: nowrap;
line-height: 0.454rem;
}
.text_8 {
width: 8.72rem;
height: 1.44rem;
overflow-wrap: break-word;
color: rgba(106, 106, 106, 1);
font-size: 0.32rem;
text-align: left;
line-height: 0.48rem;
margin: 0.214rem 0 0 0.32rem;
}
.text-wrapper_19 {
width: 6.72rem;
margin: 0.214rem 2rem 0 0.32rem;
}
.text_9 {
overflow-wrap: break-word;
color: rgba(144, 147, 153, 1);
font-size: 0.32rem;
text-align: left;
white-space: nowrap;
line-height: 0.454rem;
}
.text_10 {
height: 0.454rem;
overflow-wrap: break-word;
color: rgba(106, 106, 106, 1);
font-size: 0.32rem;
text-align: left;
white-space: nowrap;
line-height: 0.48rem;
}
.text-wrapper_20 {
width: 3.254rem;
margin: 0.214rem 5.467rem 0 0.32rem;
}
.text_11 {
overflow-wrap: break-word;
color: rgba(144, 147, 153, 1);
font-size: 0.32rem;
text-align: left;
white-space: nowrap;
line-height: 0.454rem;
}
.text_12 {
height: 0.454rem;
overflow-wrap: break-word;
color: rgba(106, 106, 106, 1);
font-size: 0.32rem;
text-align: left;
white-space: nowrap;
line-height: 0.48rem;
}
.text-wrapper_21 {
width: 5.44rem;
margin: 0.214rem 3.28rem 0 0.32rem;
}
.text_13 {
overflow-wrap: break-word;
color: rgba(144, 147, 153, 1);
font-size: 0.32rem;
text-align: left;
white-space: nowrap;
line-height: 0.454rem;
}
.text_14 {
height: 0.454rem;
overflow-wrap: break-word;
color: rgba(106, 106, 106, 1);
font-size: 0.32rem;
text-align: left;
white-space: nowrap;
line-height: 0.48rem;
}
.block_7 {
width: 8.027rem;
margin: 0.32rem 1.014rem 0 0;
}
.group_2 {
background-color: rgba(242, 247, 255, 1);
border-radius: 0px 0px 0px 8px;
position: relative;
padding: 0.48rem 1.654rem 0.454rem 1.654rem;
}
.image-text_9 {
width: 1.36rem;
}
.thumbnail_11 {
width: 0.454rem;
height: 0.454rem;
margin-bottom: 0.027rem;
}
.text-group_1 {
overflow-wrap: break-word;
color: rgba(41, 121, 255, 1);
font-size: 0.346rem;
text-align: right;
white-space: nowrap;
line-height: 0.48rem;
}
.image_1 {
position: absolute;
left: 0.32rem;
top: 0;
width: 8.72rem;
height: 0.027rem;
}
.image-text_10 {
width: 2.027rem;
margin: 0.48rem 0 0.454rem 0;
}
.thumbnail_12 {
width: 0.427rem;
height: 0.427rem;
margin: 0.027rem 0 0.027rem 0;
}
.text-group_2 {
overflow-wrap: break-word;
color: rgba(41, 121, 255, 1);
font-size: 0.346rem;
text-align: left;
white-space: nowrap;
line-height: 0.48rem;
}
</style> -->

8
packages/default-layout/index.vue Normal file
View File

@ -0,0 +1,8 @@
<template>
<view w-750rpx bg="#f7f7f7" h-1500rpx>
DefaultLayout
</view>
</template>
<script lang="ts" setup name="DefaultLayout">
</script>

37
packages/prompt/index.vue Normal file
View File

@ -0,0 +1,37 @@
<!--
* @Author: zhaojinfeng 121016171@qq.com
* @Date: 2023-06-25 15:55:08
* @LastEditors: zhaojinfeng 121016171@qq.com
* @LastEditTime: 2023-06-25 19:14:25
* @FilePath: \uni\packages\prompt\index.vue
* @Description:
*
-->
<template>
<div>xx</div>
<!-- <view>
xxx
</view> -->
</template>
<script lang="ts" setup name="Prompt">
const props = withDefaults(
defineProps<{
/** 标题 */
title: string
/** 是否必填 */
required?: boolean
/** 输入框的提示文字 */
placeholder?: string
/** 输入框的默认值 */
defaulrValue?: string
}>(),
{
required: false,
},
)
console.log(uni)
const mask = ref(false)
const value = ref(props.defaulrValue)
</script>

33
packages/search-picker/index.vue Normal file
View File

@ -0,0 +1,33 @@
<!--
* @Author: zhaojinfeng 121016171@qq.com
* @Date: 2023-06-25 19:26:10
* @LastEditors: zhaojinfeng 121016171@qq.com
* @LastEditTime: 2023-06-25 19:42:51
* @FilePath: \uni\packages\search-picker\index.vue
* @Description:
*
-->
<template>
<view>
<a-popup show>
xxxxxxxxxxxxxxxxxxxxxxxx
</a-popup>
SearchPicker
</view>
</template>
<script lang="ts" setup name="SearchPicker">
withDefaults(
defineProps<{
/** 是否必填 */
required?: boolean
/** 输入框的提示文字 */
placeholder?: string
/** 输入框的默认值 */
defaulrValue?: string
}>(),
{
required: false,
},
)
</script>

35
stories/Card.stories.ts Normal file
View File

@ -0,0 +1,35 @@
import type { Meta, StoryObj } from '@storybook/vue3'
import ThCard from '../packages/card/index.vue'
import ThCardTitle from '../packages/card-title/index.vue'
const meta = {
title: '卡片/Card',
component: ThCard,
tags: ['autodocs'],
render: (args: any) => ({
components: { ThCard },
setup() {
return { args }
},
template: '<div w-full><th-card /></div>',
}),
} satisfies Meta<typeof ThCard>
export default meta
type Story = StoryObj<typeof meta>
export const Title: Story = {
render: (args: any) => ({
components: { ThCard, ThCardTitle },
setup() {
return { args }
},
template: `
<th-card>
<th-card-title>
Title
</th-card-title>
</th-card>
`,
}),
}

47
stories/CardActions.stories.ts Normal file
View File

@ -0,0 +1,47 @@
/*
* @Author: peerless_hero peerless_hero@outlook.com
* @Date: 2023-07-08 01:44:59
* @LastEditors: zhaojinfeng 121016171@qq.com
* @LastEditTime: 2023-07-10 19:09:37
* @FilePath: \uni\stories\CardActions.stories.ts
* @Description:
*
*/
import type { Meta, StoryObj } from '@storybook/vue3'
import ThCard from '../packages/card/index.vue'
import ThCardText from '../packages/card-text/index.vue'
import ThCardActions from '../packages/card-actions/index.vue'
const meta = {
title: '卡片/CardActions',
component: ThCardActions,
tags: ['autodocs'],
} satisfies Meta<typeof ThCardActions>
export default meta
type Story = StoryObj<typeof meta>
export const Actions: Story = {
args: {
actions: [
{
text: '编辑',
}, {
text: '审核',
},
],
},
render: args => ({
components: { ThCard, ThCardText, ThCardActions },
setup() {
return { args }
},
template: `<th-card>
<th-card-text label="label" text="一长段文字一长段文字一长段文字一长段文字一长段文字一长段文字一长段文字一长段文字" />
<th-card-text label="label" text="一长段文字一长段文字一长段文字一长段文字一长段文字一长段文字一长段文字一长段文字" />
<th-card-text label="label" text="一长段文字一长段文字一长段文字一长段文字一长段文字一长段文字一长段文字一长段文字" />
<th-card-actions :actions="args.actions" />
</th-card>
`,
}),
}

13
stories/CardItem.stories.ts Normal file
View File

@ -0,0 +1,13 @@
import type { Meta, StoryObj } from '@storybook/vue3'
import CardItem from '../packages/card-item/index.vue'
const meta = {
title: '卡片/CardItem',
component: CardItem,
tags: ['autodocs'],
} satisfies Meta<typeof CardItem>
export default meta
type Story = StoryObj<typeof meta>
export const Base: Story = {}

13
stories/CardSubtitle.stories.ts Normal file
View File

@ -0,0 +1,13 @@
import type { Meta, StoryObj } from '@storybook/vue3'
import CardSubtitle from '../packages/card-subtitle/index.vue'
const meta = {
title: '卡片/CardSubtitle',
component: CardSubtitle,
tags: ['autodocs'],
} satisfies Meta<typeof CardSubtitle>
export default meta
type Story = StoryObj<typeof meta>
export const Base: Story = {}

38
stories/CardText.stories.ts Normal file
View File

@ -0,0 +1,38 @@
import type { Meta, StoryObj } from '@storybook/vue3'
import ThCard from '../packages/card/index.vue'
import ThCardText from '../packages/card-text/index.vue'
const meta = {
title: '卡片/CardText',
component: ThCardText,
tags: ['autodocs'],
} satisfies Meta<typeof ThCardText>
export default meta
type Story = StoryObj<typeof meta>
export const Text: Story = {
args: {
label: '卡片的标签',
text: '卡片的文字',
},
name: '卡片的标签加文字',
render: args => ({
components: { ThCard, ThCardText },
setup() {
return { args }
},
template: `
<th-card>
<th-card-text :label="args.label" :text="args.text" />
<th-card-text :label="args.label" :text="args.text" />
<th-card-text :label="args.label" :text="args.text" />
<th-card-text :label="args.label" :text="args.text" />
<th-card-text :label="args.label" :text="args.text" />
<th-card-text :label="args.label" :text="args.text" />
<th-card-text :label="args.label" :text="args.text" />
<th-card-text :label="args.label" :text="args.text" />
</th-card>
`,
}),
}

59
stories/CardTitle.stories.ts Normal file
View File

@ -0,0 +1,59 @@
/*
* @Author: peerless_hero peerless_hero@outlook.com
* @Date: 2023-07-08 01:44:23
* @LastEditors: peerless_hero peerless_hero@outlook.com
* @LastEditTime: 2023-07-10 02:58:09
* @FilePath: \uni\stories\CardTitle.stories.ts
* @Description:
*
*/
import type { Meta, StoryObj } from '@storybook/vue3'
import ThCard from '../packages/card/index.vue'
import ThCardTitle from '../packages/card-title/index.vue'
import ThCardText from '../packages/card-text/index.vue'
const meta = {
title: '卡片/CardTitle',
component: ThCardTitle,
tags: ['autodocs'],
} satisfies Meta<typeof ThCardTitle>
export default meta
type Story = StoryObj<typeof meta>
export const Title: Story = {
args: {
title: '卡片的标题',
},
render: args => ({
components: { ThCard, ThCardTitle },
setup() {
return { args }
},
template: `
<th-card>
<th-card-title :title="args.title" />
</th-card>
`,
}),
}
export const TitleText: Story = {
args: {
title: '卡片标题配合文字',
},
render: args => ({
components: { ThCard, ThCardTitle, ThCardText },
setup() {
return { args }
},
template: `
<th-card>
<th-card-title :title="args.title" />
<th-card-text text="一段文字一段文字" />
<th-card-text text="一段文字一段文字" />
<th-card-text text="一段文字一段文字" />
</th-card>
`,
}),
}

13
stories/DefaultLayout.stories.ts Normal file
View File

@ -0,0 +1,13 @@
import type { Meta, StoryObj } from '@storybook/vue3'
import DefaultLayout from '../packages/default-layout/index.vue'
const meta = {
title: '某个大类/DefaultLayout',
component: DefaultLayout,
tags: ['autodocs'],
} satisfies Meta<typeof DefaultLayout>
export default meta
type Story = StoryObj<typeof meta>
export const Base: Story = {}

2
stories/Header.stories.ts
View File

@ -18,7 +18,7 @@ const meta = {
*/
title: 'Example/Header',
component: MyHeader,
render: (args: any) => ({
render: args => ({
components: { MyHeader },
setup() {
return { args }

26
stories/Prompt.stories.ts Normal file
View File

@ -0,0 +1,26 @@
/*
* @Author: zhaojinfeng 121016171@qq.com
* @Date: 2023-06-25 15:55:08
* @LastEditors: zhaojinfeng 121016171@qq.com
* @LastEditTime: 2023-06-25 19:11:17
* @FilePath: \uni\stories\Prompt.stories.ts
* @Description:
*
*/
import type { Meta, StoryObj } from '@storybook/vue3'
import Prompt from '../packages/prompt/index.vue'
const meta = {
title: '反馈组件/Prompt',
component: Prompt,
tags: ['autodocs'],
} satisfies Meta<typeof Prompt>
export default meta
type Story = StoryObj<typeof meta>
export const Base: Story = {
args: {
title: '意见',
},
}

13
stories/SearchPicker.stories.ts Normal file
View File

@ -0,0 +1,13 @@
import type { Meta, StoryObj } from '@storybook/vue3'
import SearchPicker from '../packages/search-picker/index.vue'
const meta = {
title: '某个大类/SearchPicker',
component: SearchPicker,
tags: ['autodocs'],
} satisfies Meta<typeof SearchPicker>
export default meta
type Story = StoryObj<typeof meta>
export const Base: Story = {}

13
types/components.d.ts vendored
View File

@ -8,10 +8,20 @@ export {}
declare module 'vue' {
export interface GlobalComponents {
Button: typeof import('./../packages/button/index.vue')['default']
Card: typeof import('./../packages/card/index.vue')['default']
CardActions: typeof import('./../packages/card-actions/index.vue')['default']
CardItem: typeof import('./../packages/card-item/index.vue')['default']
CardSubtitle: typeof import('./../packages/card-subtitle/index.vue')['default']
CardText: typeof import('./../packages/card-text/index.vue')['default']
CardTitle: typeof import('./../packages/card-title/index.vue')['default']
DefaultLayout: typeof import('./../packages/default-layout/index.vue')['default']
Header: typeof import('./../packages/header/index.vue')['default']
Image: typeof import('./../dev/Image.vue')['default']
Prompt: typeof import('./../packages/prompt/index.vue')['default']
RouterLink: typeof import('vue-router')['RouterLink']
RouterView: typeof import('vue-router')['RouterView']
Test: typeof import('./../packages/test/index.vue')['default']
SearchPicker: typeof import('./../packages/search-picker/index.vue')['default']
Text: typeof import('./../dev/Text.vue')['default']
UniBadge: typeof import('@uni-helper/uni-ui-types')['UniBadge']
UniBreadcrumb: typeof import('@uni-helper/uni-ui-types')['UniBreadcrumb']
UniBreadcrumbItem: typeof import('@uni-helper/uni-ui-types')['UniBreadcrumbItem']
@ -71,5 +81,6 @@ declare module 'vue' {
UniTooltip: typeof import('@uni-helper/uni-ui-types')['UniTooltip']
UniTr: typeof import('@uni-helper/uni-ui-types')['UniTr']
UniTransition: typeof import('@uni-helper/uni-ui-types')['UniTransition']
View: typeof import('./../dev/View.vue')['default']
}
}

56
unocss.config.ts Normal file
View File

@ -0,0 +1,56 @@
/*
* @Author: peerless_hero peerless_hero@outlook.com
* @Date: 2023-07-09 20:53:14
* @LastEditors: peerless_hero peerless_hero@outlook.com
* @LastEditTime: 2023-07-10 00:11:49
* @FilePath: \uni\unocss.config.ts
* @Description:
*
*/
import type {
Preset,
SourceCodeTransformer,
} from 'unocss'
import {
defineConfig,
presetAttributify,
presetIcons,
presetUno,
transformerDirectives,
transformerVariantGroup,
} from 'unocss'
import { presetRemRpx } from 'unocss-applet'
const presets: Preset[] = []
const transformers: SourceCodeTransformer[] = []
const darkMode = 'class'
presets.push(presetUno({ dark: darkMode }), presetAttributify(), presetRemRpx({ mode: 'rpx2rem' }))
export default defineConfig({
presets: [
presetIcons({
scale: 1.2,
warn: true,
extraProperties: {
'display': 'inline-block',
'vertical-align': 'middle',
},
}),
...presets,
],
transformers: [
transformerDirectives(),
transformerVariantGroup(),
...transformers,
],
theme: {
preflightRoot: undefined,
},
rules: [
[/^fs-(\d+\.?\d{0,2})$/, ([, d]) => ({ 'font-size': `${d}rpx` })],
[/^leh-(\d+\.?\d{0,2})$/, ([, d]) => ({ 'line-height': `${d}rpx` })],
],
})

11
vite.config.ts
View File

@ -1,8 +1,8 @@
/*
* @Author: zhaojinfeng 121016171@qq.com
* @Date: 2023-06-15 13:22:04
* @LastEditors: zhaojinfeng 121016171@qq.com
* @LastEditTime: 2023-06-21 17:36:45
* @LastEditors: peerless_hero peerless_hero@outlook.com
* @LastEditTime: 2023-07-09 22:25:44
* @FilePath: \uni\vite.config.ts
* @Description:
*
@ -46,6 +46,7 @@ export default defineConfig({
alias: {
'~': fileURLToPath(new URL('./packages', import.meta.url)),
'@': fileURLToPath(new URL('./packages', import.meta.url)),
'/static': fileURLToPath(new URL('./assets/static', import.meta.url)),
},
},
plugins: [
@ -68,12 +69,8 @@ export default defineConfig({
}),
Components({
dts: 'types/components.d.ts',
dirs: 'packages',
dirs: ['dev', 'packages'],
types: [
{
from: 'vue-router',
names: ['RouterLink', 'RouterView'],
},
{
from: '@uni-helper/uni-ui-types',
names: [

79
yarn.lock
View File

@ -3245,6 +3245,38 @@
minimatch "^8.0.3"
resolve "^1.22.2"
"@unocss-applet/preset-applet@0.5.3":
version "0.5.3"
resolved "https://registry.npmmirror.com/@unocss-applet/preset-applet/-/preset-applet-0.5.3.tgz#d44e0de6084ecd3e107586691fc2521bb954ecff"
integrity sha512-04nRinxbuMhq2oJOWUf7JjSZpnukXgqlY8fAERCH4vjwf0ZLRCXXIwbpv9w7Tj0X8O+uOLXQL/fDCzGx9kjrKQ==
dependencies:
"@unocss-applet/utils" "0.5.3"
"@unocss/core" "^0.52.4"
"@unocss/preset-mini" "^0.52.4"
"@unocss/preset-uno" "^0.52.4"
"@unocss-applet/preset-rem-rpx@0.5.3":
version "0.5.3"
resolved "https://registry.npmmirror.com/@unocss-applet/preset-rem-rpx/-/preset-rem-rpx-0.5.3.tgz#ad31817551f6242e0d86e41c3d22dbd5e89aff3c"
integrity sha512-WdcIOrJsRyfSpuAnzPJtZULR9kO2hZXA/mJ5295r9cDnaul58XU4szboC8hZyH7gD++upl+Y3fMv25Lsev4PAg==
"@unocss-applet/transformer-applet@0.5.3":
version "0.5.3"
resolved "https://registry.npmmirror.com/@unocss-applet/transformer-applet/-/transformer-applet-0.5.3.tgz#8b85d0fcf9be75f58c2e4a5755e66de8ebe0dd22"
integrity sha512-8nFle4isHxSz/c68FchFgulACUWZ9vBVPxD6lbyqwNS+MbOuwuaXTBO9ImIj4ypCiyGJruu8xTRJhhwZHWEiDg==
dependencies:
"@unocss-applet/utils" "0.5.3"
"@unocss-applet/transformer-attributify@0.5.3":
version "0.5.3"
resolved "https://registry.npmmirror.com/@unocss-applet/transformer-attributify/-/transformer-attributify-0.5.3.tgz#f7e4bbb5e5c4cedefec3a35417791a482157bbfa"
integrity sha512-4KWgqZa30E/1zuEFpN1SwCDCFYGTdVs3BBvxghsVwk73Dl5biHuY5uavTUOhq87yFQAhk6iZKMn9o3YCVSiPRw==
"@unocss-applet/utils@0.5.3":
version "0.5.3"
resolved "https://registry.npmmirror.com/@unocss-applet/utils/-/utils-0.5.3.tgz#8e2671b5f5da052c19f0efe734a4e4baaa1ceec1"
integrity sha512-dN12YCHkLkBp7fL4A/jOmjxxrp04ST+zCX+zI5965fIXk4jvB9t6PaB/viRIE+ISKD/Jhs0ygTpd1yx0YgrSGg==
"@unocss/astro@0.53.1":
version "0.53.1"
resolved "https://registry.npmmirror.com/@unocss/astro/-/astro-0.53.1.tgz#0cde5363ef6029a1de6a70d85f81b99709d3a126"
@ -3281,11 +3313,23 @@
"@unocss/core" "0.53.1"
unconfig "^0.3.9"
"@unocss/core@0.52.7", "@unocss/core@^0.52.4":
version "0.52.7"
resolved "https://registry.npmmirror.com/@unocss/core/-/core-0.52.7.tgz#6f2ef8b6bc9c3fdef1c06ce702031454f5901a0f"
integrity sha512-dZonrlfu33SkUMsZXlsyYSM79tr2nLer/hBEU2ZaemRik2KchxIUNlZV6kX1f1k3m+gEtVQOyx1MImpgLS8PWg==
"@unocss/core@0.53.1":
version "0.53.1"
resolved "https://registry.npmmirror.com/@unocss/core/-/core-0.53.1.tgz#d14e0124496aae9bab5ab88b8a3f1e3820e60fcd"
integrity sha512-6CUaOMeQyoPIgMuSboX9yGywiCumhoYTPk6uMFhgD3vZmIRCZMwN9RFDLB+s2+NOlnBU6aQsJLONcUapZb/49g==
"@unocss/extractor-arbitrary-variants@0.52.7":
version "0.52.7"
resolved "https://registry.npmmirror.com/@unocss/extractor-arbitrary-variants/-/extractor-arbitrary-variants-0.52.7.tgz#971ffdd051fda1e90655d75e17bdfa0738c7a6c6"
integrity sha512-nJ4iE7nIRpoOIQfD8S58yG4qJd6AhVPEfEOf7ksX1u8xLf71rrBIojwraRXvv7aPqNdZiWvXdh/znpA/QC5b9w==
dependencies:
"@unocss/core" "0.52.7"
"@unocss/extractor-arbitrary-variants@0.53.1":
version "0.53.1"
resolved "https://registry.npmmirror.com/@unocss/extractor-arbitrary-variants/-/extractor-arbitrary-variants-0.53.1.tgz#0b9addd681249b7229ba26d90b48353dce0ec080"
@ -3329,6 +3373,14 @@
"@unocss/core" "0.53.1"
ofetch "^1.0.1"
"@unocss/preset-mini@0.52.7", "@unocss/preset-mini@^0.52.4":
version "0.52.7"
resolved "https://registry.npmmirror.com/@unocss/preset-mini/-/preset-mini-0.52.7.tgz#a36e9d2f9cf0bdecfd931924572a60365940ec4d"
integrity sha512-c5VRzPwyAmIBWwz2ufEboYwHGiheG+V9SCmJJLHlu/gcW5KndFsxoeJPE6nOfXVmbx4AGq/rkzV35ZXtH8Iecw==
dependencies:
"@unocss/core" "0.52.7"
"@unocss/extractor-arbitrary-variants" "0.52.7"
"@unocss/preset-mini@0.53.1":
version "0.53.1"
resolved "https://registry.npmmirror.com/@unocss/preset-mini/-/preset-mini-0.53.1.tgz#26ba858da7bab40fcecf18aef761de98499467f8"
@ -3361,6 +3413,15 @@
"@unocss/preset-mini" "0.53.1"
"@unocss/preset-wind" "0.53.1"
"@unocss/preset-uno@^0.52.4":
version "0.52.7"
resolved "https://registry.npmmirror.com/@unocss/preset-uno/-/preset-uno-0.52.7.tgz#4d667c5150928ca620db40966aacdb28301e986e"
integrity sha512-J5royXxvaPvwRplZ2zwEcB1jJETp3dTA3sIezf9ydSNr4px3h6Ul6TxFDuJpBUWlx/cxP7aRWM0p9+e2ivdRkA==
dependencies:
"@unocss/core" "0.52.7"
"@unocss/preset-mini" "0.52.7"
"@unocss/preset-wind" "0.52.7"
"@unocss/preset-web-fonts@0.53.1":
version "0.53.1"
resolved "https://registry.npmmirror.com/@unocss/preset-web-fonts/-/preset-web-fonts-0.53.1.tgz#06e6b84351bfbe2dac76b7554e699583348593e9"
@ -3369,6 +3430,14 @@
"@unocss/core" "0.53.1"
ofetch "^1.0.1"
"@unocss/preset-wind@0.52.7":
version "0.52.7"
resolved "https://registry.npmmirror.com/@unocss/preset-wind/-/preset-wind-0.52.7.tgz#77fb11feb506f9f25650e0679cc9c9e109ba0bc6"
integrity sha512-IT36cDftK7B+zDUElL4qdZZEj6iwknIpetXwuVvW/X8ljS/ocY/qfyjSX7C8k163FLAw7nTARFjW3xL066NsLw==
dependencies:
"@unocss/core" "0.52.7"
"@unocss/preset-mini" "0.52.7"
"@unocss/preset-wind@0.53.1":
version "0.53.1"
resolved "https://registry.npmmirror.com/@unocss/preset-wind/-/preset-wind-0.53.1.tgz#d32d03388fd95d3ef7e4a2204d4e7052382e7ed3"
@ -9188,6 +9257,16 @@ universalify@^2.0.0:
resolved "https://registry.npmmirror.com/universalify/-/universalify-2.0.0.tgz#75a4984efedc4b08975c5aeb73f530d02df25717"
integrity sha512-hAZsKq7Yy11Zu1DE0OzWjw7nnLZmJZYTDZZyEFHZdUhV8FkH5MCfoU1XMaxXovpyW5nq5scPqq0ZDP9Zyl04oQ==
unocss-applet@^0.5.3:
version "0.5.3"
resolved "https://registry.npmmirror.com/unocss-applet/-/unocss-applet-0.5.3.tgz#88443d3b3cc969ced663a2bc1416b7faa3160e46"
integrity sha512-JlQZjrQYb4iHLw1tUAmW4tMo9Tz2j5xSFlYb/k83RVuvZoKYUDT/adFh5NvQ/25a+V7JFyvhsutgU3mZHjlXYQ==
dependencies:
"@unocss-applet/preset-applet" "0.5.3"
"@unocss-applet/preset-rem-rpx" "0.5.3"
"@unocss-applet/transformer-applet" "0.5.3"
"@unocss-applet/transformer-attributify" "0.5.3"
unocss@^0.53.1:
version "0.53.1"
resolved "https://registry.npmmirror.com/unocss/-/unocss-0.53.1.tgz#12a2c225853c40017cd62369ef79f1b17f51d981"