Skip to content

liangzhen / framework-tools-web

Go to a project
Commit f3d45e95 by 史敦盼
Options

添加导航栏

1 parent 134c5f72
Inline Side-by-side
Showing with 861 additions and 19 deletions
src/router/index.js
...@@ -9,8 +9,15 @@ const originalPush = VueRouter.prototype.push ...@@ -9,8 +9,15 @@ const originalPush = VueRouter.prototype.push
VueRouter.prototype.push = function push(location) { VueRouter.prototype.push = function push(location) {
return originalPush.call(this, location).catch((err) => err) return originalPush.call(this, location).catch((err) => err)
} }
/**
const routes = [ * meta: {
* title: 'xxx', tag标签名称
* affix: {Boolean} 固定标签不可删除
* keepAlive: {Boolean} 页面是否缓存
* }
*
*/
export const routes = [
{ {
path: '/', path: '/',
name: 'home', name: 'home',
...@@ -30,26 +37,41 @@ const routes = [ ...@@ -30,26 +37,41 @@ const routes = [
path: '/main/archiEleList', //架构元素管理 path: '/main/archiEleList', //架构元素管理
name: 'archiEleList', name: 'archiEleList',
component: () => import('@/views/archi-ele-list/index.vue'), component: () => import('@/views/archi-ele-list/index.vue'),
meta: {
title: '架构元素管理',
},
}, },
{ {
path: '/main/archi-ele-rela', //架构元素关系管理 path: '/main/archi-ele-rela', //架构元素关系管理
name: 'archi-ele-rela', name: 'archi-ele-rela',
component: () => import('@/views/archiEleRela/index.vue'), component: () => import('@/views/archiEleRela/index.vue'),
meta: {
title: '架构元素关系管理',
},
}, },
{ {
path: '/main/archi-view-config', //架构视图配置 path: '/main/archi-view-config', //架构视图配置
name: 'archi-view-config', name: 'archi-view-config',
component: () => import('@/views/archiViewConfig/index.vue'), component: () => import('@/views/archiViewConfig/index.vue'),
meta: {
title: '架构视图配置',
},
}, },
{ {
path: '/main/meta-model-dic', //元模型字典管理 path: '/main/meta-model-dic', //元模型字典管理
name: 'meta-model-dic', name: 'meta-model-dic',
component: () => import('@/views/metaModelDic/index.vue'), component: () => import('@/views/metaModelDic/index.vue'),
meta: {
title: '元模型字典管理',
},
}, },
{ {
path: '/main/busiAssetslist', //业务架构资产管理 path: '/main/busiAssetslist', //业务架构资产管理
name: 'busiAssetslist', name: 'busiAssetslist',
component: () => import('@/views/busi-assets-list/index.vue'), component: () => import('@/views/busi-assets-list/index.vue'),
meta: {
title: '业务架构资产管理',
},
}, },
// { // {
// path: '/main/YuanMoXingGuanLiCanvas',//元模型管理画布 // path: '/main/YuanMoXingGuanLiCanvas',//元模型管理画布
...@@ -60,17 +82,24 @@ const routes = [ ...@@ -60,17 +82,24 @@ const routes = [
path: '/main/doc-demo', //在线文档编制 path: '/main/doc-demo', //在线文档编制
name: 'doc-demo', name: 'doc-demo',
component: () => import('@/views/docDemo/index.vue'), component: () => import('@/views/docDemo/index.vue'),
meta: {
title: 'demo',
},
}, },
{ {
path: '/main/metaModelList', //元模型管理 path: '/main/metaModelList', //元模型管理
name: 'metaModelList', name: 'metaModelList',
component: () => import('@/views/meta-model-list/index.vue'), component: () => import('@/views/meta-model-list/index.vue'),
meta: {
title: '元模型管理',
},
}, },
{ {
path: '/main/metaModelListDetails', //元模型管理详情 path: '/main/metaModelListDetails', //元模型管理详情
name: 'metaModelListDetails', name: 'metaModelListDetails',
meta: { meta: {
showGoBack: true, showGoBack: true,
title: '元模型管理详情',
}, },
component: () => import('@/views/meta-model-list/details.vue'), component: () => import('@/views/meta-model-list/details.vue'),
}, },
...@@ -78,33 +107,51 @@ const routes = [ ...@@ -78,33 +107,51 @@ const routes = [
path: '/main/techPoliticsFabric', //技术政策结构化 path: '/main/techPoliticsFabric', //技术政策结构化
name: 'techPoliticsFabric', name: 'techPoliticsFabric',
component: () => import('@/views/tech-politics-fabric/index.vue'), component: () => import('@/views/tech-politics-fabric/index.vue'),
meta: {
title: '技术政策结构化',
},
}, },
{ {
path: '/main/techPoliticsRelativeUse', //技术政策库关联使用 path: '/main/techPoliticsRelativeUse', //技术政策库关联使用
name: 'techPoliticsRelativeUse', name: 'techPoliticsRelativeUse',
component: () => import('@/views/tech-politics-relative-use/index.vue'), component: () => import('@/views/tech-politics-relative-use/index.vue'),
meta: {
title: '技术政策库关联使用',
},
}, },
{ {
path: '/main/reportTemplateFabric', //报告模板结构化 path: '/main/reportTemplateFabric', //报告模板结构化
name: 'reportTemplateFabric', name: 'reportTemplateFabric',
component: () => import('@/views/report-template-fabric/index.vue'), component: () => import('@/views/report-template-fabric/index.vue'),
meta: {
title: '报告模板结构化',
},
}, },
{ {
path: '/main/typicalExampleManage', //典型案例库管理 path: '/main/typicalExampleManage', //典型案例库管理
name: 'typicalExampleManage', name: 'typicalExampleManage',
component: () => import('@/views/typical-example-manage/index.vue'), component: () => import('@/views/typical-example-manage/index.vue'),
meta: {
title: '典型案例库管理',
},
}, },
{ {
path: '/main/typicalExampleRelativeUse', //典型案例库关联使用 path: '/main/typicalExampleRelativeUse', //典型案例库关联使用
name: 'typicalExampleRelativeUse', name: 'typicalExampleRelativeUse',
component: () => component: () =>
import('@/views/typical-example-relative-use/index.vue'), import('@/views/typical-example-relative-use/index.vue'),
meta: {
title: '典型案例库关联使用',
},
}, },
{ {
path: '/main/totalArchiPropertyDocument', //总体架构资产文档库 path: '/main/totalArchiPropertyDocument', //总体架构资产文档库
name: 'totalArchiPropertyDocument', name: 'totalArchiPropertyDocument',
component: () => component: () =>
import('@/views/total-archi-property-document/index.vue'), import('@/views/total-archi-property-document/index.vue'),
meta: {
title: '总体架构资产文档库',
},
}, },
// { // {
// path: '/main/YuanMoXingGuanLiTable',//drawio跳转的表格 // path: '/main/YuanMoXingGuanLiTable',//drawio跳转的表格
...@@ -115,23 +162,33 @@ const routes = [ ...@@ -115,23 +162,33 @@ const routes = [
path: '/main/etp-Manage', //专家人才库 path: '/main/etp-Manage', //专家人才库
name: 'etp-Manage', name: 'etp-Manage',
component: () => import('@/views/etpManage/index.vue'), component: () => import('@/views/etpManage/index.vue'),
meta: {
title: '专家人才库',
},
}, },
{ {
path: '/main/reportTemplateRelativeUse', //报告模板关联使用 path: '/main/reportTemplateRelativeUse', //报告模板关联使用
name: 'reportTemplateRelativeUse', name: 'reportTemplateRelativeUse',
component: () => component: () =>
import('@/views/report-template-relative-use/index.vue'), import('@/views/report-template-relative-use/index.vue'),
meta: {
title: '报告模板关联使用',
},
}, },
{ {
path: '/main/archiViewManage', //架构视图管理 path: '/main/archiViewManage', //架构视图管理
name: 'archiViewManage', name: 'archiViewManage',
component: () => import('@/views/archi-view-manage/index.vue'), component: () => import('@/views/archi-view-manage/index.vue'),
meta: {
title: '架构视图管理',
},
}, },
{ {
path: '/main/archiViewManageDetails', //架构视图管理详情 path: '/main/archiViewManageDetails', //架构视图管理详情
name: 'archiViewManageDetails', name: 'archiViewManageDetails',
meta: { meta: {
showGoBack: true, showGoBack: true,
title: '架构视图管理详情',
}, },
component: () => import('@/views/archi-view-manage/details.vue'), component: () => import('@/views/archi-view-manage/details.vue'),
}, },
...@@ -139,57 +196,88 @@ const routes = [ ...@@ -139,57 +196,88 @@ const routes = [
path: '/main/archiAssetManage/', //总体架构资产管理 path: '/main/archiAssetManage/', //总体架构资产管理
name: 'archiAssetManage', name: 'archiAssetManage',
component: () => import('@/views/archi-asset-manage/index.vue'), component: () => import('@/views/archi-asset-manage/index.vue'),
meta: {
title: '总体架构资产管理',
},
}, },
{ {
path: '/main/comCenterServeList/', //企业中台服务清单 path: '/main/comCenterServeList/', //企业中台服务清单
name: 'comCenterServeList', name: 'comCenterServeList',
component: () => import('@/views/comCenterServeList/index.vue'), component: () => import('@/views/comCenterServeList/index.vue'),
meta: {
title: '企业中台服务清单',
},
}, },
{ {
path: '/main/currentAssetsList', //现状架构资产管理 path: '/main/currentAssetsList', //现状架构资产管理
name: 'currentAssetsList', name: 'currentAssetsList',
component: () => import('@/views/current-assets-list/index.vue'), component: () => import('@/views/current-assets-list/index.vue'),
meta: {
title: '现状架构资产管理',
},
}, },
{ {
path: '/main/logManage', //日志管理 path: '/main/logManage', //日志管理
name: 'logManage', name: 'logManage',
component: () => import('@/views/log-manage/index.vue'), component: () => import('@/views/log-manage/index.vue'),
meta: {
title: '日志管理',
},
}, },
{ {
path: '/main/archiEvoluteLine', //架构演进路线资产管理 path: '/main/archiEvoluteLine', //架构演进路线资产管理
name: 'archiEvoluteLine', name: 'archiEvoluteLine',
component: () => import('@/views/archi-evolute-line/index.vue'), component: () => import('@/views/archi-evolute-line/index.vue'),
meta: {
title: '架构演进路线资产管理',
},
}, },
{ {
path: '/main/archiIntelligenceSearch', //总体架构资产智能搜索 path: '/main/archiIntelligenceSearch', //总体架构资产智能搜索
name: 'archiIntelligenceSearch', name: 'archiIntelligenceSearch',
component: () => import('@/views/archi-intelligence-search/index.vue'), component: () => import('@/views/archi-intelligence-search/index.vue'),
meta: {
title: '总体架构资产智能搜索',
},
}, },
{ {
path: '/main/archiAssetVisualShow', //总体架构资产可视化展示 path: '/main/archiAssetVisualShow', //总体架构资产可视化展示
name: 'archiAssetVisualShow', name: 'archiAssetVisualShow',
component: () => import('@/views/archiAssetVisualShow/index.vue'), component: () => import('@/views/archiAssetVisualShow/index.vue'),
meta: {
title: '总体架构资产可视化展示',
},
}, },
{ {
path: '/main/systemInfoManage', //系统信息管理 path: '/main/systemInfoManage', //系统信息管理
name: 'systemInfoManage', name: 'systemInfoManage',
component: () => import('@/views/systemInfoManage/index.vue'), component: () => import('@/views/systemInfoManage/index.vue'),
meta: {
title: '系统信息管理',
},
}, },
{ {
path: '/main/projectInfoManage', //项目信息管理 path: '/main/projectInfoManage', //项目信息管理
name: 'projectInfoManage', name: 'projectInfoManage',
component: () => import('@/views/projectInfoManage/index.vue'), component: () => import('@/views/projectInfoManage/index.vue'),
meta: {
title: '项目信息管理',
},
}, },
{ {
path: '/main/systemArchiViewDesign', //系统架构视图设计 path: '/main/systemArchiViewDesign', //系统架构视图设计
name: 'systemArchiViewDesign', name: 'systemArchiViewDesign',
component: () => import('@/views/systemArchiViewDesign/index.vue'), component: () => import('@/views/systemArchiViewDesign/index.vue'),
meta: {
title: '系统架构视图设计',
},
}, },
{ {
path: '/main/systemArchiViewDesignDetails', //系统架构视图设计详情 path: '/main/systemArchiViewDesignDetails', //系统架构视图设计详情
name: 'systemArchiViewDesignDetails', name: 'systemArchiViewDesignDetails',
meta: { meta: {
showGoBack: true, showGoBack: true,
title: '系统架构视图设计详情',
}, },
component: () => import('@/views/systemArchiViewDesign/details.vue'), component: () => import('@/views/systemArchiViewDesign/details.vue'),
}, },
...@@ -198,6 +286,7 @@ const routes = [ ...@@ -198,6 +286,7 @@ const routes = [
name: 'documentEdit', name: 'documentEdit',
meta: { meta: {
showGoBack: true, showGoBack: true,
title: '文档编辑',
}, },
component: () => import('@/views/documentEdit/index.vue'), component: () => import('@/views/documentEdit/index.vue'),
}, },
...@@ -205,12 +294,16 @@ const routes = [ ...@@ -205,12 +294,16 @@ const routes = [
path: '/main/summaryArchiDesign', //概设阶段视图设计 path: '/main/summaryArchiDesign', //概设阶段视图设计
name: 'summaryArchiDesign', name: 'summaryArchiDesign',
component: () => import('@/views/summaryArchiDesign/index.vue'), component: () => import('@/views/summaryArchiDesign/index.vue'),
meta: {
title: '概设阶段视图设计',
},
}, },
{ {
path: '/main/summaryArchiDesignDetails', //概设阶段视图设计详情 path: '/main/summaryArchiDesignDetails', //概设阶段视图设计详情
name: 'summaryArchiDesignDetails', name: 'summaryArchiDesignDetails',
meta: { meta: {
showGoBack: true, showGoBack: true,
title: '概设阶段视图设计详情',
}, },
component: () => import('@/views/summaryArchiDesign/details.vue'), component: () => import('@/views/summaryArchiDesign/details.vue'),
}, },
...@@ -218,12 +311,16 @@ const routes = [ ...@@ -218,12 +311,16 @@ const routes = [
path: '/main/otherArchiDesign', //其他视图设计 path: '/main/otherArchiDesign', //其他视图设计
name: 'otherArchiDesign', name: 'otherArchiDesign',
component: () => import('@/views/otherArchiDesign/index.vue'), component: () => import('@/views/otherArchiDesign/index.vue'),
meta: {
title: '其他视图设计',
},
}, },
{ {
path: '/main/otherArchiDesignDetails', //其他视图设计详情 path: '/main/otherArchiDesignDetails', //其他视图设计详情
name: 'otherArchiDesignDetails', name: 'otherArchiDesignDetails',
meta: { meta: {
showGoBack: true, showGoBack: true,
title: '其他视图设计详情',
}, },
component: () => import('@/views/otherArchiDesign/details.vue'), component: () => import('@/views/otherArchiDesign/details.vue'),
}, },
...@@ -231,12 +328,16 @@ const routes = [ ...@@ -231,12 +328,16 @@ const routes = [
path: '/main/reviewSituation', //评审情况(概要设计) path: '/main/reviewSituation', //评审情况(概要设计)
name: 'reviewSituation', name: 'reviewSituation',
component: () => import('@/views/reviewSituation/index.vue'), component: () => import('@/views/reviewSituation/index.vue'),
meta: {
title: '评审情况(概要设计)',
},
}, },
{ {
path: '/main/reviewSituationDetails', //评审情况(概要设计)，详情 path: '/main/reviewSituationDetails', //评审情况(概要设计)，详情
name: 'reviewSituationDetails', name: 'reviewSituationDetails',
meta: { meta: {
showGoBack: true, showGoBack: true,
title: '评审情况(概要设计)详情',
}, },
component: () => import('@/views/reviewSituation/details.vue'), component: () => import('@/views/reviewSituation/details.vue'),
}, },
...@@ -244,12 +345,16 @@ const routes = [ ...@@ -244,12 +345,16 @@ const routes = [
path: '/main/reviewArchiFollowCheck', //概设架构遵从审查 path: '/main/reviewArchiFollowCheck', //概设架构遵从审查
name: 'reviewArchiFollowCheck', name: 'reviewArchiFollowCheck',
component: () => import('@/views/reviewArchiFollowCheck/index.vue'), component: () => import('@/views/reviewArchiFollowCheck/index.vue'),
meta: {
title: '概设架构遵从审查',
},
}, },
{ {
path: '/main/reviewArchiFollowCheckDetails', //概设架构遵从审查，详情 path: '/main/reviewArchiFollowCheckDetails', //概设架构遵从审查，详情
name: 'reviewArchiFollowCheckDetails', name: 'reviewArchiFollowCheckDetails',
meta: { meta: {
showGoBack: true, showGoBack: true,
title: '概设架构遵从审查详情',
}, },
component: () => import('@/views/reviewArchiFollowCheck/details.vue'), component: () => import('@/views/reviewArchiFollowCheck/details.vue'),
}, },
...@@ -257,12 +362,16 @@ const routes = [ ...@@ -257,12 +362,16 @@ const routes = [
path: '/main/reviewArchiPoliticeCheck', //概设架构政策审查 path: '/main/reviewArchiPoliticeCheck', //概设架构政策审查
name: 'reviewArchiPoliticeCheck', name: 'reviewArchiPoliticeCheck',
component: () => import('@/views/reviewArchiPoliticeCheck/index.vue'), component: () => import('@/views/reviewArchiPoliticeCheck/index.vue'),
meta: {
title: '概设架构政策审查',
},
}, },
{ {
path: '/main/reviewArchiPoliticeCheckDetails', //概设架构政策审查，详情 path: '/main/reviewArchiPoliticeCheckDetails', //概设架构政策审查，详情
name: 'reviewArchiPoliticeCheckDetails', name: 'reviewArchiPoliticeCheckDetails',
meta: { meta: {
showGoBack: true, showGoBack: true,
title: '概设架构政策审查详情',
}, },
component: () => import('@/views/reviewArchiPoliticeCheck/details.vue'), component: () => import('@/views/reviewArchiPoliticeCheck/details.vue'),
}, },
...@@ -270,17 +379,25 @@ const routes = [ ...@@ -270,17 +379,25 @@ const routes = [
path: '/main/batchPlanManagement', //批次计划管理 path: '/main/batchPlanManagement', //批次计划管理
name: 'batchPlanManagement', name: 'batchPlanManagement',
component: () => import('@/views/batchPlanManagement/index.vue'), component: () => import('@/views/batchPlanManagement/index.vue'),
meta: {
title: '批次计划管理',
keepAlive: true
},
}, },
{ {
path: '/main/conceptualReview', // 概设材料审查列表 path: '/main/conceptualReview', // 概设材料审查列表
name: 'conceptualReview', name: 'conceptualReview',
component: () => import('@/views/conceptualReview/index.vue'), component: () => import('@/views/conceptualReview/index.vue'),
meta: {
title: '概设材料审查',
},
}, },
{ {
path: '/main/conceptualExamine', // 概设材料审查页面 path: '/main/conceptualExamine', // 概设材料审查页面
name: 'conceptualExamine', name: 'conceptualExamine',
meta: { meta: {
showGoBack: true, showGoBack: true,
title: '概设材料审查详情',
}, },
component: () => import('@/views/conceptualReview/Examine.vue'), component: () => import('@/views/conceptualReview/Examine.vue'),
}, },
...@@ -288,22 +405,33 @@ const routes = [ ...@@ -288,22 +405,33 @@ const routes = [
path: '/main/demandManagement', // 需求管理列表页 path: '/main/demandManagement', // 需求管理列表页
name: 'demandManagement', name: 'demandManagement',
component: () => import('@/views/demandManagement/index.vue'), component: () => import('@/views/demandManagement/index.vue'),
meta: {
title: '需求管理',
keepAlive: true
},
}, },
{ {
path: '/main/conceptualViewOrg', // 概设材料意见编制 path: '/main/conceptualViewOrg', // 概设材料意见编制
name: 'conceptualViewOrg', name: 'conceptualViewOrg',
component: () => import('@/views/conceptualViewOrg/index.vue'), component: () => import('@/views/conceptualViewOrg/index.vue'),
meta: {
title: '概设材料意见编制',
},
}, },
{ {
path: '/main/conceptualBaseManagement', // 概设评审基础管理 path: '/main/conceptualBaseManagement', // 概设评审基础管理
name: 'conceptualBaseManagement', name: 'conceptualBaseManagement',
component: () => import('@/views/conceptualBaseManagement/index.vue'), component: () => import('@/views/conceptualBaseManagement/index.vue'),
meta: {
title: '概设评审基础管理',
},
}, },
{ {
path: '/main/onlineReview', // 评审意见编制- 在线辅助审核 path: '/main/onlineReview', // 评审意见编制- 在线辅助审核
name: 'onlineReview', name: 'onlineReview',
meta: { meta: {
showGoBack: true, showGoBack: true,
title: '在线辅助审核',
}, },
component: () => import('@/views/conceptualViewOrg/OnlineReview.vue'), component: () => import('@/views/conceptualViewOrg/OnlineReview.vue'),
}, },
...@@ -311,28 +439,41 @@ const routes = [ ...@@ -311,28 +439,41 @@ const routes = [
path: '/main/conceptualRelated', // 概设关联业务管理 path: '/main/conceptualRelated', // 概设关联业务管理
name: 'conceptualRelated', name: 'conceptualRelated',
component: () => import('@/views/conceptualRelated/index.vue'), component: () => import('@/views/conceptualRelated/index.vue'),
meta: {
title: '概设关联业务管理',
},
}, },
{ {
path: '/main/supervisionNotifyManagement', // 架构督查督查通报管理 path: '/main/supervisionNotifyManagement', // 架构督查督查通报管理
name: 'supervisionNotifyManagement', name: 'supervisionNotifyManagement',
component: () => component: () =>
import('@/views/supervisionNotifyManagement/index.vue'), import('@/views/supervisionNotifyManagement/index.vue'),
meta: {
title: '督查通报管理',
},
}, },
{ {
path: '/main/supervisionProblemEdit', // 架构督查督查问题整改 path: '/main/supervisionProblemEdit', // 架构督查督查问题整改
name: 'supervisionProblemEdit', name: 'supervisionProblemEdit',
component: () => import('@/views/supervisionProblemEdit/index.vue'), component: () => import('@/views/supervisionProblemEdit/index.vue'),
meta: {
title: '督查问题整改',
},
}, },
{ {
path: '/main/architectureFollowExamine', // 架构督查架构遵从检查 path: '/main/architectureFollowExamine', // 架构督查架构遵从检查
name: 'architectureFollowExamine', name: 'architectureFollowExamine',
component: () => import('@/views/architectureFollowExamine/index.vue'), component: () => import('@/views/architectureFollowExamine/index.vue'),
meta: {
title: '架构遵从检查',
},
}, },
{ {
path: '/main/architectureFollowExamineDetails', // 架构督查 - 架构遵从检查-详情 path: '/main/architectureFollowExamineDetails', // 架构督查 - 架构遵从检查-详情
name: 'architectureFollowExamineDetails', name: 'architectureFollowExamineDetails',
meta: { meta: {
showGoBack: true, showGoBack: true,
title: '架构遵从检查详情',
}, },
component: () => component: () =>
import('@/views/architectureFollowExamine/details.vue'), import('@/views/architectureFollowExamine/details.vue'),
...@@ -341,33 +482,51 @@ const routes = [ ...@@ -341,33 +482,51 @@ const routes = [
path: '/main/artPolicyExamine', // 架构督查-技术政策审查 path: '/main/artPolicyExamine', // 架构督查-技术政策审查
name: 'artPolicyExamine', name: 'artPolicyExamine',
component: () => import('@/views/artPolicyExamine/index.vue'), component: () => import('@/views/artPolicyExamine/index.vue'),
meta: {
title: '技术政策审查',
},
}, },
{ {
path: '/main/collectDataConfiguration', // 架构督查 - 收集资料配置 path: '/main/collectDataConfiguration', // 架构督查 - 收集资料配置
name: 'collectDataConfiguration', name: 'collectDataConfiguration',
component: () => import('@/views/collectDataConfiguration/index.vue'), component: () => import('@/views/collectDataConfiguration/index.vue'),
meta: {
title: '收集资料配置',
},
}, },
{ {
path: '/main/supervisionDataCollection', // 架构督查 - 督查资料收集 path: '/main/supervisionDataCollection', // 架构督查 - 督查资料收集
name: 'supervisionDataCollection', name: 'supervisionDataCollection',
component: () => import('@/views/supervisionDataCollection/index.vue'), component: () => import('@/views/supervisionDataCollection/index.vue'),
meta: {
title: '督查资料收集',
},
}, },
{ {
path: '/main/architectureInspectionAnalysis', // 架构督查 - 架构督查分析 path: '/main/architectureInspectionAnalysis', // 架构督查 - 架构督查分析
name: 'architectureInspectionAnalysis', name: 'architectureInspectionAnalysis',
component: () => component: () =>
import('@/views/architectureInspectionAnalysis/index.vue'), import('@/views/architectureInspectionAnalysis/index.vue'),
meta: {
title: '架构督查分析',
},
}, },
{ {
path:'/main/examine',// 架构督查 - 架构督查分析 path: '/main/examine', // 架构督查 - 架构督查分析
name:'examine', name: 'examine',
component:()=> import('@/views/artPolicyExamine/Examine.vue'), component: () => import('@/views/artPolicyExamine/Examine.vue'),
meta: {
title: '架构督查分析',
},
}, },
{ {
path: '/main/dictionaryManagement', // 系统管理 - 字典管理 path: '/main/dictionaryManagement', // 系统管理 - 字典管理
name: 'dictionaryManagement', name: 'dictionaryManagement',
component: () => import('@/views/dictionaryManagement/index.vue'), component: () => import('@/views/dictionaryManagement/index.vue'),
meta: {
title: '字典管理',
},
}, },
], ],
}, },
......
src/store/getters.js 0 → 100644
import { getAllBreadcrumbList } from '@/utils'
import { menuOptions } from '@/views/Main/menu'
const getters = {
// 递归处理后的所有面包屑导航列表
breadcrumbListGet: (state) => getAllBreadcrumbList(menuOptions),
// tag 路由标签
cachedViews: state => state.tagsView.cachedViews,
}
export default getters
src/store/index.js
import Vue from 'vue' import Vue from 'vue'
import Vuex from 'vuex' import Vuex from 'vuex'
import getters from './getters'
Vue.use(Vuex) Vue.use(Vuex)
import { getAllBreadcrumbList } from '@/utils'
import { menuOptions } from '@/views/Main/menu' const modulesFiles = require.context('./modules', true, /\.js$/)
// you do not need `import app from './modules/app'`
// it will auto require all vuex module from modules file
const modules = modulesFiles.keys().reduce((modules, modulePath) => {
// set './app.js' => 'app'
const moduleName = modulePath.replace(/^\.\/(.*)\.\w+$/, '$1')
const value = modulesFiles(modulePath)
modules[moduleName] = value.default
return modules
}, {})
export default new Vuex.Store({ export default new Vuex.Store({
state: {}, state: {},
getters: { getters,
// 递归处理后的所有面包屑导航列表
breadcrumbListGet: (state) => getAllBreadcrumbList(menuOptions),
},
mutations: {}, mutations: {},
actions: {}, actions: {},
modules: {}, modules,
}) })
src/store/modules/tagsView.js 0 → 100644
const state = {
visitedViews: [],
cachedViews: []
}
const mutations = {
ADD_VISITED_VIEW: (state, view) => {
if (state.visitedViews.some(v => v.path === view.path)) return
state.visitedViews.push(
Object.assign({}, view, {
title: view.meta.title || 'no-name'
})
)
},
ADD_CACHED_VIEW: (state, view) => {
if (state.cachedViews.includes(view.name)) return
if (view.meta.keepAlive) {
state.cachedViews.push(view.name)
}
},
DEL_VISITED_VIEW: (state, view) => {
for (const [i, v] of state.visitedViews.entries()) {
if (v.path === view.path) {
state.visitedViews.splice(i, 1)
break
}
}
},
DEL_CACHED_VIEW: (state, view) => {
const index = state.cachedViews.indexOf(view.name)
index > -1 && state.cachedViews.splice(index, 1)
},
DEL_OTHERS_VISITED_VIEWS: (state, view) => {
state.visitedViews = state.visitedViews.filter(v => {
return v.meta.affix || v.path === view.path
})
},
DEL_OTHERS_CACHED_VIEWS: (state, view) => {
const index = state.cachedViews.indexOf(view.name)
if (index > -1) {
state.cachedViews = state.cachedViews.slice(index, index + 1)
} else {
// if index = -1, there is no cached tags
state.cachedViews = []
}
},
DEL_ALL_VISITED_VIEWS: state => {
// keep affix tags
const affixTags = state.visitedViews.filter(tag => tag.meta.affix)
state.visitedViews = affixTags
},
DEL_ALL_CACHED_VIEWS: state => {
state.cachedViews = []
},
UPDATE_VISITED_VIEW: (state, view) => {
for (let v of state.visitedViews) {
if (v.path === view.path) {
v = Object.assign(v, view)
break
}
}
}
}
const actions = {
addView({ dispatch }, view) {
dispatch('addVisitedView', view)
dispatch('addCachedView', view)
},
addVisitedView({ commit }, view) {
commit('ADD_VISITED_VIEW', view)
},
addCachedView({ commit }, view) {
commit('ADD_CACHED_VIEW', view)
},
delView({ dispatch, state }, view) {
return new Promise(resolve => {
dispatch('delVisitedView', view)
dispatch('delCachedView', view)
resolve({
visitedViews: [...state.visitedViews],
cachedViews: [...state.cachedViews]
})
})
},
delVisitedView({ commit, state }, view) {
return new Promise(resolve => {
commit('DEL_VISITED_VIEW', view)
resolve([...state.visitedViews])
})
},
delCachedView({ commit, state }, view) {
return new Promise(resolve => {
commit('DEL_CACHED_VIEW', view)
resolve([...state.cachedViews])
})
},
delOthersViews({ dispatch, state }, view) {
return new Promise(resolve => {
dispatch('delOthersVisitedViews', view)
dispatch('delOthersCachedViews', view)
resolve({
visitedViews: [...state.visitedViews],
cachedViews: [...state.cachedViews]
})
})
},
delOthersVisitedViews({ commit, state }, view) {
return new Promise(resolve => {
commit('DEL_OTHERS_VISITED_VIEWS', view)
resolve([...state.visitedViews])
})
},
delOthersCachedViews({ commit, state }, view) {
return new Promise(resolve => {
commit('DEL_OTHERS_CACHED_VIEWS', view)
resolve([...state.cachedViews])
})
},
delAllViews({ dispatch, state }, view) {
return new Promise(resolve => {
dispatch('delAllVisitedViews', view)
dispatch('delAllCachedViews', view)
resolve({
visitedViews: [...state.visitedViews],
cachedViews: [...state.cachedViews]
})
})
},
delAllVisitedViews({ commit, state }) {
return new Promise(resolve => {
commit('DEL_ALL_VISITED_VIEWS')
resolve([...state.visitedViews])
})
},
delAllCachedViews({ commit, state }) {
return new Promise(resolve => {
commit('DEL_ALL_CACHED_VIEWS')
resolve([...state.cachedViews])
})
},
updateVisitedView({ commit }, view) {
commit('UPDATE_VISITED_VIEW', view)
}
}
export default {
namespaced: true,
state,
mutations,
actions
}
src/styles/transition.scss
...@@ -17,3 +17,18 @@ ...@@ -17,3 +17,18 @@
.breadcrumb-leave-active { .breadcrumb-leave-active {
position: absolute; position: absolute;
} }
/* fade-transform */
.fade-transform-leave-active,
.fade-transform-enter-active {
transition: all .5s;
}
.fade-transform-enter {
opacity: 0;
transform: translateX(-30px);
}
.fade-transform-leave-to {
opacity: 0;
transform: translateX(30px);
}
src/views/Main/components/AppMain.vue 0 → 100644
<template>
<section class="app-main">
<transition name="fade-transform" mode="out-in">
<keep-alive :include="cachedViews">
<router-view :key="key" />
</keep-alive>
</transition>
</section>
</template>
<script>
export default {
name: 'AppMain',
computed: {
cachedViews() {
return this.$store.state.tagsView.cachedViews
},
key() {
return this.$route.path
}
}
}
</script>
<style lang="scss" scoped>
@import '@/styles/transition.scss';
.app-main {
/* 50= navbar 50 */
// min-height: calc(100vh - 50px);
// width: 100%;
// position: relative;
// overflow: hidden;
display: flex;
height: calc(100% - 220px);
width: calc(100% - 40px);
margin: 70px 20px 20px 20px;
border-top: 6px solid #0d867f;
box-shadow: 10px 10px 30px 30px rgba(201, 226, 225, 1);
}
.fixed-header+.app-main {
padding-top: 50px;
}
.hasTagsView {
.app-main {
/* 84 = navbar + tags-view = 50 + 34 */
min-height: calc(100vh - 84px);
}
.fixed-header+.app-main {
padding-top: 84px;
}
}
</style>
<style lang="scss">
// fix css style bug in open el-dialog
.el-popup-parent--hidden {
.fixed-header {
padding-right: 15px;
}
}
</style>
src/views/Main/components/TagsView/ScrollPane.vue 0 → 100644
<template>
<el-scrollbar ref="scrollContainer" :vertical="false" class="scroll-container" @wheel.native.prevent="handleScroll">
<slot />
</el-scrollbar>
</template>
<script>
const tagAndTagSpacing = 4 // tagAndTagSpacing
export default {
name: 'ScrollPane',
data() {
return {
left: 0
}
},
computed: {
scrollWrapper() {
return this.$refs.scrollContainer.$refs.wrap
}
},
methods: {
handleScroll(e) {
const eventDelta = e.wheelDelta || -e.deltaY * 40
const $scrollWrapper = this.scrollWrapper
$scrollWrapper.scrollLeft = $scrollWrapper.scrollLeft + eventDelta / 4
},
moveToTarget(currentTag) {
const $container = this.$refs.scrollContainer.$el
const $containerWidth = $container.offsetWidth
const $scrollWrapper = this.scrollWrapper
const tagList = this.$parent.$refs.tag
let firstTag = null
let lastTag = null
// find first tag and last tag
if (tagList.length > 0) {
firstTag = tagList[0]
lastTag = tagList[tagList.length - 1]
}
if (firstTag === currentTag) {
$scrollWrapper.scrollLeft = 0
} else if (lastTag === currentTag) {
$scrollWrapper.scrollLeft = $scrollWrapper.scrollWidth - $containerWidth
} else {
// find preTag and nextTag
const currentIndex = tagList.findIndex(item => item === currentTag)
const prevTag = tagList[currentIndex - 1]
const nextTag = tagList[currentIndex + 1]
// the tag's offsetLeft after of nextTag
const afterNextTagOffsetLeft = nextTag.$el.offsetLeft + nextTag.$el.offsetWidth + tagAndTagSpacing
// the tag's offsetLeft before of prevTag
const beforePrevTagOffsetLeft = prevTag.$el.offsetLeft - tagAndTagSpacing
if (afterNextTagOffsetLeft > $scrollWrapper.scrollLeft + $containerWidth) {
$scrollWrapper.scrollLeft = afterNextTagOffsetLeft - $containerWidth
} else if (beforePrevTagOffsetLeft < $scrollWrapper.scrollLeft) {
$scrollWrapper.scrollLeft = beforePrevTagOffsetLeft
}
}
}
}
}
</script>
<style lang="scss" scoped>
.scroll-container {
white-space: nowrap;
position: relative;
overflow: hidden;
width: 100%;
/deep/ {
.el-scrollbar__bar {
bottom: 0px;
}
.el-scrollbar__wrap {
height: 49px;
}
}
}
</style>
src/views/Main/components/TagsView/index.vue 0 → 100644
<template>
<div id="tags-view-container" class="tags-view-container">
<scroll-pane ref="scrollPane" class="tags-view-wrapper">
<!-- @click.middle.native="!isAffix(tag)?closeSelectedTag(tag):''" -->
<router-link
v-for="tag in visitedViews"
ref="tag"
:key="tag.path"
:class="isActive(tag) ? 'active' : ''"
:to="{ path: tag.path, query: tag.query, fullPath: tag.fullPath }"
tag="span"
class="tags-view-item"
@contextmenu.prevent.native="openMenu(tag, $event)"
>
{{ tag.title }}
<span
v-if="!isAffix(tag) && visitedViews.length > 1"
class="el-icon-close"
@click.prevent.stop="closeSelectedTag(tag)"
/>
</router-link>
</scroll-pane>
<!-- <ul v-show="visible" :style="{left:left+'px',top:top+'px'}" class="contextmenu">
<li @click="refreshSelectedTag(selectedTag)">Refresh</li>
<li v-if="!isAffix(selectedTag)" @click="closeSelectedTag(selectedTag)">Close</li>
<li @click="closeOthersTags(selectedTag)">Close Others</li>
<li @click="closeAllTags(selectedTag)">Close All</li>
</ul> -->
</div>
</template>
<script>
import ScrollPane from './ScrollPane'
// import path from 'path'
import { routes } from '@/router'
export default {
components: { ScrollPane },
data() {
return {
visible: false,
top: 0,
left: 0,
selectedTag: {},
affixTags: [],
}
},
computed: {
visitedViews() {
return this.$store.state.tagsView.visitedViews
},
// routes() {
// return this.$store.state.permission.routes
// },
},
watch: {
$route() {
this.addTags()
this.moveToCurrentTag()
},
visible(value) {
if (value) {
document.body.addEventListener('click', this.closeMenu)
} else {
document.body.removeEventListener('click', this.closeMenu)
}
},
},
mounted() {
this.initTags()
this.addTags()
// 页面刷新前缓存和赋值
this.beforeUnload()
},
methods: {
// 刷新前缓存tab
beforeUnload() {
// 监听页面刷新
window.addEventListener('beforeunload', () => {
// visitedViews数据结构太复杂无法直接JSON.stringify处理，先转换需要的数据
let tabViews = this.visitedViews.map((item) => {
return {
fullPath: item.fullPath,
hash: item.hash,
meta: { ...item.meta },
name: item.name,
params: { ...item.params },
path: item.path,
query: { ...item.query },
title: item.title,
}
})
sessionStorage.setItem('tabViews', JSON.stringify(tabViews))
})
// 页面初始化加载判断缓存中是否有数据
let oldViews = JSON.parse(sessionStorage.getItem('tabViews')) || []
if (oldViews.length > 0) {
this.$store.state.tagsView.visitedViews = oldViews
}
},
isActive(route) {
return route.path === this.$route.path
},
isAffix(tag) {
return tag.meta && tag.meta.affix
},
filterAffixTags(routes, basePath = '/') {
let tags = []
routes.forEach((route) => {
if (route.meta && route.meta.affix) {
const tagPath = path.resolve(basePath, route.path)
tags.push({
fullPath: tagPath,
path: tagPath,
name: route.name,
meta: { ...route.meta },
})
}
if (route.children) {
const tempTags = this.filterAffixTags(route.children, route.path)
if (tempTags.length >= 1) {
tags = [...tags, ...tempTags]
}
}
})
return tags
},
initTags() {
const affixTags = (this.affixTags = this.filterAffixTags(routes))
for (const tag of affixTags) {
// Must have tag name
if (tag.name) {
this.$store.dispatch('tagsView/addVisitedView', tag)
}
}
},
addTags() {
const { name } = this.$route
if (name) {
this.$store.dispatch('tagsView/addView', this.$route)
}
return false
},
moveToCurrentTag() {
const tags = this.$refs.tag
this.$nextTick(() => {
for (const tag of tags) {
if (tag.to.path === this.$route.path) {
this.$refs.scrollPane.moveToTarget(tag)
// when query is different then update
if (tag.to.fullPath !== this.$route.fullPath) {
this.$store.dispatch('tagsView/updateVisitedView', this.$route)
}
break
}
}
})
},
refreshSelectedTag(view) {
this.$store.dispatch('tagsView/delCachedView', view).then(() => {
const { fullPath } = view
this.$nextTick(() => {
this.$router.replace({
path: '/redirect' + fullPath,
})
})
})
},
closeSelectedTag(view) {
this.$store
.dispatch('tagsView/delView', view)
.then(({ visitedViews }) => {
if (this.isActive(view)) {
this.toLastView(visitedViews, view)
}
})
},
closeOthersTags() {
this.$router.push(this.selectedTag)
this.$store
.dispatch('tagsView/delOthersViews', this.selectedTag)
.then(() => {
this.moveToCurrentTag()
})
},
closeAllTags(view) {
this.$store.dispatch('tagsView/delAllViews').then(({ visitedViews }) => {
if (this.affixTags.some((tag) => tag.path === view.path)) {
return
}
this.toLastView(visitedViews, view)
})
},
toLastView(visitedViews, view) {
const latestView = visitedViews.slice(-1)[0]
if (latestView) {
this.$router.push(latestView.fullPath)
} else {
// now the default is to redirect to the home page if there is no tags-view,
// you can adjust it according to your needs.
this.$router.push('/')
}
},
openMenu(tag, e) {
const menuMinWidth = 105
const offsetLeft = this.$el.getBoundingClientRect().left // container margin left
const offsetWidth = this.$el.offsetWidth // container width
const maxLeft = offsetWidth - menuMinWidth // left boundary
const left = e.clientX - offsetLeft + 15 // 15: margin right
if (left > maxLeft) {
this.left = maxLeft
} else {
this.left = left
}
this.top = e.clientY
this.visible = true
this.selectedTag = tag
},
closeMenu() {
this.visible = false
},
handleScroll() {
this.closeMenu()
},
},
}
</script>
<style lang="scss" scoped>
@import '@/styles/common.scss';
/deep/ .scroll-container .el-scrollbar__wrap {
scrollbar-width: none;
}
.tags-view-container {
height: 34px;
width: 100%;
background: #fff;
border-bottom: 1px solid #d8dce5;
box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.12), 0 0 3px 0 rgba(0, 0, 0, 0.04);
text-align: left;
.tags-view-wrapper {
.tags-view-item {
display: inline-block;
position: relative;
cursor: pointer;
height: 26px;
line-height: 26px;
// border: 1px solid #d8dce5;
color: #495060;
background: #fff;
padding: 0 8px;
font-size: 12px;
margin-left: 5px;
margin-top: 4px;
&:first-of-type {
margin-left: 15px;
}
&:last-of-type {
margin-right: 15px;
}
@mixin tagActive() {
color: $color-primary;
background: url('@/assets/main/tag_bg.png') no-repeat center;
background-size: cover;
&::before {
content: '';
// background: #fff;
display: inline-block;
width: 8px;
height: 8px;
border-radius: 50%;
position: relative;
margin-right: 2px;
}
}
&:hover {
color: $color-primary;
}
&.active {
// background-color: #409eff;
// color: #fff;
// border-color: #409eff;
@include tagActive;
}
}
}
.contextmenu {
margin: 0;
background: #fff;
z-index: 3000;
position: absolute;
list-style-type: none;
padding: 5px 0;
border-radius: 4px;
font-size: 12px;
font-weight: 400;
color: #333;
box-shadow: 2px 2px 3px 0 rgba(0, 0, 0, 0.3);
li {
margin: 0;
padding: 7px 16px;
cursor: pointer;
&:hover {
background: #eee;
}
}
}
}
</style>
<style lang="scss">
//reset element css of el-icon-close
.tags-view-wrapper {
.tags-view-item {
.el-icon-close {
width: 16px;
height: 16px;
vertical-align: 2px;
border-radius: 50%;
text-align: center;
transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
transform-origin: 100% 50%;
&:before {
transform: scale(0.6);
display: inline-block;
vertical-align: -3px;
}
&:hover {
background-color: #b4bccc;
color: #fff;
}
}
}
}
</style>
src/views/Main/index.vue
...@@ -101,6 +101,7 @@ ...@@ -101,6 +101,7 @@
</div> </div>
</el-popover> </el-popover>
</div> </div>
<tags-view />
<div class="flex-b-c"> <div class="flex-b-c">
<el-breadcrumb separator="/"> <el-breadcrumb separator="/">
<!-- <el-breadcrumb-item>{{ breadcrumb1 }}</el-breadcrumb-item> <!-- <el-breadcrumb-item>{{ breadcrumb1 }}</el-breadcrumb-item>
...@@ -141,19 +142,22 @@ ...@@ -141,19 +142,22 @@
</div> </div>
</div> </div>
</div> </div>
<div class="left_menu_and_drawio_container"> <app-main />
<!-- <div class="left_menu_container"> <!-- <div class="left_menu_and_drawio_container">
左边任务栏
</div> -->
<router-view></router-view> <router-view></router-view>
</div> </div> -->
</div> </div>
</template> </template>
<script> <script>
// import $ from 'jquery' // import $ from 'jquery'
import AppMain from './components/AppMain.vue'
import TagsView from './components/TagsView/index.vue'
import { menuOptions } from './menu' import { menuOptions } from './menu'
export default { export default {
components: {}, components: {
AppMain,
TagsView
},
data() { data() {
return { return {
visible1: false, visible1: false,
......
Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!