Skip to content

A
apaas-ui
Commit 10a908b0 authored by 徐一鸣's avatar 徐一鸣
Browse files
Options

工作台服务管理和应用管理跳转

parent d152b930
Show whitespace changes
Inline Side-by-side
Showing with 533 additions and 450 deletions
src/App.vue
View file @ 10a908b0
......@@ -12,8 +12,24 @@ export default {
components: {
bdMenu,
},
methods: {},
created() {},
methods: {
getCurrentUser() {
this.$api.user.getNowUser().then(({ data }) => {
if (data.success == 1) {
console.log("--- user info ---");
console.log(data.data);
console.log("--- user info ---");
this.$store.commit("userInfofun", data.data);
} else {
console.log(data.errMsg);
}
});
},
},
created() {
this.getCurrentUser();
},
};
</script>
......
src/components/menu.vue
View file @ 10a908b0
<template>
<div class="menu">
<img src="../assets/imgs/home_img_logo.png" alt class="logo" />
<div style="float:right;cursor: pointer;position:relative;" class="user_hover">
<div
style="float:right;cursor: pointer;position:relative;"
class="user_hover"
>
<span class="user">用户</span>
<img src="../assets/imgs/home_ic_user.png" alt class="user_pic" />
<div class="user_menu">
......@@ -9,11 +12,16 @@
v-for="(item, index) in user_arr"
:key="index + 700"
@click="gotopage(item.path)"
>{{ item.name }}</div>
>
{{ item.name }}
</div>
</div>
<div class="sj"></div>
</div>
<div style="float:right;cursor: pointer;position:relative;" class="shop_hover">
<div
style="float:right;cursor: pointer;position:relative;"
class="shop_hover"
>
<div class="number">99+</div>
<img src="../assets/imgs/home_ic_shop.png" alt class="car" />
<div class="shop_menu">
......@@ -25,23 +33,40 @@
>
<img :src="item.service.cover" class="shop_img" />
<div class="shop_cell_msgs">
<p
@click="getDetail(item.id)"
class="shop_cell_name over_one"
>{{ item.service_id == 0 ? item.application.app_name : item.service.name }}</p>
<p
class="shop_cell_msg bover_one"
>{{ item.service_id == 0 ? item.application.ywly : item.service.sectors_name }}</p>
<p
class="shop_cell_msg over_one"
>{{ item.service_id == 0 ? item.application.org : item.service.organization_name }}</p>
<p @click="getDetail(item.id)" class="shop_cell_name over_one">
{{
item.service_id == 0
? item.application.app_name
: item.service.name
}}
</p>
<p class="shop_cell_msg bover_one">
{{
item.service_id == 0
? item.application.ywly
: item.service.sectors_name
}}
</p>
<p class="shop_cell_msg over_one">
{{
item.service_id == 0
? item.application.org
: item.service.organization_name
}}
</p>
</div>
<div>
<img @click.stop="deleteItem(item.id)" src="../assets/imgs/ic_delete.png" alt />
<img
@click.stop="deleteItem(item.id)"
src="../assets/imgs/ic_delete.png"
alt
/>
</div>
</div>
<div class="shop_footer">
<el-button @click="settlement" size="small" class="shop_settlement">去购物车申请结算</el-button>
<el-button @click="settlement" size="small" class="shop_settlement"
>去购物车申请结算</el-button
>
</div>
</div>
<div class="shop_sj"></div>
......@@ -56,14 +81,24 @@
:style="{ color: now_menu == index ? '#fff' : '' }"
>
{{ item.name }}
<div class="user_menu" v-if="item.children && item.children.length" style="left: 30px;">
<div
class="user_menu"
v-if="item.children && item.children.length"
style="left: 30px;"
>
<div
v-for="(v, indexs) in item.children"
:key="indexs + 700"
@click.stop="gotoChildPage(v, index)"
>{{ v.name }}</div>
>
{{ v.name }}
</div>
</div>
<div class="sj" v-if="item.children && item.children.length" style="left: 60px;"></div>
<div
class="sj"
v-if="item.children && item.children.length"
style="left: 60px;"
></div>
<div class="bottom_show" v-if="now_menu == index"></div>
</div>
</div>
......@@ -81,21 +116,21 @@ export default {
children: [
{
name: "服务注册",
path: "/fwzc/fwcs"
path: "/fwzc/fwcs",
},
{
name: "服务管理",
path: "/fwgl/"
path: "/fwgl/",
},
{
name: "应用管理",
path: "/yygl/"
}
]
path: "/yygl/",
},
],
},
{
name: "技术支持",
path: "/xxx"
path: "/xxx",
},
{
name: "服务超市",
......@@ -103,34 +138,34 @@ export default {
children: [
{
name: "数据服务",
path: "/shop/data_service_list/5"
path: "/shop/data_service_list/5",
},
{
name: "时空服务",
path: "/shop/space_time_service_list/6"
path: "/shop/space_time_service_list/6",
},
{
name: "视频服务",
path: "/shop/video_service_list/7"
path: "/shop/video_service_list/7",
},
{
name: "感知服务",
path: "/shop/perception_service_list/10"
path: "/shop/perception_service_list/10",
},
{
name: "综合应用",
path: "/shop/comprehensive_app_list/11"
path: "/shop/comprehensive_app_list/11",
},
{
name: "云资源服务",
path: "/shop/cloud"
path: "/shop/cloud",
},
{
name: "应用商店",
path: "/shop/app_store_list/12"
}
]
}
path: "/shop/app_store_list/12",
},
],
},
],
now_menu: 2,
user_arr: [
......@@ -138,9 +173,9 @@ export default {
{ name: "消息通知", path: "/user/message" },
{ name: "收银中心", path: "/authority" },
{ name: "关于BD-aPaaS", path: "/data_analysis" },
{ name: "退出登录", path: "" }
{ name: "退出登录", path: "" },
],
shopping_list: []
shopping_list: [],
};
},
mounted() {
......@@ -149,12 +184,12 @@ export default {
computed: {
getMenuCartState() {
return this.$store.state.menuCartState;
}
},
},
watch: {
getMenuCartState(newVal) {
this.getList();
}
},
},
methods: {
gotopage(n) {
......@@ -165,7 +200,7 @@ export default {
},
deleteItem(id) {
let query = [id];
this.$api.serviceShop.delShoppingCart(query).then(response => {
this.$api.serviceShop.delShoppingCart(query).then((response) => {
this.getList();
});
},
......@@ -181,7 +216,7 @@ export default {
gotoChildPage(v, parent) {
if (v.path) {
if (v.path == "/fwgl/" || v.path == "/yygl/") {
this.$router.push(v.path + this.$store.state.role);
this.$router.push(v.path + this.$store.getters.level);
} else if (parent == 2) {
this.$router.push(v.path);
this.$store.commit("serviceShopMenuAct", v.path);
......@@ -192,7 +227,7 @@ export default {
}
},
getList() {
this.$api.serviceShop.getShoppingCart().then(response => {
this.$api.serviceShop.getShoppingCart().then((response) => {
if (response.data.success == "1") {
console.log(response.data.data);
this.shopping_list = response.data.data.valid
......@@ -202,8 +237,8 @@ export default {
console.log(response.data.message);
}
});
}
}
},
},
};
</script>
......
src/pages/workbench/workPlace.vue
View file @ 10a908b0
......@@ -4,7 +4,7 @@
<div class="preson">
<div class="person_text">
<img src="@/assets/imgs/img_head.png" alt />
<span>你好，{{person}}！最近登录{{login_time}}</span>
<span>你好，{{ person }}！最近登录{{ login_time }}</span>
</div>
<div class="person_menu">
管理功能&nbsp;&nbsp;&nbsp;
......@@ -12,34 +12,51 @@
<div class="manage_menu">
<div
v-for="(item,index) in manage_arr"
:key="index+800"
v-for="(item, index) in manage_arr"
:key="index + 800"
class="manage_box"
@click="manage_func(index)"
v-if="item.role==now_user"
v-if="item.role == now_user"
>
<img :src="item.pic" alt />
{{item.text}}
{{ item.text }}
</div>
</div>
</div>
</div>
<div class="menu">
<div
:class="now_user==0?'menu_box0':now_user==1?'menu_box1':'menu_box2'"
v-for="(item,index) in menu_arr[now_user]"
:key="index+100"
:class="
now_user == 0
? 'menu_box0'
: now_user == 1
? 'menu_box1'
: 'menu_box2'
"
v-for="(item, index) in menu_arr[now_user]"
:key="index + 100"
>
<img :src="item.pic" alt />
<div class="menu_text">
<p>{{item.text}}</p>
<p>{{ item.text }}</p>
<p
:style="index == menu_arr[now_user].length - 1||now_user==1&&index==0||now_user==2&&index==0?{color:item.color,marginRight:'-20px'}:{color:item.color}"
:style="
index == menu_arr[now_user].length - 1 ||
(now_user == 1 && index == 0) ||
(now_user == 2 && index == 0)
? { color: item.color, marginRight: '-20px' }
: { color: item.color }
"
>
<span style="font-size:36px">{{item.num}}</span>
<span style="font-size:36px">{{ item.num }}</span>
<span
v-if="index == menu_arr[now_user].length - 1||now_user==1&&index==0||now_user==2&&index==0"
>万</span>
v-if="
index == menu_arr[now_user].length - 1 ||
(now_user == 1 && index == 0) ||
(now_user == 2 && index == 0)
"
>万</span
>
</p>
</div>
</div>
......@@ -53,19 +70,19 @@
style="margin-top:20px;margin-bottom:10px;font-size:18px;color: #0d1847;font-weight:600;padding-left:20px;"
>
数据分析中心
<img style="vertical-align:-9px;" src="@/assets/imgs/home_btn_enter.png" alt />
<img
style="vertical-align:-9px;"
src="@/assets/imgs/home_btn_enter.png"
alt
/>
</p>
<div class="data_charts">
<div class="data_charts_left">
<p>
<span></span> 服务健康状态
</p>
<p><span></span> 服务健康状态</p>
<div :id="health" class="health"></div>
</div>
<div class="data_charts_right">
<p>
<span></span> 服务运营分析
</p>
<p><span></span> 服务运营分析</p>
<div :id="yy_asy" class="yy_asy"></div>
</div>
</div>
......@@ -73,16 +90,18 @@
<div class="online_tool">
<p
style="margin-top:20px;margin-bottom:10px;font-size:18px;color: #0d1847;font-weight:600;height:28px;padding-left:20px;"
>在线组件工具</p>
>
在线组件工具
</p>
<div class="online_contain">
<div
v-for="(item,index) in online_tool_arr"
:key="index+300"
v-for="(item, index) in online_tool_arr"
:key="index + 300"
class="online_box"
:style="{backgroundColor:item.bg}"
:style="{ backgroundColor: item.bg }"
>
<img :src="item.pic" alt />
<span :style="{color:item.color}">{{item.text}}</span>
<span :style="{ color: item.color }">{{ item.text }}</span>
</div>
</div>
</div>
......@@ -95,13 +114,15 @@
style="margin-top:20px;margin-bottom:10px;font-size:18px;color: #0d1847;font-weight:600;padding-left:20px;"
>
数据资产看板
<img style="vertical-align:-9px;" src="@/assets/imgs/home_btn_enter.png" alt />
<img
style="vertical-align:-9px;"
src="@/assets/imgs/home_btn_enter.png"
alt
/>
</p>
<div class="data_charts" style="width:100%;">
<div class="data_charts_left">
<p>
<span></span> 服务健康状态
</p>
<p><span></span> 服务健康状态</p>
<div :id="health" class="health"></div>
</div>
<div class="data_charts_left" style="width:420px;margin-left:40px;">
......@@ -119,9 +140,7 @@
<div :id="fwyy" class="fwyy"></div>
</div>
<div class="data_charts_right">
<p>
<span></span> 服务运营分析
</p>
<p><span></span> 服务运营分析</p>
<div :id="yy_asy" class="yy_asy"></div>
</div>
</div>
......@@ -135,25 +154,23 @@
style="margin-top:20px;margin-bottom:10px;font-size:18px;color: #0d1847;font-weight:600;padding-left:20px;"
>
数据资产看板
<img style="vertical-align:-9px;" src="@/assets/imgs/home_btn_enter.png" alt />
<img
style="vertical-align:-9px;"
src="@/assets/imgs/home_btn_enter.png"
alt
/>
</p>
<div class="data_charts" style="width:100%;">
<div class="data_charts_left" style="width:590px;">
<p>
<span></span> 服务运营分析
</p>
<p><span></span> 服务运营分析</p>
<div :id="yy_asy" class="yy_asy" style="width:590px;"></div>
</div>
<div class="data_charts_left" style="width:285px;">
<p>
<span></span> 服务类型分析
</p>
<p><span></span> 服务类型分析</p>
<div :id="fwlx_asy" class="health" style="width:265px;"></div>
</div>
<div class="data_charts_left" style="width:285px;">
<p>
<span></span> 应用类型分析
</p>
<p><span></span> 应用类型分析</p>
<div :id="yylx_asy" class="health" style="width:265px;"></div>
</div>
</div>
......@@ -162,11 +179,11 @@
<!-- 普通用户/组织管理员--服务 -->
<div class="case_box">
<div class="data_asy" :style="now_user==0?{}:{width:'590px'}">
<div class="data_asy" :style="now_user == 0 ? {} : { width: '590px' }">
<p
style="margin-top:20px;margin-bottom:10px;font-size:18px;color: #0d1847;font-weight:600;padding-left:20px;"
>
{{now_user == 0?'我的服务':'服务管理'}}
{{ now_user == 0 ? "我的服务" : "服务管理" }}
<img
style="vertical-align:-9px;cursor: pointer;"
src="@/assets/imgs/home_btn_enter.png"
......@@ -177,13 +194,19 @@
<div class="myservice">
<div class="myservice_title">
<div
v-for="(item,index) in service_arr[now_user]"
:key="index+400"
v-for="(item, index) in service_arr[now_user]"
:key="index + 400"
class="myservice_type"
:style="now_type==index?{borderBottom:'4px solid #f5ab4c',color:'#e56600'}:{}"
:style="
now_type == index
? { borderBottom: '4px solid #f5ab4c', color: '#e56600' }
: {}
"
@click="now_type = index"
>{{item}}</div>
<div class="myservice_btn" v-if="now_user==0" @click="gotozc()">
>
{{ item }}
</div>
<div class="myservice_btn" v-if="now_user == 0" @click="gotozc()">
<img src="@/assets/imgs/home_ic_release.png" alt />&nbsp; 服务注册
</div>
</div>
......@@ -195,11 +218,11 @@
></table-um>
</div>
</div>
<div class="online_tool" :style="now_user==0?{}:{width:'590px'}">
<div class="online_tool" :style="now_user == 0 ? {} : { width: '590px' }">
<p
style="margin-top:20px;margin-bottom:10px;font-size:18px;color: #0d1847;font-weight:600;padding-left:20px;"
>
{{now_user == 0?'我的应用':'平台应用'}}
{{ now_user == 0 ? "我的应用" : "平台应用" }}
<img
@click="gotoyy"
style="vertical-align:-9px;"
......@@ -210,18 +233,28 @@
<div class="myapp">
<div class="myservice_title">
<div
v-for="(item,index) in apptype_arr[now_user]"
:key="index+400"
v-for="(item, index) in apptype_arr[now_user]"
:key="index + 400"
class="myservice_type"
:style="now_app==index?{borderBottom:'4px solid #f5ab4c',color:'#e56600'}:{}"
:style="
now_app == index
? { borderBottom: '4px solid #f5ab4c', color: '#e56600' }
: {}
"
@click="now_app = index"
>{{item}}</div>
>
{{ item }}
</div>
</div>
<el-scrollbar class="myapp_contain" v-if="now_user == 0">
<div v-for="(item,index) in app_arr" :key="index+600" class="myapp_box">
<div
v-for="(item, index) in app_arr"
:key="index + 600"
class="myapp_box"
>
<img :src="item.pic" alt style="width:60px;height:60px;" />
<p>{{item.name}}</p>
<p>{{item.version}}</p>
<p>{{ item.name }}</p>
<p>{{ item.version }}</p>
</div>
</el-scrollbar>
......@@ -258,12 +291,12 @@ export default {
fw_options: [
{
value: 0,
label: "服务总数"
label: "服务总数",
},
{
value: 1,
label: "应用总数"
}
label: "应用总数",
},
],
app_url_arr: [[], ["creat_app", "check_app"], ["creat_app", "check_app"]],
app_head: [
......@@ -274,65 +307,65 @@ export default {
prop: "yymc",
label: "应用名称",
width: "90px",
align: "left"
align: "left",
},
{
prop: "yylx",
label: "应用类型",
width: "120px",
align: "center"
align: "center",
},
{
prop: "yybb",
label: "应用版本",
width: "80px",
align: "center"
align: "center",
},
{
prop: "yycjsj",
label: "应用创建时间",
width: "160px",
align: "center"
align: "center",
},
{
prop: "yybscs",
label: "被部署次数",
width: "100px",
align: "center"
}
align: "center",
},
],
[
{
prop: "yymc",
label: "应用名称",
width: "90px",
align: "left"
align: "left",
},
{
prop: "yylx",
label: "应用类型",
width: "120px",
align: "center"
align: "center",
},
{
prop: "yybb",
label: "应用版本",
width: "80px",
align: "center"
align: "center",
},
{
prop: "yyspsj",
label: "应用审批时间",
width: "160px",
align: "center"
align: "center",
},
{
prop: "spzt",
label: "审批状态",
width: "100px",
align: "center"
}
]
align: "center",
},
],
],
[
[
......@@ -340,76 +373,76 @@ export default {
prop: "yymc",
label: "应用名称",
width: "90px",
align: "left"
align: "left",
},
{
prop: "yylx",
label: "应用类型",
width: "120px",
align: "center"
align: "center",
},
{
prop: "yybb",
label: "应用版本",
width: "80px",
align: "center"
align: "center",
},
{
prop: "yycjsj",
label: "应用创建时间",
width: "160px",
align: "center"
align: "center",
},
{
prop: "yybscs",
label: "被部署次数",
width: "100px",
align: "center"
}
align: "center",
},
],
[
{
prop: "yymc",
label: "应用名称",
width: "90px",
align: "left"
align: "left",
},
{
prop: "yylx",
label: "应用类型",
width: "120px",
align: "center"
align: "center",
},
{
prop: "yybb",
label: "应用版本",
width: "80px",
align: "center"
align: "center",
},
{
prop: "yyspsj",
label: "应用审批时间",
width: "160px",
align: "center"
align: "center",
},
{
prop: "spzt",
label: "审批状态",
width: "100px",
align: "center"
}
]
]
align: "center",
},
],
],
],
service_url_arr: [
[
"nor_service_list",
"nor_apply_service",
"nor_service_sh",
"nor_cloud"
"nor_cloud",
],
["nor_service_list", "nor_service_sh", "nor_cloud"],
["nor_service_list", "nor_service_sh", "nor_cloud_manage"]
["nor_service_list", "nor_service_sh", "nor_cloud_manage"],
],
service_head: [
[
......@@ -418,117 +451,117 @@ export default {
prop: "fwmc",
label: "服务名称",
width: "250px",
align: "left"
align: "left",
},
{
prop: "fwlx",
label: "服务类型",
width: "120px",
align: "center"
align: "center",
},
{
prop: "zcfbsj",
label: "注册发布时间",
width: "200px",
align: "center"
align: "center",
},
{
prop: "bdycs",
label: "被调用次数",
width: "110px",
align: "center"
}
align: "center",
},
],
[
{
prop: "fwmc",
label: "服务名称",
width: "250px",
align: "left"
align: "left",
},
{
prop: "fwlx",
label: "服务类型",
width: "120px",
align: "center"
align: "center",
},
{
prop: "sqsj",
label: "申请时间",
width: "200px",
align: "center"
align: "center",
},
{
prop: "sqspzt",
label: "申请审批状态",
width: "110px",
align: "center"
}
align: "center",
},
],
[
{
prop: "fwmc",
label: "服务名称",
width: "250px",
align: "left"
align: "left",
},
{
prop: "fwlx",
label: "服务类型",
width: "120px",
align: "center"
align: "center",
},
{
prop: "spsj",
label: "审批时间",
width: "200px",
align: "center"
align: "center",
},
{
prop: "spzt",
label: "审批状态",
width: "110px",
align: "center"
}
align: "center",
},
],
[
{
prop: "gzqy",
label: "工作区域",
width: "150px",
align: "left"
align: "left",
},
{
prop: "wlhj",
label: "网络环境",
width: "120px",
align: "center"
align: "center",
},
{
prop: "cpu",
label: "CPU(核)",
width: "90px",
align: "center"
align: "center",
},
{
prop: "ncgb",
label: "内存(GB)",
width: "90px",
align: "center"
align: "center",
},
{
prop: "zyzlgb",
label: "资源总量(GB)",
width: "120px",
align: "center"
align: "center",
},
{
prop: "sqzt",
label: "申请状态",
width: "110px",
align: "center"
}
]
align: "center",
},
],
],
[
[
......@@ -536,83 +569,83 @@ export default {
prop: "fwmc",
label: "服务名称",
width: "140px",
align: "left"
align: "left",
},
{
prop: "fwlx",
label: "服务类型",
width: "120px",
align: "center"
align: "center",
},
{
prop: "zcfbsj",
label: "注册发布时间",
width: "180px",
align: "center"
align: "center",
},
{
prop: "bdycs",
label: "被调用次数",
width: "110px",
align: "center"
}
align: "center",
},
],
[
{
prop: "fwmc",
label: "服务名称",
width: "140px",
align: "left"
align: "left",
},
{
prop: "fwlx",
label: "服务类型",
width: "120px",
align: "center"
align: "center",
},
{
prop: "spsj",
label: "审批时间",
width: "180px",
align: "center"
align: "center",
},
{
prop: "spzt",
label: "审批状态",
width: "110px",
align: "center"
}
align: "center",
},
],
[
{
prop: "gzqy",
label: "工作区域",
width: "100px",
align: "left"
align: "left",
},
{
prop: "wlhj",
label: "网络环境",
width: "90px",
align: "center"
align: "center",
},
{
prop: "cpu",
label: "CPU(核)",
width: "80px",
align: "center"
align: "center",
},
{
prop: "ncgb",
label: "内存(GB)",
width: "80px",
align: "center"
align: "center",
},
{
prop: "zyzlgb",
label: "资源总量(GB)",
width: "110px",
align: "center"
align: "center",
},
{
prop: "sqzt",
......@@ -623,14 +656,14 @@ export default {
btnList: [
{
label: "分配",
type: "distribut"
type: "distribut",
},
{
label: "已分配",
}
]
}
]
},
],
},
],
],
[
[
......@@ -638,80 +671,80 @@ export default {
prop: "fwmc",
label: "服务名称",
width: "140px",
align: "left"
align: "left",
},
{
prop: "fwlx",
label: "服务类型",
width: "120px",
align: "center"
align: "center",
},
{
prop: "zcfbsj",
label: "注册发布时间",
width: "180px",
align: "center"
align: "center",
},
{
prop: "bdycs",
label: "被调用次数",
width: "110px",
align: "center"
}
align: "center",
},
],
[
{
prop: "fwmc",
label: "服务名称",
width: "140px",
align: "left"
align: "left",
},
{
prop: "fwlx",
label: "服务类型",
width: "120px",
align: "center"
align: "center",
},
{
prop: "spsj",
label: "审批时间",
width: "180px",
align: "center"
align: "center",
},
{
prop: "spzt",
label: "审批状态",
width: "110px",
align: "center"
}
align: "center",
},
],
[
{
prop: "sszz",
label: "所属组织",
width: "170px",
align: "left"
align: "left",
},
{
prop: "cpu",
label: "CPU使用量(核)",
width: "120px",
align: "center"
align: "center",
},
{
prop: "ncgb",
label: "内存使用量(GB)",
width: "130px",
align: "center"
align: "center",
},
{
prop: "gzqysl",
label: "工作区域数量(个)",
width: "130px",
align: "center"
}
]
]
align: "center",
},
],
],
],
fw_value: 0,
menu_arr: [
......@@ -721,25 +754,25 @@ export default {
pic: require("@/assets/imgs/ic_fuwuzs_navy.png"),
bg: "#e6ebfe",
color: "#515fe7",
type:"service",
num: ""
type: "service",
num: "",
},
{
text: "应用总数",
pic: require("@/assets/imgs/ic_yingyongzs.png"),
bg: "#e5f4fe",
color: "#38aef9",
type:'app',
num: ""
type: "app",
num: "",
},
{
text: "收益总额",
pic: require("@/assets/imgs/ic_shouyize.png"),
bg: "#fcefd6",
color: "#ea7d19",
type:'getMoney',
num: ""
}
type: "getMoney",
num: "",
},
],
[
{
......@@ -747,33 +780,33 @@ export default {
pic: require("@/assets/imgs/ic_yonghuzs.png"),
bg: "#e6ebfe",
color: "#515fe7",
type:'areaUser',
num: ""
type: "areaUser",
num: "",
},
{
text: "服务总数",
pic: require("@/assets/imgs/ic_fuwuzs.png"),
bg: "#e5f4fe",
color: "#38aef9",
type:'service',
num: ""
type: "service",
num: "",
},
{
text: "应用总数",
pic: require("@/assets/imgs/ic_yingyongzs.png"),
bg: "#e7fdfc",
color: "#25bdb1",
type:'app',
num: ""
type: "app",
num: "",
},
{
text: "收益总额",
pic: require("@/assets/imgs/ic_shouyize.png"),
bg: "#fcefd6",
color: "#ea7d19",
type:'getMoney',
num: ""
}
type: "getMoney",
num: "",
},
],
[
{
......@@ -781,142 +814,142 @@ export default {
pic: require("@/assets/imgs/ic_yonghuzs.png"),
bg: "#e6ebfe",
color: "#515fe7",
type:'allUser',
num: ""
type: "allUser",
num: "",
},
{
text: "服务总数",
pic: require("@/assets/imgs/ic_fuwuzs.png"),
bg: "#e5f4fe",
color: "#38aef9",
type:'service',
num: ""
type: "service",
num: "",
},
{
text: "应用总数",
pic: require("@/assets/imgs/ic_yingyongzs.png"),
bg: "#e7fdfc",
color: "#25bdb1",
type:'app',
num: ""
type: "app",
num: "",
},
{
text: "收益总额",
pic: require("@/assets/imgs/ic_shouyize.png"),
bg: "#fcefd6",
color: "#ea7d19",
type:'getMoney',
num: ""
}
]
type: "getMoney",
num: "",
},
],
],
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: [
["部署的应用", "创新的应用"],
["创新应用", "应用审批"],
["创新应用", "应用审批"]
["创新应用", "应用审批"],
],
app_arr: [],
manage_arr: [
{
pic: require("@/assets/imgs/home_tool_ic_key.png"),
text: "我的密钥",
role:0,
role: 0,
},
{
pic: require("@/assets/imgs/home_tool_ic_organize.png"),
text: "组织管理",
role:1,
role: 1,
},
{
pic: require("@/assets/imgs/home_tool_ic_key.png"),
text: "密钥管理",
role:1,
role: 1,
},
{
pic: require("@/assets/imgs/home_tool_ic_quanxian.png"),
text: "权限管理",
role:2,
role: 2,
},
{
pic: require("@/assets/imgs/home_tool_ic_quanxian.png"),
text: "容器管理",
role:2,
role: 2,
},
{
pic: require("@/assets/imgs/home_tool_ic_quanxian.png"),
text: "数据管控",
role:2,
role: 2,
},
{
pic: require("@/assets/imgs/home_tool_ic_quanxian.png"),
text: "消息新闻管理",
role:2,
}
]
role: 2,
},
],
};
},
components: {
tableUm
tableUm,
},
created(){
this.getUserData()
this.getAppData()
created() {
this.getUserData();
this.getAppData();
},
mounted() {
this.now_user = this.$store.state.role
getRole().then(data => {
this.now_user = this.$store.getters.level;
getRole().then((data) => {
this.now_user = data;
this.$store.commit('rolefun',data)
this.getInfoData()
this.$store.commit("rolefun", data);
this.getInfoData();
setTimeout(() => {
if (this.now_user == 0) {
this.getHealth();
......@@ -927,137 +960,118 @@ export default {
this.getappusedata();
} else if (this.now_user == 2) {
this.getoperatingdata();
this.getfwlxdata()
this.getyylxdata()
this.getfwlxdata();
this.getyylxdata();
}
}, 500);
});
},
methods: {
gotoyy(){
this.$router.push('/yygl/'+this.now_user)
gotoyy() {
this.$router.push("/yygl/" + this.now_user);
},
gotofw(){
this.$router.push('/fwgl/'+this.now_user)
gotofw() {
this.$router.push("/fwgl/" + this.now_user);
},
gotozc(){
this.$router.push('/fwzc/fwcs')
gotozc() {
this.$router.push("/fwzc/fwcs");
},
getUserData(){
getUserData() {
this.$http
.get('/static/workpalce.json')
.then(response => {
.get("/static/workpalce.json")
.then((response) => {
console.log(response);
let data = response.data.data
this.person = data.userdata.person
this.login_time = data.userdata.login_time
let data = response.data.data;
this.person = data.userdata.person;
this.login_time = data.userdata.login_time;
})
.catch(function(response) {
});
.catch(function(response) {});
},
getoperatingdata(){
getoperatingdata() {
this.$http
.get('/static/workpalce.json')
.then(response => {
.get("/static/workpalce.json")
.then((response) => {
console.log(response);
let data = response.data.data
let data = response.data.data;
this.init_yy(
data.operatingdata.xarr,
data.operatingdata.service_yarr,
data.operatingdata.app_yarr,
data.operatingdata.get_yarr,
data.operatingdata.get_yarr
);
})
.catch(function(response) {
});
.catch(function(response) {});
},
getappusedata(){
getappusedata() {
this.$http
.get('/static/workpalce.json')
.then(response => {
.get("/static/workpalce.json")
.then((response) => {
console.log(response);
let data = response.data.data
this.init_fwyy(
data.appusedata.xarr,
data.appusedata.yarr,
);
let data = response.data.data;
this.init_fwyy(data.appusedata.xarr, data.appusedata.yarr);
})
.catch(function(response) {
});
.catch(function(response) {});
},
getfwlxdata(){
getfwlxdata() {
this.$http
.get('/static/workpalce.json')
.then(response => {
.get("/static/workpalce.json")
.then((response) => {
console.log(response);
let data = response.data.data
this.init_fwlx_asy(
data.fwlxdata
);
let data = response.data.data;
this.init_fwlx_asy(data.fwlxdata);
})
.catch(function(response) {
});
.catch(function(response) {});
},
getyylxdata(){
getyylxdata() {
this.$http
.get('/static/workpalce.json')
.then(response => {
.get("/static/workpalce.json")
.then((response) => {
console.log(response);
let data = response.data.data
this.init_yylx_asy(
data.yylxdata
);
let data = response.data.data;
this.init_yylx_asy(data.yylxdata);
})
.catch(function(response) {
});
.catch(function(response) {});
},
getHealth(){
getHealth() {
this.$http
.get('/static/workpalce.json')
.then(response => {
.get("/static/workpalce.json")
.then((response) => {
console.log(response);
let data = response.data.data
let data = response.data.data;
this.init_health(data.health);
})
.catch(function(response) {
});
.catch(function(response) {});
},
getAppData(){
getAppData() {
this.$http
.get('/static/workpalce.json')
.then(response => {
.get("/static/workpalce.json")
.then((response) => {
console.log(response);
let data = response.data.data
this.app_arr = data.appdata
let data = response.data.data;
this.app_arr = data.appdata;
})
.catch(function(response) {
});
.catch(function(response) {});
},
getInfoData(){
getInfoData() {
this.$http
.get('/static/workpalce.json')
.then(response => {
.get("/static/workpalce.json")
.then((response) => {
console.log(response);
let data = response.data.data
this.menu_arr[this.now_user].forEach((e,idx) => {
if(data.infodata[e.type]){
this.$set(this.menu_arr[this.now_user][idx],'num',data.infodata[e.type])
let data = response.data.data;
this.menu_arr[this.now_user].forEach((e, idx) => {
if (data.infodata[e.type]) {
this.$set(
this.menu_arr[this.now_user][idx],
"num",
data.infodata[e.type]
);
}
});
})
.catch(function(response) {
});
.catch(function(response) {});
},
//分配接口调用
distribut(val){
distribut(val) {
console.log(val);
},
manage_func(n) {
......@@ -1070,15 +1084,15 @@ export default {
textStyle: {
color: "#000",
fontSize: 40,
fontWeight: 200
fontWeight: 200,
},
subtext: "健康占比",
subtextStyle: {
color: "#c9cedd"
color: "#c9cedd",
},
itemGap: -10, // 主副标题距离
left: "center",
top: "center"
top: "center",
},
angleAxis: {
max: 100, // 满分
......@@ -1086,37 +1100,37 @@ export default {
startAngle: 90,
// 隐藏刻度线
axisLine: {
show: false
show: false,
},
axisTick: {
show: false
show: false,
},
axisLabel: {
show: false
show: false,
},
splitLine: {
show: false
}
show: false,
},
},
radiusAxis: {
type: "category",
// 隐藏刻度线
axisLine: {
show: false
show: false,
},
axisTick: {
show: false
show: false,
},
axisLabel: {
show: false
show: false,
},
splitLine: {
show: false
}
show: false,
},
},
polar: {
center: ["50%", "50%"],
radius: "140%" //图形大小
radius: "140%", //图形大小
},
series: [
{
......@@ -1130,17 +1144,17 @@ export default {
normal: {
color: "#e56600",
shadowColor: "rgba(0, 0, 0, 0.2)",
shadowBlur: 20
}
}
}
shadowBlur: 20,
},
},
},
],
coordinateSystem: "polar",
roundCap: true,
barWidth: 10,
barGap: "-100%", // 两环重叠
z: 2
z: 2,
},
{
// 灰色环
......@@ -1152,17 +1166,17 @@ export default {
itemStyle: {
color: "#c9cedd",
shadowColor: "rgba(0, 0, 0, 0.2)",
shadowBlur: 20
}
}
shadowBlur: 20,
},
},
],
coordinateSystem: "polar",
roundCap: true,
barWidth: 10,
barGap: "-100%", // 两环重叠
z: 1
}
]
z: 1,
},
],
};
window[this.health] = echarts.init(document.getElementById(this.health));
window[this.health].setOption(options, true);
......@@ -1187,21 +1201,21 @@ export default {
white: {
color: "#ddd",
align: "center",
padding: [3, 0]
}
padding: [3, 0],
},
};
var placeHolderStyle = {
normal: {
label: {
show: false
show: false,
},
labelLine: {
show: false
show: false,
},
color: "rgba(0, 0, 0, 0)",
borderColor: "rgba(0, 0, 0, 0)",
borderWidth: 0
}
borderWidth: 0,
},
};
var data = [];
var color = ["#515fe7", "#36a5ec", "#da9f2a", "#23b2a7", "#d46002"];
......@@ -1216,14 +1230,14 @@ export default {
borderWidth: 5,
shadowBlur: 20,
borderColor: color[i],
shadowColor: color[i]
}
}
shadowColor: color[i],
},
},
},
{
value: 2,
name: "",
itemStyle: placeHolderStyle
itemStyle: placeHolderStyle,
}
);
legendarr.push(scaleData[i].name);
......@@ -1255,18 +1269,18 @@ export default {
return "";
}
},
rich: rich
}
}
rich: rich,
},
},
},
data: data,
},
data: data
}
];
var options = {
color: color,
tooltip: {
show: false
show: false,
},
legend: {
bottom: -5,
......@@ -1275,17 +1289,17 @@ export default {
itemHeight: 10,
orient: "horizontal",
data: legendarr,
backgroundColor: "#f4f7fc"
backgroundColor: "#f4f7fc",
},
toolbox: {
show: false
show: false,
},
series: seriesObj
series: seriesObj,
};
return options;
},
init_yy(xarr,service,app,get) {
init_yy(xarr, service, app, get) {
var colors = ["#e56600", "#c9cedd", "#515fe7"];
var options = {
......@@ -1294,28 +1308,28 @@ export default {
tooltip: {
trigger: "axis",
axisPointer: {
type: "cross"
}
type: "cross",
},
},
grid: {
top: "20",
bottom: "45"
bottom: "45",
},
legend: {
data: ["服务调用总数", "应用部署总数", "收益总额"],
bottom: 0,
itemWidth: 10,
itemHeight: 10,
backgroundColor: "#f4f7fc"
backgroundColor: "#f4f7fc",
},
xAxis: [
{
type: "category",
axisTick: {
alignWithLabel: true
alignWithLabel: true,
},
data: xarr,
},
data: xarr
}
],
yAxis: [
{
......@@ -1325,9 +1339,9 @@ export default {
position: "right",
axisLine: {
lineStyle: {
color: colors[1]
}
}
color: colors[1],
},
},
},
{
type: "value",
......@@ -1336,10 +1350,10 @@ export default {
position: "left",
axisLine: {
lineStyle: {
color: colors[1]
}
}
}
color: colors[1],
},
},
},
],
series: [
{
......@@ -1349,9 +1363,9 @@ export default {
data: service,
itemStyle: {
barBorderRadius: 6,
color: colors[2]
color: colors[2],
},
barWidth: 12
barWidth: 12,
},
{
name: "应用部署总数",
......@@ -1360,9 +1374,9 @@ export default {
data: app,
itemStyle: {
barBorderRadius: 6,
color: colors[0]
color: colors[0],
},
barWidth: 12
barWidth: 12,
},
{
name: "收益总额",
......@@ -1370,59 +1384,59 @@ export default {
yAxisIndex: 0,
data: get,
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(xarr,yarr) {
init_fwyy(xarr, yarr) {
var dataname = ["服务总数", "应用总数"];
var options = {
tooltip: {
trigger: "axis",
axisPointer: {
label: {
backgroundColor: "#fff"
}
}
backgroundColor: "#fff",
},
},
},
legend: {
data: [dataname[0]],
itemWidth: 14,
itemHeight: 10,
bottom: 0
bottom: 0,
},
grid: {
borderColor: "#f2f2f2",
top: 20,
bottom: 45,
right: 0
right: 0,
},
xAxis: {
type: "category",
axisTick: { show: false },
axisLine: { show: false },
nameTextStyle: {
color: "#0d1847"
color: "#0d1847",
},
data: xarr
data: xarr,
},
yAxis: {
type: "value",
axisLine: {
show: false,
lineStyle: {
color: "#c9cedd"
}
color: "#c9cedd",
},
},
axisTick: { show: false },
nameTextStyle: {
color: "#f2f2f2"
}
color: "#f2f2f2",
},
},
series: [
{
......@@ -1433,31 +1447,30 @@ export default {
sampling: "average",
symbol: "circle",
itemStyle: {
color: "#0a92c4"
color: "#0a92c4",
},
areaStyle: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
{
offset: 0,
color: "#0a92c4"
color: "#0a92c4",
},
{
offset: 1,
color: "#ffe"
}
])
}
}
]
color: "#ffe",
},
]),
},
},
],
};
window[this.fwyy] = echarts.init(document.getElementById(this.fwyy));
window[this.fwyy].setOption(options, true);
}
}
},
},
};
</script>
<style>
.online_tool .el-scrollbar__wrap {
overflow-x: hidden;
......@@ -1696,7 +1709,7 @@ export default {
margin: 10px 20px 40px 0px;
text-align: center;
}
.myapp_contain .myapp_box:nth-of-type(3n){
.myapp_contain .myapp_box:nth-of-type(3n) {
margin-right: 0;
}
.myapp_box p:nth-of-type(1) {
......
src/store/index.js
View file @ 10a908b0
......@@ -4,7 +4,8 @@ Vue.use(Vuex);
const store = new Vuex.Store({
state: {
role: 2, // 0：普通用户，1：组织管理员，2：超级管理员
role: 0, // 0：普通用户，1：组织管理员，2：超级管理员
userInfo: null, // 用户信息
serviceShopMenu: "/shop/data_service_list", // 服务超市侧边栏
fwglNav: [
["注册发布的服务", "申请的服务" /* , "云资源服务" */], // 普通用户
......@@ -19,8 +20,26 @@ const store = new Vuex.Store({
shoppingCart: [], //购物车
menuCartState: 0, //购物车操作都要修改这个值，menu监听这个值的变化实时获取购物车列表
},
modules: {},
getters: {
// 1：超管 2：组织管理员 3：普通用户 4：开发者
is_admin: (state) => {
return (state.userInfo && state.userInfo.is_admin) || 3;
},
// 0：普通用户，1：组织管理员，2：超级管理员
level: (state, getters) => {
if (getters.is_admin == 1) {
return 2;
} else if (getters.is_admin == 2) {
return 1;
} else {
return 0;
}
},
},
mutations: {
userInfofun(state, newValue) {
state.userInfo = newValue;
},
rolefun(state, newValue) {
state.role = newValue;
},
......@@ -32,7 +51,7 @@ const store = new Vuex.Store({
},
setMenuCartState(state) {
state.menuCartState++;
}
},
},
});
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment