yvan/Study
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

added ESlint 语法检测

Browse Source
This commit is contained in:
何秀钢
2021-06-02 14:11:45 +08:00
parent 3932a8fbf3
commit 2f0465a1a1
94 changed files with 5031 additions and 4790 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/src/view/layout/aside/asideComponent/asyncSubmenu.vue
+4 -6
View File
@@ -1,10 +1,10 @@
<template>
<el-submenu :popper-append-to-body="false" ref="subMenu" :index="routerInfo.name">
<el-submenu ref="subMenu" :popper-append-to-body="false" :index="routerInfo.name">
<template slot="title">
<i :class="'el-icon-'+routerInfo.meta.icon"></i>
<span slot="title">{{routerInfo.meta.title}}</span>
<i :class="'el-icon-'+routerInfo.meta.icon" />
<span slot="title">{{ routerInfo.meta.title }}</span>
</template>
<slot></slot>
<slot />
</el-submenu>
</template>
@@ -21,5 +21,3 @@ export default {
}
}
</script>
<style lang="scss">
</style>
web/src/view/layout/aside/asideComponent/index.vue
+13 -15
View File
@@ -1,7 +1,7 @@
<template>
<component :is="menuComponent" :routerInfo="routerInfo" v-if="!routerInfo.hidden">
<component :is="menuComponent" v-if="!routerInfo.hidden" :router-info="routerInfo">
<template v-if="routerInfo.children&&routerInfo.children.length">
<AsideComponent :key="item.name" :routerInfo="item" v-for="item in routerInfo.children" />
<AsideComponent v-for="item in routerInfo.children" :key="item.name" :router-info="item" />
</template>
</component>
</template>
@@ -12,14 +12,9 @@ import AsyncSubmenu from './asyncSubmenu'
export default {
name: 'AsideComponent',
computed: {
menuComponent() {
if (this.routerInfo.children&&this.routerInfo.children.filter(item=>!item.hidden).length) {
return 'AsyncSubmenu'
} else {
return 'MenuItem'
}
}
components: {
MenuItem,
AsyncSubmenu
},
props: {
routerInfo: {
@@ -29,11 +24,14 @@ export default {
type: Object
}
},
components: {
MenuItem,
AsyncSubmenu
computed: {
menuComponent() {
if (this.routerInfo.children && this.routerInfo.children.filter(item => !item.hidden).length) {
return 'AsyncSubmenu'
} else {
return 'MenuItem'
}
}
}
}
</script>
<style lang="scss">
</style>
web/src/view/layout/aside/asideComponent/menuItem.vue
+2 -4
View File
@@ -1,7 +1,7 @@
<template>
<el-menu-item :index="routerInfo.name" :route="{parameters:routerInfo.parameters}">
<i :class="'el-icon-'+routerInfo.meta.icon"></i>
<span slot="title">{{routerInfo.meta.title}}</span>
<i :class="'el-icon-'+routerInfo.meta.icon" />
<span slot="title">{{ routerInfo.meta.title }}</span>
</el-menu-item>
</template>
@@ -18,5 +18,3 @@ export default {
}
}
</script>
<style lang="scss">
</style>
web/src/view/layout/aside/historyComponent/history.vue
+133 -131
View File
@@ -1,24 +1,24 @@
<template>
<div class="router-history">
<el-tabs
:closable="!(historys.length==1&&this.$route.name==defaultRouter)"
v-model="activeValue"
:closable="!(historys.length===1&&this.$route.name===defaultRouter)"
type="card"
@contextmenu.prevent.native="openContextMenu($event)"
@tab-click="changeTab"
@tab-remove="removeTab"
type="card"
v-model="activeValue"
>
<el-tab-pane
v-for="item in historys"
:key="item.name + JSON.stringify(item.query)+JSON.stringify(item.params)"
:label="item.meta.title"
:name="item.name + JSON.stringify(item.query)+JSON.stringify(item.params)"
:tab="item"
v-for="item in historys"
></el-tab-pane>
/>
</el-tabs>
<!--自定义右键菜单html代码-->
<ul :style="{left:left+'px',top:top+'px'}" class="contextmenu" v-show="contextMenuVisible">
<ul v-show="contextMenuVisible" :style="{left:left+'px',top:top+'px'}" class="contextmenu">
<li @click="closeAll">关闭所有</li>
<li @click="closeLeft">关闭左侧</li>
<li @click="closeRight">关闭右侧</li>
@@ -26,84 +26,107 @@
</ul>
</div>
</template>
<script>
import { mapGetters } from "vuex";
const getFmtString = (item)=>{
return item.name +
JSON.stringify(item.query) +
JSON.stringify(item.params)
}
import { mapGetters } from 'vuex'
const getFmtString = (item) => {
return item.name +
JSON.stringify(item.query) +
JSON.stringify(item.params)
}
export default {
name: "HistoryComponent",
name: 'HistoryComponent',
data() {
return {
historys: [],
activeValue: "",
activeValue: '',
contextMenuVisible: false,
left: 0,
top: 0,
isCollapse: false,
isMobile: false,
rightActive: ""
};
rightActive: ''
}
},
computed: {
...mapGetters("user", ["userInfo"]),
...mapGetters('user', ['userInfo']),
defaultRouter() {
return this.userInfo.authority.defaultRouter;
return this.userInfo.authority.defaultRouter
}
},
watch: {
contextMenuVisible() {
if (this.contextMenuVisible) {
document.body.addEventListener('click', () => {
this.contextMenuVisible = false
})
} else {
document.body.removeEventListener('click', () => {
this.contextMenuVisible = false
})
}
},
$route(to, now) {
this.historys = this.historys.filter(item => !item.meta.closeTab)
this.setTab(to)
sessionStorage.setItem('historys', JSON.stringify(this.historys))
this.activeValue = window.sessionStorage.getItem('activeValue')
if (now && to && now.name === to.name) {
this.$bus.$emit('reload')
}
}
},
created() {
this.$bus.on("mobile", isMobile => {
this.isMobile = isMobile;
});
this.$bus.on("collapse", isCollapse => {
this.isCollapse = isCollapse;
});
this.$bus.on('mobile', isMobile => {
this.isMobile = isMobile
})
this.$bus.on('collapse', isCollapse => {
this.isCollapse = isCollapse
})
const initHistorys = [
{
name: this.defaultRouter,
meta: {
title: "首页"
title: '首页'
},
query: {},
params: {}
}
];
]
this.historys =
JSON.parse(sessionStorage.getItem("historys")) || initHistorys;
if(!window.sessionStorage.getItem("activeValue")){
this.activeValue = getFmtString(this.$route)
}else{
this.activeValue = window.sessionStorage.getItem("activeValue");
}
this.setTab(this.$route);
JSON.parse(sessionStorage.getItem('historys')) || initHistorys
if (!window.sessionStorage.getItem('activeValue')) {
this.activeValue = getFmtString(this.$route)
} else {
this.activeValue = window.sessionStorage.getItem('activeValue')
}
this.setTab(this.$route)
},
beforeDestroy() {
this.$bus.off("collapse");
this.$bus.off("mobile");
this.$bus.off('collapse')
this.$bus.off('mobile')
},
methods: {
openContextMenu(e) {
if (this.historys.length == 1 && this.$route.name == this.defaultRouter) {
return false;
if (this.historys.length === 1 && this.$route.name === this.defaultRouter) {
return false
}
if (e.srcElement.id) {
this.contextMenuVisible = true;
let width;
this.contextMenuVisible = true
let width
if (this.isCollapse) {
width = 54;
width = 54
} else {
width = 220;
width = 220
}
if (this.isMobile) {
width = 0;
width = 0
}
this.left = e.clientX - width;
this.top = e.clientY + 10;
this.rightActive = e.srcElement.id.split("-")[1];
this.left = e.clientX - width
this.top = e.clientY + 10
this.rightActive = e.srcElement.id.split('-')[1]
}
},
closeAll() {
@@ -111,155 +134,134 @@ export default {
{
name: this.defaultRouter,
meta: {
title: "首页"
title: '首页'
},
query: {},
params: {}
}
];
this.$router.push({ name: this.defaultRouter });
this.contextMenuVisible = false;
sessionStorage.setItem("historys", JSON.stringify(this.historys));
]
this.$router.push({ name: this.defaultRouter })
this.contextMenuVisible = false
sessionStorage.setItem('historys', JSON.stringify(this.historys))
},
closeLeft() {
let right;
let right
const rightIndex = this.historys.findIndex(item => {
if (getFmtString(item) == this.rightActive) {
right = item;
if (getFmtString(item) === this.rightActive) {
right = item
}
return (
getFmtString(item) == this.rightActive
);
});
getFmtString(item) === this.rightActive
)
})
const activeIndex = this.historys.findIndex(
item => getFmtString(item) == this.activeValue
);
this.historys.splice(0, rightIndex);
item => getFmtString(item) === this.activeValue
)
this.historys.splice(0, rightIndex)
if (rightIndex > activeIndex) {
this.$router.push(right);
this.$router.push(right)
}
sessionStorage.setItem("historys", JSON.stringify(this.historys));
sessionStorage.setItem('historys', JSON.stringify(this.historys))
},
closeRight() {
let right;
let right
const leftIndex = this.historys.findIndex(item => {
if ( getFmtString(item) == this.rightActive ) {
right = item;
if (getFmtString(item) === this.rightActive) {
right = item
}
return ( getFmtString(item) == this.rightActive );
});
return (getFmtString(item) === this.rightActive)
})
const activeIndex = this.historys.findIndex(
item => getFmtString(item) == this.activeValue
);
this.historys.splice(leftIndex + 1, this.historys.length);
item => getFmtString(item) === this.activeValue
)
this.historys.splice(leftIndex + 1, this.historys.length)
if (leftIndex < activeIndex) {
this.$router.push(right);
this.$router.push(right)
}
sessionStorage.setItem("historys", JSON.stringify(this.historys));
sessionStorage.setItem('historys', JSON.stringify(this.historys))
},
closeOther() {
let right;
let right
this.historys = this.historys.filter(item => {
if ( getFmtString(item) == this.rightActive
if (getFmtString(item) === this.rightActive
) {
right = item;
right = item
}
return ( getFmtString(item) == this.rightActive
);
});
this.$router.push(right);
sessionStorage.setItem("historys", JSON.stringify(this.historys));
return (getFmtString(item) === this.rightActive
)
})
this.$router.push(right)
sessionStorage.setItem('historys', JSON.stringify(this.historys))
},
isSame(route1, route2) {
if (route1.name != route2.name) {
return false;
if (route1.name !== route2.name) {
return false
}
for (let key in route1.query) {
if (route1.query[key] != route2.query[key]) {
return false;
for (const key in route1.query) {
if (route1.query[key] !== route2.query[key]) {
return false
}
}
for (let key in route1.params) {
if (route1.params[key] != route2.params[key]) {
return false;
for (const key in route1.params) {
if (route1.params[key] !== route2.params[key]) {
return false
}
}
return true;
return true
},
setTab(route) {
if (!this.historys.some(item => this.isSame(item, route))) {
const obj = {};
obj.name = route.name;
obj.meta = route.meta;
obj.query = route.query;
obj.params = route.params;
this.historys.push(obj);
const obj = {}
obj.name = route.name
obj.meta = route.meta
obj.query = route.query
obj.params = route.params
this.historys.push(obj)
}
window.sessionStorage.setItem(
"activeValue",
'activeValue',
getFmtString(this.$route)
);
)
},
changeTab(component) {
const tab = component.$attrs.tab;
const tab = component.$attrs.tab
this.$router.push({
name: tab.name,
query: tab.query,
params: tab.params
});
})
},
removeTab(tab) {
const index = this.historys.findIndex(
item => getFmtString(item) == tab
);
item => getFmtString(item) === tab
)
if (
getFmtString(this.$route) == tab
getFmtString(this.$route) === tab
) {
if (this.historys.length == 1) {
this.$router.push({ name: this.defaultRouter });
if (this.historys.length === 1) {
this.$router.push({ name: this.defaultRouter })
} else {
if (index < this.historys.length - 1) {
this.$router.push({
name: this.historys[index + 1].name,
query: this.historys[index + 1].query,
params: this.historys[index + 1].params
});
})
} else {
this.$router.push({
name: this.historys[index - 1].name,
query: this.historys[index - 1].query,
params: this.historys[index - 1].params
});
})
}
}
}
this.historys.splice(index, 1);
}
},
watch: {
contextMenuVisible() {
if (this.contextMenuVisible) {
document.body.addEventListener("click", () => {
this.contextMenuVisible = false;
});
} else {
document.body.removeEventListener("click", () => {
this.contextMenuVisible = false;
});
}
},
$route(to, now) {
this.historys = this.historys.filter(item => !item.meta.closeTab);
this.setTab(to);
sessionStorage.setItem("historys", JSON.stringify(this.historys));
this.activeValue = window.sessionStorage.getItem("activeValue");
if (now && to && now.name == to.name) {
this.$bus.$emit("reload");
}
this.historys.splice(index, 1)
}
}
};
}
</script>
<style lang="scss">
.contextmenu {
width: 100px;
@@ -283,4 +285,4 @@ export default {
background: #f2f2f2;
cursor: pointer;
}
</style>
</style>
web/src/view/layout/aside/index.vue
+48 -48
View File
@@ -6,14 +6,14 @@
:collapse="isCollapse"
:collapse-transition="true"
:default-active="active"
@select="selectMenuItem"
active-text-color="#fff"
class="el-menu-vertical"
text-color="rgb(191, 203, 217)"
unique-opened
@select="selectMenuItem"
>
<template v-for="item in asyncRouters[0].children">
<aside-component :key="item.name" :routerInfo="item" v-if="!item.hidden" />
<aside-component v-if="!item.hidden" :key="item.name" :router-info="item" />
</template>
</el-menu>
</transition>
@@ -22,63 +22,63 @@
</template>
<script>
import { mapGetters, mapMutations } from "vuex";
import AsideComponent from "@/view/layout/aside/asideComponent";
import { mapGetters, mapMutations } from 'vuex'
import AsideComponent from '@/view/layout/aside/asideComponent'
export default {
name: "Aside",
data() {
return {
active: "",
isCollapse: false
};
},
methods: {
...mapMutations("history", ["addHistory"]),
selectMenuItem(index, _, ele) {
const query = {};
const params = {};
ele.route.parameters &&
ele.route.parameters.map(item => {
if (item.type == "query") {
query[item.key] = item.value;
} else {
params[item.key] = item.value;
}
});
if (index === this.$route.name) return;
if (index.indexOf("http://") > -1 || index.indexOf("https://") > -1) {
window.open(index);
} else {
this.$router.push({ name: index, query, params });
}
}
},
computed: {
...mapGetters("router", ["asyncRouters"])
},
name: 'Aside',
components: {
AsideComponent
},
created() {
this.active = this.$route.name;
let screenWidth = document.body.clientWidth;
if (screenWidth < 1000) {
this.isCollapse = !this.isCollapse;
data() {
return {
active: '',
isCollapse: false
}
this.$bus.on("collapse", item => {
this.isCollapse = item;
});
},
computed: {
...mapGetters('router', ['asyncRouters'])
},
watch: {
$route() {
this.active = this.$route.name;
this.active = this.$route.name
}
},
created() {
this.active = this.$route.name
const screenWidth = document.body.clientWidth
if (screenWidth < 1000) {
this.isCollapse = !this.isCollapse
}
this.$bus.on('collapse', item => {
this.isCollapse = item
})
},
beforeDestroy() {
this.$bus.off("collapse");
this.$bus.off('collapse')
},
methods: {
...mapMutations('history', ['addHistory']),
selectMenuItem(index, _, ele) {
const query = {}
const params = {}
ele.route.parameters &&
ele.route.parameters.map(item => {
if (item.type === 'query') {
query[item.key] = item.value
} else {
params[item.key] = item.value
}
})
if (index === this.$route.name) return
if (index.indexOf('http://') > -1 || index.indexOf('https://') > -1) {
window.open(index)
} else {
this.$router.push({ name: index, query, params })
}
}
}
};
}
</script>
<style lang="scss">
@@ -95,4 +95,4 @@ export default {
vertical-align: middle;
}
}
</style>
</style>