From 11a8138c6672261b3b50fa1e4d006ed51c5b8037 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E4=BA=8E=E8=82=96=E7=A3=8A?= <18851179580@163.com>
Date: Tue, 27 Aug 2024 13:43:35 +0800
Subject: [PATCH 1/2] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E6=96=87=E5=AD=97?=
 =?UTF-8?q?=E9=A2=9C=E8=89=B2=E8=89=B2=E5=80=BC=E6=A0=B7=E5=BC=8F=E6=98=BE?=
 =?UTF-8?q?=E7=A4=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../common/color-text-size-group/index.vue    | 30 ++++++++++++++
 .../index.vue                                 |  8 +++-
 src/components/model-article-list/index.vue   |  6 +--
 .../model-article-list-styles.vue             | 30 ++------------
 .../model-article-tabs-styles.vue             | 40 +++----------------
 .../components/tabs-styles.vue                |  4 +-
 .../model-notice/model-notice-styles.vue      |  4 +-
 .../model-shop-list-styles.vue                | 21 +++-------
 .../model-shop-tabs-styles.vue                | 29 ++++----------
 .../model-tabs/model-tabs-styles.vue          | 12 ++----
 10 files changed, 67 insertions(+), 117 deletions(-)
 create mode 100644 src/components/common/color-text-size-group/index.vue
 rename src/components/common/{text-size-type => text-size-group}/index.vue (76%)

diff --git a/src/components/common/color-text-size-group/index.vue b/src/components/common/color-text-size-group/index.vue
new file mode 100644
index 00000000..45842bfc
--- /dev/null
+++ b/src/components/common/color-text-size-group/index.vue
@@ -0,0 +1,30 @@
+<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>
+    </div>
+</template>
+
+<script setup lang="ts">
+interface Props {
+    defaultColor?: string;
+}
+const props = withDefaults(defineProps<Props>(), {
+    defaultColor: ''
+});
+const color = defineModel('color', {
+    type: String,
+    default: ''
+});
+const typeface = defineModel('typeface', {
+    type: String,
+    default: '400'
+});
+const size = defineModel('size', {
+    type: Number,
+    default: 15
+});
+</script>
+
+<style lang="scss" scoped>
+</style>
\ No newline at end of file
diff --git a/src/components/common/text-size-type/index.vue b/src/components/common/text-size-group/index.vue
similarity index 76%
rename from src/components/common/text-size-type/index.vue
rename to src/components/common/text-size-group/index.vue
index 18e57a9f..e334a54d 100644
--- a/src/components/common/text-size-type/index.vue
+++ b/src/components/common/text-size-group/index.vue
@@ -2,7 +2,7 @@
     <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">
+    <el-form-item label="字号" label-width="40" class="mb-0 w word-size">
         <slider v-model="size" :max="100"></slider>
     </el-form-item>
 </template>
