From 0215b076ade59be98d6715fe18ca56762fa56196 Mon Sep 17 00:00:00 2001
From: sws <1141121512@qq.com>
Date: Thu, 29 Aug 2024 14:52:28 +0800
Subject: [PATCH] =?UTF-8?q?1.=E6=B5=8B=E8=AF=95=E4=BC=98=E5=8C=96=E4=BF=AE?=
 =?UTF-8?q?=E6=94=B9=20sws=202024-08-28?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/base/color-picker/index.vue    |  8 ++-----
 src/components/common/common-styles/index.vue |  8 ++-----
 .../model-image/model-image-style.vue         |  5 +---
 .../model-article-list-content.vue            |  7 +++++-
 .../model-article-tabs-content.vue            | 15 +++++++++---
 .../model-shop-tabs-content.vue               | 10 +++++---
 .../model-tabs/model-tabs-content.vue         | 24 +++++++++++--------
 src/layout/components/settings/index.vue      |  1 +
 src/styles/common.scss                        | 12 ++++------
 9 files changed, 50 insertions(+), 40 deletions(-)

diff --git a/src/components/base/color-picker/index.vue b/src/components/base/color-picker/index.vue
index 813230c7..9d806667 100644
--- a/src/components/base/color-picker/index.vue
+++ b/src/components/base/color-picker/index.vue
@@ -1,6 +1,6 @@
 <template>
     <div class="flex-row align-c gap-12">
-        <el-color-picker v-model="color" :predefine="predefine_colors" @change="color_picker_change"  />
+        <el-color-picker v-model="color" :predefine="predefine_colors" />
         <icon name="reset" color="primary" size="16" :class="['c-pointer', { disable: color == defaultColor }]" @click="reset_event"></icon>
     </div>
 </template>
@@ -17,11 +17,8 @@ const props = withDefaults(defineProps<Props>(), {
 });
 
 const color = defineModel({ type: String });
-const emit = defineEmits(['update:value']);
-const color_picker_change = (val: string | null) => {
-    emit('update:value', val);
-};
 const reset_event = () => {
+    console.log(1);
     if (color.value == props.defaultColor) {
         return;
     } else {
@@ -30,7 +27,6 @@ const reset_event = () => {
         } else {
             color.value = '';
         }
-        emit('update:value', color.value);
     }
 };
 </script>
diff --git a/src/components/common/common-styles/index.vue b/src/components/common/common-styles/index.vue
index f58a6859..a5a84be9 100644
--- a/src/components/common/common-styles/index.vue
+++ b/src/components/common/common-styles/index.vue
@@ -37,7 +37,7 @@
                 <el-form-item v-if="isShadow" label="阴影设置">
                     <div class="flex-col gap-10 w">
                         <el-form-item label="颜色" label-width="45">
-                            <color-picker v-model="form.box_shadow_color" @update:value="box_shadow_color_event"></color-picker>
+                            <color-picker v-model="form.box_shadow_color"></color-picker>
                         </el-form-item>
                         <el-form-item label="X轴" label-width="45">
                             <slider v-model="form.box_shadow_x" :min="-20" :max="20"></slider>
