新增标签页样式chrome风格

ruoyi-ui/src/layout/components/Settings/index.vue

@@ -61,7 +61,7 @@
         <h3 class="drawer-title">系统布局配置</h3>
 
         <div class="drawer-item">
-          <span>开启 Tags-Views</span>
+          <span>开启页签</span>
           <el-switch v-model="tagsView" class="drawer-switch" />
         </div>
 
@@ -75,6 +75,14 @@
           <el-switch v-model="tagsIcon" :disabled="!tagsView" class="drawer-switch" />
         </div>
 
+        <div class="drawer-item">
+          <span>标签页样式</span>
+          <el-radio-group v-model="tagsViewStyle" :disabled="!tagsView" size="mini" class="drawer-switch">
+            <el-radio-button label="card">卡片</el-radio-button>
+            <el-radio-button label="chrome">谷歌</el-radio-button>
+          </el-radio-group>
+        </div>
+
         <div class="drawer-item">
           <span>固定 Header</span>
           <el-switch v-model="fixedHeader" class="drawer-switch" />
@@ -163,6 +171,17 @@ export default {
         })
       }
     },
+    tagsViewStyle: {
+      get() {
+        return this.$store.state.settings.tagsViewStyle
+      },
+      set(val) {
+        this.$store.dispatch('settings/changeSetting', {
+          key: 'tagsViewStyle',
+          value: val
+        })
+      }
+    },
     sidebarLogo: {
       get() {
         return this.$store.state.settings.sidebarLogo
@@ -256,6 +275,7 @@ export default {
             "navType":${this.navType},
             "tagsView":${this.tagsView},
             "tagsIcon":${this.tagsIcon},
+            "tagsViewStyle":"${this.tagsViewStyle}",
             "tagsViewPersist":${this.tagsViewPersist},
             "fixedHeader":${this.fixedHeader},
             "sidebarLogo":${this.sidebarLogo},