|
@@ -5,7 +5,42 @@
|
|
|
<img style="width: 22px;height: 22px;vertical-align: middle;margin: 0 5px;" src="../../assets/icon_movie.png"/>
|
|
|
<span style="vertical-align: middle;">帮助</span>
|
|
|
</p>
|
|
|
+ <!-- 通知 -->
|
|
|
<notice-icon class="action"/>
|
|
|
+ <!-- 皮肤设置 -->
|
|
|
+ <a-popover trigger="click">
|
|
|
+ <div slot="content" style="width: 200px;">
|
|
|
+ <a-form-model :label-col="{ span: 8 }" :wrapper-col="{ span: 16 }">
|
|
|
+ <a-form-model-item label="主题">
|
|
|
+ <a-radio-group @change="changeTheme">
|
|
|
+ <a-radio-button value="dark">
|
|
|
+ 深色
|
|
|
+ </a-radio-button>
|
|
|
+ <a-radio-button value="light">
|
|
|
+ 浅色
|
|
|
+ </a-radio-button>
|
|
|
+ </a-radio-group>
|
|
|
+ </a-form-model-item>
|
|
|
+ <a-form-model-item label="字体大小">
|
|
|
+ <a-radio-group>
|
|
|
+ <a-radio-button value="small">
|
|
|
+ 小
|
|
|
+ </a-radio-button>
|
|
|
+ <a-radio-button value="middle">
|
|
|
+ 中
|
|
|
+ </a-radio-button>
|
|
|
+ <a-radio-button value="large">
|
|
|
+ 大
|
|
|
+ </a-radio-button>
|
|
|
+ </a-radio-group>
|
|
|
+ </a-form-model-item>
|
|
|
+ </a-form-model>
|
|
|
+ </div>
|
|
|
+ <span class="skin">
|
|
|
+ <a-icon style="font-size: 15px; padding: 0 3px 0 0" type="skin" />
|
|
|
+ 设置
|
|
|
+ </span>
|
|
|
+ </a-popover>
|
|
|
<a-dropdown>
|
|
|
<span class="action ant-dropdown-link user-dropdown-menu">
|
|
|
<!-- <a-avatar class="avatar" size="small" :src="avatar==''?defaultAvatar:avatar"/> -->
|
|
@@ -137,20 +172,25 @@ export default {
|
|
|
description: ((err.response || {}).data || {}).message || err.message || '请求出现错误,请稍后再试',
|
|
|
duration: 4
|
|
|
})
|
|
|
+ },
|
|
|
+ // 切换主题
|
|
|
+ changeTheme (e) {
|
|
|
+ console.log(e)
|
|
|
+ this.$store.dispatch('ToggleTheme', e.target.value)
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
</script>
|
|
|
<style scoped="scoped">
|
|
|
-.help-cont{
|
|
|
+.help-cont,.skin{
|
|
|
display: inline-block;
|
|
|
cursor: pointer;
|
|
|
transition: all 0.3s;
|
|
|
- padding: 0 5px;
|
|
|
+ padding: 0 12px;
|
|
|
margin: 0;
|
|
|
vertical-align: bottom;
|
|
|
}
|
|
|
-.help-cont:hover {
|
|
|
+.help-cont:hover, .skin:hover {
|
|
|
background-color: rgba(0, 0, 0, 0.04);
|
|
|
}
|
|
|
</style>
|