From daae04211539a4ac15c6e46e0c871dd5bfec5e1e Mon Sep 17 00:00:00 2001 From: zhangjun1 Date: Mon, 27 Apr 2020 18:32:26 +0800 Subject: [PATCH] =?UTF-8?q?=E5=B7=A5=E4=BD=9C=E5=8F=B0=E7=BB=84=E7=BB=87?= =?UTF-8?q?=E7=AE=A1=E7=90=86=E5=91=98=E9=A1=B5=E9=9D=A2?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/workPlace.vue | 526 +++++++++++++++++++++++++++------------- 1 file changed, 356 insertions(+), 170 deletions(-) diff --git a/src/pages/workPlace.vue b/src/pages/workPlace.vue index 90bcde6..20a36bc 100644 --- a/src/pages/workPlace.vue +++ b/src/pages/workPlace.vue @@ -11,7 +11,15 @@
-
{{item.text}}
+
+ + {{item.text}} +
@@ -35,11 +43,12 @@ -
-

+

数据分析中心

@@ -59,54 +68,140 @@
-

- 在线组件工具 -

+

在线组件工具

-
- {{item.text}} +
+ + {{item.text}} +
+
+
+
+ + + +
+
+

+ 数据资产看板 + + +

+
+
+

+ 服务健康状态 +

+
+
+
+

+ 服务应用总况 + + + + +

+
+
+
+

+ 服务运营分析 +

+
- -
-
-

- 我的服务 + +

+
+

+ 数据资产看板 + + +

+
+
+

+ 服务运营分析 +

+
+
+
+
+
+ + +
+
+

+ {{now_user == 0?'我的服务':'服务管理'}}

-
{{item}}
-
  服务注册
+
{{item}}
+
+   服务注册 +
-
-

- 我的应用 +

+

+ {{now_user == 0?'我的应用':'平台应用'}}

-
{{item}}
+
{{item}}
- +
- +

{{item.name}}

{{item.version}}

