1.项目页签图标替换

loulijun2021

2022-12-31 95faeea7f46a9d8f4817c8950c697835a463ec1b

 src/layout/components/Settings/index.vue

@@ -1,11 +1,46 @@
<template>
  <div class="drawer-container">
    <div>
      <h3 class="drawer-title">Page style setting</h3>
      <h3 class="drawer-title">项目配置</h3>

      <div class="drawer-item">
        <span>Theme Color</span>
        <span>主题颜色</span>
        <theme-picker style="float: right;height: 26px;margin: -3px 8px 0 0;" @change="themeChange" />
      </div>

      <div class="drawer-item" style="display: flex;justify-content: space-between">
        <span>头部颜色</span>
        <el-switch
          v-model="$store.state.settings.headBackgroundColorValue"
          style="display: block"
          active-color="#304156"
          inactive-color="#ccc"
          active-text="深色"
          inactive-text="浅色"
        />
      </div>
      <div class="drawer-item" style="display: flex;justify-content: space-between">
        <span>菜单模式</span>
        <el-switch
          v-model="$store.state.settings.menuIsHorizontal"
          style="display: block"
          :active-color="$store.state.settings.theme"
          inactive-color="#ccc"
          active-text="横向"
          inactive-text="竖向"
        />
      </div>
      <div class="drawer-item" style="display: flex;justify-content: space-between">
        <span>左侧颜色</span>
        <el-switch
          v-model="$store.state.settings.leftBackgroundColorValue"
          style="display: block"
          active-color="#304156"
          :disabled="$store.state.settings.menuIsHorizontal"
          inactive-color="#ccc"
          active-text="深色"
          inactive-text="浅色"
        />
      </div>

      <!--      此三个功能暂时不用-->
@@ -92,7 +127,7 @@
  .drawer-title {
    margin-bottom: 12px;
    color: rgba(0, 0, 0, .85);
    font-size: 14px;
    font-size: 18px;
    line-height: 22px;
  }