sileya-ai
/
vr-uniapp
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

修改组件的组成

v1.0.0
于肖磊 2024-08-27 13:59:37 +08:00
parent 11a8138c66
commit 0cba639eec
6 changed files with 27 additions and 54 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
src/components/common/color-text-size-group/index.vue
View File

@ -1,16 +1,23 @@
<template>
<div class="flex-col w h gap-10">
<color-picker v-model="color" :default-color="props.defaultColor"></color-picker>
<text-size-group v-model:typeface="typeface" v-model:size="size"></text-size-group>
<color-picker v-if="typeList.includes('color')" v-model="color" :default-color="props.defaultColor"></color-picker>
<el-radio-group v-if="typeList.includes('typeface')" v-model="typeface" class="ml-4">
<el-radio v-for="item in font_weight" :key="item.value" :value="item.value">{{ item.name }}</el-radio>
</el-radio-group>
<el-form-item v-if="typeList.includes('size')" label="字号" label-width="40" class="mb-0 w word-size">
<slider v-model="size" :max="100"></slider>
</el-form-item>
</div>
</template>
<script setup lang="ts">
interface Props {
defaultColor?: string;
typeList?: string[]; // 默认显示3个，传递了之后按照传递的显示
}
const props = withDefaults(defineProps<Props>(), {
defaultColor: ''
defaultColor: '',
typeList: () => ['color', 'typeface', 'size'],
});
const color = defineModel('color', {
type: String,
@ -24,7 +31,18 @@ const size = defineModel('size', {
type: Number,
default: 15
});
const font_weight = [
{ name: '加粗', value: '500' },
{ name: '正常', value: '400' },
];
</script>
<style lang="scss" scoped>
.word-size {
:deep(.el-form-item__label) {
color: #999;
font-size: 1.2rem;
}
}
</style>

33
src/components/common/text-size-group/index.vue
View File

@ -1,33 +0,0 @@
<template>
<el-radio-group v-model="typeface" class="ml-4">
<el-radio v-for="item in font_weight" :key="item.value" :value="item.value">{{ item.name }}</el-radio>
</el-radio-group>
<el-form-item label="字号" label-width="40" class="mb-0 w word-size">
<slider v-model="size" :max="100"></slider>
</el-form-item>
</template>
<script setup lang="ts">
const typeface = defineModel('typeface', {
type: String,
default: '400'
});
const size = defineModel('size', {
type: Number,
default: 15
});
const font_weight = [
{ name: '加粗', value: '500' },
{ name: '正常', value: '400' },
];
</script>
<style lang="scss" scoped>
.word-size {
:deep(.el-form-item__label) {
color: #999;
font-size: 1.2rem;
}
}
</style>

10
src/components/model-data-magic/components/tabs-styles.vue
View File

@ -36,16 +36,10 @@
<template v-if="tabs_content.data_type === 'goods'">
<template v-if="isShowTitle">
<el-form-item label="主标题">
<div class="flex-col gap-10 w">
<color-picker v-model="form.heading_color" default-color="#000000"></color-picker>
<text-size-group v-model:typeface="form.heading_typeface" v-model:size="form.heading_size"></text-size-group>
</div>
<color-text-size-group v-model:color="form.heading_color" v-model:typeface="form.heading_typeface" v-model:size="form.heading_size" default-color="#000000"></color-text-size-group>
</el-form-item>
<el-form-item label="副标题">
<div class="flex-col gap-10 w">
<color-picker v-model="form.subtitle_color" default-color="#000000"></color-picker>
<text-size-group v-model:typeface="form.subtitle_typeface" v-model:size="form.subtitle_size"></text-size-group>
</div>
<color-text-size-group v-model:color="form.subtitle_color" v-model:typeface="form.subtitle_typeface" v-model:size="form.subtitle_size" default-color="#000000"></color-text-size-group>
</el-form-item>
</template>
<el-form-item label="内间距">

10
src/components/model-notice/model-notice-styles.vue
View File

@ -5,10 +5,7 @@
<div class="mb-12">标题样式</div>
<template v-if="!is_img">
<el-form-item label="标题文字">
<div class="flex-col gap-10 w">
<color-picker v-model="form.topic_color" default-color="#000000"></color-picker>
<text-size-group v-model:typeface="form.topic_typeface" v-model:size="form.topic_size"></text-size-group>
</div>
<color-text-size-group v-model:color="form.topic_color" v-model:typeface="form.topic_typeface" v-model:size="form.topic_size" default-color="#000000"></color-text-size-group>
</el-form-item>
<el-form-item label="标题背景" class="topic">
<flex-gradients-create :color-list="form.topic_color_list"></flex-gradients-create>
@ -26,10 +23,7 @@
<color-picker v-model="form.button_color" default-color="#999"></color-picker>
</el-form-item>
<el-form-item label="内容标题">
<div class="flex-col gap-10 w">
<color-picker v-model="form.news_color" default-color="#000000"></color-picker>
<text-size-group v-model:typeface="form.news_typeface" v-model:size="form.news_size"></text-size-group>
</div>
<color-text-size-group v-model:color="form.news_color" v-model:typeface="form.news_typeface" v-model:size="form.news_size" default-color="#000000"></color-text-size-group>
</el-form-item>
</card-container>
</el-form>

2
src/components/model-shop-list/model-shop-list-styles.vue
View File

@ -52,7 +52,7 @@
<flex-gradients-create :color-list="form.shop_button_color" default-color="#FF3D53"></flex-gradients-create>
</el-form-item>
<el-form-item label="立即购买">
<text-size-group v-model:typeface="form.shop_button_typeface" v-model:size="form.shop_button_size"></text-size-group>
<color-text-size-group v-model:typeface="form.shop_button_typeface" v-model:size="form.shop_button_size" :type-list="['typeface', 'size']"></color-text-size-group>
</el-form-item>
</card-container>
</el-form>

2
src/components/model-shop-tabs/model-shop-tabs-styles.vue
View File

@ -64,7 +64,7 @@
<flex-gradients-create :color-list="form.shop_button_color" default-color="#2a94ff"></flex-gradients-create>
</el-form-item>
<el-form-item label="立即购买">
<text-size-group v-model:typeface="form.shop_button_typeface" v-model:size="form.shop_button_size"></text-size-group>
<color-text-size-group v-model:typeface="form.shop_button_typeface" v-model:size="form.shop_button_size" :type-list="['typeface', 'size']"></color-text-size-group>
</el-form-item>
</card-container>
</el-form>