Skip to content

GitLab

S
Starter Web Vue
Commit e7df7eba authored by 水落(YangLei)'s avatar 水落(YangLei)
Browse files
Options

feat: 优化部分代码

parent edddb3b6
Hide whitespace changes
Inline Side-by-side
Showing with 116 additions and 50 deletions
src/main.js
View file @ e7df7eba
......@@ -33,8 +33,7 @@ const store = new Vuex.Store({
//装载vue-router控件 如果开发时 不用动态可直接修改这里 isAsynRount=false
Vue.use(Router);
const isAsynRount = store.state.settingModule.asyncRoutes;
const options = initRouter(isAsynRount);
const options = initRouter();
const router = new Router(options);
//装载vue-i18n控件 如果语言优先级 请直接修改这里localeLang和fallbackLang
......
src/pages/frame/components/setting/Setting.vue
View file @ e7df7eba
<template>
<div class="side-setting">
<setting-item>
<a-button @click="saveSetting" type="primary" icon="save">{{$t('save')}}</a-button>
<a-button @click="resetSetting" type="dashed" icon="redo" style="float: right">{{$t('reset')}}</a-button>
<a-button @click="saveSetting" type="primary" icon="save">{{ $t('save') }}</a-button>
<a-button @click="resetSetting" type="dashed" icon="redo" style="float: right">
{{ $t('reset') }}
</a-button>
</setting-item>
<setting-item :title="$t('theme.title')">
<img-checkbox-group @change="values => setTheme({...theme, mode: values[0]})" :default-values="[theme.mode]">
<img-checkbox :title="$t('theme.dark')" img="https://gw.alipayobjects.com/zos/rmsportal/LCkqqYNmvBEbokSDscrm.svg" value="dark" />
<img-checkbox :title="$t('theme.light')" img="https://gw.alipayobjects.com/zos/rmsportal/jpRkZQMyYRryryPNtyIC.svg" value="light" />
<img-checkbox :title="$t('theme.night')" img="https://gw.alipayobjects.com/zos/antfincdn/hmKaLQvmY2/LCkqqYNmvBEbokSDscrm.svg" value="night" />
<img-checkbox-group
@change="values => setTheme({ ...theme, mode: values[0] })"
:default-values="[theme.mode]"
>
<img-checkbox
:title="$t('theme.dark')"
img="https://gw.alipayobjects.com/zos/rmsportal/LCkqqYNmvBEbokSDscrm.svg"
value="dark"
/>
<img-checkbox
:title="$t('theme.light')"
img="https://gw.alipayobjects.com/zos/rmsportal/jpRkZQMyYRryryPNtyIC.svg"
value="light"
/>
</img-checkbox-group>
</setting-item>
<setting-item :title="$t('theme.color')">
<color-checkbox-group @change="(values, colors) => setTheme({...theme, color: colors[0]})" :defaultValues="[palettes.indexOf(theme.color)]" :multiple="false">
<color-checkbox v-for="(color, index) in palettes" :key="index" :color="color" :value="index" />
<color-checkbox-group
@change="(values, colors) => setTheme({ ...theme, color: colors[0] })"
:defaultValues="[palettes.indexOf(theme.color)]"
:multiple="false"
>
<color-checkbox
v-for="(color, index) in palettes"
:key="index"
:color="color"
:value="index"
/>
</color-checkbox-group>
</setting-item>
<a-divider />
<setting-item :title="$t('navigate.title')">
<img-checkbox-group @change="values => setLayout(values[0])" :default-values="[layout]">
<img-checkbox :title="$t('navigate.side')" img="https://gw.alipayobjects.com/zos/rmsportal/JopDzEhOqwOjeNTXkoje.svg" value="side" />
<img-checkbox :title="$t('navigate.head')" img="https://gw.alipayobjects.com/zos/rmsportal/KDNDBbriJhLwuqMoxcAr.svg" value="head" />
<img-checkbox :title="$t('navigate.mix')" img="https://gw.alipayobjects.com/zos/antfincdn/x8Ob%26B8cy8/LCkqqYNmvBEbokSDscrm.svg" value="mix" />
<img-checkbox
:title="$t('navigate.side')"
img="https://gw.alipayobjects.com/zos/rmsportal/JopDzEhOqwOjeNTXkoje.svg"
value="side"
/>
<img-checkbox
:title="$t('navigate.head')"
img="https://gw.alipayobjects.com/zos/rmsportal/KDNDBbriJhLwuqMoxcAr.svg"
value="head"
/>
<img-checkbox
:title="$t('navigate.mix')"
img="https://gw.alipayobjects.com/zos/antfincdn/x8Ob%26B8cy8/LCkqqYNmvBEbokSDscrm.svg"
value="mix"
/>
</img-checkbox-group>
</setting-item>
<setting-item>
<a-list :split="false">
<a-list-item>
{{$t('navigate.content.title')}}
<a-select :getPopupContainer="getPopupContainer" :value="pageWidth" @change="setPageWidth" class="select-item" size="small" slot="actions">
<a-select-option value="fluid">{{$t('navigate.content.fluid')}}</a-select-option>
<a-select-option value="fixed">{{$t('navigate.content.fixed')}}</a-select-option>
{{ $t('navigate.content.title') }}
<a-select
:getPopupContainer="getPopupContainer"
:value="pageWidth"
@change="setPageWidth"
class="select-item"
size="small"
slot="actions"
>
<a-select-option value="fluid">{{ $t('navigate.content.fluid') }}</a-select-option>
<a-select-option value="fixed">{{ $t('navigate.content.fixed') }}</a-select-option>
</a-select>
</a-list-item>
<a-list-item>
{{$t('navigate.fixedHeader')}}
{{ $t('navigate.fixedHeader') }}
<a-switch :checked="fixedHeader" slot="actions" size="small" @change="setFixedHeader" />
</a-list-item>
<a-list-item>
{{$t('navigate.fixedSideBar')}}
{{ $t('navigate.fixedSideBar') }}
<a-switch :checked="fixedSideBar" slot="actions" size="small" @change="setFixedSideBar" />
</a-list-item>
</a-list>
......@@ -47,11 +87,11 @@
<setting-item :title="$t('other.title')">
<a-list :split="false">
<a-list-item>
{{$t('other.multiPages')}}
{{ $t('other.multiPages') }}
<a-switch :checked="multiPage" slot="actions" size="small" @change="setMultiPage" />
</a-list-item>
<a-list-item>
{{$t('other.hideSetting')}}
{{ $t('other.hideSetting') }}
<a-switch :checked="hideSetting" slot="actions" size="small" @change="setHideSetting" />
</a-list-item>
</a-list>
......@@ -60,24 +100,46 @@
<setting-item :title="$t('animate.title')">
<a-list :split="false">
<a-list-item>
{{$t('animate.disable')}}
<a-switch :checked="animate.disabled" slot="actions" size="small" @change="val => setAnimate({...animate, disabled: val})" />
{{ $t('animate.disable') }}
<a-switch
:checked="animate.disabled"
slot="actions"
size="small"
@change="val => setAnimate({ ...animate, disabled: val })"
/>
</a-list-item>
<a-list-item>
{{$t('animate.effect')}}
<a-select :value="animate.name" :getPopupContainer="getPopupContainer" @change="val => setAnimate({...animate, name: val})" class="select-item" size="small" slot="actions">
<a-select-option :key="index" :value="item.name" v-for="(item, index) in animates">{{item.alias}}</a-select-option>
{{ $t('animate.effect') }}
<a-select
:value="animate.name"
:getPopupContainer="getPopupContainer"
@change="val => setAnimate({ ...animate, name: val })"
class="select-item"
size="small"
slot="actions"
>
<a-select-option :key="index" :value="item.name" v-for="(item, index) in animates">{{
item.alias
}}</a-select-option>
</a-select>
</a-list-item>
<a-list-item>
{{$t('animate.direction')}}
<a-select :value="animate.direction" :getPopupContainer="getPopupContainer" @change="val => setAnimate({...animate, direction: val})" class="select-item" size="small" slot="actions">
<a-select-option :key="index" :value="item" v-for="(item, index) in directions">{{item}}</a-select-option>
{{ $t('animate.direction') }}
<a-select
:value="animate.direction"
:getPopupContainer="getPopupContainer"
@change="val => setAnimate({ ...animate, direction: val })"
class="select-item"
size="small"
slot="actions"
>
<a-select-option :key="index" :value="item" v-for="(item, index) in directions">{{
item
}}</a-select-option>
</a-select>
</a-list-item>
</a-list>
</setting-item>
</div>
</template>
......@@ -176,7 +238,7 @@ export default {
},
computed: {
directions() {
return this.animates.find((item) => item.name == this.animate.name).directions;
return this.animates.find(item => item.name == this.animate.name).directions;
},
...mapState('settingModule', [
'theme',
......@@ -192,7 +254,7 @@ export default {
]),
},
watch: {
'animate.name': function (val) {
'animate.name': function(val) {
this.setAnimate({ name: val, direction: this.directions[0] });
},
},
......@@ -220,7 +282,7 @@ export default {
let config = {};
let mySetting = this.$store.state.settingModule;
let dftSetting = local ? settingConfig : settingConfig;
Object.keys(mySetting).forEach((key) => {
Object.keys(mySetting).forEach(key => {
const dftValue = dftSetting[key],
myValue = mySetting[key];
if (dftValue != undefined && !fastEqual(dftValue, myValue)) {
......
src/pages/frame/layouts/AdminLayout.vue
View file @ e7df7eba
......@@ -170,6 +170,7 @@ export default {
<style lang="less" scoped>
.admin-layout {
height: 100%;
.side-menu {
&.fixed-side {
position: fixed;
......
src/pages/home/index.js 0 → 100644
View file @ e7df7eba
import Home from './index.vue';
export default Home;
src/pages/system/view/log/login_log/index.js 0 → 100644
View file @ e7df7eba
import LoginLog from './index.vue';
export default LoginLog;
src/router/index.js
View file @ e7df7eba
import syncConfig from './config';
import asyncConfig from './async/config.async';
import { formatRoutes } from '../utils/routerUtil';
// 不需要登录拦截的路由配置
const loginIgnore = {
names: ['404', '403'], //根据路由名称匹配
paths: ['/login'], //根据路由fullPath匹配
/**
* 判断路由是否包含在该配置中
* @param route vue-router 的 route 对象
* @returns {boolean}
*/
includes(route) {
return this.names.includes(route.name) || this.paths.includes(route.path)
}
names: ['404', '403'], //根据路由名称匹配
paths: ['/login'], //根据路由fullPath匹配
/**
* 判断路由是否包含在该配置中
* @param route vue-router 的 route 对象
* @returns {boolean}
*/
includes(route) {
return this.names.includes(route.name) || this.paths.includes(route.path);
},
};
/**
......@@ -21,11 +20,10 @@ const loginIgnore = {
* @param isAsync 是否异步路由模式
* @returns {options.routes}
*/
function initRouter(isAsync) {
const options = isAsync ? asyncConfig : syncConfig;
formatRoutes(options.routes);
return options;
function initRouter() {
const options = syncConfig;
formatRoutes(options.routes);
return options;
}
export {loginIgnore , initRouter}
export { loginIgnore, initRouter };
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment