Skip to content

liangzhen / framework-tools-web

Go to a project
Commit 7ba0c888 by ‘july-fu’
Options

feat: 企业中台服务清单

1 parent e33fc5d5
Inline Side-by-side
Showing with 3105 additions and 270 deletions
src/api/comCenterServeListNew.js 0 → 100644
import { get, post, download } from "@/utils/http";
import {
EADC_ARRCHITECTURE,
EADC_KNOWLEDGE_POOL,
EADC_SHARED_ABILITY,
} from "@/config/micromodule";
export function getServiceList(data) {
return post(EADC_ARRCHITECTURE + "/arc-aby-iy/qryListPage", data);
}
src/mixins/tableMixin.js 0 → 100644
/**
* @param {*} options string|| undefined
*/
export default function tableMixin(options) {
const name = options || "";
let changePageName = `${name}handlerCurrentChange`;
let changeSizeName = `${name}handlerSizeChange`;
let methodsName = `${name}getList`;
let pagerName = `${name}pager`;
let dataName = `${name}data`;
return {
data() {
return {
[dataName]: [],
};
},
mounted() {},
methods: {
[changePageName](page) {
this[pagerName].page = page;
this[methodsName]();
},
[changeSizeName](size) {
this[pagerName].size = size;
this[methodsName]();
},
},
};
}
src/newComponents/ETable/functional.vue 0 → 100644
<script>
export default {
functional: true,
props: {
row: {
type: Object,
required: true,
},
item: {
type: Object,
required: true,
},
},
render(h, ctx) {
//
return ctx.props.item.render(h, ctx.props.row)
},
};
</script>
\ No newline at end of file
src/newComponents/ETable/index.vue 0 → 100644
<template>
<div class="eTableWrapper" :key="tableKey">
<div class="tableHeaderWrapper">
<slot name="header"></slot>
</div>
<div class="controlWrapper">
<div class="title" v-if="title">
<div>{{ title }}</div>
</div>
<div class="operate">
<template v-if="operateList.length">
<el-button v-for="(item, index) in operateList" :key="index" v-bind="filterBtns(item)"
:disabled="checkDisabled(item)" @click="item.click">{{ item.label }}</el-button>
</template>
</div>
</div>
<div class="mainTable">
<el-table ref="mainTableRef" v-bind="$attrs" v-on="$listeners" stripe border>
<el-table-column v-if="selectionList" type="selection" fixed="left" width="55" align="center"
:selectable="selectable"></el-table-column>
<el-table-column v-if="indexMethod !== null" type="index" :index="computedOrder" fixed="left" label="序号"
width="80" align="center"></el-table-column>
<template v-for="(item, index) in columns">
<el-table-column v-if="item.label !== '操作'" :key="index" :label="item.label" v-bind="fiterMethods(item)">
<template slot-scope="scope">
<tableColumnSlot :row="scope.row" :item="item" :index="scope.$index" />
</template>
</el-table-column>
<el-table-column v-else :key="index" fixed="right" :label="item.label" v-bind="fiterMethods(item)">
<template slot-scope="scope">
<el-button v-for="(item, index) in item.tableBtnList" :key="index" v-bind="filterBtns(item)"
:disabled="checkDisabled(item, scope.row, scope.$index)" @click="item.click(scope.row, scope.$index)">{{
item.label }}</el-button>
</template>
</el-table-column>
</template>
<slot name="end"></slot>
</el-table>
</div>
<div class="paginations" v-if="pager && pager.current">
<el-pagination background @size-change="handleSizeChange" @current-change="handleCurrentChange"
:current-page="pager.current" :page-sizes="pager.sizes" :page-size="pager.size"
layout="total, sizes, prev, pager, next, jumper" :total="pager.total">
</el-pagination>
</div>
</div>
</template>
<script>
import tableColumnSlot from "./tableColumnSlot.vue";
export default {
name: "ETable",
components: { tableColumnSlot },
props: {
title: {
// tableName
type: String,
default: "",
},
tableKey: {
// single page deffer key
type: String,
default: "",
},
selectionList: {
// mutiple select
type: Array,
},
indexMethod: {
type: Boolean | null, //true 123| false 11,12,13| null
default: null,
},
selectable: {
type: Function | null, //
default: null,
},
operateList: {
//operate
type: Array,
default: () => {
return [
// demo
// {
// label: "新增",
// class:'btns',
// icon:'fa-search',
// size:'small',
// click: () => {
//
// }
// }
];
},
},
columns: {
// table row props
type: Array,
default: () => [
// {
// label: '建设类型', // label文字
// prop: 'buildType', // 字段名
// collectionType: true,
// width: '120px',
// showOverflowTooltip: true,
// align: 'center',
// className: 'btns',
// selectable: () => { },
// fixed: 'left',
// minWidth: 100,
// },
],
},
pager: {
type: Object,
},
},
data() {
return {};
},
mounted() {
this.$emit("update:tableRef", this.$refs.mainTableRef);
},
methods: {
computedOrder(index) {
if (this.indexMethod === true) {
return index + 1;
} else {
return (this.pager.current - 1) * this.pager.size + index + 1;
}
},
// 按钮是否禁用
checkDisabled(item, row, index) {
if (typeof item.disabled === "boolean") {
return item.disabled;
} else if (
Object.prototype.toString.call(item.disabled) === "[object Function]"
) {
return row ? item.disabled(row, index) : item.disabled();
}
},
// 格式错乱主动调用解决
doLayout() {
this.$refs.mainTableRef.doLayout();
},
filterBtns(item) {
const { click, ...others } = item;
return { ...others };
},
// TODO: 是否需要筛选不需要处理的字段
fiterMethods(item) {
const { click, ...others } = item;
return { ...others };
},
handleSizeChange(size) {
this.$emit("sizeChange", size);
},
handleCurrentChange(page) {
this.$emit("currentChange", page);
},
},
};
</script>
<style lang="scss" scoped>
* {
box-sizing: border-box;
}
.eTableWrapper {
width: 100%;
height: 100%;
display: flex;
padding: 0 12px;
flex-direction: column;
.tableHeaderWrapper {
width: 100%;
}
.controlWrapper {
width: 100%;
display: flex;
justify-content: space-between;
align-items: center;
.title {
font-size: 22px;
padding-bottom: 8px;
position: relative;
text-indent: 6px;
display: flex;
justify-content: flex-start;
align-items: center;
&::before {
display: block;
content: "";
width: 4px;
border-radius: 6px;
background-color: #0d867f;
height: 20px;
}
}
.operate {
flex: 1;
display: flex;
justify-content: flex-end;
padding-bottom: 8px;
align-items: center;
}
}
.mainTable {
width: 100%;
/deep/.el-table__fixed {
height: 100% !important;
}
}
.paginations {
width: 100%;
display: flex;
justify-content: flex-end;
align-items: center;
margin-top: 20px;
margin-bottom: 12px;
}
}
</style>
src/newComponents/ETable/tableColumnSlot.vue 0 → 100644
<template>
<div class="tableCloumnSlotWrapper">
<span v-if="!item.T && !item.render">{{ row[item.prop] || '--' }}</span>
<div :class="row[item.prop] ? 'defaultLink' : ''" v-else-if="item.T == 'a'" :style="item.style"
@click="handlerClick(item.click, row)">{{
row[item.prop] ||
'--' }}</div>
<FuncCom v-else-if="item.render" :item="item" :row="row" />
<el-switch v-else-if="item.T === 'switch'" :value="row[item.prop]" :active-color="item.activeColor || '#13ce66'"
:active-value="item.active" :inactive-value="item.inactive" :inactive-color="item.inactiveColor || '#13ce66'"
@change="item.click(row, index)"></el-switch>
<el-image v-else-if="item.T === 'image'" style="width: 60px; height: 60px" :src="row[item.prop]"
:preview-src-list="[row[item.prop]]">
</el-image>
<el-button v-else-if="item.T === 'button'" :class="item.class || ''" :size="item.size || 'small'"
@click="item.click(row, index)">{{ item.buttonName }}</el-button>
<span v-else :class="item.class || ''" :style="item.style || {}">{{ row[item.prop] || '--' }}</span>
</div>
</template>
<script>
import FuncCom from './functional.vue'
export default {
components: { FuncCom },
props: {
row: {
type: Object,
required: true
},
item: {
type: Object,
required: true
},
index: {
type: Number,
required: true
}
},
methods: {
handlerClick(click, row) {
if (click) {
click(row)
}
}
}
}
</script>
<style scoped>
.defaultLink {
text-decoration: underline;
}
</style>
\ No newline at end of file
src/router/index.js
import Vue from 'vue'
import VueRouter from 'vue-router'
import Main from '@/views/Main'
import Vue from "vue";
import VueRouter from "vue-router";
import Main from "@/views/Main";
Vue.use(VueRouter)
Vue.use(VueRouter);
// 解决elementUI导航栏中的vue-router在3.0版本以上重复点击菜单报错的问题 ###
const originalPush = VueRouter.prototype.push
const originalPush = VueRouter.prototype.push;
VueRouter.prototype.push = function push(location) {
return originalPush.call(this, location).catch((err) => err)
}
return originalPush.call(this, location).catch((err) => err);
};
/**
* meta: {
* title: 'xxx', tag标签名称
* affix: {Boolean} 固定标签不可删除
* keepAlive: {Boolean} 页面是否缓存
* }
*
*
*/
export const routes = [
{
path: '/',
name: 'home',
redirect: '/main',
path: "/",
name: "home",
redirect: "/main",
// component: Home
},
{
path: '/redirect',
path: "/redirect",
component: Main,
children: [
{
path: '/redirect/:path(.*)',
component: () => import('@/views/redirect/index')
}
]
path: "/redirect/:path(.*)",
component: () => import("@/views/redirect/index"),
},
],
},
{
path: '/main',
name: 'main',
path: "/main",
name: "main",
// route level code-splitting
// this generates a separate chunk (about.[hash].js) for this route
// which is lazy-loaded when the route is visited.
component: Main,
meta : {
title: '首页'
meta: {
title: "首页",
},
children: [
{
path: '/main/archiEleList', //架构元素管理
name: 'archiEleList',
component: () => import('@/views/archi-ele-list/index.vue'),
path: "/main/archiEleList", //架构元素管理
name: "archiEleList",
component: () => import("@/views/archi-ele-list/index.vue"),
meta: {
title: '架构元素管理',
title: "架构元素管理",
},
},
{
path: '/main/archi-ele-rela', //架构元素关系管理
name: 'archi-ele-rela',
component: () => import('@/views/archiEleRela/index.vue'),
path: "/main/archi-ele-rela", //架构元素关系管理
name: "archi-ele-rela",
component: () => import("@/views/archiEleRela/index.vue"),
meta: {
title: '架构元素关系管理',
title: "架构元素关系管理",
},
},
{
path: '/main/archi-view-config', //架构视图配置
name: 'archi-view-config',
component: () => import('@/views/archiViewConfig/index.vue'),
path: "/main/archi-view-config", //架构视图配置
name: "archi-view-config",
component: () => import("@/views/archiViewConfig/index.vue"),
meta: {
title: '架构视图配置',
title: "架构视图配置",
},
},
{
path: '/main/meta-model-dic', //元模型字典管理
name: 'meta-model-dic',
component: () => import('@/views/metaModelDic/index.vue'),
path: "/main/meta-model-dic", //元模型字典管理
name: "meta-model-dic",
component: () => import("@/views/metaModelDic/index.vue"),
meta: {
title: '元模型字典管理',
title: "元模型字典管理",
},
},
{
path: '/main/busiAssetslist', //业务架构资产管理
name: 'busiAssetslist',
component: () => import('@/views/busi-assets-list/index.vue'),
path: "/main/busiAssetslist", //业务架构资产管理
name: "busiAssetslist",
component: () => import("@/views/busi-assets-list/index.vue"),
meta: {
title: '总体架构资产管理',
keepAlive: true
title: "总体架构资产管理",
keepAlive: true,
},
},
// {
......@@ -92,79 +92,79 @@ export const routes = [
// component: () => import('@/views/YuanMoXingGuanLi/YuanMoXingGuanLiCanvas/index.vue'),
// },
{
path: '/main/doc-demo', //在线文档编制
name: 'doc-demo',
component: () => import('@/views/docDemo/index.vue'),
path: "/main/doc-demo", //在线文档编制
name: "doc-demo",
component: () => import("@/views/docDemo/index.vue"),
meta: {
title: 'demo',
title: "demo",
},
},
{
path: '/main/metaModelList', //元模型管理
name: 'metaModelList',
component: () => import('@/views/meta-model-list/index.vue'),
path: "/main/metaModelList", //元模型管理
name: "metaModelList",
component: () => import("@/views/meta-model-list/index.vue"),
meta: {
title: '元模型管理',
keepAlive: true
title: "元模型管理",
keepAlive: true,
},
},
{
path: '/main/metaModelListDetails', //元模型管理详情
name: 'metaModelListDetails',
path: "/main/metaModelListDetails", //元模型管理详情
name: "metaModelListDetails",
meta: {
showGoBack: true,
title: '元模型管理详情',
title: "元模型管理详情",
},
component: () => import('@/views/meta-model-list/details.vue'),
component: () => import("@/views/meta-model-list/details.vue"),
},
{
path: '/main/techPoliticsFabric', //技术政策结构化
name: 'techPoliticsFabric',
component: () => import('@/views/tech-politics-fabric/index.vue'),
path: "/main/techPoliticsFabric", //技术政策结构化
name: "techPoliticsFabric",
component: () => import("@/views/tech-politics-fabric/index.vue"),
meta: {
title: '技术政策结构化',
title: "技术政策结构化",
},
},
{
path: '/main/techPoliticsRelativeUse', //技术政策库关联使用
name: 'techPoliticsRelativeUse',
component: () => import('@/views/tech-politics-relative-use/index.vue'),
path: "/main/techPoliticsRelativeUse", //技术政策库关联使用
name: "techPoliticsRelativeUse",
component: () => import("@/views/tech-politics-relative-use/index.vue"),
meta: {
title: '技术政策库关联使用',
title: "技术政策库关联使用",
},
},
{
path: '/main/reportTemplateFabric', //报告模板结构化
name: 'reportTemplateFabric',
component: () => import('@/views/report-template-fabric/index.vue'),
path: "/main/reportTemplateFabric", //报告模板结构化
name: "reportTemplateFabric",
component: () => import("@/views/report-template-fabric/index.vue"),
meta: {
title: '报告模板结构化',
title: "报告模板结构化",
},
},
{
path: '/main/typicalExampleManage', //典型案例库管理
name: 'typicalExampleManage',
component: () => import('@/views/typical-example-manage/index.vue'),
path: "/main/typicalExampleManage", //典型案例库管理
name: "typicalExampleManage",
component: () => import("@/views/typical-example-manage/index.vue"),
meta: {
title: '典型案例库管理',
title: "典型案例库管理",
},
},
{
path: '/main/typicalExampleRelativeUse', //典型案例库关联使用
name: 'typicalExampleRelativeUse',
path: "/main/typicalExampleRelativeUse", //典型案例库关联使用
name: "typicalExampleRelativeUse",
component: () =>
import('@/views/typical-example-relative-use/index.vue'),
import("@/views/typical-example-relative-use/index.vue"),
meta: {
title: '典型案例库关联使用',
title: "典型案例库关联使用",
},
},
{
path: '/main/totalArchiPropertyDocument', //总体架构资产文档库
name: 'totalArchiPropertyDocument',
path: "/main/totalArchiPropertyDocument", //总体架构资产文档库
name: "totalArchiPropertyDocument",
component: () =>
import('@/views/total-archi-property-document/index.vue'),
import("@/views/total-archi-property-document/index.vue"),
meta: {
title: '总体架构资产文档库',
title: "总体架构资产文档库",
},
},
// {
......@@ -173,401 +173,401 @@ export const routes = [
// component: () => import('@/views/YuanMoXingGuanLi/YuanMoXingGuanLiTable/index.vue'),
// },
{
path: '/main/etp-Manage', //专家人才库
name: 'etp-Manage',
component: () => import('@/views/etpManage/index.vue'),
path: "/main/etp-Manage", //专家人才库
name: "etp-Manage",
component: () => import("@/views/etpManage/index.vue"),
meta: {
title: '专家人才库',
title: "专家人才库",
},
},
{
path: '/main/reportTemplateRelativeUse', //报告模板关联使用
name: 'reportTemplateRelativeUse',
path: "/main/reportTemplateRelativeUse", //报告模板关联使用
name: "reportTemplateRelativeUse",
component: () =>
import('@/views/report-template-relative-use/index.vue'),
import("@/views/report-template-relative-use/index.vue"),
meta: {
title: '报告模板关联使用',
title: "报告模板关联使用",
},
},
{
path: '/main/archiViewManage', //架构视图管理
name: 'archiViewManage',
component: () => import('@/views/archi-view-manage/index.vue'),
path: "/main/archiViewManage", //架构视图管理
name: "archiViewManage",
component: () => import("@/views/archi-view-manage/index.vue"),
meta: {
title: '架构视图管理',
keepAlive: true
title: "架构视图管理",
keepAlive: true,
},
},
{
path: '/main/archiViewManageDetails', //架构视图管理详情
name: 'archiViewManageDetails',
path: "/main/archiViewManageDetails", //架构视图管理详情
name: "archiViewManageDetails",
meta: {
showGoBack: true,
title: '架构视图管理详情',
title: "架构视图管理详情",
},
component: () => import('@/views/archi-view-manage/details.vue'),
component: () => import("@/views/archi-view-manage/details.vue"),
},
{
path: '/main/archiAssetManage/', //总体架构资产管理
name: 'archiAssetManage',
component: () => import('@/views/archi-asset-manage/index.vue'),
path: "/main/archiAssetManage/", //总体架构资产管理
name: "archiAssetManage",
component: () => import("@/views/archi-asset-manage/index.vue"),
meta: {
title: '系统架构资产管理',
title: "系统架构资产管理",
},
},
{
path: '/main/comCenterServeList/', //企业中台服务清单
name: 'comCenterServeList',
component: () => import('@/views/comCenterServeList/index.vue'),
path: "/main/comCenterServeList/", //企业中台服务清单
name: "comCenterServeList",
component: () => import("@/views/comCenterServeListNew/index.vue"),
meta: {
title: '企业中台服务清单',
title: "企业中台服务清单",
},
},
{
path: '/main/currentAssetsList', //现状架构资产管理
name: 'currentAssetsList',
path: "/main/currentAssetsList", //现状架构资产管理
name: "currentAssetsList",
// component: () => import('@/views/current-assets-list/index.vue'),
component: () => import('@/views/busi-assets-list/index.vue'),
component: () => import("@/views/busi-assets-list/index.vue"),
meta: {
title: '现状架构资产管理',
title: "现状架构资产管理",
},
},
{
path: '/main/logManage', //日志管理
name: 'logManage',
component: () => import('@/views/log-manage/index.vue'),
path: "/main/logManage", //日志管理
name: "logManage",
component: () => import("@/views/log-manage/index.vue"),
meta: {
title: '日志管理',
title: "日志管理",
},
},
{
path: '/main/archiEvoluteLine', //架构演进路线资产管理
name: 'archiEvoluteLine',
component: () => import('@/views/archi-evolute-line/index.vue'),
path: "/main/archiEvoluteLine", //架构演进路线资产管理
name: "archiEvoluteLine",
component: () => import("@/views/archi-evolute-line/index.vue"),
meta: {
title: '架构演进路线资产管理',
title: "架构演进路线资产管理",
},
},
{
path: '/main/archiIntelligenceSearch', //总体架构资产智能搜索
name: 'archiIntelligenceSearch',
component: () => import('@/views/archi-intelligence-search/index.vue'),
path: "/main/archiIntelligenceSearch", //总体架构资产智能搜索
name: "archiIntelligenceSearch",
component: () => import("@/views/archi-intelligence-search/index.vue"),
meta: {
title: '总体架构资产智能搜索',
title: "总体架构资产智能搜索",
},
},
{
path: '/main/archiAssetVisualShow', //总体架构资产可视化展示
name: 'archiAssetVisualShow',
component: () => import('@/views/archiAssetVisualShow/index.vue'),
path: "/main/archiAssetVisualShow", //总体架构资产可视化展示
name: "archiAssetVisualShow",
component: () => import("@/views/archiAssetVisualShow/index.vue"),
meta: {
title: '总体架构资产可视化展示',
title: "总体架构资产可视化展示",
},
},
{
path: '/main/systemInfoManage', //系统信息管理
name: 'systemInfoManage',
component: () => import('@/views/systemInfoManage/index.vue'),
path: "/main/systemInfoManage", //系统信息管理
name: "systemInfoManage",
component: () => import("@/views/systemInfoManage/index.vue"),
meta: {
title: '系统信息管理',
title: "系统信息管理",
},
},
{
path: '/main/projectInfoManage', //项目信息管理
name: 'projectInfoManage',
component: () => import('@/views/projectInfoManage/index.vue'),
path: "/main/projectInfoManage", //项目信息管理
name: "projectInfoManage",
component: () => import("@/views/projectInfoManage/index.vue"),
meta: {
title: '项目信息管理',
title: "项目信息管理",
},
},
{
path: '/main/systemArchiViewDesign', //系统架构视图设计
name: 'systemArchiViewDesign',
component: () => import('@/views/systemArchiViewDesign/index.vue'),
path: "/main/systemArchiViewDesign", //系统架构视图设计
name: "systemArchiViewDesign",
component: () => import("@/views/systemArchiViewDesign/index.vue"),
meta: {
title: '系统架构视图设计',
title: "系统架构视图设计",
},
},
{
path: '/main/systemArchiViewDesignDetails', //系统架构视图设计详情
name: 'systemArchiViewDesignDetails',
path: "/main/systemArchiViewDesignDetails", //系统架构视图设计详情
name: "systemArchiViewDesignDetails",
meta: {
showGoBack: true,
title: '系统架构视图设计详情',
title: "系统架构视图设计详情",
},
component: () => import('@/views/systemArchiViewDesign/details.vue'),
component: () => import("@/views/systemArchiViewDesign/details.vue"),
},
{
path: '/main/documentEdit', //文档编辑
name: 'documentEdit',
path: "/main/documentEdit", //文档编辑
name: "documentEdit",
meta: {
showGoBack: true,
title: '文档编辑',
title: "文档编辑",
},
component: () => import('@/views/documentEdit/index.vue'),
component: () => import("@/views/documentEdit/index.vue"),
},
{
path: '/main/summaryArchiDesign', //概设阶段视图设计
name: 'summaryArchiDesign',
component: () => import('@/views/summaryArchiDesign/index.vue'),
path: "/main/summaryArchiDesign", //概设阶段视图设计
name: "summaryArchiDesign",
component: () => import("@/views/summaryArchiDesign/index.vue"),
meta: {
title: '概设阶段视图设计',
title: "概设阶段视图设计",
},
},
{
path: '/main/summaryArchiDesignDetails', //概设阶段视图设计详情
name: 'summaryArchiDesignDetails',
path: "/main/summaryArchiDesignDetails", //概设阶段视图设计详情
name: "summaryArchiDesignDetails",
meta: {
showGoBack: true,
title: '概设阶段视图设计详情',
title: "概设阶段视图设计详情",
},
component: () => import('@/views/summaryArchiDesign/details.vue'),
component: () => import("@/views/summaryArchiDesign/details.vue"),
},
{
path: '/main/otherArchiDesign', //其他视图设计
name: 'otherArchiDesign',
component: () => import('@/views/otherArchiDesign/index.vue'),
path: "/main/otherArchiDesign", //其他视图设计
name: "otherArchiDesign",
component: () => import("@/views/otherArchiDesign/index.vue"),
meta: {
title: '其他视图设计',
title: "其他视图设计",
},
},
{
path: '/main/otherArchiDesignDetails', //其他视图设计详情
name: 'otherArchiDesignDetails',
path: "/main/otherArchiDesignDetails", //其他视图设计详情
name: "otherArchiDesignDetails",
meta: {
showGoBack: true,
title: '其他视图设计详情',
title: "其他视图设计详情",
},
component: () => import('@/views/otherArchiDesign/details.vue'),
component: () => import("@/views/otherArchiDesign/details.vue"),
},
{
path: '/main/reviewSituation', //评审情况(概要设计)
name: 'reviewSituation',
component: () => import('@/views/reviewSituation/index.vue'),
path: "/main/reviewSituation", //评审情况(概要设计)
name: "reviewSituation",
component: () => import("@/views/reviewSituation/index.vue"),
meta: {
title: '评审情况(概要设计)',
title: "评审情况(概要设计)",
},
},
{
path: '/main/reviewSituationDetails', //评审情况(概要设计)，详情
name: 'reviewSituationDetails',
path: "/main/reviewSituationDetails", //评审情况(概要设计)，详情
name: "reviewSituationDetails",
meta: {
showGoBack: true,
title: '评审情况(概要设计)详情',
title: "评审情况(概要设计)详情",
},
component: () => import('@/views/reviewSituation/details.vue'),
component: () => import("@/views/reviewSituation/details.vue"),
},
{
path: '/main/reviewArchiFollowCheck', //概设架构遵从审查
name: 'reviewArchiFollowCheck',
component: () => import('@/views/reviewArchiFollowCheck/index.vue'),
path: "/main/reviewArchiFollowCheck", //概设架构遵从审查
name: "reviewArchiFollowCheck",
component: () => import("@/views/reviewArchiFollowCheck/index.vue"),
meta: {
title: '概设架构遵从审查',
title: "概设架构遵从审查",
},
},
{
path: '/main/reviewArchiFollowCheckDetails', //概设架构遵从审查，详情
name: 'reviewArchiFollowCheckDetails',
path: "/main/reviewArchiFollowCheckDetails", //概设架构遵从审查，详情
name: "reviewArchiFollowCheckDetails",
meta: {
showGoBack: true,
title: '概设架构遵从审查详情',
title: "概设架构遵从审查详情",
},
component: () => import('@/views/reviewArchiFollowCheck/details.vue'),
component: () => import("@/views/reviewArchiFollowCheck/details.vue"),
},
{
path: '/main/reviewArchiPoliticeCheck', //概设架构政策审查
name: 'reviewArchiPoliticeCheck',
component: () => import('@/views/reviewArchiPoliticeCheck/index.vue'),
path: "/main/reviewArchiPoliticeCheck", //概设架构政策审查
name: "reviewArchiPoliticeCheck",
component: () => import("@/views/reviewArchiPoliticeCheck/index.vue"),
meta: {
title: '概设架构政策审查',
title: "概设架构政策审查",
},
},
{
path: '/main/reviewArchiPoliticeCheckDetails', //概设架构政策审查，详情
name: 'reviewArchiPoliticeCheckDetails',
path: "/main/reviewArchiPoliticeCheckDetails", //概设架构政策审查，详情
name: "reviewArchiPoliticeCheckDetails",
meta: {
showGoBack: true,
title: '概设架构政策审查详情',
title: "概设架构政策审查详情",
},
component: () => import('@/views/reviewArchiPoliticeCheck/details.vue'),
component: () => import("@/views/reviewArchiPoliticeCheck/details.vue"),
},
{
path: '/main/batchPlanManagement', //批次计划管理
name: 'batchPlanManagement',
component: () => import('@/views/batchPlanManagement/index.vue'),
path: "/main/batchPlanManagement", //批次计划管理
name: "batchPlanManagement",
component: () => import("@/views/batchPlanManagement/index.vue"),
meta: {
title: '批次计划管理',
keepAlive: true
title: "批次计划管理",
keepAlive: true,
},
},
{
path: '/main/conceptualReview', // 概设材料审查列表
name: 'conceptualReview',
component: () => import('@/views/conceptualReview/index.vue'),
path: "/main/conceptualReview", // 概设材料审查列表
name: "conceptualReview",
component: () => import("@/views/conceptualReview/index.vue"),
meta: {
title: '概设材料审查',
title: "概设材料审查",
},
},
{
path: '/main/conceptualExamine', // 概设材料审查页面
name: 'conceptualExamine',
path: "/main/conceptualExamine", // 概设材料审查页面
name: "conceptualExamine",
meta: {
showGoBack: true,
title: '概设材料审查详情',
title: "概设材料审查详情",
},
component: () => import('@/views/conceptualReview/Examine.vue'),
component: () => import("@/views/conceptualReview/Examine.vue"),
},
{
path: '/main/demandManagement', // 需求管理列表页
name: 'demandManagement',
component: () => import('@/views/demandManagement/index.vue'),
path: "/main/demandManagement", // 需求管理列表页
name: "demandManagement",
component: () => import("@/views/demandManagement/index.vue"),
meta: {
title: '需求管理',
keepAlive: true
title: "需求管理",
keepAlive: true,
},
},
{
path: '/main/conceptualViewOrg', // 概设材料意见编制
name: 'conceptualViewOrg',
component: () => import('@/views/conceptualViewOrg/index.vue'),
path: "/main/conceptualViewOrg", // 概设材料意见编制
name: "conceptualViewOrg",
component: () => import("@/views/conceptualViewOrg/index.vue"),
meta: {
title: '概设材料意见编制',
title: "概设材料意见编制",
},
},
{
path: '/main/conceptualBaseManagement', // 概设评审基础管理
name: 'conceptualBaseManagement',
component: () => import('@/views/conceptualBaseManagement/index.vue'),
path: "/main/conceptualBaseManagement", // 概设评审基础管理
name: "conceptualBaseManagement",
component: () => import("@/views/conceptualBaseManagement/index.vue"),
meta: {
title: '概设评审基础管理',
title: "概设评审基础管理",
},
},
{
path: '/main/onlineReview', // 评审意见编制- 在线辅助审核
name: 'onlineReview',
path: "/main/onlineReview", // 评审意见编制- 在线辅助审核
name: "onlineReview",
meta: {
showGoBack: true,
title: '在线辅助审核',
title: "在线辅助审核",
},
component: () => import('@/views/conceptualViewOrg/OnlineReview.vue'),
component: () => import("@/views/conceptualViewOrg/OnlineReview.vue"),
},
{
path: '/main/conceptualRelated', // 概设关联业务管理
name: 'conceptualRelated',
component: () => import('@/views/conceptualRelated/index.vue'),
path: "/main/conceptualRelated", // 概设关联业务管理
name: "conceptualRelated",
component: () => import("@/views/conceptualRelated/index.vue"),
meta: {
title: '概设关联业务管理',
title: "概设关联业务管理",
},
},
{
path: '/main/supervisionNotifyManagement', // 架构督查督查通报管理
name: 'supervisionNotifyManagement',
path: "/main/supervisionNotifyManagement", // 架构督查督查通报管理
name: "supervisionNotifyManagement",
component: () =>
import('@/views/supervisionNotifyManagement/index.vue'),
import("@/views/supervisionNotifyManagement/index.vue"),
meta: {
title: '督查通报管理',
title: "督查通报管理",
},
},
{
path: '/main/supervisionProblemEdit', // 架构督查督查问题整改
name: 'supervisionProblemEdit',
component: () => import('@/views/supervisionProblemEdit/index.vue'),
path: "/main/supervisionProblemEdit", // 架构督查督查问题整改
name: "supervisionProblemEdit",
component: () => import("@/views/supervisionProblemEdit/index.vue"),
meta: {
title: '督查问题整改',
title: "督查问题整改",
},
},
{
path: '/main/architectureFollowExamine', // 架构督查架构遵从检查
name: 'architectureFollowExamine',
component: () => import('@/views/architectureFollowExamine/index.vue'),
path: "/main/architectureFollowExamine", // 架构督查架构遵从检查
name: "architectureFollowExamine",
component: () => import("@/views/architectureFollowExamine/index.vue"),
meta: {
title: '架构遵从检查',
title: "架构遵从检查",
},
},
{
path: '/main/architectureFollowExamineDetails', // 架构督查 - 架构遵从检查-详情
name: 'architectureFollowExamineDetails',
path: "/main/architectureFollowExamineDetails", // 架构督查 - 架构遵从检查-详情
name: "architectureFollowExamineDetails",
meta: {
showGoBack: true,
title: '架构遵从检查详情',
title: "架构遵从检查详情",
},
component: () =>
import('@/views/architectureFollowExamine/details.vue'),
import("@/views/architectureFollowExamine/details.vue"),
},
{
path: '/main/artPolicyExamine', // 架构督查-技术政策审查
name: 'artPolicyExamine',
component: () => import('@/views/artPolicyExamine/index.vue'),
path: "/main/artPolicyExamine", // 架构督查-技术政策审查
name: "artPolicyExamine",
component: () => import("@/views/artPolicyExamine/index.vue"),
meta: {
title: '技术政策审查',
title: "技术政策审查",
},
},
{
path: '/main/collectDataConfiguration', // 架构督查 - 收集资料配置
name: 'collectDataConfiguration',
component: () => import('@/views/collectDataConfiguration/index.vue'),
path: "/main/collectDataConfiguration", // 架构督查 - 收集资料配置
name: "collectDataConfiguration",
component: () => import("@/views/collectDataConfiguration/index.vue"),
meta: {
title: '收集资料配置',
title: "收集资料配置",
},
},
{
path: '/main/supervisionDataCollection', // 架构督查 - 督查资料收集
name: 'supervisionDataCollection',
component: () => import('@/views/supervisionDataCollection/index.vue'),
path: "/main/supervisionDataCollection", // 架构督查 - 督查资料收集
name: "supervisionDataCollection",
component: () => import("@/views/supervisionDataCollection/index.vue"),
meta: {
title: '督查资料收集',
title: "督查资料收集",
},
},
{
path: '/main/architectureInspectionAnalysis', // 架构督查 - 架构督查分析
name: 'architectureInspectionAnalysis',
path: "/main/architectureInspectionAnalysis", // 架构督查 - 架构督查分析
name: "architectureInspectionAnalysis",
component: () =>
import('@/views/architectureInspectionAnalysis/index.vue'),
import("@/views/architectureInspectionAnalysis/index.vue"),
meta: {
title: '架构督查分析',
title: "架构督查分析",
},
},
{
path: '/main/examine', // 架构督查 - 架构督查分析
name: 'examine',
component: () => import('@/views/artPolicyExamine/Examine.vue'),
path: "/main/examine", // 架构督查 - 架构督查分析
name: "examine",
component: () => import("@/views/artPolicyExamine/Examine.vue"),
meta: {
title: '架构督查分析',
title: "架构督查分析",
},
},
{
path: '/main/dictionaryManagement', // 系统管理 - 字典管理
name: 'dictionaryManagement',
component: () => import('@/views/dictionaryManagement/index.vue'),
path: "/main/dictionaryManagement", // 系统管理 - 字典管理
name: "dictionaryManagement",
component: () => import("@/views/dictionaryManagement/index.vue"),
meta: {
title: '字典管理',
title: "字典管理",
},
},
{
path: '/main/organizationManagement', // 系统管理 - 组织机构管理
name: 'organizationManagement',
component: () => import('@/views/organizationManagement/index.vue'),
path: "/main/organizationManagement", // 系统管理 - 组织机构管理
name: "organizationManagement",
component: () => import("@/views/organizationManagement/index.vue"),
meta: {
title: '组织机构管理',
keepAlive: true
title: "组织机构管理",
keepAlive: true,
},
},
{
path: '/main/dataMapping', // 数据成图
name: 'dataMapping',
component: () => import('@/views/dataMapping/index.vue'),
path: "/main/dataMapping", // 数据成图
name: "dataMapping",
component: () => import("@/views/dataMapping/index.vue"),
meta: {
title: '数据成图',
keepAlive: true
title: "数据成图",
keepAlive: true,
},
},
],
},
]
];
const router = new VueRouter({
routes,
})
});
export default router
export default router;
src/styles/common.scss
......@@ -124,4 +124,21 @@ $color-primary: #0d867f;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.comDialog {
.el-dialog__header {
background-color: #0d867f;
text-align: left;
}
.el-dialog__title {
color: #fff;
}
.el-dialog__close {
color: #fff;
}
}
\ No newline at end of file
src/views/comCenterServeListNew/components/businessMsg.vue 0 → 100644
<template>
<div class="businessMsgWrapper">
<ETable ref="ETableRef" title="业务信息列表" :tableRef.sync="tableRef" :height="430" tableKey="businessMsg" :data="data"
:columns="columns" :indexMethod="true" v-loading="loading" :operateList="operateList" :tableBtnList="tableBtnList"
@sizeChange="handlerSizeChange" @currentChange="handlerCurrentChange" :pager="pager">
<SearchForm slot="header" :formOptions="formOptions" @onSearch="getList" @onReset="reset"></SearchForm>
</ETable>
</div>
</template>
<script>
import SearchForm from "@/components/SearchForm.vue";
import ETable from "@/newComponents/ETable/index.vue";
import tableMixin from "@/mixins/tableMixin";
export default {
name: "businessMsg",
components: { SearchForm, ETable },
mixins: [tableMixin()],
data() {
return {
loading: false,
tableRef: null,
form: {
name: '',
date: '',
typeName: '',
type: ''
},
selectionList: [],
formOptions: [
{
label: "中台服务名称",
prop: "name",
element: "el-input",
placeholder: "服务名称",
},
{
label: "统计日期",
prop: "buildType",
element: "el-date-picker",
type: 'date',
valueFormat: 'yyyy-MM-dd',
element: 'el-date-picker',
initValue: new Date().format('yyyy-MM-dd'),
placeholder: '统计日期',
},
{
label: "业务活动名称",
prop: "buildType",
element: "el-select",
dictType: "build_type",
placeholder: "业务活动名称",
},
],
operateList: [
{
label: "新增",
type: "primary",
size: "mini",
icon: "el-icon-plus",
disabled: true,
click: () => {
console.log("add");
},
},
{
label: "下载模板",
type: "primary",
size: "mini",
icon: "el-icon-download",
disabled: false,
click: () => {
console.log("测试");
},
},
{
label: "导入",
type: "primary",
size: "mini",
icon: "el-icon-upload",
disabled: false,
click: () => {
console.log("测试");
},
},
],
pager: {
current: 2,
size: 10,
total: 100,
sizes: [10, 20, 50, 100],
},
columns: [
{
label: "中台服务编码",
prop: "buildType",
showOverflowTooltip: true,
align: "center",
fixed: "left",
minWidth: 140
},
{
label: "中台服务名称",
prop: "buildType2",
minWidth: 140,
showOverflowTooltip: true,
align: "center",
},
{
label: "业务活动名称",
prop: "buildType2",
minWidth: 120,
showOverflowTooltip: true,
align: "center",
},
{
label: "业务活动编码",
prop: "buildType2",
minWidth: 120,
showOverflowTooltip: true,
align: "center",
},
{
label: "业务流程名称",
prop: "buildType2",
minWidth: 120,
showOverflowTooltip: true,
align: "center",
},
{
label: "业务职能",
prop: "buildType2",
minWidth: 120,
showOverflowTooltip: true,
align: "center",
},
{
label: "业务域",
prop: "buildType2",
minWidth: 120,
showOverflowTooltip: true,
align: "center",
},
{
label: "关联的业务对象数量",
T: 'a',
prop: "buildType2",
minWidth: 120,
align: "center",
style: { color: '#0b8680', cursor: 'pointer' },
click: (row) => {
this.$emit('dialog', '关联的业务对象数量', row)
},
},
{
label: "关联的应用服务数量",
T: 'a',
prop: "buildType2",
minWidth: 120,
align: "center",
style: { color: '#0b8680', cursor: 'pointer' },
click: (row) => {
this.$emit('dialog', '关联的应用服务数量', row)
},
},
],
tableBtnList: [
{
label: "编辑",
type: "primary",
size: "mini",
icon: "el-icon-circle-plus-outline",
click: (row, index) => {
console.log("编辑", row);
},
},
],
data: [{ buildType2: 11 }],
};
},
mounted() { },
methods: {
doLayout() {
this.tableRef.doLayout()
},
getList() {
console.log("getList");
},
reset() { },
handleSelectionChange(val) {
this.selectionList = val;
},
showClick(val) {
console.log("showClick", val);
}
},
};
</script>
<style lang="scss" scoped>
.businessMsgWrapper {
width: 100%;
height: 100%;
}
</style>
\ No newline at end of file
src/views/comCenterServeListNew/components/comDialog.vue 0 → 100644
<template>
<el-dialog :title="tableConfig.subTitle + ' - ' + tableConfig.title" custom-class="comDialog" :visible.sync="show"
:center="false" :close-on-click-modal="false" width="80%" @close="close">
<div class="comDialogTable">
<ETable ref="ETableRef" :height="430" :data="data" :columns="tableConfig.columns" :indexMethod="true"
v-loading="loading" @sizeChange="handlerSizeChange" @currentChange="handlerCurrentChange" :pager="pager">
</ETable>
</div>
</el-dialog>
</template>
<script>
import ETable from "@/newComponents/ETable/index.vue";
import tableMixin from "@/mixins/tableMixin";
export default {
components: {
ETable
},
mixins: [tableMixin()],
data() {
return {
loading: false,
show: false,
pager: {
current: 1,
size: 10,
total: 100,
sizes: [10, 20, 50, 100],
},
defaultTableColumns: [
// 中台清单
{
title: '服务调用频率',
subTitle: '检修计划编制服务',
columns: [
{
label: "中台服务编码",
prop: "buildType",
showOverflowTooltip: true,
align: "center",
fixed: "left",
minWidth: 140
},
{
label: "主调服务编码",
prop: "buildType2",
minWidth: 140,
showOverflowTooltip: true,
align: "center",
},
{
label: "主调服务名称",
prop: "buildType2",
minWidth: 120,
showOverflowTooltip: true,
align: "center",
},
{
label: "服务类型",
prop: "buildType2",
minWidth: 120,
showOverflowTooltip: true,
align: "center",
},
{
label: "模块",
prop: "buildType2",
minWidth: 120,
showOverflowTooltip: true,
align: "center",
},
{
label: "响应时长（S）",
prop: "buildType2",
minWidth: 120,
showOverflowTooltip: true,
align: "center",
},
{
label: "系统应用",
prop: "buildType2",
minWidth: 120,
showOverflowTooltip: true,
align: "center",
},
{
label: "调用时间",
prop: "buildType2",
minWidth: 120,
showOverflowTooltip: true,
align: "center",
},
{
label: "服务状态",
prop: "buildType2",
minWidth: 120,
showOverflowTooltip: true,
align: "center",
},
{
label: "操作",
prop: "action",
minWidth: 120,
align: "center",
tableBtnList: [
{
label: "链路跟踪",
type: "primary",
size: "mini",
icon: "el-icon-circle-plus-outline",
click: (row, index) => {
console.log("链路跟踪", row);
},
},
]
},
],
getList() {
},
},
{
title: '服务调用方数量',
subTitle: '检修计划编制服务',
columns: [
{
label: "中台服务编码",
prop: "buildType",
showOverflowTooltip: true,
align: "center",
fixed: "left",
minWidth: 140
},
{
label: "中台服务名称",
prop: "buildType2",
minWidth: 140,
showOverflowTooltip: true,
align: "center",
},
{
label: "系统应用",
prop: "buildType2",
minWidth: 120,
showOverflowTooltip: true,
align: "center",
},
],
tableBtnList: [],
getList() {
},
},
{
title: '操作实体数量',
subTitle: '检修计划编制服务',
columns: [
{
label: "中台服务编码",
prop: "buildType",
showOverflowTooltip: true,
align: "center",
fixed: "left",
minWidth: 140
},
{
label: "物理实体名称",
prop: "buildType2",
minWidth: 140,
showOverflowTooltip: true,
align: "center",
},
{
label: "物理实体编码",
prop: "buildType2",
minWidth: 120,
showOverflowTooltip: true,
align: "center",
},
{
label: "物理实体记录数量",
prop: "buildType2",
minWidth: 120,
showOverflowTooltip: true,
align: "center",
},
{
label: "响应时间（S）",
prop: "buildType2",
minWidth: 120,
showOverflowTooltip: true,
align: "center",
},
{
label: "物理实体当前大小",
prop: "buildType2",
minWidth: 120,
showOverflowTooltip: true,
align: "center",
},
{
label: "逻辑实体",
prop: "buildType2",
minWidth: 120,
showOverflowTooltip: true,
align: "center",
},
{
label: "概念实体",
prop: "buildType2",
minWidth: 120,
showOverflowTooltip: true,
align: "center",
},
{
label: "实体发布时间",
prop: "buildType2",
minWidth: 120,
showOverflowTooltip: true,
align: "center",
},
],
getList() {
},
},
{
title: '支撑技术组件数量',
subTitle: '查询检修计划',
columns: [
{
label: "中台服务编码",
prop: "buildType",
showOverflowTooltip: true,
align: "center",
fixed: "left",
minWidth: 140
},
{
label: "中台服务名称",
prop: "buildType2",
minWidth: 140,
showOverflowTooltip: true,
align: "center",
},
{
label: "基础组件名称",
prop: "buildType2",
minWidth: 120,
showOverflowTooltip: true,
align: "center",
},
{
label: "基础组件编码",
prop: "buildType2",
minWidth: 120,
showOverflowTooltip: true,
align: "center",
},
{
label: "技术平台",
prop: "buildType2",
minWidth: 120,
showOverflowTooltip: true,
align: "center",
},
],
getList() {
},
},
// 业务信息
{
title: '关联的业务对象数量',
subTitle: '查询检修计划',
columns: [
{
label: "中台服务编码",
prop: "buildType",
showOverflowTooltip: true,
align: "center",
fixed: "left",
minWidth: 140
},
{
label: "中台服务名称",
prop: "buildType2",
minWidth: 140,
showOverflowTooltip: true,
align: "center",
},
{
label: "业务对象名称",
prop: "buildType2",
minWidth: 120,
showOverflowTooltip: true,
align: "center",
},
{
label: "业务对象编码",
prop: "buildType2",
minWidth: 120,
showOverflowTooltip: true,
align: "center",
},
{
label: "业务流程名称",
prop: "buildType2",
minWidth: 120,
showOverflowTooltip: true,
align: "center",
},
{
label: "业务职能",
prop: "buildType2",
minWidth: 120,
showOverflowTooltip: true,
align: "center",
},
{
label: "业务域",
prop: "buildType2",
minWidth: 120,
showOverflowTooltip: true,
align: "center",
},
],
getList() {
},
},
{
title: '关联的应用服务数量',
subTitle: '查询检修计划',
columns: [
{
label: "中台服务编码",
prop: "buildType",
showOverflowTooltip: true,
align: "center",
fixed: "left",
minWidth: 140
},
{
label: "中台服务名称",
prop: "buildType2",
minWidth: 140,
showOverflowTooltip: true,
align: "center",
},
{
label: "应用服务名称",
prop: "buildType2",
minWidth: 120,
showOverflowTooltip: true,
align: "center",
},
{
label: "应用服务编码",
prop: "buildType2",
minWidth: 120,
showOverflowTooltip: true,
align: "center",
},
{
label: "功能模块",
prop: "buildType2",
minWidth: 120,
showOverflowTooltip: true,
align: "center",
},
{
label: "系统应用",
prop: "buildType2",
minWidth: 120,
showOverflowTooltip: true,
align: "center",
},
],
getList() {
},
},
//应用服务信息
// 关联的业务对象数量 同业务信息1
{
title: '关联的业务活动数量',
subTitle: '查询检修计划',
columns: [
{
label: "中台服务编码",
prop: "buildType",
showOverflowTooltip: true,
align: "center",
fixed: "left",
minWidth: 140
},
{
label: "中台服务名称",
prop: "buildType2",
minWidth: 140,
showOverflowTooltip: true,
align: "center",
},
{
label: "业务活动名称",
prop: "buildType2",
minWidth: 120,
showOverflowTooltip: true,
align: "center",
},
{
label: "业务活动编码",
prop: "buildType2",
minWidth: 120,
showOverflowTooltip: true,
align: "center",
},
{
label: "业务职能",
prop: "buildType2",
minWidth: 120,
showOverflowTooltip: true,
align: "center",
},
{
label: "业务流程名称",
prop: "buildType2",
minWidth: 120,
showOverflowTooltip: true,
align: "center",
},
],
getList() {
},
},
{
title: '关联的物理实体数量',
subTitle: '查询检修计划',
columns: [
{
label: "中台服务编码",
prop: "buildType",
showOverflowTooltip: true,
align: "center",
fixed: "left",
minWidth: 140
},
{
label: "中台服务名称",
prop: "buildType2",
minWidth: 140,
showOverflowTooltip: true,
align: "center",
},
{
label: "物理实体名称",
prop: "buildType2",
minWidth: 120,
showOverflowTooltip: true,
align: "center",
},
{
label: "物理实体英文名称",
prop: "buildType2",
minWidth: 120,
showOverflowTooltip: true,
align: "center",
},
{
label: "物理实体编码",
prop: "buildType2",
minWidth: 120,
showOverflowTooltip: true,
align: "center",
},
{
label: "逻辑实体",
prop: "buildType2",
minWidth: 120,
showOverflowTooltip: true,
align: "center",
},
{
label: "概念实体",
prop: "buildType2",
minWidth: 120,
showOverflowTooltip: true,
align: "center",
},
],
getList() {
},
},
{
title: '关联的技术组件数量',
subTitle: '查询检修计划',
columns: [
{
label: "中台服务编码",
prop: "buildType",
showOverflowTooltip: true,
align: "center",
fixed: "left",
minWidth: 140
},
{
label: "中台服务名称",
prop: "buildType2",
minWidth: 140,
showOverflowTooltip: true,
align: "center",
},
{
label: "基础组件名称",
prop: "buildType2",
minWidth: 120,
showOverflowTooltip: true,
align: "center",
},
{
label: "基础组件编码",
prop: "buildType2",
minWidth: 120,
showOverflowTooltip: true,
align: "center",
},
{
label: "技术平台",
prop: "buildType2",
minWidth: 120,
showOverflowTooltip: true,
align: "center",
},
],
getList() {
},
},
// 技术组件信息
{
title: '支撑的系统数量',
subTitle: '检修计划编制服务',
columns: [
{
label: "中台服务编码",
prop: "buildType",
showOverflowTooltip: true,
align: "center",
fixed: "left",
minWidth: 140
},
{
label: "中台服务名称",
prop: "buildType2",
minWidth: 140,
showOverflowTooltip: true,
align: "center",
},
{
label: "基础组件名称",
prop: "buildType2",
minWidth: 120,
showOverflowTooltip: true,
align: "center",
},
{
label: "基础组件编码",
prop: "buildType2",
minWidth: 120,
showOverflowTooltip: true,
align: "center",
},
{
label: "系统应用",
prop: "buildType2",
minWidth: 120,
showOverflowTooltip: true,
align: "center",
},
],
getList() {
},
},
{
title: '支撑的数据服务数量',
subTitle: '检修计划编制服务',
columns: [
{
label: "中台服务编码",
prop: "buildType",
showOverflowTooltip: true,
align: "center",
fixed: "left",
minWidth: 140
},
{
label: "数据服务名称",
prop: "buildType2",
minWidth: 120,
showOverflowTooltip: true,
align: "center",
},
{
label: "数据服务编码",
prop: "buildType2",
minWidth: 120,
showOverflowTooltip: true,
align: "center",
},
],
getList() {
},
},
],
tableConfig: {},
data: [],
}
},
methods: {
open(params) {
const { title, ...others } = params
let arr = this.defaultTableColumns.filter(i => i.title == title)
if (!arr.length) {
throw ('参数有误,请检查...')
}
this.show = true;
this.tableConfig = arr[0]
this.tableConfig.getList()
},
close() {
this.show = false;
},
reset() {
this.tableConfig = {}
this.data = []
this.pager = {
current: 1,
size: 10,
total: 100,
sizes: [10, 20, 50, 100],
}
}
},
}
</script>
\ No newline at end of file
src/views/comCenterServeListNew/components/dataEntity.vue 0 → 100644
<template>
<div class="dataEntityWrapper">
<ETable ref="ETableRef" title="数据实体信息列表" :tableRef.sync="tableRef" :height="430" tableKey="dataEntity" :data="data"
:columns="columns" :indexMethod="true" v-loading="loading" :operateList="operateList" :tableBtnList="tableBtnList"
@sizeChange="handlerSizeChange" @currentChange="handlerCurrentChange" :pager="pager">
<SearchForm slot="header" :formOptions="formOptions" @onSearch="getList" @onReset="reset"></SearchForm>
</ETable>
</div>
</template>
<script>
import SearchForm from "@/components/SearchForm.vue";
import ETable from "@/newComponents/ETable/index.vue";
import tableMixin from "@/mixins/tableMixin";
export default {
name: "dataEntity",
components: { SearchForm, ETable },
mixins: [tableMixin()],
data() {
return {
loading: false,
tableRef: null,
form: {
name: '',
date: '',
typeName: '',
type: ''
},
selectionList: [],
formOptions: [
{
label: "服务名称",
prop: "name",
element: "el-input",
placeholder: "服务名称",
},
{
label: "统计日期",
prop: "buildType",
element: "el-date-picker",
type: 'date',
valueFormat: 'yyyy-MM-dd',
element: 'el-date-picker',
initValue: new Date().format('yyyy-MM-dd'),
placeholder: '统计日期',
},
{
label: "中台类型",
prop: "buildType",
element: "el-select",
dictType: "build_type",
placeholder: "中台类型",
},
{
label: "中台名称",
prop: "buildType",
element: "el-select",
dictType: "build_type",
placeholder: "中台名称",
},
],
operateList: [
{
label: "新增",
type: "primary",
size: "mini",
icon: "el-icon-plus",
disabled: true,
click: () => {
console.log("add");
},
},
{
label: "下载模板",
type: "primary",
size: "mini",
icon: "el-icon-download",
disabled: false,
click: () => {
console.log("测试");
},
},
{
label: "导入",
type: "primary",
size: "mini",
icon: "el-icon-upload",
disabled: false,
click: () => {
console.log("测试");
},
},
],
pager: {
current: 2,
size: 10,
total: 100,
sizes: [10, 20, 50, 100],
},
columns: [
{
label: "中台服务编码",
prop: "buildType",
showOverflowTooltip: true,
align: "center",
fixed: "left",
minWidth: 140
},
{
label: "中台服务名称",
prop: "buildType2",
minWidth: 140,
showOverflowTooltip: true,
align: "center",
},
{
label: "物理实体名称",
prop: "buildType2",
minWidth: 120,
showOverflowTooltip: true,
align: "center",
},
{
label: "物理实体英文名称",
prop: "buildType2",
minWidth: 120,
showOverflowTooltip: true,
align: "center",
},
{
label: "物理实体编码",
prop: "buildType2",
minWidth: 120,
showOverflowTooltip: true,
align: "center",
},
{
label: "逻辑实体",
prop: "buildType2",
minWidth: 120,
showOverflowTooltip: true,
align: "center",
},
{
label: "概念实体",
prop: "buildType2",
minWidth: 120,
showOverflowTooltip: true,
align: "center",
},
],
tableBtnList: [
{
label: "编辑",
type: "primary",
size: "mini",
icon: "el-icon-circle-plus-outline",
click: (row, index) => {
console.log("编辑", row);
},
},
],
data: [{ buildType2: 11 }],
};
},
mounted() { },
methods: {
doLayout() {
this.tableRef.doLayout()
},
getList() {
console.log("getList");
},
reset() { },
handleSelectionChange(val) {
this.selectionList = val;
},
showClick(val) {
console.log("showClick", val);
}
},
};
</script>
<style lang="scss" scoped>
.dataEntityWrapper {
width: 100%;
height: 100%;
}
</style>
\ No newline at end of file
src/views/comCenterServeListNew/components/editService.vue 0 → 100644
<template>
<el-dialog :title="title" custom-class="comDialog" :visible.sync="show" :center="false" :close-on-click-modal="false"
width="80%" @close="close">
<el-form :model="form" :rules="rules" ref="formRef" label-width="120px">
<el-row>
<el-col :span="12">
<el-form-item label="中台服务名称" prop="abilityName">
<el-input class="w180" type="text" placeholder="中台服务名称" v-model="form.abilityName"
maxlength="50"></el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="中台服务编码" prop="abilityCode">
<el-input class="w180" type="text" placeholder="中台服务编码" v-model="form.abilityCode"
maxlength="50"></el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="服务类型" prop="serveType">
<el-select class="w180" v-model="form.serveType" placeholder="请选择">
<el-option v-for="item in serverTypeOptions" :key="item.value" :label="item.label" :value="item.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="模块" prop="module">
<el-input class="w180" type="text" placeholder="模块" v-model="form.module" maxlength="50"></el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="中台类型" prop="content">
<el-select class="w180" v-model="value" placeholder="请选择">
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="中台名称" prop="content">
<el-input class="w180" type="textarea" :rows="3" maxlength="200" show-word-limit placeholder="请输入内容"
v-model="form.content"></el-input>
</el-form-item>
</el-col>
</el-row>
</el-form>
<span slot="footer">
<el-button @click="close">取 消</el-button>
<el-button type="primary" @click="submit">保 存</el-button>
<el-button type="primary" @click="submit">发 布</el-button>
</span>
</el-dialog>
</template>
<script>
import { serverTypeOptions, abilitySourceOptions, midGroundNameOptions, midGroundTypeOptions } from '../options.js'
export default {
data() {
return {
serverTypeOptions,
abilitySourceOptions,
midGroundNameOptions,
midGroundTypeOptions,
show: false,
title: "新增",
form: {
abilityCode: undefined, // 中台服务编码 false
abilityName: undefined, // 中台服务名称 false
},
rules: {},
};
},
methods: {
close() {
this.show = false;
},
open(row) {
row ? (this.form = { ...row }) : "";
this.show = true;
},
submit() {
this.$refs.formRef.validate((valid) => {
if (valid) {
this.$emit("submit");
this.close();
} else {
return false;
}
});
},
},
};
</script>
<style lang="scss" scoped>
.w180 {
width: 180px;
}
</style>
src/views/comCenterServeListNew/components/serviceList.vue 0 → 100644
<template>
<div class="serviceListWrapper">
<ETable ref="ETableRef" title="中台服务清单列表" :tableRef.sync="tableRef" :height="500" tableKey="serviceList"
:selectionList="selectionList" @selection-change="handleSelectionChange" :data="data" :columns="columns"
:indexMethod="true" v-loading="loading" :operateList="operateList" @sizeChange="handlerSizeChange"
@currentChange="handlerCurrentChange" :pager="pager">
<el-form class="search" :model="form" slot="header">
<el-row>
<el-col :span="4">
<el-form-item label="中台服务名称">
<el-input class="w180" size="mini" type="text" placeholder="中台服务名称" v-model="form.abilityName"
maxlength="50"></el-input>
</el-form-item>
</el-col>
<el-col :span="4">
<el-form-item label="资源类型">
<el-select class="w180" size="mini" v-model="form.abilitySource" placeholder="资源类型">
<el-option v-for="item in abilitySourceOptions" :key="item.value" :label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="4">
<el-form-item label="中台类型">
<el-select class="w180" size="mini" v-model="form.midGroundType" placeholder="中台类型">
<el-option v-for="item in midGroundTypeOptions" :key="item.value" :label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="4">
<el-form-item label="中台名称">
<el-select class="w180" size="mini" v-model="form.midGroundName" placeholder="中台名称">
<el-option v-for="item in midGroundNameOptions" :key="item.value" :label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="4">
<el-form-item label="发布时间">
<el-date-picker class="w180" size="mini" v-model="form.startTime" value-format="yyyy-MM-dd" type="date"
placeholder="发布时间">
</el-date-picker>
</el-form-item>
</el-col>
<el-col :span="4">
<div class="btn-box">
<el-button size="mini" type="primary" class="btn-search" icon="el-icon-search" @click="search"
v-preventReClick>查询</el-button>
<el-button size="mini" type="default" class="btn-reset" icon="el-icon-refresh"
@click="reset">重置</el-button>
</div>
</el-col>
</el-row>
</el-form>
<el-table-column slot="end" fixed="right" label="操作" align="center" :width="120">
<template slot-scope="scope">
<div class="btns">
<img src="@/assets/btn1.jpg" style="cursor: pointer" width="26" height="26"
@click="concatService(scope.row)" alt="">
</div>
</template>
</el-table-column>
</ETable>
<!-- 关联 -->
<el-dialog :title="title" custom-class="comDialog" :visible.sync="show" :center="false"
:close-on-click-modal="false" width="80%" @close="close">
<el-row class="comDialogContent">
<el-col :span="12">
<el-tree :data="treeData" show-checkbox node-key="id" default-expand-all :props="treeProps"
@check-change="checkChange">
</el-tree>
</el-col>
<el-col :span="12">
<ETable title="选中列表" :max-height="630" :height="400" tableKey="serviceListDialog" :data="dialogData"
:columns="dialogColumns" :indexMethod="true">
</ETable>
</el-col>
</el-row>
<span slot="footer">
<el-button @click="show = false">取 消</el-button>
<el-button type="primary" @click="show = false">确 定</el-button>
</span>
</el-dialog>
<!-- edit -->
<!-- <EditService ref="EditServiceRef" @submit="getList" /> -->
</div>
</template>
<script>
import { serverTypeOptions, abilitySourceOptions, midGroundNameOptions, midGroundTypeOptions } from '../options.js'
import { getServiceList } from '@/api/comCenterServeListNew'
import EditService from './editService.vue'
import ETable from "@/newComponents/ETable/index.vue";
import tableMixin from "@/mixins/tableMixin";
export default {
name: "serviceList",
components: { ETable, EditService },
mixins: [tableMixin()],
data() {
return {
abilitySourceOptions, midGroundNameOptions, midGroundTypeOptions,
title: '',
show: false,
dialogRow: {},
dialogData: [],
dialogSelectData: [],
loading: false,
tableRef: null,
form: {
abilityName: '',// 中台服务名称 false
abilitySource: '',// 资源类型 1 中台服务清单 2 业务信息 3 应用服务信息 4 数据实体信息 5 技术组件信息 false
midGroundName: '',// 中台名称 false
midGroundType: '',// 中台类型 false
statTime: '',// 统计时间 false
},
selectionList: [],
operateList: [
{
label: "新增",
type: "primary",
size: "mini",
icon: "el-icon-plus",
disabled: false,
click: () => {
this.$refs.EditServiceRef.open()
console.log("add");
},
},
{
label: "发布",
type: "primary",
size: "mini",
icon: "el-icon-upload2",
disabled: false,
click: () => {
console.log("测试");
},
},
{
label: "取消发布",
type: "primary",
size: "mini",
style: { 'background': '#ff5722', 'border-color': '#ff5722' },
icon: "el-icon-sold-out",
disabled: false,
click: () => {
console.log("测试");
},
},
{
label: "下载模板",
type: "primary",
size: "mini",
icon: "el-icon-download",
disabled: false,
click: () => {
console.log("测试");
},
},
{
label: "导入",
type: "primary",
size: "mini",
icon: "el-icon-upload",
disabled: false,
click: () => {
console.log("测试");
},
},
],
pager: {
current: 2,
size: 10,
total: 100,
sizes: [10, 20, 50, 100],
},
columns: [
{
label: "中台服务编码",
prop: "abilityCode",
showOverflowTooltip: true,
align: "center",
fixed: "left",
minWidth: 140
},
{
label: "中台服务名称",
prop: "abilityName",
minWidth: 140,
showOverflowTooltip: true,
align: "center",
},
{
label: "服务类型",
prop: "serveType",
minWidth: 120,
showOverflowTooltip: true,
align: "center",
render: (h, params) => {
return h("span", {}, params.serveType ? serverTypeOptions[params.serveType - 1].label : '--');
},
},
{
label: "模块",
prop: "module",
minWidth: 120,
showOverflowTooltip: true,
align: "center",
},
{
label: "中台类型",
prop: "midGroundType",
minWidth: 120,
showOverflowTooltip: true,
align: "center",
render: (h, params) => {
console.log('midGroundNameOptions', midGroundNameOptions)
return h("span", {}, params.midGroundType ? midGroundNameOptions[params.midGroundType - 1].label : '--');
},
},
{
label: "中台名称",
prop: "midGroundName",
minWidth: 120,
showOverflowTooltip: true,
align: "center",
render: (h, params) => {
return h("span", {}, params.midGroundName ? midGroundTypeOptions[params.midGroundName - 1].label : '--');
},
},
// {
// label: "服务调用频率",
// T: 'a',
// prop: "buildType2",
// minWidth: 120,
// align: "center",
// style: { color: '#0b8680', cursor: 'pointer' },
// click: (row) => {
// this.$emit('dialog', '服务调用频率', row)
// },
// },
{
label: "服务调用方数量",
T: 'a',
prop: "serviceInvNum",
minWidth: 120,
align: "center",
style: { color: '#0b8680', cursor: 'pointer' },
click: (row) => {
this.$emit('dialog', '服务调用方数量', row)
},
},
{
label: "操作实体数量",
T: 'a',
prop: "oprEntityNum",
minWidth: 120,
align: "center",
style: { color: '#0b8680', cursor: 'pointer' },
click: (row) => {
this.$emit('dialog', '操作实体数量', row)
},
},
{
label: "支撑技术组件数量",
T: 'a',
prop: "supportTecModNum",
minWidth: 140,
align: "center",
style: { color: '#0b8680', cursor: 'pointer' },
click: (row) => {
this.$emit('dialog', '支撑技术组件数量', row)
},
},
{
label: "服务发布时间",
prop: "publishTime",
minWidth: 120,
showOverflowTooltip: true,
align: "center",
},
{
label: "支撑的业务活动",
prop: "suppportBusActNum",
minWidth: 120,
align: "center",
},
{
label: "关联的中台服务",
prop: "relMidServiceNum",
minWidth: 120,
align: "center",
},
{
label: "服务状态",
prop: "state",
minWidth: 120,
showOverflowTooltip: true,
align: "center",
},
// {
// label: "操作",
// prop: "action",
// minWidth: 360,
// align: "center",
// tableBtnList: [
// {
// label: "业务",
// type: "primary",
// size: "mini",
// icon: "el-icon-circle-plus-outline",
// click: (row, index) => {
// this.dialogRow = { ...row }
// console.log("编辑", row);
// this.title = '关联业务'
// this.show = true;
// },
// },
// {
// label: "应用",
// type: "primary",
// size: "mini",
// icon: "el-icon-circle-plus-outline",
// click: (row, index) => {
// console.log("编辑", row);
// },
// },
// {
// label: "实体",
// type: "primary",
// size: "mini",
// icon: "el-icon-circle-plus-outline",
// click: (row, index) => {
// console.log("编辑", row);
// },
// },
// {
// label: "组件",
// type: "primary",
// size: "mini",
// icon: "el-icon-circle-plus-outline",
// click: (row, index) => {
// console.log("编辑", row);
// },
// },
// ],
// },
],
data: [],
treeProps: {
children: 'children',
label: 'label'
},
treeData: [{
id: 1,
label: '一级 1',
children: [{
id: 4,
label: '二级 1-1',
children: [{
id: 9,
label: '三级 1-1-1'
}, {
id: 10,
label: '三级 1-1-2'
}]
}]
}],
dialogColumns: [
{
label: "资产名称",
prop: "buildType",
showOverflowTooltip: true,
align: "center",
fixed: "left",
minWidth: 140
},
{
label: "资产编号",
prop: "buildType",
showOverflowTooltip: true,
align: "center",
fixed: "left",
minWidth: 140
},
{
label: "所属元素",
prop: "buildType",
showOverflowTooltip: true,
align: "center",
fixed: "left",
minWidth: 140
},
],
dialogData: []
};
},
mounted() {
this.disabledTreeNode(this.treeData)
this.getList()
},
methods: {
concatService(row) {
this.dialogRow = { ...row }
console.log("编辑", row);
this.title = '关联业务'
this.show = true;
},
disabledTreeNode(data) {
if (Object.prototype.toString.call(data) === '[object Array]') {
data.forEach((item, index) => {
if (item.children && item.children.length) {
item.disabled = true
this.disabledTreeNode(item.children)
}
})
} else {
throw ('Method disabledTreeNode params data must be an Array.')
}
},
checkChange(node, checked) {
console.log('checkChange', node, checked);
},
close() {
},
doLayout() {
this.tableRef.doLayout()
},
async getList() {
let params = { ...this.form, pageSize: this.pager.size, current: this.pager.current }
this.loading = true
const res = await getServiceList(params).catch(() => {
this.pager.total = 0
this.loading = false
})
this.loading = false
console.log('getList', res)
if (res.code == 200) {
this.data = res.data.records
this.pager.total = res.data.total
}
},
search() {
this.pager.current = 1
this.getList()
},
reset() {
this.form = {
abilityName: '',// 中台服务名称 false
abilitySource: '',// 资源类型 1 中台服务清单 2 业务信息 3 应用服务信息 4 数据实体信息 5 技术组件信息 false
midGroundName: '',// 中台名称 false
midGroundType: '',// 中台类型 false
statTime: '',// 统计时间 false
}
this.getList()
},
handleSelectionChange(val) {
this.selectionList = val;
},
},
};
</script>
<style lang="scss" scoped>
.serviceListWrapper {
width: 100%;
height: 100%;
}
.search {
/deep/.el-form-item {
margin-bottom: 0 !important;
}
}
.w180 {
width: 180px;
}
.btn-box {
display: flex;
justify-content: flex-end;
align-items: center;
height: 38px;
}
.btns {
height: 33px;
display: flex;
justify-content: center;
align-items: center;
img {
margin: 0 6px;
}
}
.comDialog {
.el-dialog__header {
background-color: #0d867f;
text-align: left;
}
.el-dialog__title {
color: #fff;
}
.el-dialog__close {
color: #fff;
}
.comDialogContent {
min-height: 400px;
}
.el-tree {
/deep/ .is-leaf {
background-color: transparent !important;
}
}
}
</style>
\ No newline at end of file
src/views/comCenterServeListNew/components/technicalCom.vue 0 → 100644
<template>
<div class="technicalComWrapper">
<ETable ref="ETableRef" title="技术组件信息列表" :tableRef.sync="tableRef" :height="430" tableKey="technicalCom"
:data="data" :columns="columns" :indexMethod="true" v-loading="loading" :operateList="operateList"
:tableBtnList="tableBtnList" @sizeChange="handlerSizeChange" @currentChange="handlerCurrentChange" :pager="pager">
<SearchForm slot="header" :formOptions="formOptions" @onSearch="getList" @onReset="reset"></SearchForm>
</ETable>
</div>
</template>
<script>
import SearchForm from "@/components/SearchForm.vue";
import ETable from "@/newComponents/ETable/index.vue";
import tableMixin from "@/mixins/tableMixin";
export default {
name: "technicalCom",
components: { SearchForm, ETable },
mixins: [tableMixin()],
data() {
return {
loading: false,
tableRef: null,
form: {
name: '',
date: '',
typeName: '',
type: ''
},
selectionList: [],
formOptions: [
{
label: "服务名称",
prop: "name",
element: "el-input",
placeholder: "服务名称",
},
{
label: "统计日期",
prop: "buildType",
element: "el-date-picker",
type: 'date',
valueFormat: 'yyyy-MM-dd',
element: 'el-date-picker',
initValue: new Date().format('yyyy-MM-dd'),
placeholder: '统计日期',
},
{
label: "基础组件名称",
prop: "buildType",
element: "el-select",
dictType: "build_type",
placeholder: "基础组件名称",
},
],
operateList: [
{
label: "新增",
type: "primary",
size: "mini",
icon: "el-icon-plus",
disabled: true,
click: () => {
console.log("add");
},
},
{
label: "下载模板",
type: "primary",
size: "mini",
icon: "el-icon-download",
disabled: false,
click: () => {
console.log("测试");
},
},
{
label: "导入",
type: "primary",
size: "mini",
icon: "el-icon-upload",
disabled: false,
click: () => {
console.log("测试");
},
},
],
pager: {
current: 2,
size: 10,
total: 100,
sizes: [10, 20, 50, 100],
},
columns: [
{
label: "中台服务编码",
prop: "buildType",
showOverflowTooltip: true,
align: "center",
fixed: "left",
minWidth: 140
},
{
label: "中台服务名称",
prop: "buildType2",
minWidth: 140,
showOverflowTooltip: true,
align: "center",
},
{
label: "基础组件名称",
prop: "buildType2",
minWidth: 120,
showOverflowTooltip: true,
align: "center",
},
{
label: "基础组件编码",
prop: "buildType2",
minWidth: 120,
showOverflowTooltip: true,
align: "center",
},
{
label: "技术平台",
prop: "buildType2",
minWidth: 120,
showOverflowTooltip: true,
align: "center",
},
{
label: "支撑的系统数量",
T: 'a',
prop: "buildType2",
minWidth: 140,
align: "center",
style: { color: '#0b8680', cursor: 'pointer' },
click: (row) => {
this.$emit('dialog', '支撑的系统数量', row)
},
},
{
label: "支撑的数据服务数量",
T: 'a',
prop: "buildType2",
minWidth: 140,
align: "center",
style: { color: '#0b8680', cursor: 'pointer' },
click: (row) => {
this.$emit('dialog', '支撑的数据服务数量', row)
},
},
],
tableBtnList: [
{
label: "编辑",
type: "primary",
size: "mini",
icon: "el-icon-circle-plus-outline",
click: (row, index) => {
console.log("编辑", row);
},
},
],
data: [{ buildType2: 11 }],
};
},
mounted() { },
methods: {
doLayout() {
this.tableRef.doLayout()
},
getList() {
console.log("getList");
},
reset() { },
handleSelectionChange(val) {
this.selectionList = val;
},
showClick(val) {
console.log("showClick", val);
}
},
};
</script>
<style lang="scss" scoped>
.technicalComWrapper {
width: 100%;
height: 100%;
}
</style>
\ No newline at end of file
src/views/comCenterServeListNew/components/usiingService.vue 0 → 100644
<template>
<div class="usiingServiceWrapper">
<ETable ref="ETableRef" title="应用服务列表" :tableRef.sync="tableRef" :height="430" tableKey="usiingService" :data="data"
:columns="columns" :indexMethod="true" v-loading="loading" :operateList="operateList" :tableBtnList="tableBtnList"
@sizeChange="handlerSizeChange" @currentChange="handlerCurrentChange" :pager="pager">
<SearchForm slot="header" :formOptions="formOptions" @onSearch="getList" @onReset="reset"></SearchForm>
</ETable>
</div>
</template>
<script>
import SearchForm from "@/components/SearchForm.vue";
import ETable from "@/newComponents/ETable/index.vue";
import tableMixin from "@/mixins/tableMixin";
export default {
name: "usiingService",
components: { SearchForm, ETable },
mixins: [tableMixin()],
data() {
return {
loading: false,
tableRef: null,
form: {
name: '',
date: '',
typeName: '',
type: ''
},
selectionList: [],
formOptions: [
{
label: "中台服务名称",
prop: "name",
element: "el-input",
placeholder: "中台服务名称",
},
{
label: "统计日期",
prop: "buildType",
element: "el-date-picker",
type: 'date',
valueFormat: 'yyyy-MM-dd',
element: 'el-date-picker',
initValue: new Date().format('yyyy-MM-dd'),
placeholder: '统计日期',
},
{
label: "业务服务名称",
prop: "buildType",
element: "el-select",
dictType: "build_type",
placeholder: "业务服务名称",
},
{
label: "应用服务名称",
prop: "buildType",
element: "el-select",
dictType: "build_type",
placeholder: "应用服务名称",
},
],
operateList: [
{
label: "新增",
type: "primary",
size: "mini",
icon: "el-icon-plus",
disabled: true,
click: () => {
console.log("add");
},
},
{
label: "下载模板",
type: "primary",
size: "mini",
icon: "el-icon-download",
disabled: false,
click: () => {
console.log("测试");
},
},
{
label: "导入",
type: "primary",
size: "mini",
icon: "el-icon-upload",
disabled: false,
click: () => {
console.log("测试");
},
},
],
pager: {
current: 2,
size: 10,
total: 100,
sizes: [10, 20, 50, 100],
},
columns: [
{
label: "中台服务编码",
prop: "buildType",
showOverflowTooltip: true,
align: "center",
fixed: "left",
minWidth: 140
},
{
label: "中台服务名称",
prop: "buildType2",
minWidth: 140,
showOverflowTooltip: true,
align: "center",
},
{
label: "应用活动名称",
prop: "buildType2",
minWidth: 120,
showOverflowTooltip: true,
align: "center",
},
{
label: "应用活动编码",
prop: "buildType2",
minWidth: 120,
showOverflowTooltip: true,
align: "center",
},
{
label: "功能模块",
prop: "buildType2",
minWidth: 120,
showOverflowTooltip: true,
align: "center",
},
{
label: "系统应用",
prop: "buildType2",
minWidth: 120,
showOverflowTooltip: true,
align: "center",
},
{
label: "关联的业务对象数量",
T: 'a',
prop: "buildType2",
minWidth: 140,
align: "center",
style: { color: '#0b8680', cursor: 'pointer' },
click: (row) => {
this.$emit('dialog', '关联的业务对象数量', row)
},
},
{
label: "关联的业务活动数量",
T: 'a',
prop: "buildType2",
minWidth: 140,
align: "center",
style: { color: '#0b8680', cursor: 'pointer' },
click: (row) => {
this.$emit('dialog', '关联的业务活动数量', row)
},
},
{
label: "关联的物理实体数量",
T: 'a',
prop: "buildType2",
minWidth: 140,
align: "center",
style: { color: '#0b8680', cursor: 'pointer' },
click: (row) => {
this.$emit('dialog', '关联的物理实体数量', row)
},
},
{
label: "关联的技术组件数量",
T: 'a',
prop: "buildType2",
minWidth: 140,
align: "center",
style: { color: '#0b8680', cursor: 'pointer' },
click: (row) => {
this.$emit('dialog', '关联的技术组件数量', row)
},
},
],
tableBtnList: [
{
label: "编辑",
type: "primary",
size: "mini",
icon: "el-icon-circle-plus-outline",
click: (row, index) => {
console.log("编辑", row);
},
},
],
data: [{ buildType2: 11 }],
};
},
mounted() { },
methods: {
doLayout() {
this.tableRef.doLayout()
},
getList() {
console.log("getList");
},
reset() { },
handleSelectionChange(val) {
this.selectionList = val;
},
showClick(val) {
console.log("showClick", val);
}
},
};
</script>
<style lang="scss" scoped>
.usiingServiceWrapper {
width: 100%;
height: 100%;
}
</style>
\ No newline at end of file
src/views/comCenterServeListNew/index.vue 0 → 100644
<template>
<div class="comCenterServeList">
<div class="table_container">
<el-tabs v-model="active" @tab-click="handleClick">
<el-tab-pane v-for="(item, index) in tabList" :key="index" :label="item.label" :name="item.name">
<component :ref="`${item.name}ref`" :is="item.name" @dialog="openDialog"></component>
</el-tab-pane>
</el-tabs>
</div>
<ComDialog ref="ComDialogRef" />
</div>
</template>
<script>
import ServiceList from './components/serviceList.vue';
import BusinessMsg from './components/businessMsg.vue';
import UsiingService from './components/usiingService.vue';
import DataEntity from './components/dataEntity.vue';
import TechnicalCom from './components/technicalCom.vue';
import ComDialog from './components/comDialog.vue';
export default {
name: 'comCenterServeList',
components: {
ServiceList,
BusinessMsg,
UsiingService,
DataEntity,
TechnicalCom,
ComDialog
},
data() {
return {
tabList: [
{
label: '中台服务清单',
name: 'ServiceList',
},
{
label: '业务信息',
name: 'BusinessMsg',
},
{
label: '应用服务信息',
name: 'UsiingService',
},
{
label: '数据实体信息',
name: 'DataEntity',
},
{
label: '技术组件信息',
name: 'TechnicalCom',
}
],
active: "ServiceList",
};
},
mounted() {
},
methods: {
openDialog(title, row) {
console.log(title, row)
let params = { title, row }
this.$refs.ComDialogRef.open(params)
},
handleClick(tab) {
this.active = tab.name;
// 解决列表fixed样式错乱
this.$nextTick(() => {
this.$refs[`${tab.name}ref`][0].doLayout()
})
},
}
}
</script>
<style scoped>
.form_item_container {
display: flex;
flex-wrap: wrap;
}
.el-form-item {
display: flex;
width: 33%;
}
.cross1 {
width: 100%;
}
/deep/ .cross1>.el-form-item__content {
width: 86.4% !important;
}
.comCenterServeList {
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: center;
}
.dialog_content_1 {
display: flex;
justify-content: space-between;
}
.el-button--primary {
background: rgba(13, 134, 127, 0.1);
color: #0D867F;
border: 0;
}
.add_select_item_icon_container {
margin-top: 10px;
text-align: center;
cursor: pointer;
}
/deep/ .el-dialog__header {
background-color: #0D867F;
text-align: left;
}
/deep/ .el-input-group__append {
background-color: #0D867F;
color: #fff;
cursor: pointer;
}
/deep/ .el-dialog__title {
color: #fff;
}
/deep/ .el-dialog__close {
color: #fff;
}
.search_menu {
display: flex;
justify-content: space-between;
}
.search_menu_item_container {
display: flex;
align-items: center;
}
.search_menu_btn_container {
display: flex;
align-items: center;
}
.search_menu_item {
display: flex;
align-items: center;
width: 344px;
}
.search_title {
/* width: 20%; */
flex-shrink: 0;
margin-right: 15px;
}
.search_item {
width: 60%;
}
.search_btn {
width: 100%;
display: flex;
margin-top: 50px;
margin-bottom: 20px;
}
.el-button--default {
border: 0;
}
.shanChu_btn {
color: #DD6A15;
background-color: #F8EBE2;
}
.tingYong_btn {
color: #DEA82A;
background-color: #FDF6E6;
}
.el-button.is-disabled {
color: #C0C4CC !important;
background-color: #fff !important;
}
.add_btn {
display: flex;
align-items: center;
justify-content: center;
width: 76px;
height: 32px;
background: rgba(13, 134, 127, 0.1);
border-radius: 6px 6px 6px 6px;
border: 1px solid #0D867F;
font-size: 14px;
color: #0D867F;
cursor: pointer;
}
.version_btn {
display: flex;
align-items: center;
justify-content: center;
width: 104px;
height: 32px;
background: rgba(13, 134, 127, 0.1);
border-radius: 6px 6px 6px 6px;
border: 1px solid #0D867F;
font-size: 14px;
color: #0D867F;
cursor: pointer;
margin-left: 15px;
}
.query_btn {
display: flex;
align-items: center;
justify-content: center;
width: 76px;
height: 32px;
background: rgba(13, 134, 127, 1);
border-radius: 6px 6px 6px 6px;
border: 1px solid #0D867F;
font-size: 14px;
color: #fff;
margin-right: 10px;
cursor: pointer;
}
.reset_btn {
display: flex;
align-items: center;
justify-content: center;
width: 76px;
height: 32px;
background: rgba(244, 244, 244, 1);
border-radius: 6px 6px 6px 6px;
border: 1px solid #ccc;
font-size: 14px;
color: #666;
cursor: pointer;
}
.btn_icon {
margin-right: 10px;
}
.table_container {
width: 97%;
height: calc(100% - 40px);
margin-top: 20px;
}
.el-pagination {
margin-top: 30px;
}
/deep/ .el-pagination.is-background .el-pager li:not(.disabled).active {
background-color: #0D867F;
}
.greenButton {
background-color: #0D867F;
color: #fff;
}
</style>
\ No newline at end of file
src/views/comCenterServeListNew/options.js 0 → 100644
export const serverTypeOptions = [
{
label: "聚合服务",
value: 1,
},
{
label: "规则服务",
value: 2,
},
{
label: "数据服务",
value: 3,
},
{
label: "原子服务",
value: 4,
},
];
export const archiTypeOptions = [
{
label: "业务架构",
value: 1,
},
{
label: "应用架构",
value: 2,
},
{
label: "数据架构",
value: 3,
},
{
label: "技术架构",
value: 4,
},
{
label: "安全架构",
value: 5,
},
];
export const abilitySourceOptions = [
{
label: "中台服务清单",
value: 1,
},
{
label: "业务信息",
value: 2,
},
{
label: "应用服务信息",
value: 3,
},
{
label: "数据实体信息",
value: 4,
},
{
label: "技术组件信息",
value: 5,
},
];
export const midGroundNameOptions = [
{
label: "项目管理业务中台",
value: "项目管理业务中台",
},
{
label: "电网资源业务中台",
value: "电网资源业务中台",
},
{
label: "客户服务业务中台",
value: "客户服务业务中台",
},
{
label: "财务管理业务中台",
value: "财务管理业务中台",
},
];
export const midGroundTypeOptions = [
{
label: "业务中台",
value: "业务中台",
},
{
label: "数据中台",
value: "数据中台",
},
{
label: "技术中台",
value: "技术中台",
},
];
Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!