| | |
| | | <div class="dock"> |
| | | <template v-for="item in openAppList" :key="item.key"> |
| | | <div class="item" @click="openApp(item)"> |
| | | <i |
| | | :style="{ backgroundColor: item.iconBgColor, color: item.iconColor }" |
| | | class="iconfont" |
| | | :class="item[iconKey]" |
| | | ></i> |
| | | <i :style="{ backgroundColor: item.iconBgColor, color: item.iconColor }" class="iconfont" |
| | | :class="item[iconKey]"></i> |
| | | <small style="margin-top: 5px; font-size: 10px">{{ item[labelKey] }}</small> |
| | | </div> |
| | | </template> |
| | |
| | | </div> |
| | | </template> |
| | | <script> |
| | | import { mapGetters } from 'vuex'; |
| | | import $Mode from './mode/index'; |
| | | import index from '@/mixins/index'; |
| | | import topLock from '@/page/index/top/top-lock.vue'; |
| | | import { mapGetters } from 'vuex' |
| | | import $Mode from './mode/index' |
| | | import index from '@/mixins/index' |
| | | import topLock from '@/page/index/top/top-lock.vue' |
| | | |
| | | export default { |
| | | mixins: [index], |
| | | components: { |
| | | topLock, |
| | | }, |
| | | data() { |
| | | data () { |
| | | return { |
| | | app: false, |
| | | timeString: '', |
| | | }; |
| | | } |
| | | }, |
| | | computed: { |
| | | ...mapGetters(['menu', 'tagList', 'tagWel', 'tag', 'userInfo', 'isMacOs']), |
| | | labelKey() { |
| | | return this.website.menu.label; |
| | | ...mapGetters(['menu', 'bsTagList', 'tagWel', 'tag', 'userInfo', 'isMacOs']), |
| | | labelKey () { |
| | | return this.website.menu.label |
| | | }, |
| | | pathKey() { |
| | | return this.website.menu.path; |
| | | pathKey () { |
| | | return this.website.menu.path |
| | | }, |
| | | hrefKey() { |
| | | return this.website.menu.href; |
| | | hrefKey () { |
| | | return this.website.menu.href |
| | | }, |
| | | childrenKey() { |
| | | return this.website.menu.children; |
| | | childrenKey () { |
| | | return this.website.menu.children |
| | | }, |
| | | queryKey() { |
| | | return this.website.menu.query; |
| | | queryKey () { |
| | | return this.website.menu.query |
| | | }, |
| | | iconKey() { |
| | | return this.website.menu.icon; |
| | | iconKey () { |
| | | return this.website.menu.icon |
| | | }, |
| | | menuList() { |
| | | let result = []; |
| | | menuList () { |
| | | let result = [] |
| | | const findMenu = list => { |
| | | list.forEach(ele => { |
| | | if (ele[this.childrenKey] && ele[this.childrenKey].length !== 0) { |
| | | findMenu(ele[this.childrenKey]); |
| | | findMenu(ele[this.childrenKey]) |
| | | } else { |
| | | result.push(ele); |
| | | result.push(ele) |
| | | } |
| | | }); |
| | | }; |
| | | findMenu(this.menu); |
| | | return result; |
| | | }) |
| | | } |
| | | findMenu(this.menu) |
| | | return result |
| | | }, |
| | | deskTopAppList() { |
| | | return this.menuList; |
| | | deskTopAppList () { |
| | | return this.menuList |
| | | }, |
| | | openAppList() { |
| | | return []; |
| | | openAppList () { |
| | | return [] |
| | | }, |
| | | }, |
| | | created() { |
| | | this.startTimer(); |
| | | this.$store.dispatch('GetMenu'); |
| | | created () { |
| | | this.startTimer() |
| | | this.$store.dispatch('GetMenu') |
| | | }, |
| | | methods: { |
| | | switchTheme() { |
| | | this.$store.commit('SET_THEME_NAME', ''); |
| | | this.$router.push(this.tagWel); |
| | | setTimeout(() => location.reload()); |
| | | switchTheme () { |
| | | this.$store.commit('SET_THEME_NAME', '') |
| | | this.$router.push(this.tagWel) |
| | | setTimeout(() => location.reload()) |
| | | }, |
| | | logout() { |
| | | this.$store.commit('SET_THEME_NAME', ''); |
| | | logout () { |
| | | this.$store.commit('SET_THEME_NAME', '') |
| | | this.$store.dispatch('LogOut').then(() => { |
| | | this.$router.push({ path: '/login' }); |
| | | setTimeout(() => location.reload()); |
| | | }); |
| | | this.$router.push({ path: '/login' }) |
| | | setTimeout(() => location.reload()) |
| | | }) |
| | | }, |
| | | startTimer() { |
| | | startTimer () { |
| | | setInterval(() => { |
| | | this.timeString = this.$dayjs().format('YYYY年MM月DD日 HH:mm'); |
| | | }, 1000); |
| | | this.timeString = this.$dayjs().format('YYYY年MM月DD日 HH:mm') |
| | | }, 1000) |
| | | }, |
| | | openApp(item) { |
| | | openApp (item) { |
| | | $Mode({ |
| | | title: item[this.labelKey], |
| | | path: item[this.hrefKey] ? item[this.hrefKey] : item[this.pathKey], |
| | | }); |
| | | }) |
| | | }, |
| | | }, |
| | | }; |
| | | } |
| | | </script> |
| | | <style> |
| | | .top .el-dropdown { |
| | |
| | | <template> |
| | | <div class="avue-tags" v-if="setting.tag" @click="contextmenuFlag = false"> |
| | | <!-- tag盒子 --> |
| | | <div |
| | | v-if="contextmenuFlag" |
| | | class="avue-tags__contentmenu" |
| | | :style="{ left: contentmenuX + 'px', top: contentmenuY + 'px' }" |
| | | > |
| | | <div v-if="contextmenuFlag" class="avue-tags__contentmenu" |
| | | :style="{ left: contentmenuX + 'px', top: contentmenuY + 'px' }"> |
| | | <div class="item" @click="closeOthersTags">{{ $t('tagsView.closeOthers') }}</div> |
| | | <div class="item" @click="closeAllTags">{{ $t('tagsView.closeAll') }}</div> |
| | | <div class="item" @click="clearCacheTags">{{ $t('tagsView.clearCache') }}</div> |
| | | </div> |
| | | <div class="avue-tags__box"> |
| | | <el-tabs |
| | | v-model="active" |
| | | type="card" |
| | | @contextmenu="handleContextmenu" |
| | | :closable="tagLen !== 1" |
| | | @tab-click="openTag" |
| | | @edit="menuTag" |
| | | > |
| | | <el-tab-pane |
| | | v-for="(item, index) in tagList" |
| | | :key="index" |
| | | :label="generateTitle(item)" |
| | | :name="item.fullPath" |
| | | > |
| | | <el-tabs v-model="active" type="card" @contextmenu="handleContextmenu" :closable="tagLen !== 1" |
| | | @tab-click="openTag" @edit="menuTag"> |
| | | <el-tab-pane v-for="(item, index) in bsTagList" :key="index" :label="generateTitle(item)" :name="item.fullPath"> |
| | | <template #label> |
| | | <span> |
| | | {{ generateTitle(item) }} |
| | | <i |
| | | class="el-icon-refresh" |
| | | :class="{ turn: refresh }" |
| | | @click="handleRefresh" |
| | | v-if="active === item.fullPath" |
| | | ></i> |
| | | <i class="el-icon-refresh" :class="{ turn: refresh }" @click="handleRefresh" |
| | | v-if="active === item.fullPath"></i> |
| | | </span> |
| | | </template> |
| | | </el-tab-pane> |
| | |
| | | <template #dropdown> |
| | | <el-dropdown-menu> |
| | | <el-dropdown-item @click="openSearch">{{ $t('tagsView.search') }}</el-dropdown-item> |
| | | <el-dropdown-item @click="closeOthersTags" |
| | | >{{ $t('tagsView.closeOthers') }} |
| | | <el-dropdown-item @click="closeOthersTags">{{ $t('tagsView.closeOthers') }} |
| | | </el-dropdown-item> |
| | | <el-dropdown-item @click="closeAllTags">{{ $t('tagsView.closeAll') }}</el-dropdown-item> |
| | | <el-dropdown-item @click="clearCacheTags" |
| | | >{{ $t('tagsView.clearCache') }} |
| | | <el-dropdown-item @click="clearCacheTags">{{ $t('tagsView.clearCache') }} |
| | | </el-dropdown-item> |
| | | </el-dropdown-menu> |
| | | </template> |
| | |
| | | </div> |
| | | </template> |
| | | <script> |
| | | import { mapGetters } from 'vuex'; |
| | | import { clearCache } from '@/api/user'; |
| | | import { mapGetters } from 'vuex' |
| | | import { clearCache } from '@/api/user' |
| | | |
| | | export default { |
| | | name: 'tags', |
| | | data() { |
| | | data () { |
| | | return { |
| | | refresh: false, |
| | | active: '', |
| | | contentmenuX: '', |
| | | contentmenuY: '', |
| | | contextmenuFlag: false, |
| | | }; |
| | | } |
| | | }, |
| | | watch: { |
| | | tag: { |
| | | handler(val) { |
| | | this.active = val.fullPath; |
| | | handler (val) { |
| | | this.active = val.fullPath |
| | | }, |
| | | immediate: true, |
| | | }, |
| | | contextmenuFlag() { |
| | | window.addEventListener('mousedown', this.watchContextmenu); |
| | | contextmenuFlag () { |
| | | window.addEventListener('mousedown', this.watchContextmenu) |
| | | }, |
| | | }, |
| | | computed: { |
| | | ...mapGetters(['tagWel', 'tagList', 'tag', 'setting']), |
| | | tagLen() { |
| | | return this.tagList.length || 0; |
| | | ...mapGetters(['tagWel', 'bsTagList', 'tag', 'setting']), |
| | | tagLen () { |
| | | return this.bsTagList.length || 0 |
| | | }, |
| | | }, |
| | | methods: { |
| | | openSearch() { |
| | | this.$store.commit('SET_IS_SEARCH', true); |
| | | openSearch () { |
| | | this.$store.commit('SET_IS_SEARCH', true) |
| | | }, |
| | | handleRefresh() { |
| | | this.refresh = true; |
| | | this.$store.commit('SET_IS_REFRESH', false); |
| | | handleRefresh () { |
| | | this.refresh = true |
| | | this.$store.commit('SET_IS_REFRESH', false) |
| | | setTimeout(() => { |
| | | this.$store.commit('SET_IS_REFRESH', true); |
| | | }, 100); |
| | | this.$store.commit('SET_IS_REFRESH', true) |
| | | }, 100) |
| | | setTimeout(() => { |
| | | this.refresh = false; |
| | | }, 500); |
| | | this.refresh = false |
| | | }, 500) |
| | | }, |
| | | generateTitle(item) { |
| | | generateTitle (item) { |
| | | return this.$router.$avueRouter.generateTitle({ |
| | | ...item, |
| | | ...{ |
| | | label: item.name, |
| | | }, |
| | | }); |
| | | }) |
| | | }, |
| | | watchContextmenu(event) { |
| | | watchContextmenu (event) { |
| | | if (!this.$el.contains(event.target) || event.button !== 0) { |
| | | this.contextmenuFlag = false; |
| | | this.contextmenuFlag = false |
| | | } |
| | | window.removeEventListener('mousedown', this.watchContextmenu); |
| | | window.removeEventListener('mousedown', this.watchContextmenu) |
| | | }, |
| | | handleContextmenu(event) { |
| | | let target = event.target; |
| | | let flag = false; |
| | | if (target.className.indexOf('el-tabs__item') > -1) flag = true; |
| | | handleContextmenu (event) { |
| | | let target = event.target |
| | | let flag = false |
| | | if (target.className.indexOf('el-tabs__item') > -1) flag = true |
| | | else if (target.parentNode.className.indexOf('el-tabs__item') > -1) { |
| | | target = target.parentNode; |
| | | flag = true; |
| | | target = target.parentNode |
| | | flag = true |
| | | } |
| | | if (flag) { |
| | | event.preventDefault(); |
| | | event.stopPropagation(); |
| | | this.contentmenuX = event.clientX; |
| | | this.contentmenuY = event.clientY; |
| | | this.tagName = target.getAttribute('aria-controls').slice(5); |
| | | this.contextmenuFlag = true; |
| | | event.preventDefault() |
| | | event.stopPropagation() |
| | | this.contentmenuX = event.clientX |
| | | this.contentmenuY = event.clientY |
| | | this.tagName = target.getAttribute('aria-controls').slice(5) |
| | | this.contextmenuFlag = true |
| | | } |
| | | }, |
| | | menuTag(value, action) { |
| | | menuTag (value, action) { |
| | | if (action === 'remove') { |
| | | let { tag, key } = this.findTag(value); |
| | | this.$store.commit('DEL_TAG', tag); |
| | | let { tag, key } = this.findTag(value) |
| | | this.$store.commit('DEL_TAG', tag) |
| | | if (tag.fullPath === this.tag.fullPath) { |
| | | tag = this.tagList[key - 1]; |
| | | tag = this.bsTagList[key - 1] |
| | | this.$router.push({ |
| | | path: tag.path, |
| | | query: tag.query, |
| | | }); |
| | | }) |
| | | } |
| | | } |
| | | }, |
| | | openTag(item) { |
| | | let value = item.props.name; |
| | | let { tag } = this.findTag(value); |
| | | openTag (item) { |
| | | let value = item.props.name |
| | | let { tag } = this.findTag(value) |
| | | this.$router.push({ |
| | | path: tag.path, |
| | | query: tag.query, |
| | | }); |
| | | }) |
| | | }, |
| | | findTag(fullPath) { |
| | | let tag = this.tagList.find(item => item.fullPath === fullPath); |
| | | let key = this.tagList.findIndex(item => item.fullPath === fullPath); |
| | | return { tag, key }; |
| | | findTag (fullPath) { |
| | | let tag = this.bsTagList.find(item => item.fullPath === fullPath) |
| | | let key = this.bsTagList.findIndex(item => item.fullPath === fullPath) |
| | | return { tag, key } |
| | | }, |
| | | closeOthersTags() { |
| | | this.contextmenuFlag = false; |
| | | this.$store.commit('DEL_TAG_OTHER'); |
| | | closeOthersTags () { |
| | | this.contextmenuFlag = false |
| | | this.$store.commit('DEL_TAG_OTHER') |
| | | }, |
| | | closeAllTags() { |
| | | this.contextmenuFlag = false; |
| | | this.$store.commit('DEL_ALL_TAG'); |
| | | this.$router.push(this.tagWel); |
| | | closeAllTags () { |
| | | this.contextmenuFlag = false |
| | | this.$store.commit('DEL_ALL_TAG') |
| | | this.$router.push(this.tagWel) |
| | | }, |
| | | clearCacheTags() { |
| | | clearCacheTags () { |
| | | this.$confirm('是否需要清除缓存?', { |
| | | confirmButtonText: '确定', |
| | | cancelButtonText: '取消', |
| | | type: 'warning', |
| | | }).then(() => { |
| | | clearCache().then(() => { |
| | | this.contextmenuFlag = false; |
| | | this.$message.success('清除完毕'); |
| | | }); |
| | | }); |
| | | this.contextmenuFlag = false |
| | | this.$message.success('清除完毕') |
| | | }) |
| | | }) |
| | | }, |
| | | }, |
| | | }; |
| | | } |
| | | </script> |
| | |
| | | </template> |
| | | |
| | | <script> |
| | | import { mapGetters } from 'vuex'; |
| | | import topLock from './top-lock.vue'; |
| | | import topMenu from './top-menu.vue'; |
| | | import topSearch from './top-search.vue'; |
| | | import topTheme from './top-theme.vue'; |
| | | import topLogs from './top-logs.vue'; |
| | | import topColor from './top-color.vue'; |
| | | import topLang from './top-lang.vue'; |
| | | import topFull from './top-full.vue'; |
| | | import topQna from './top-qna.vue'; |
| | | import topSetting from '../setting.vue'; |
| | | import { mapGetters } from 'vuex' |
| | | import topLock from './top-lock.vue' |
| | | import topMenu from './top-menu.vue' |
| | | import topSearch from './top-search.vue' |
| | | import topTheme from './top-theme.vue' |
| | | import topLogs from './top-logs.vue' |
| | | import topColor from './top-color.vue' |
| | | import topLang from './top-lang.vue' |
| | | import topFull from './top-full.vue' |
| | | import topQna from './top-qna.vue' |
| | | import topSetting from '../setting.vue' |
| | | |
| | | export default { |
| | | components: { |
| | |
| | | topSetting, |
| | | }, |
| | | name: 'top', |
| | | data() { |
| | | return {}; |
| | | data () { |
| | | return {} |
| | | }, |
| | | filters: {}, |
| | | created() {}, |
| | | created () { }, |
| | | computed: { |
| | | ...mapGetters([ |
| | | 'setting', |
| | | 'userInfo', |
| | | 'tagWel', |
| | | 'tagList', |
| | | 'bsTagList', |
| | | 'isCollapse', |
| | | 'tag', |
| | | 'logsLen', |
| | |
| | | ]), |
| | | }, |
| | | methods: { |
| | | setCollapse() { |
| | | this.$store.commit('SET_COLLAPSE'); |
| | | setCollapse () { |
| | | this.$store.commit('SET_COLLAPSE') |
| | | }, |
| | | logout() { |
| | | logout () { |
| | | this.$confirm(this.$t('logoutTip'), this.$t('tip'), { |
| | | confirmButtonText: this.$t('submitText'), |
| | | cancelButtonText: this.$t('cancelText'), |
| | | type: 'warning', |
| | | }).then(() => { |
| | | this.$store.dispatch('LogOut').then(() => { |
| | | this.$router.push({ path: '/login' }); |
| | | }); |
| | | }); |
| | | this.$router.push({ path: '/login' }) |
| | | }) |
| | | }) |
| | | }, |
| | | }, |
| | | }; |
| | | } |
| | | </script> |
| | | |
| | | <style lang="scss" scoped> |
| | |
| | | import website from '@/config/website'; |
| | | import website from '@/config/website' |
| | | |
| | | const modules = import.meta.glob('../**/**/*.vue'); |
| | | const modules = import.meta.glob('../**/**/*.vue') |
| | | |
| | | function isURL(s) { |
| | | return /^http[s]?:\/\/.*/.test(s); |
| | | function isURL (s) { |
| | | return /^http[s]?:\/\/.*/.test(s) |
| | | } |
| | | |
| | | let RouterPlugin = function () { |
| | | this.$router = null; |
| | | this.$store = null; |
| | | }; |
| | | this.$router = null |
| | | this.$store = null |
| | | } |
| | | RouterPlugin.install = function (option = {}) { |
| | | this.$router = option.router; |
| | | this.$store = option.store; |
| | | let i18n = option.i18n.global; |
| | | this.$router = option.router |
| | | this.$store = option.store |
| | | let i18n = option.i18n.global |
| | | this.$router.$avueRouter = { |
| | | safe: this, |
| | | // 设置标题 |
| | | setTitle: title => { |
| | | const defaultTitle = i18n.t('title'); |
| | | title = title ? `${title} | ${defaultTitle}` : defaultTitle; |
| | | document.title = title; |
| | | const defaultTitle = i18n.t('title') |
| | | title = title ? `${title} | ${defaultTitle}` : defaultTitle |
| | | document.title = title |
| | | }, |
| | | closeTag: value => { |
| | | let tag = value || this.$store.getters.tag; |
| | | let tag = value || this.$store.getters.tag |
| | | if (typeof value === 'string') { |
| | | tag = this.$store.getters.tagList.find(ele => ele.fullPath === value); |
| | | tag = this.$store.getters.bsTagList.find(ele => ele.fullPath === value) |
| | | } |
| | | this.$store.commit('DEL_TAG', tag); |
| | | this.$store.commit('DEL_TAG', tag) |
| | | }, |
| | | generateTitle: (item, props = {}) => { |
| | | let query = item[props.query || 'query'] || {}; |
| | | let title = query.name || item[props.label || 'label']; |
| | | let meta = item[props.meta || 'meta'] || {}; |
| | | let key = meta.i18n; |
| | | let query = item[props.query || 'query'] || {} |
| | | let title = query.name || item[props.label || 'label'] |
| | | let meta = item[props.meta || 'meta'] || {} |
| | | let key = meta.i18n |
| | | if (key) { |
| | | const hasKey = i18n.te('route.' + key); |
| | | if (hasKey) return i18n.t('route.' + key); |
| | | const hasKey = i18n.te('route.' + key) |
| | | if (hasKey) return i18n.t('route.' + key) |
| | | } |
| | | return title ? title.split(',')[0] : title; |
| | | return title ? title.split(',')[0] : title |
| | | }, |
| | | //动态路由 |
| | | formatRoutes: function (aMenu = [], first) { |
| | | const aRouter = []; |
| | | const propsDefault = website.menu; |
| | | const aRouter = [] |
| | | const propsDefault = website.menu |
| | | |
| | | if (aMenu && aMenu.length === 0) return; |
| | | if (aMenu && aMenu.length === 0) return |
| | | for (let i = 0; i < aMenu.length; i++) { |
| | | const oMenu = aMenu[i]; |
| | | const oMenu = aMenu[i] |
| | | let path = oMenu[propsDefault.path], |
| | | isComponent = true, |
| | | component = oMenu.component, |
| | |
| | | icon = oMenu[propsDefault.icon], |
| | | children = oMenu[propsDefault.children], |
| | | query = oMenu[propsDefault.query], |
| | | meta = oMenu[propsDefault.meta]; |
| | | meta = oMenu[propsDefault.meta] |
| | | if (option.keepAlive) { |
| | | meta.keepAlive = option.keepAlive; |
| | | meta.keepAlive = option.keepAlive |
| | | } |
| | | const isChild = !!(children && children.length !== 0); |
| | | const isChild = !!(children && children.length !== 0) |
| | | const oRouter = { |
| | | path: path, |
| | | component: (() => { |
| | |
| | | option.store.getters.isMacOs || !website.setting.menu |
| | | ? '../page/index/layout.vue' |
| | | : '../page/index/index.vue' |
| | | ]; |
| | | ] |
| | | // 判断是否为多层路由 |
| | | } else if (isChild && !first) { |
| | | return modules['../page/index/layout.vue']; |
| | | return modules['../page/index/layout.vue'] |
| | | // 判断是否为最终的页面视图 |
| | | } else { |
| | | let result = modules[`../${component}.vue`]; |
| | | if (result) result().then(mod => (mod.default.name = path)); |
| | | let result = modules[`../${component}.vue`] |
| | | if (result) result().then(mod => (mod.default.name = path)) |
| | | else { |
| | | isComponent = false; |
| | | isComponent = false |
| | | } |
| | | return result; |
| | | return result |
| | | } |
| | | })(), |
| | | name, |
| | |
| | | meta, |
| | | query, |
| | | redirect: (() => { |
| | | if (!isChild && first) return `${path}`; |
| | | else return ''; |
| | | if (!isChild && first) return `${path}` |
| | | else return '' |
| | | })(), |
| | | // 处理是否为一级路由 |
| | | children: !isChild |
| | | ? (() => { |
| | | if (first) { |
| | | oMenu[propsDefault.path] = `${path}`; |
| | | let result = modules[`../${component}.vue`]; |
| | | if (result) result().then(mod => (mod.default.name = path)); |
| | | else { |
| | | isComponent = false; |
| | | } |
| | | return [ |
| | | { |
| | | component: result, |
| | | icon: icon, |
| | | name: name, |
| | | meta: meta, |
| | | query: query, |
| | | path: '', |
| | | }, |
| | | ]; |
| | | if (first) { |
| | | oMenu[propsDefault.path] = `${path}` |
| | | let result = modules[`../${component}.vue`] |
| | | if (result) result().then(mod => (mod.default.name = path)) |
| | | else { |
| | | isComponent = false |
| | | } |
| | | return []; |
| | | })() |
| | | return [ |
| | | { |
| | | component: result, |
| | | icon: icon, |
| | | name: name, |
| | | meta: meta, |
| | | query: query, |
| | | path: '', |
| | | }, |
| | | ] |
| | | } |
| | | return [] |
| | | })() |
| | | : (() => { |
| | | return this.formatRoutes(children, false); |
| | | })(), |
| | | }; |
| | | if (!isURL(path) && isComponent) aRouter.push(oRouter); |
| | | return this.formatRoutes(children, false) |
| | | })(), |
| | | } |
| | | if (!isURL(path) && isComponent) aRouter.push(oRouter) |
| | | } |
| | | if (first) { |
| | | aRouter.forEach(ele => this.safe.$router.addRoute(ele)); |
| | | aRouter.forEach(ele => this.safe.$router.addRoute(ele)) |
| | | } else { |
| | | return aRouter; |
| | | return aRouter |
| | | } |
| | | }, |
| | | }; |
| | | }; |
| | | } |
| | | } |
| | | export const formatPath = (ele, first) => { |
| | | const propsDefault = website.menu; |
| | | const icon = ele[propsDefault.icon]; |
| | | ele[propsDefault.icon] = !icon ? propsDefault.iconDefault : icon; |
| | | const propsDefault = website.menu |
| | | const icon = ele[propsDefault.icon] |
| | | ele[propsDefault.icon] = !icon ? propsDefault.iconDefault : icon |
| | | ele.meta = { |
| | | keepAlive: ele.isOpen === 2, |
| | | }; |
| | | const iframeComponent = 'components/iframe/main'; |
| | | } |
| | | const iframeComponent = 'components/iframe/main' |
| | | const iframeSrc = href => { |
| | | return href.replace(/&/g, '#'); |
| | | }; |
| | | const isChild = !!(ele[propsDefault.children] && ele[propsDefault.children].length !== 0); |
| | | return href.replace(/&/g, '#') |
| | | } |
| | | const isChild = !!(ele[propsDefault.children] && ele[propsDefault.children].length !== 0) |
| | | if (!isChild && first) { |
| | | ele.component = 'views' + ele[propsDefault.path]; |
| | | ele.component = 'views' + ele[propsDefault.path] |
| | | if (isURL(ele[propsDefault.href])) { |
| | | let href = ele[propsDefault.href]; |
| | | ele.component = iframeComponent; |
| | | let href = ele[propsDefault.href] |
| | | ele.component = iframeComponent |
| | | ele[propsDefault.query] = { |
| | | url: iframeSrc(href), |
| | | }; |
| | | } |
| | | } |
| | | } else { |
| | | ele[propsDefault.children] && |
| | | ele[propsDefault.children].forEach(child => { |
| | | child.component = 'views' + child[propsDefault.path]; |
| | | child.component = 'views' + child[propsDefault.path] |
| | | child.meta = { |
| | | keepAlive: child.isOpen === 2, |
| | | }; |
| | | } |
| | | if (isURL(child[propsDefault.href])) { |
| | | let href = child[propsDefault.href]; |
| | | child[propsDefault.path] = ele[propsDefault.path] + '/' + child.code; |
| | | child.component = iframeComponent; |
| | | let href = child[propsDefault.href] |
| | | child[propsDefault.path] = ele[propsDefault.path] + '/' + child.code |
| | | child.component = iframeComponent |
| | | child[propsDefault.query] = { |
| | | url: iframeSrc(href), |
| | | }; |
| | | } |
| | | } |
| | | formatPath(child); |
| | | }); |
| | | formatPath(child) |
| | | }) |
| | | } |
| | | }; |
| | | export default RouterPlugin; |
| | | } |
| | | export default RouterPlugin |
| | |
| | | isFullScren: state => state.common.isFullScren, |
| | | isMenu: state => state.common.isMenu, |
| | | lockPasswd: state => state.common.lockPasswd, |
| | | tagList: state => state.tags.tagList, |
| | | bsTagList: state => state.tags.bsTagList, |
| | | tagsKeep: (state, getters) => { |
| | | return getters.tagList |
| | | return getters.bsTagList |
| | | .filter(ele => { |
| | | return (ele.meta || {}).keepAlive; |
| | | return (ele.meta || {}).keepAlive |
| | | }) |
| | | .map(ele => ele.fullPath); |
| | | .map(ele => ele.fullPath) |
| | | }, |
| | | tagWel: state => state.tags.tagWel, |
| | | token: state => state.user.token, |
| | |
| | | flowRoutes: state => state.dict.flowRoutes, |
| | | devicesCmdExecuteInfo: state => state.device.devicesCmdExecuteInfo, |
| | | deviceState: state => state.device.deviceState, |
| | | }; |
| | | export default getters; |
| | | } |
| | | export default getters |
| | |
| | | import { setStore, getStore } from 'utils/store'; |
| | | import website from '@/config/website'; |
| | | import { setStore, getStore } from 'utils/store' |
| | | import website from '@/config/website' |
| | | |
| | | const tagWel = website.fistPage; |
| | | const tagWel = website.fistPage |
| | | const navs = { |
| | | state: { |
| | | tagList: getStore({ name: 'tagList' }) || [], |
| | | bsTagList: getStore({ name: 'bsTagList' }) || [], |
| | | tag: getStore({ name: 'tag' }) || {}, |
| | | tagWel: tagWel, |
| | | }, |
| | | mutations: { |
| | | ADD_TAG: (state, action) => { |
| | | if (typeof action.name == 'function') action.name = action.name(action.query); |
| | | state.tag = action; |
| | | setStore({ name: 'tag', content: state.tag }); |
| | | if (state.tagList.some(ele => ele.fullPath == action.fullPath)) return; |
| | | state.tagList.push(action); |
| | | setStore({ name: 'tagList', content: state.tagList }); |
| | | if (typeof action.name == 'function') action.name = action.name(action.query) |
| | | state.tag = action |
| | | setStore({ name: 'tag', content: state.tag }) |
| | | if (state.bsTagList.some(ele => ele.fullPath == action.fullPath)) return |
| | | state.bsTagList.push(action) |
| | | setStore({ name: 'bsTagList', content: state.bsTagList }) |
| | | }, |
| | | DEL_TAG: (state, action) => { |
| | | state.tagList = state.tagList.filter(item => { |
| | | return item.fullPath !== action.fullPath; |
| | | }); |
| | | setStore({ name: 'tagList', content: state.tagList }); |
| | | state.bsTagList = state.bsTagList.filter(item => { |
| | | return item.fullPath !== action.fullPath |
| | | }) |
| | | setStore({ name: 'bsTagList', content: state.bsTagList }) |
| | | }, |
| | | DEL_ALL_TAG: (state, tagList = []) => { |
| | | state.tagList = tagList; |
| | | setStore({ name: 'tagList', content: state.tagList }); |
| | | DEL_ALL_TAG: (state, bsTagList = []) => { |
| | | state.bsTagList = bsTagList |
| | | setStore({ name: 'bsTagList', content: state.bsTagList }) |
| | | }, |
| | | DEL_TAG_OTHER: state => { |
| | | state.tagList = state.tagList.filter(item => { |
| | | return [state.tag.fullPath, website.fistPage.path].includes(item.fullPath); |
| | | }); |
| | | setStore({ name: 'tagList', content: state.tagList }); |
| | | state.bsTagList = state.bsTagList.filter(item => { |
| | | return [state.tag.fullPath, website.fistPage.path].includes(item.fullPath) |
| | | }) |
| | | setStore({ name: 'bsTagList', content: state.bsTagList }) |
| | | }, |
| | | }, |
| | | }; |
| | | export default navs; |
| | | } |
| | | export default navs |