| | |
| | | <template>
|
| | | <el-drawer v-model="showSettings" direction="rtl" size="300px">
|
| | | <div class="setting-drawer-title">
|
| | | <h3 class="drawer-title">主题风格设置</h3>
|
| | | </div>
|
| | | <div class="setting-drawer-block-checbox">
|
| | | <div
|
| | | class="setting-drawer-block-checbox-item"
|
| | | @click="handleTheme('theme-dark')"
|
| | | >
|
| | | <img src="@/assets/images/dark.svg" alt="dark" />
|
| | | <div
|
| | | v-if="sideTheme === 'theme-dark'"
|
| | | class="setting-drawer-block-checbox-selectIcon"
|
| | | style="display: block"
|
| | | >
|
| | | <i aria-label="图标: check" class="anticon anticon-check">
|
| | | <svg
|
| | | viewBox="64 64 896 896"
|
| | | data-icon="check"
|
| | | width="1em"
|
| | | height="1em"
|
| | | :fill="theme"
|
| | | aria-hidden="true"
|
| | | focusable="false"
|
| | | class
|
| | | >
|
| | | <path
|
| | | d="M912 190h-69.9c-9.8 0-19.1 4.5-25.1 12.2L404.7 724.5 207 474a32 32 0 0 0-25.1-12.2H112c-6.7 0-10.4 7.7-6.3 12.9l273.9 347c12.8 16.2 37.4 16.2 50.3 0l488.4-618.9c4.1-5.1.4-12.8-6.3-12.8z"
|
| | | />
|
| | | </svg>
|
| | | </i>
|
| | | </div>
|
| | | </div>
|
| | | <div
|
| | | class="setting-drawer-block-checbox-item"
|
| | | @click="handleTheme('theme-light')"
|
| | | >
|
| | | <img src="@/assets/images/light.svg" alt="light" />
|
| | | <div
|
| | | v-if="sideTheme === 'theme-light'"
|
| | | class="setting-drawer-block-checbox-selectIcon"
|
| | | style="display: block"
|
| | | >
|
| | | <i aria-label="图标: check" class="anticon anticon-check">
|
| | | <svg
|
| | | viewBox="64 64 896 896"
|
| | | data-icon="check"
|
| | | width="1em"
|
| | | height="1em"
|
| | | :fill="theme"
|
| | | aria-hidden="true"
|
| | | focusable="false"
|
| | | class
|
| | | >
|
| | | <path
|
| | | d="M912 190h-69.9c-9.8 0-19.1 4.5-25.1 12.2L404.7 724.5 207 474a32 32 0 0 0-25.1-12.2H112c-6.7 0-10.4 7.7-6.3 12.9l273.9 347c12.8 16.2 37.4 16.2 50.3 0l488.4-618.9c4.1-5.1.4-12.8-6.3-12.8z"
|
| | | />
|
| | | </svg>
|
| | | </i>
|
| | | </div>
|
| | | </div>
|
| | | </div>
|
| | | <!-- <div class="setting-drawer-title">-->
|
| | | <!-- <h3 class="drawer-title">主题风格设置</h3>-->
|
| | | <!-- </div>-->
|
| | | <!-- <div class="setting-drawer-block-checbox">-->
|
| | | <!-- <div-->
|
| | | <!-- class="setting-drawer-block-checbox-item"-->
|
| | | <!-- @click="handleTheme('theme-dark')"-->
|
| | | <!-- >-->
|
| | | <!-- <img src="@/assets/images/dark.svg" alt="dark" />-->
|
| | | <!-- <div-->
|
| | | <!-- v-if="sideTheme === 'theme-dark'"-->
|
| | | <!-- class="setting-drawer-block-checbox-selectIcon"-->
|
| | | <!-- style="display: block"-->
|
| | | <!-- >-->
|
| | | <!-- <i aria-label="图标: check" class="anticon anticon-check">-->
|
| | | <!-- <svg-->
|
| | | <!-- viewBox="64 64 896 896"-->
|
| | | <!-- data-icon="check"-->
|
| | | <!-- width="1em"-->
|
| | | <!-- height="1em"-->
|
| | | <!-- :fill="theme"-->
|
| | | <!-- aria-hidden="true"-->
|
| | | <!-- focusable="false"-->
|
| | | <!-- class-->
|
| | | <!-- >-->
|
| | | <!-- <path-->
|
| | | <!-- d="M912 190h-69.9c-9.8 0-19.1 4.5-25.1 12.2L404.7 724.5 207 474a32 32 0 0 0-25.1-12.2H112c-6.7 0-10.4 7.7-6.3 12.9l273.9 347c12.8 16.2 37.4 16.2 50.3 0l488.4-618.9c4.1-5.1.4-12.8-6.3-12.8z"-->
|
| | | <!-- />-->
|
| | | <!-- </svg>-->
|
| | | <!-- </i>-->
|
| | | <!-- </div>-->
|
| | | <!-- </div>-->
|
| | | <!-- <div-->
|
| | | <!-- class="setting-drawer-block-checbox-item"-->
|
| | | <!-- @click="handleTheme('theme-light')"-->
|
| | | <!-- >-->
|
| | | <!-- <img src="@/assets/images/light.svg" alt="light" />-->
|
| | | <!-- <div-->
|
| | | <!-- v-if="sideTheme === 'theme-light'"-->
|
| | | <!-- class="setting-drawer-block-checbox-selectIcon"-->
|
| | | <!-- style="display: block"-->
|
| | | <!-- >-->
|
| | | <!-- <i aria-label="图标: check" class="anticon anticon-check">-->
|
| | | <!-- <svg-->
|
| | | <!-- viewBox="64 64 896 896"-->
|
| | | <!-- data-icon="check"-->
|
| | | <!-- width="1em"-->
|
| | | <!-- height="1em"-->
|
| | | <!-- :fill="theme"-->
|
| | | <!-- aria-hidden="true"-->
|
| | | <!-- focusable="false"-->
|
| | | <!-- class-->
|
| | | <!-- >-->
|
| | | <!-- <path-->
|
| | | <!-- d="M912 190h-69.9c-9.8 0-19.1 4.5-25.1 12.2L404.7 724.5 207 474a32 32 0 0 0-25.1-12.2H112c-6.7 0-10.4 7.7-6.3 12.9l273.9 347c12.8 16.2 37.4 16.2 50.3 0l488.4-618.9c4.1-5.1.4-12.8-6.3-12.8z"-->
|
| | | <!-- />-->
|
| | | <!-- </svg>-->
|
| | | <!-- </i>-->
|
| | | <!-- </div>-->
|
| | | <!-- </div>-->
|
| | | <!-- </div>-->
|
| | | <div class="drawer-item">
|
| | | <span>主题颜色</span>
|
| | | <span class="comp-style">
|
| | |
| | | "#81D8D0",
|
| | | "#E85827",
|
| | | "#008C8C",
|
| | | "#002FA7",
|
| | | "#F9DC24",
|
| | | "#B05923",
|
| | | "#003153",
|