From 5697f042a43fb707a3dd3d836711e76180af7b21 Mon Sep 17 00:00:00 2001
From: sws <1141121512@qq.com>
Date: Tue, 24 Sep 2024 13:35:57 +0800
Subject: [PATCH] =?UTF-8?q?1.=E6=96=B0=E5=A2=9E=E5=BA=95=E9=83=A8=E5=AF=BC?=
 =?UTF-8?q?=E8=88=AA=E5=8D=95=E7=8B=AC=E9=85=8D=E7=BD=AE=E9=A1=B5=E9=9D=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../footer-nav/footer-nav-content.vue         | 10 +++++-----
 .../tabbar/components/settings/index.vue      | 19 +++++++++++--------
 src/views/tabbar/index.vue                    | 15 ++++++++++-----
 3 files changed, 26 insertions(+), 18 deletions(-)

diff --git a/src/components/footer-nav/footer-nav-content.vue b/src/components/footer-nav/footer-nav-content.vue
index 230ce46b..c04c42e7 100644
--- a/src/components/footer-nav/footer-nav-content.vue
+++ b/src/components/footer-nav/footer-nav-content.vue
@@ -5,15 +5,15 @@
                 <div class="mb-12">展示设置</div>
                 <el-form-item label="导航样式">
                     <el-radio-group v-model="form.nav_style" is-button @change="nav_style_change">
-                        <el-radio :value="0">图片加文字</el-radio>
-                        <el-radio :value="1">图片</el-radio>
-                        <el-radio :value="2">文字</el-radio>
+                        <el-radio value="0">图片加文字</el-radio>
+                        <el-radio value="1">图片</el-radio>
+                        <el-radio value="2">文字</el-radio>
                     </el-radio-group>
                 </el-form-item>
                 <el-form-item label="导航类型">
                     <el-radio-group v-model="form.nav_type" is-button @change="nav_type_change">
-                        <el-radio :value="0">底部固定</el-radio>
-                        <el-radio :value="1">底部悬浮</el-radio>
+                        <el-radio value="0">底部固定</el-radio>
+                        <el-radio value="1">底部悬浮</el-radio>
                     </el-radio-group>
                 </el-form-item>
             </card-container>
diff --git a/src/views/tabbar/components/settings/index.vue b/src/views/tabbar/components/settings/index.vue
index d4b2a405..ba7dcdb4 100644
--- a/src/views/tabbar/components/settings/index.vue
+++ b/src/views/tabbar/components/settings/index.vue
@@ -1,16 +1,17 @@
 <template>
     <!-- 顶部导航栏 -->
     <div class="settings">
-        <card-container class="settings-title flex-row jc-sb align-c mb-8" padding="2.1rem 3.8rem">
-            <div class="title">底部导航</div>
+        <div class="settings-title flex-row jc-c align-c mb-8 w">
             <el-radio-group v-model="radio" class="radio-group" size="large" is-button>
                 <el-radio-button class="radio-item" value="1">内容</el-radio-button>
                 <el-radio-button class="radio-item" value="2">样式</el-radio-button>
             </el-radio-group>
-        </card-container>
-        <div class="setting-content">
-            <!-- 底部导航 -->
-            <footer-nav-setting :type="radio" :value="value"></footer-nav-setting>
+        </div>
+        <div class="box-shadow-sm">
+            <div class="setting-content">
+                <!-- 底部导航 -->
+                <footer-nav-setting :type="radio" :value="value"></footer-nav-setting>
+            </div>
         </div>
     </div>
 </template>
@@ -21,17 +22,16 @@ const props = defineProps({
         default: () => ({}),
     },
 });
-console.log(props.value);
 const radio = ref('1'); // 创建一个响应式的数字变量，初始值为0
 </script>
 <style lang="scss" scoped>
 .settings {
     width: 46rem;
-    overflow: auto;
     display: flex;
     flex-direction: column;
     .settings-title {
         height: 7.8rem;
+        padding: 2.1rem 3.8rem;
         .title {
             font-size: 16px;
             font-weight: 500;
@@ -40,11 +40,14 @@ const radio = ref('1'); // 创建一个响应式的数字变量，初始值为0
         .radio-group {
             background: #f4f4f4;
             border-radius: 100rem;
+            width: 100%;
             .el-radio-button {
                 overflow: hidden;
+                width: 50%;
                 border-radius: 100rem;
                 :deep(.el-radio-button__inner) {
                     border: 0;
+                    width: 100%;
                     background: #f4f4f4;
                 }
                 :deep(.el-radio-button__original-radio:checked + .el-radio-button__inner) {
diff --git a/src/views/tabbar/index.vue b/src/views/tabbar/index.vue
index 1fa71982..f123dae9 100644
--- a/src/views/tabbar/index.vue
+++ b/src/views/tabbar/index.vue
@@ -18,6 +18,7 @@
 </template>
 
 <script setup lang="ts">
+import { get_math } from '@/utils';
 import { Settings, AppMain } from './components/index';
 import defaultSettings from './components/main/index';
 import { cloneDeep } from 'lodash';
@@ -43,6 +44,7 @@ const init = () => {
             } else {
                 form.value = cloneDeep(temp_form.value);
             }
+            key.value = get_math();
             loading_event();
         })
         .catch(() => {
@@ -88,11 +90,14 @@ const save_event = () => {
 .app-wrapper {
     background-color: #fff;
     .app-wrapper-content {
-        height: calc(100vh - 11.1rem);
+        height: calc(100vh - 6.2rem);
     }
     .app-wrapper-footer {
-        height: 11.1rem;
-        padding: 3.5rem 2rem;
+        height: 6.2rem;
+        padding: 1.5rem;
+        border-top: 0.1rem solid #f5f5f5;
+        position: relative;
+        background: #fff;
         .footer-save {
             height: 3.1rem;
             line-height: 3.1rem;
@@ -115,9 +120,9 @@ const save_event = () => {
     box-shadow: 0 0.5rem 2rem rgba(50, 55, 58, 0.1);
 }
 :deep(.settings) {
-    box-shadow: 0 0.5rem 2rem rgba(50, 55, 58, 0.1);
+    // box-shadow: 0 0.5rem 2rem rgba(50, 55, 58, 0.1);
     .settings-title {
-        box-shadow: 0 0.5rem 2rem rgba(50, 55, 58, 0.1);
+        // box-shadow: 0 0.5rem 2rem rgba(50, 55, 58, 0.1);
     }
 }
 </style>