@@ -75,7 +75,7 @@ const props = defineProps({
     isShadow: {
         type: Boolean,
         default: true,
-    }
+    },
 });
 // 初始化表单数据
 interface color_form {
@@ -139,10 +139,6 @@ const padding_change = (padding: any) => {
     form = Object.assign(form, pick(padding, ['padding', 'padding_top', 'padding_bottom', 'padding_left', 'padding_right']));
     emit('update:value', form);
 };
-const box_shadow_color_event = (val: string) => {
-    form.box_shadow_color = val;
-    emit('update:value', form);
-};
 </script>
 <style lang="scss" scoped>
 .common-styles {
diff --git a/src/components/common/custom-module/model-image/model-image-style.vue b/src/components/common/custom-module/model-image/model-image-style.vue
index a2efca0c..b314b8e7 100644
--- a/src/components/common/custom-module/model-image/model-image-style.vue
+++ b/src/components/common/custom-module/model-image/model-image-style.vue
@@ -30,7 +30,7 @@
                     <el-switch v-model="form.bottom_up" />
                 </el-form-item>
             </card-container>
-            <div class="bg-f5 partition-line" />
+            <div class="bg-f5 divider-line" />
             <card-container class="h">
                 <div class="mb-12">边框设置</div>
                 <el-form-item label="边框显示">
@@ -131,7 +131,4 @@ watch(
     width: 3rem;
     height: 2rem;
 }
-.partition-line {
-    height: 0.8rem;
-}
 </style>
diff --git a/src/components/model-article-list/model-article-list-content.vue b/src/components/model-article-list/model-article-list-content.vue
index c7b0cb0d..f31fe900 100644
--- a/src/components/model-article-list/model-article-list-content.vue
+++ b/src/components/model-article-list/model-article-list-content.vue
@@ -30,7 +30,7 @@
                             </el-select>
                         </el-form-item>
                         <el-form-item label="显示数量">
-                            <el-input v-model="form.number" type="number" min="1" max="50" placeholder="请输入显示数量" clearable />
+                            <el-input-number v-model="form.number" :min="1" :max="50" type="number" placeholder="请输入显示数量" value-on-clear="min" class="w number-show" controls-position="right"></el-input-number>
                         </el-form-item>
                         <el-form-item label="排序类型">
                             <el-radio-group v-model="form.sort">
@@ -198,4 +198,9 @@ const url_value_dialog_call_back = (item: any[]) => {
     width: 4rem;
     height: 4rem;
 }
+.number-show {
+    :deep(.el-input__wrapper .el-input__inner) {
+        text-align: left;
+    }
+}
 </style>
diff --git a/src/components/model-article-tabs/model-article-tabs-content.vue b/src/components/model-article-tabs/model-article-tabs-content.vue
index 6a9095e5..d7c0d118 100644
--- a/src/components/model-article-tabs/model-article-tabs-content.vue
+++ b/src/components/model-article-tabs/model-article-tabs-content.vue
@@ -17,7 +17,7 @@
                     </el-radio-group>
                 </el-form-item>
             </card-container>
-            <card-container class="content-height">
+            <card-container class="content-height mb-8">
                 <div class="mb-12">选项卡设置</div>
                 <div class="nav-list">
                     <drag :data="form.tabs_list" type="card" icon-position="top" :space-col="20" @click="tabs_list_click" @remove="tabs_list_remove" @on-sort="tabs_list_sort">
@@ -48,7 +48,7 @@
                                             </el-select>
                                         </el-form-item>
                                         <el-form-item label="显示数量">
-                                            <el-input v-model="row.number" type="number" min="1" max="50" placeholder="请输入显示数量" clearable />
+                                            <el-input-number v-model="row.number" :min="1" :max="50" type="number" placeholder="请输入显示数量" value-on-clear="min" class="w number-show" controls-position="right"></el-input-number>
                                         </el-form-item>
                                         <el-form-item label="排序类型">
                                             <el-radio-group v-model="row.sort">
@@ -193,7 +193,11 @@ const tabs_list_click = (item: any, index: number) => {
 };
 // 选项卡设置
 const tabs_list_remove = (index: number) => {
-    form.tabs_list.splice(index, 1);
+    if (form.tabs_list.length > 1) {
+        form.tabs_list.splice(index, 1);
+    } else {
+        ElMessage.warning('至少保留一个选项卡');
+    }
 };
 const tabs_list_sort = (item: any) => {
     // 拖拽完成后更新数组
@@ -256,4 +260,9 @@ const tabs_theme_change = (val: string | number | boolean | undefined): void =>
     width: 4rem;
     height: 4rem;
 }
+.number-show {
+    :deep(.el-input__wrapper .el-input__inner) {
+        text-align: left;
+    }
+}
 </style>
diff --git a/src/components/model-shop-tabs/model-shop-tabs-content.vue b/src/components/model-shop-tabs/model-shop-tabs-content.vue
index 3f148084..eb663c9e 100644
--- a/src/components/model-shop-tabs/model-shop-tabs-content.vue
+++ b/src/components/model-shop-tabs/model-shop-tabs-content.vue
@@ -17,7 +17,7 @@
                     </el-radio-group>
                 </el-form-item>
             </card-container>
-            <card-container class="content-height">
+            <card-container class="content-height mb-8">
                 <div class="mb-12">选项卡设置</div>
                 <div class="nav-list">
                     <drag :data="form.tabs_list" type="card" icon-position="top" :space-col="20" @click="tabs_list_click" @remove="tabs_list_remove" @on-sort="tabs_list_sort">
@@ -183,7 +183,11 @@ const tabs_list_click = (item: any, index: number) => {
 };
 // 选项卡设置
 const tabs_list_remove = (index: number) => {
-    form.value.tabs_list.splice(index, 1);
+    if (form.value.tabs_list.length > 1) {
+        form.value.tabs_list.splice(index, 1);
+    } else {
+        ElMessage.warning('至少保留一个选项卡');
+    }
 };
 const tabs_list_sort = (item: any) => {
     form.value.tabs_list = item;
@@ -265,7 +269,7 @@ const change_style = (val: any): void => {
 const is_revise = ref(false);
 const change_shop_type = () => {
     is_revise.value = true;
-}
+};
 </script>
 <style lang="scss" scoped>
 .content {
diff --git a/src/components/model-tabs/model-tabs-content.vue b/src/components/model-tabs/model-tabs-content.vue
index 89c73d29..1eef3942 100644
--- a/src/components/model-tabs/model-tabs-content.vue
+++ b/src/components/model-tabs/model-tabs-content.vue
@@ -37,7 +37,7 @@
                                     <url-value v-model="scoped.row.micro_page_list"></url-value>
                                 </template>
                                 <template v-else>
-                                    <url-value v-model="scoped.row.classify" :type="[ 'goods-category' ]"></url-value>
+                                    <url-value v-model="scoped.row.classify" :type="['goods-category']"></url-value>
                                 </template>
                             </el-form-item>
                         </div>
@@ -59,12 +59,12 @@ const props = defineProps({
     tabStyle: {
         type: Object,
         default: () => ({}),
-    }
+    },
 });
 
 const state = reactive({
     form: props.value,
-    styles: props.tabStyle
+    styles: props.tabStyle,
 });
 const { form, styles } = toRefs(state);
 const add = () => {
@@ -76,17 +76,21 @@ const add = () => {
         classify: {},
         micro_page: '',
         micro_page_list: [],
-        category_list: []
-    })
-}
+        category_list: [],
+    });
+};
 const remove = (index: number) => {
-    form.value.tabs_list.splice(index, 1);
-}
+    if (form.value.tabs_list.length > 1) {
+        form.value.tabs_list.splice(index, 1);
+    } else {
+        ElMessage.warning('至少保留一个选项卡');
+    }
+};
 // 拖拽更新之后，更新数据
 const on_sort = (new_list: nav_group[]) => {
     form.value.tabs_list = new_list;
-}
-const tabs_theme_change = (val: string | number | boolean | undefined):void => {
+};
+const tabs_theme_change = (val: string | number | boolean | undefined): void => {
     styles.value.tabs_color_checked = tabs_style(styles.value.tabs_color_checked, val);
 };
 </script>