@@ -24,4 +24,10 @@ const font_weight = [
 </script>
 
 <style lang="scss" scoped>
+.word-size {
+    :deep(.el-form-item__label) {
+        color: #999;
+        font-size: 1.2rem;
+    }
+}
 </style>
\ No newline at end of file
diff --git a/src/components/model-article-list/index.vue b/src/components/model-article-list/index.vue
index 9eb1119c..7b07e080 100644
--- a/src/components/model-article-list/index.vue
+++ b/src/components/model-article-list/index.vue
@@ -59,8 +59,6 @@ const data_list = ref<ArticleList[]>([]);
 const article_theme = ref('0');
 // 是否显示
 const field_show = ref(['0', '1']);
-// 是否显示封面图片
-const is_cover = ref(true);
 // 文章
 const article_name = ref('');
 // 日期
@@ -108,7 +106,6 @@ watch(
 
         article_theme.value = new_content.theme;
         field_show.value = new_content.field_show;
-        is_cover.value = new_content.is_cover;
         // 样式
         article_name.value = 'font-size:' + new_style.name_size + 'px;' + 'font-weight:' + new_style.name_weight + ';' + 'color:' + new_style.name_color + ';';
         article_date.value = 'font-size:' + new_style.time_size + 'px;' + 'font-weight:' + new_style.time_weight + ';' + 'color:' + new_style.time_color + ';';
@@ -160,13 +157,14 @@ const article_theme_class = computed(() => {
     return `style${article_theme.value}`;
 });
 const get_auto_data_list = async (new_content: any) => {
-    const { category, number, sort, sort_rules } = new_content;
+    const { category, number, sort, sort_rules, is_cover } = new_content;
     const new_data = {
         article_keywords: '',
         article_category_ids: category.join(','),
         article_order_by_type: sort,
         article_order_by_rule: sort_rules,
         article_number: number,
+        article_is_cover: is_cover ? 1 : 0,
     };
     const res = await ArticleAPI.getAutoList(new_data);
     if (!isEmpty(res.data)) {
diff --git a/src/components/model-article-list/model-article-list-styles.vue b/src/components/model-article-list/model-article-list-styles.vue
index 518849a5..4b9edab6 100644
--- a/src/components/model-article-list/model-article-list-styles.vue
+++ b/src/components/model-article-list/model-article-list-styles.vue
@@ -4,37 +4,13 @@
             <card-container class="mb-8">
                 <div class="mb-12">列表样式</div>
                 <el-form-item label="文章名称">
-                    <el-radio-group v-model="form.name_weight">
-                        <el-radio v-for="item in font_weight" :key="item.value" :value="item.value">{{ item.name }}</el-radio>
-                    </el-radio-group>
-                </el-form-item>
-                <el-form-item label="字号">
-                    <slider v-model="form.name_size"></slider>
-                </el-form-item>
-                <el-form-item label="名称色值">
-                    <color-picker v-model="form.name_color"></color-picker>
+                    <color-text-size-group v-model:color="form.name_color" v-model:typeface="form.name_weight" v-model:size="form.name_size"></color-text-size-group>
                 </el-form-item>
                 <el-form-item label="日期时间">
-                    <el-radio-group v-model="form.time_weight">
-                        <el-radio v-for="item in font_weight" :key="item.value" :value="item.value">{{ item.name }}</el-radio>
-                    </el-radio-group>
-                </el-form-item>
-                <el-form-item label="字号">
-                    <slider v-model="form.time_size"></slider>
-                </el-form-item>
-                <el-form-item label="日期颜色">
-                    <color-picker v-model="form.time_color"></color-picker>
+                    <color-text-size-group v-model:color="form.time_color" v-model:typeface="form.time_weight" v-model:size="form.time_size"></color-text-size-group>
                 </el-form-item>
                 <el-form-item label="浏览量">
-                    <el-radio-group v-model="form.page_view_weight">
-                        <el-radio v-for="item in font_weight" :key="item.value" :value="item.value">{{ item.name }}</el-radio>
-                    </el-radio-group>
-                </el-form-item>
-                <el-form-item label="字号">
-                    <slider v-model="form.page_view_size"></slider>
-                </el-form-item>
-                <el-form-item label="浏览色值">
-                    <color-picker v-model="form.page_view_color"></color-picker>
+                    <color-text-size-group v-model:color="form.page_view_color" v-model:typeface="form.page_view_weight" v-model:size="form.page_view_size"></color-text-size-group>
                 </el-form-item>
                 <el-form-item label="内容圆角">
                     <radius :value="form.content_radius"></radius>
diff --git a/src/components/model-article-tabs/model-article-tabs-styles.vue b/src/components/model-article-tabs/model-article-tabs-styles.vue
index 0a3ea543..f4dc5fd9 100644
--- a/src/components/model-article-tabs/model-article-tabs-styles.vue
+++ b/src/components/model-article-tabs/model-article-tabs-styles.vue
@@ -7,52 +7,22 @@
                     <mult-color-picker :value="form.tabs_checked" :type="form.tabs_direction" @update:value="tabs_checked_event"></mult-color-picker>
                 </el-form-item>
                 <el-form-item label="选中文字">
-                    <div class="flex-col w h gap-10">
-                        <color-picker v-model="form.tabs_color_checked" default-color="rgba(51,51,51,1)"></color-picker>
-                        <text-size-type v-model:typeface="form.tabs_weight_checked" v-model:size="form.tabs_size_checked"></text-size-type>
-                    </div>
+                    <color-text-size-group v-model:color="form.tabs_color_checked" v-model:typeface="form.tabs_weight_checked" v-model:size="form.tabs_size_checked" default-color="rgba(51,51,51,1)"></color-text-size-group>
                 </el-form-item>
                 <el-form-item label="未选文字">
-                    <div class="flex-col w h gap-10">
-                        <color-picker v-model="form.tabs_color" default-color="rgba(51,51,51,1)"></color-picker>
-                        <text-size-type v-model:typeface="form.tabs_weight" v-model:size="form.tabs_size"></text-size-type>
-                    </div>
+                    <color-text-size-group v-model:color="form.tabs_color" v-model:typeface="form.tabs_weight" v-model:size="form.tabs_size" default-color="rgba(51,51,51,1)"></color-text-size-group>
                 </el-form-item>
             </card-container>
             <card-container class="mb-8">
                 <div class="mb-12">内容样式</div>
                 <el-form-item label="文章名称">
-                    <el-radio-group v-model="form.name_weight">
-                        <el-radio v-for="item in font_weight" :key="item.value" :value="item.value">{{ item.name }}</el-radio>
-                    </el-radio-group>
-                </el-form-item>
-                <el-form-item label="字号">
-                    <slider v-model="form.name_size"></slider>
-                </el-form-item>
-                <el-form-item label="名称色值">
-                    <color-picker v-model="form.name_color"></color-picker>
+                    <color-text-size-group v-model:color="form.name_color" v-model:typeface="form.name_weight" v-model:size="form.name_size"></color-text-size-group>
                 </el-form-item>
                 <el-form-item label="日期时间">
-                    <el-radio-group v-model="form.time_weight">
-                        <el-radio v-for="item in font_weight" :key="item.value" :value="item.value">{{ item.name }}</el-radio>
-                    </el-radio-group>
-                </el-form-item>
-                <el-form-item label="字号">
-                    <slider v-model="form.time_size"></slider>
-                </el-form-item>
-                <el-form-item label="日期颜色">
-                    <color-picker v-model="form.time_color"></color-picker>
+                    <color-text-size-group v-model:color="form.time_color" v-model:typeface="form.time_weight" v-model:size="form.time_size"></color-text-size-group>
                 </el-form-item>
                 <el-form-item label="浏览量">
-                    <el-radio-group v-model="form.page_view_weight">
-                        <el-radio v-for="item in font_weight" :key="item.value" :value="item.value">{{ item.name }}</el-radio>
-                    </el-radio-group>
-                </el-form-item>
-                <el-form-item label="字号">
-                    <slider v-model="form.page_view_size"></slider>
-                </el-form-item>
-                <el-form-item label="浏览色值">
-                    <color-picker v-model="form.page_view_color"></color-picker>
+                    <color-text-size-group v-model:color="form.page_view_color" v-model:typeface="form.page_view_weight" v-model:size="form.page_view_size"></color-text-size-group>
                 </el-form-item>
                 <el-form-item label="内容圆角">
                     <radius :value="form.content_radius"></radius>
diff --git a/src/components/model-data-magic/components/tabs-styles.vue b/src/components/model-data-magic/components/tabs-styles.vue
index 614c7fae..385e9d8e 100644
--- a/src/components/model-data-magic/components/tabs-styles.vue
+++ b/src/components/model-data-magic/components/tabs-styles.vue
@@ -38,13 +38,13 @@
                 <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-type v-model:typeface="form.heading_typeface" v-model:size="form.heading_size"></text-size-type>
+                        <text-size-group v-model:typeface="form.heading_typeface" v-model:size="form.heading_size"></text-size-group>
                     </div>
                 </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-type v-model:typeface="form.subtitle_typeface" v-model:size="form.subtitle_size"></text-size-type>
+                        <text-size-group v-model:typeface="form.subtitle_typeface" v-model:size="form.subtitle_size"></text-size-group>
                     </div>
                 </el-form-item>
             </template>
diff --git a/src/components/model-notice/model-notice-styles.vue b/src/components/model-notice/model-notice-styles.vue
index 67aa8c86..c2874450 100644
--- a/src/components/model-notice/model-notice-styles.vue
+++ b/src/components/model-notice/model-notice-styles.vue
@@ -7,7 +7,7 @@
                     <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-type v-model:typeface="form.topic_typeface" v-model:size="form.topic_size"></text-size-type>
+                            <text-size-group v-model:typeface="form.topic_typeface" v-model:size="form.topic_size"></text-size-group>
                         </div>
                     </el-form-item>
                     <el-form-item label="标题背景" class="topic">
@@ -28,7 +28,7 @@
                 <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-type v-model:typeface="form.news_typeface" v-model:size="form.news_size"></text-size-type>
+                        <text-size-group v-model:typeface="form.news_typeface" v-model:size="form.news_size"></text-size-group>
                     </div>
                 </el-form-item>
             </card-container>
diff --git a/src/components/model-shop-list/model-shop-list-styles.vue b/src/components/model-shop-list/model-shop-list-styles.vue
index 42c32e8b..cdb486f8 100644
--- a/src/components/model-shop-list/model-shop-list-styles.vue
+++ b/src/components/model-shop-list/model-shop-list-styles.vue
@@ -4,27 +4,18 @@
             <card-container class="mb-8">
                 <div class="mb-12">商品样式</div>
                 <el-form-item label="商品名称">
-                    <text-size-type v-model:typeface="form.shop_title_typeface" v-model:size="form.shop_title_size"></text-size-type>
-                </el-form-item>
-                <el-form-item label="名称色值">
-                    <color-picker v-model="form.shop_title_color" default-color="#000000"></color-picker>
+                    <color-text-size-group v-model:color="form.shop_title_color" v-model:typeface="form.shop_title_typeface" v-model:size="form.shop_title_size" default-color="#000000"></color-text-size-group>
                 </el-form-item>
                 <el-form-item label="商品价格">
-                    <text-size-type v-model:typeface="form.shop_price_typeface" v-model:size="form.shop_price_size"></text-size-type>
-                </el-form-item>
-                <el-form-item label="价格色值">
-                    <color-picker v-model="form.shop_price_color" default-color="#000000"></color-picker>
+                    <color-text-size-group v-model:color="form.shop_price_color" v-model:typeface="form.shop_price_typeface" v-model:size="form.shop_price_size" default-color="#000000"></color-text-size-group>
                 </el-form-item>
                 <template v-if="theme != '6'">
                     <el-form-item label="已售数量">
-                        <text-size-type v-model:typeface="form.shop_sold_number_typeface" v-model:size="form.shop_sold_number_size"></text-size-type>
-                    </el-form-item>
-                    <el-form-item label="数量设置">
-                        <color-picker v-model="form.shop_sold_number_color" default-color="#000000"></color-picker>
+                        <color-text-size-group v-model:color="form.shop_sold_number_color" v-model:typeface="form.shop_sold_number_typeface" v-model:size="form.shop_sold_number_size" default-color="#000000"></color-text-size-group>
                     </el-form-item>
                 </template>
                 <!-- <el-form-item label="评分">
-                    <text-size-type v-model:typeface="form.shop_score_typeface" v-model:size="form.shop_score_size"></text-size-type>
+                    <text-size-group v-model:typeface="form.shop_score_typeface" v-model:size="form.shop_score_size"></text-size-group>
                 </el-form-item>
                 <el-form-item label="评分颜色">
                     <color-picker v-model="form.shop_score_color" default-color="#000000"></color-picker>
@@ -58,10 +49,10 @@
             <card-container class="mb-8">
                 <div class="mb-12">购物车按钮</div>
                 <el-form-item label="按钮颜色" class="topic">
-                    <flex-gradients-create :color-list="form.shop_button_color" default-color="#2a94ff"></flex-gradients-create>
+                    <flex-gradients-create :color-list="form.shop_button_color" default-color="#FF3D53"></flex-gradients-create>
                 </el-form-item>
                 <el-form-item label="立即购买">
-                    <text-size-type v-model:typeface="form.shop_button_typeface" v-model:size="form.shop_button_size"></text-size-type>
+                    <text-size-group v-model:typeface="form.shop_button_typeface" v-model:size="form.shop_button_size"></text-size-group>
                 </el-form-item>
             </card-container>
         </el-form>
diff --git a/src/components/model-shop-tabs/model-shop-tabs-styles.vue b/src/components/model-shop-tabs/model-shop-tabs-styles.vue
index 5b1a6fe0..f9e48f19 100644
--- a/src/components/model-shop-tabs/model-shop-tabs-styles.vue
+++ b/src/components/model-shop-tabs/model-shop-tabs-styles.vue
@@ -7,38 +7,23 @@
                     <mult-color-picker :value="form.tabs_checked" :type="form.tabs_direction" @update:value="tabs_checked_event"></mult-color-picker>
                 </el-form-item>
                 <el-form-item label="选中文字">
-                    <div class="flex-col w h gap-10">
-                        <color-picker v-model="form.tabs_color_checked" default-color="rgba(51,51,51,1)"></color-picker>
-                        <text-size-type v-model:typeface="form.tabs_weight_checked" v-model:size="form.tabs_size_checked"></text-size-type>
-                    </div>
+                    <color-text-size-group v-model:color="form.tabs_color_checked" v-model:typeface="form.tabs_weight_checked" v-model:size="form.tabs_size_checked" default-color="rgba(51,51,51,1)"></color-text-size-group>
                 </el-form-item>
                 <el-form-item label="未选文字">
-                    <div class="flex-col w h gap-10">
-                        <color-picker v-model="form.tabs_color" default-color="rgba(51,51,51,1)"></color-picker>
-                        <text-size-type v-model:typeface="form.tabs_weight" v-model:size="form.tabs_size"></text-size-type>
-                    </div>
+                    <color-text-size-group v-model:color="form.tabs_color" v-model:typeface="form.tabs_weight" v-model:size="form.tabs_size" default-color="rgba(51,51,51,1)"></color-text-size-group>
                 </el-form-item>
             </card-container>
             <card-container class="mb-8">
                 <div class="mb-12">内容样式</div>
                 <el-form-item label="商品名称">
-                    <text-size-type v-model:typeface="form.shop_title_typeface" v-model:size="form.shop_title_size"></text-size-type>
-                </el-form-item>
-                <el-form-item label="名称色值">
-                    <color-picker v-model="form.shop_title_color" default-color="#000000"></color-picker>
+                    <color-text-size-group v-model:color="form.shop_title_color" v-model:typeface="form.shop_title_typeface" v-model:size="form.shop_title_size" default-color="#000000"></color-text-size-group>
                 </el-form-item>
                 <el-form-item label="商品价格">
-                    <text-size-type v-model:typeface="form.shop_price_typeface" v-model:size="form.shop_price_size"></text-size-type>
-                </el-form-item>
-                <el-form-item label="价格色值">
-                    <color-picker v-model="form.shop_price_color" default-color="#000000"></color-picker>
+                    <color-text-size-group v-model:color="form.shop_price_color" v-model:typeface="form.shop_price_typeface" v-model:size="form.shop_price_size" default-color="#000000"></color-text-size-group>
                 </el-form-item>
                 <template v-if="theme != '6'">
                     <el-form-item label="已售数量">
-                        <text-size-type v-model:typeface="form.shop_sold_number_typeface" v-model:size="form.shop_sold_number_size"></text-size-type>
-                    </el-form-item>
-                    <el-form-item label="数量设置">
-                        <color-picker v-model="form.shop_sold_number_color" default-color="#000000"></color-picker>
+                        <color-text-size-group v-model:color="form.shop_sold_number_color" v-model:typeface="form.shop_sold_number_typeface" v-model:size="form.shop_sold_number_size" default-color="#000000"></color-text-size-group>
                     </el-form-item>
                 </template>
                 <el-form-item label="内容圆角">
@@ -67,7 +52,7 @@
                     </template>
                 </template>
                 <!-- <el-form-item label="评分">
-                    <text-size-type v-model:typeface="form.shop_score_typeface" v-model:size="form.shop_score_size"></text-size-type>
+                    <text-size-group v-model:typeface="form.shop_score_typeface" v-model:size="form.shop_score_size"></text-size-group>
                 </el-form-item>
                 <el-form-item label="评分颜色">
                     <color-picker v-model="form.shop_score_color" default-color="#000000"></color-picker>
@@ -79,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-type v-model:typeface="form.shop_button_typeface" v-model:size="form.shop_button_size"></text-size-type>
+                    <text-size-group v-model:typeface="form.shop_button_typeface" v-model:size="form.shop_button_size"></text-size-group>
                 </el-form-item>
             </card-container>
         </el-form>
diff --git a/src/components/model-tabs/model-tabs-styles.vue b/src/components/model-tabs/model-tabs-styles.vue
index 95b39348..06e0e131 100644
--- a/src/components/model-tabs/model-tabs-styles.vue
+++ b/src/components/model-tabs/model-tabs-styles.vue
@@ -6,17 +6,11 @@
                 <el-form-item label="选中装饰">
                     <mult-color-picker :value="form.tabs_checked" :type="form.tabs_direction" @update:value="tabs_checked_event"></mult-color-picker>
                 </el-form-item>
-                <el-form-item label="选中文字" class="">
-                    <div class="flex-col w h gap-10">
-                        <color-picker v-model="form.tabs_color_checked" default-color="rgba(51,51,51,1)"></color-picker>
-                        <text-size-type v-model:typeface="form.tabs_weight_checked" v-model:size="form.tabs_size_checked"></text-size-type>
-                    </div>
+                <el-form-item label="选中文字">
+                    <color-text-size-group v-model:color="form.tabs_color_checked" v-model:typeface="form.tabs_weight_checked" v-model:size="form.tabs_size_checked" default-color="rgba(51,51,51,1)"></color-text-size-group>
                 </el-form-item>
                 <el-form-item label="未选文字">
-                    <div class="flex-col w h gap-10">
-                        <color-picker v-model="form.tabs_color" default-color="rgba(51,51,51,1)"></color-picker>
-                        <text-size-type v-model:typeface="form.tabs_weight" v-model:size="form.tabs_size"></text-size-type>
-                    </div>
+                    <color-text-size-group v-model:color="form.tabs_color" v-model:typeface="form.tabs_weight" v-model:size="form.tabs_size" default-color="rgba(51,51,51,1)"></color-text-size-group>
                 </el-form-item>
             </card-container>
         </el-form>

From 0cba639eeca67281916433c087ab0359c8876a36 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E4=BA=8E=E8=82=96=E7=A3=8A?= <18851179580@163.com>
Date: Tue, 27 Aug 2024 13:59:37 +0800
Subject: [PATCH 2/2] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E7=BB=84=E4=BB=B6?=
 =?UTF-8?q?=E7=9A=84=E7=BB=84=E6=88=90?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../common/color-text-size-group/index.vue    | 24 ++++++++++++--
 .../common/text-size-group/index.vue          | 33 -------------------
 .../components/tabs-styles.vue                | 10 ++----
 .../model-notice/model-notice-styles.vue      | 10 ++----
 .../model-shop-list-styles.vue                |  2 +-
 .../model-shop-tabs-styles.vue                |  2 +-
 6 files changed, 27 insertions(+), 54 deletions(-)
 delete mode 100644 src/components/common/text-size-group/index.vue

diff --git a/src/components/common/color-text-size-group/index.vue b/src/components/common/color-text-size-group/index.vue
index 45842bfc..c385b9b1 100644
--- a/src/components/common/color-text-size-group/index.vue
+++ b/src/components/common/color-text-size-group/index.vue
@@ -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>
\ No newline at end of file
diff --git a/src/components/common/text-size-group/index.vue b/src/components/common/text-size-group/index.vue
deleted file mode 100644
index e334a54d..00000000
--- a/src/components/common/text-size-group/index.vue
+++ /dev/null
@@ -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>
\ No newline at end of file
diff --git a/src/components/model-data-magic/components/tabs-styles.vue b/src/components/model-data-magic/components/tabs-styles.vue
index 385e9d8e..ece9e257 100644
--- a/src/components/model-data-magic/components/tabs-styles.vue
+++ b/src/components/model-data-magic/components/tabs-styles.vue
@@ -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="内间距">
diff --git a/src/components/model-notice/model-notice-styles.vue b/src/components/model-notice/model-notice-styles.vue
index c2874450..c645d3eb 100644
--- a/src/components/model-notice/model-notice-styles.vue
+++ b/src/components/model-notice/model-notice-styles.vue
@@ -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>
diff --git a/src/components/model-shop-list/model-shop-list-styles.vue b/src/components/model-shop-list/model-shop-list-styles.vue
index cdb486f8..3ed4d2f5 100644
--- a/src/components/model-shop-list/model-shop-list-styles.vue
+++ b/src/components/model-shop-list/model-shop-list-styles.vue
@@ -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>
diff --git a/src/components/model-shop-tabs/model-shop-tabs-styles.vue b/src/components/model-shop-tabs/model-shop-tabs-styles.vue
index f9e48f19..3743276a 100644
--- a/src/components/model-shop-tabs/model-shop-tabs-styles.vue
+++ b/src/components/model-shop-tabs/model-shop-tabs-styles.vue
@@ -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>