+
- -
@@ -119,12 +214,24 @@ export default { return { person: "康先生", login_time: "2020-03-12 10:21:22", - now_user: 0,//0:普通用户,1:组织管理员,2:超级管理员 - now_type:0, - now_app:0, - manage_flag:false, + now_user: 2, //0:普通用户,1:组织管理员,2:超级管理员 + now_type: 0, + now_app: 0, + manage_flag: false, health: uuidv1(), yy_asy: uuidv1(), + fwyy: uuidv1(), + fw_options:[ + { + value:0, + label:'服务总数', + }, + { + value:1, + label:'应用总数', + }, + ], + fw_value:0, menu_arr: [ [ { @@ -208,125 +315,140 @@ export default { color: "#ea7d19", num: "¥2,312" } - ], + ] ], - online_tool_arr:[ + online_tool_arr: [ { text: "智能绘图", pic: require("../assets/imgs/home_tool_ic_znht.png"), bg: "#e5f4fe", - color: "#38aef9", + color: "#38aef9" }, { text: "数据开发", pic: require("../assets/imgs/home_tool_ic_sjkf.png"), bg: "#e6ebfe", - color: "#515fe7", + color: "#515fe7" }, { text: "模型工场", pic: require("../assets/imgs/home_tool_ic_mxgc.png"), bg: "#e6ebfe", - color: "#515fe7", + color: "#515fe7" }, { text: "流程设计", pic: require("../assets/imgs/home_tool_ic_lcsj.png"), bg: "#e6ebfe", - color: "#515fe7", + color: "#515fe7" }, { text: "可视化报表", pic: require("../assets/imgs/home_tool_ic_kshbb.png"), bg: "#fff2e2", - color: "#ea7d19", + color: "#ea7d19" }, { text: "模板应用", pic: require("../assets/imgs/home_tool_ic_mbyy.png"), bg: "#fff2e2", - color: "#ea7d19", + color: "#ea7d19" }, { text: "应用创新", pic: require("../assets/imgs/home_tool_ic_yycx.png"), bg: "#e7fdfc", - color: "#25bdb1", - }, + color: "#25bdb1" + } + ], + service_arr: [ + ["服务列表", "申请服务", "服务审批", "云资源"], + ["服务列表", "服务审批", "云资源管理"], + ], + apptype_arr: [ + ["部署的应用", "创新的应用"], + ["创新应用", "应用审批"], ], - service_arr:['服务列表','申请服务','服务审批','云资源'], - apptype_arr:['部署的应用','创新的应用'], - app_arr:[ + app_arr: [ { - pic:require("../assets/imgs/home_tool_ic_znht.png"), - name:'定定定', - version:'1.0.1', + pic: require("../assets/imgs/home_tool_ic_znht.png"), + name: "定定定", + version: "1.0.1" }, { - pic:require("../assets/imgs/home_tool_ic_znht.png"), - name:'定定定定定定定定', - version:'1.0.1', + pic: require("../assets/imgs/home_tool_ic_znht.png"), + name: "定定定定定定定定", + version: "1.0.1" }, { - pic:require("../assets/imgs/home_tool_ic_znht.png"), - name:'定定定定定定定定', - version:'1.0.1', + pic: require("../assets/imgs/home_tool_ic_znht.png"), + name: "定定定定定定定定", + version: "1.0.1" }, { - pic:require("../assets/imgs/home_tool_ic_znht.png"), - name:'定定定定定定定定', - version:'1.0.1', + pic: require("../assets/imgs/home_tool_ic_znht.png"), + name: "定定定定定定定定", + version: "1.0.1" }, { - pic:require("../assets/imgs/home_tool_ic_znht.png"), - name:'定定定定定定定定', - version:'1.0.1', + pic: require("../assets/imgs/home_tool_ic_znht.png"), + name: "定定定定定定定定", + version: "1.0.1" }, { - pic:require("../assets/imgs/home_tool_ic_znht.png"), - name:'定定定定定定定定', - version:'1.0.1', + pic: require("../assets/imgs/home_tool_ic_znht.png"), + name: "定定定定定定定定", + version: "1.0.1" }, { - pic:require("../assets/imgs/home_tool_ic_znht.png"), - name:'定定定定定定定定', - version:'1.0.1', - }, + pic: require("../assets/imgs/home_tool_ic_znht.png"), + name: "定定定定定定定定", + version: "1.0.1" + } ], - manage_arr:[ + manage_arr: [ { - pic:require('../assets/imgs/home_tool_ic_key.png'), - text:'我的密钥', + pic: require("../assets/imgs/home_tool_ic_key.png"), + text: "我的密钥" }, { - pic:require('../assets/imgs/home_tool_ic_organize.png'), - text:'组织管理', + pic: require("../assets/imgs/home_tool_ic_organize.png"), + text: "组织管理" }, { - pic:require('../assets/imgs/home_tool_ic_quanxian.png'), - text:'权限管理', + pic: require("../assets/imgs/home_tool_ic_quanxian.png"), + text: "权限管理" }, { - pic:require('../assets/imgs/home_tool_ic_quanxian.png'), - text:'容器管理', + pic: require("../assets/imgs/home_tool_ic_quanxian.png"), + text: "容器管理" }, { - pic:require('../assets/imgs/home_tool_ic_quanxian.png'), - text:'数据管控', + pic: require("../assets/imgs/home_tool_ic_quanxian.png"), + text: "数据管控" }, { - pic:require('../assets/imgs/home_tool_ic_quanxian.png'), - text:'消息新闻管理', - }, + pic: require("../assets/imgs/home_tool_ic_quanxian.png"), + text: "消息新闻管理" + } ] }; }, mounted() { - this.init_health(50); - this.init_yy() + if(this.now_user == 0){ + this.init_health(50); + this.init_yy(); + }else if(this.now_user == 1){ + this.init_health(50); + this.init_yy(); + this.init_fwyy() + }else if(this.now_user == 2){ + + this.init_fwyy() + } }, methods: { - manage_func(n){ + manage_func(n) { console.log(n); }, init_health(num) { @@ -447,14 +569,14 @@ export default { }, grid: { top: "20", - bottom:'45', + bottom: "45" }, legend: { data: ["服务调用总数", "应用部署总数", "收益总额"], bottom: 0, - itemWidth:10, - itemHeight:10, - backgroundColor:'#f4f7fc', + itemWidth: 10, + itemHeight: 10, + backgroundColor: "#f4f7fc" }, xAxis: [ { @@ -462,13 +584,7 @@ export default { axisTick: { alignWithLabel: true }, - data: [ - "1月", - "2月", - "3月", - "4月", - "5月", - ] + data: ["1月", "2月", "3月", "4月", "5月"] } ], yAxis: [ @@ -500,16 +616,10 @@ export default { name: "服务调用总数", type: "bar", yAxisIndex: 1, - data: [ - 2.0, - 4.9, - 7.0, - 23.2, - 25.6, - ], + data: [2.0, 4.9, 7.0, 23.2, 25.6], itemStyle: { barBorderRadius: 6, - color:colors[2] + color: colors[2] }, barWidth: 12 }, @@ -517,16 +627,10 @@ export default { name: "应用部署总数", type: "bar", yAxisIndex: 1, - data: [ - 2.6, - 5.9, - 9.0, - 26.4, - 28.7, - ], + data: [2.6, 5.9, 9.0, 26.4, 28.7], itemStyle: { barBorderRadius: 6, - color:colors[0] + color: colors[0] }, barWidth: 12 }, @@ -534,22 +638,90 @@ export default { name: "收益总额", type: "line", yAxisIndex: 0, - data: [ - 2.0, - 2.2, - 3.3, - 4.5, - 6.3, - ], + data: [2.0, 2.2, 3.3, 4.5, 6.3], itemStyle: { - color:colors[0] + color: colors[0] }, - symbol:'circle', + symbol: "circle" } ] }; window[this.yy_asy] = echarts.init(document.getElementById(this.yy_asy)); window[this.yy_asy].setOption(options, true); + }, + init_fwyy() { + var dataname = ['服务总数','应用总数'] + var options = { + tooltip: { + trigger: "axis", + axisPointer: { + label: { + backgroundColor: "#fff" + } + } + }, + legend:{ + data: [dataname[0]], + itemWidth: 14, + itemHeight: 10, + bottom:0 + }, + grid: { + borderColor: "#f2f2f2", + top:20, + bottom:45, + right:0, + }, + xAxis: { + type: "category", + axisTick: { show: false }, + axisLine: { show: false }, + nameTextStyle: { + color: "#0d1847" + }, + data: ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"] + }, + yAxis: { + type: "value", + axisLine: { + show: false, + lineStyle: { + color: '#c9cedd' + } + }, + axisTick: { show: false }, + nameTextStyle: { + color: "#f2f2f2" + } + }, + series: [ + { + data: [820, 932, 901, 934, 1290, 1330, 1320], + type: "line", + name:dataname[0], + smooth: true, + sampling: "average", + symbol: "circle", + itemStyle: { + color: "#0a92c4" + }, + areaStyle: { + color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [ + { + offset: 0, + color: "#0a92c4" + }, + { + offset: 1, + color: "#ffe" + } + ]) + } + } + ] + }; + window[this.fwyy] = echarts.init(document.getElementById(this.fwyy)); + window[this.fwyy].setOption(options, true); } } }; @@ -557,9 +729,21 @@ export default { \ No newline at end of file -- 2.26.0