diff --git a/src/layout/components/settings/index.vue b/src/layout/components/settings/index.vue
index 02cb805a..08cbedb7 100644
--- a/src/layout/components/settings/index.vue
+++ b/src/layout/components/settings/index.vue
@@ -148,6 +148,7 @@ const radio = ref('1'); // 创建一个响应式的数字变量，初始值为0
     .setting-content {
         height: calc(100vh - 16.8rem);
         overflow: auto;
+        background-color: #fff;
     }
 }
 @media screen and (max-width: 1540px) {
diff --git a/src/styles/common.scss b/src/styles/common.scss
index e948f8f6..b346368f 100644
--- a/src/styles/common.scss
+++ b/src/styles/common.scss
@@ -248,13 +248,6 @@
 ::-webkit-scrollbar-thumb:hover {
     background-color: #c7c9cc;
 }
-/*setting content和style的高度控制，仅限只有一块区域的时候使用 */
-.common-content-height {
-    height: calc(100vh - 16.8rem);
-}
-.common-style-height {
-    height: calc(100vh - 36.8rem);
-}
 
 .animate-linear {
     transition: all 0.3s linear;
@@ -264,3 +257,8 @@
 .mask {
     background-color: rgba(0, 0, 0, 0.2);
 }
+
+// 分割线
+.divider-line {
+    height: 0.8rem;
+}