Skip to content

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

应用数据分析

parent 542089ec
Hide whitespace changes
Inline Side-by-side
Showing with 214 additions and 35 deletions
src/pages/data-analysis/my-application.vue
View file @ 0a6d623c
......@@ -9,11 +9,11 @@
<el-col :span="6" class="in_left">
<el-row>
<el-col :span="24" class="in_block">
<block-radius :show_header="true" title="服务总体概况" class="block">
<block-radius :show_header="true" title="应用总体概况" class="block">
<div class="left_1">
<div ref="left_1_l" class="left_1_l">
<img :src="require('@/assets/imgs/data_img_service.gif')" class="left_1_img" />
<div class="left_1_title">服务总数</div>
<div class="left_1_title">应用总数</div>
<div class="left_1_num">2222</div>
</div>
<dashboard ref="left_1_r" :data="das_data" :is_word="true" class="left_1_r"></dashboard>
......@@ -23,7 +23,7 @@
<el-col :span="24" class="in_block">
<block-radius
:show_header="true"
title="服务调用次数分析"
title="应用调用次数分析"
:buttons_arr="['近7天', '近30天']"
@changeButton="changeServiceCellBtn"
class="block"
......@@ -34,12 +34,12 @@
<el-col :span="24" class="in_block">
<block-radius
:show_header="true"
title="服务类型分析"
:buttons_arr="['发布的服务', '调用的服务']"
title="应用类型分析"
:buttons_arr="['发布的应用', '调用的应用']"
@changeButton="changeServiceTypeBtn"
class="block"
>
<multiple-circle :data="mult_data" :text="text"></multiple-circle>
<multiple-circle class="block-radius-content" :data="mult_data" :text="text"></multiple-circle>
</block-radius>
</el-col>
</el-row>
......@@ -53,8 +53,14 @@
<block-radius class="block"></block-radius>
</el-col>
<el-col :span="24" class="in_block">
<block-radius class="block">
<line-chart :data="line_data"></line-chart>
<block-radius
class="block"
:show_header="true"
title="应用总数变化趋势"
:buttons_arr="['近14天', '近30天']"
@changeButton="changeAppTotalChangeBtn"
>
<line-chart class="block-radius-content" :data="line_data"></line-chart>
</block-radius>
</el-col>
</el-row>
......@@ -62,25 +68,55 @@
<el-col :span="6" class="in_right">
<el-row>
<el-col :span="24" class="in_block">
<block-radius class="block">
<toplist></toplist>
<block-radius
:show_header="true"
title="应用部署排名分析"
:buttons_arr="['被部署次数', '被部署次数']"
@changeButton="changeServeiceApplyCountBtn"
class="block"
>
<toplist
class="block-radius-content"
:options="toplistData"
:target-value="toplistTargetValue"
></toplist>
</block-radius>
</el-col>
<el-col :span="24" class="in_block">
<block-radius class="block">
<starlist></starlist>
<block-radius
:show_header="true"
title="应用评价及评分"
:buttons_arr="['应用评价', '应用评分']"
@changeButton="changeAppInfoBtn"
class="block"
>
<commentlist
v-if="appInfoBtnIndex == 0"
class="block-radius-content"
:data="commentlistData"
></commentlist>
<starlist
v-else
class="block-radius-content"
:options="starlistData"
style="margin-top: 30px;height: calc(100% - 51px);"
></starlist>
</block-radius>
</el-col>
<el-col :span="24" class="in_block">
<block-radius class="block">
<single-circle :data="single_data"></single-circle>
<block-radius
class="block"
:show_header="true"
title="应用在线区域统计"
>
<single-circle class="block-radius-content" :data="single_data"></single-circle>
</block-radius>
</el-col>
</el-row>
</el-col>
<!-- 不可横向铺满，一般为最后一行 -->
<el-col :span="6" class="in_block">
<block-radius :show_header="true" title="服务来源机构分析" class="block">
<block-radius :show_header="true" title="应用来源机构分析" class="block">
<BarChart :data="bar_data_org" :colors="['#e56600', '#e56600']" />
</block-radius>
</el-col>
......@@ -101,6 +137,7 @@ import singleCircle from "@/components/e-charts/single_circle";
import lineChart from "@/components/e-charts/line_chart";
import Toplist from "@/components/e-charts/toplist";
import Starlist from "@/components/e-charts/starlist";
import Commentlist from "@/components/e-charts/commentlist";
import BarChart from "@/components/e-charts/bar-chart";
import Graph from "@/components/e-charts/graph";
export default {
......@@ -111,6 +148,7 @@ export default {
singleCircle,
Toplist,
Starlist,
Commentlist,
lineChart,
BarChart,
Graph
......@@ -187,18 +225,137 @@ export default {
[100, 1210, 130, 1530, 160, 120, 110, 1200]
],
legend: ["aaa1", "bbb1"]
}
},
toplistData: [
{
name: "报警应用",
value: 2031,
logo:
"https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg",
unit: "次"
},
{
name: "数据应用",
value: 2201,
logo:
"https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg",
unit: "次"
},
{
name: "消息队列应用",
value: 1901,
logo:
"https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg",
unit: "次"
},
{
name: "档案中心应用",
value: 1400,
logo:
"https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg",
unit: "次"
},
{
name: "哈哈应用",
value: 1280,
logo:
"https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg",
unit: "次"
}
], // 应用部署排名分析
toplistTargetValue: 2400, // 应用部署排名分析 目标值
appInfoBtnIndex: 0,
commentlistData: [
{
add_time: "2020-07-14T16:35:40Z",
content: "1111111111111111",
id: 36,
picture_path:
"/apaas/static/docs/image/image/blob_cb30e7a3-3184-42dd-9e2f-7e6b69accb0c.blob",
score: 5,
service_id: 128,
user_name: "普通用户lxy"
},
{
add_time: "2020-07-14T16:35:40Z",
content: "1111111111111111",
id: 36,
picture_path:
"/apaas/static/docs/image/image/blob_cb30e7a3-3184-42dd-9e2f-7e6b69accb0c.blob",
score: 4,
service_id: 128,
user_name: "普通用户lxy"
},
{
add_time: "2020-07-14T16:35:40Z",
content: "1111111111111111",
id: 36,
picture_path:
"/apaas/static/docs/image/image/blob_cb30e7a3-3184-42dd-9e2f-7e6b69accb0c.blob",
score: 3,
service_id: 128,
user_name: "普通用户lxy"
},
{
add_time: "2020-07-14T16:35:40Z",
content: "1111111111111111",
id: 36,
picture_path:
"/apaas/static/docs/image/image/blob_cb30e7a3-3184-42dd-9e2f-7e6b69accb0c.blob",
score: 2,
service_id: 128,
user_name: "普通用户lxy"
}
], // 应用评价
starlistData: [
{
star: 5,
count: 5,
unit: "个"
},
{
star: 4,
count: 4,
unit: "个"
},
{
star: 3,
count: 3,
unit: "个"
},
{
star: 2,
count: 10002,
unit: "个"
},
{
star: 1,
count: 1,
unit: "个"
}
], // 应用评分
}),
mounted() {},
methods: {
changeServiceTypeBtn(index) {
console.log(index);
console.log("应用类型分析: " + index);
},
changeApplicationFieldBtn(index) {
console.log(index);
console.log("xxx: " + index);
},
changeServiceCellBtn(index) {
console.log(index);
console.log("应用调用次数分析: " + index);
},
changeServeiceApplyCountBtn(index) {
console.log("应用部署排名分析: " + index);
},
changeAppInfoBtn(index) {
this.appInfoBtnIndex = index;
console.log("应用评价及评分: " + index);
},
changeAppTotalChangeBtn(index) {
console.log("应用总数变化趋势: " + index);
}
}
};
......@@ -265,4 +422,8 @@ export default {
width: 330px;
height: 230px;
}
.block-radius-content {
height: calc(100% - 36px);
margin-top: 15px;
}
</style>
\ No newline at end of file
src/pages/data-analysis/my-service.vue
View file @ 0a6d623c
......@@ -39,7 +39,7 @@
@changeButton="changeServiceTypeBtn"
class="block"
>
<multiple-circle :data="mult_data" :text="text"></multiple-circle>
<multiple-circle class="block-radius-content" :data="mult_data" :text="text"></multiple-circle>
</block-radius>
</el-col>
<el-col :span="24" class="in_block">
......@@ -84,7 +84,7 @@
<div class="right-content">
<apass-table
class="hot-search-table"
:header="hotSearchHeader"
:header="hotSearchHeader"
:data="hotSearchData"
:padding-left="0"
@sort-change="hotSearchSortChange"
......@@ -94,8 +94,14 @@
</block-radius>
</el-col>
<el-col :span="24" class="in_block">
<block-radius class="block">
<line-chart :data="line_data"></line-chart>
<block-radius
class="block"
:show_header="true"
title="服务总数变化趋势"
:buttons_arr="['近14天', '近30天']"
@changeButton="changeServeiceTotalChangeBtn"
>
<line-chart class="block-radius-content" :data="line_data"></line-chart>
</block-radius>
</el-col>
</el-row>
......@@ -129,8 +135,14 @@
</block-radius>
</el-col>
<el-col :span="24" class="in_block">
<block-radius class="block">
<single-circle :data="single_data"></single-circle>
<block-radius
:show_header="true"
title="服务开放程度统计"
:buttons_arr="['发布的服务', '调用的服务']"
@changeButton="changeOpenessBtnindex"
class="block"
>
<single-circle class="block-radius-content" :data="single_data"></single-circle>
</block-radius>
</el-col>
<el-col :span="24" class="in_block">
......@@ -179,7 +191,7 @@ import singleCircle from "@/components/e-charts/single_circle";
import lineChart from "@/components/e-charts/line_chart";
import Toplist from "@/components/e-charts/toplist";
import Starlist from "@/components/e-charts/starlist";
import commentlist from "@/components/e-charts/commentlist";
import Commentlist from "@/components/e-charts/commentlist";
import BarChart from "@/components/e-charts/bar-chart";
import ApassTable from "@/components/apass-table";
import Graph from "@/components/e-charts/graph";
......@@ -190,7 +202,7 @@ export default {
multipleCircle,
singleCircle,
Toplist,
commentlist,
Commentlist,
Starlist,
lineChart,
BarChart,
......@@ -460,24 +472,30 @@ export default {
console.log("查看热搜详情");
},
hotSearchSortChange(sortInfo) {
console.log(sortInfo);
console.log("服务热门搜索: " + sortInfo);
},
changeServiceTypeBtn(index) {
console.log(index);
console.log("服务类型分析:" + index);
},
changeApplicationFieldBtn(index) {
console.log(index);
console.log("服务应用领域统计: " + index);
},
changeServeiceApplyCountBtn(index) {
console.log(index);
}, // 服务调用排名分析
console.log("服务调用排名分析: " + index);
},
changeServeiceInfoBtn(index) {
this.serveiceInfoBtnIndex = index;
console.log(index);
}, // 服务评价及评分
console.log("服务评价及评分: " + index);
},
changeOpenessBtnindex(index) {
console.log("服务开放程度统计: " + index);
},
changeServiceCellBtn(index) {
console.log(index);
console.log("服务调用次数分析: " + index);
},
changeServeiceTotalChangeBtn(index) {
console.log("服务总数变化趋势: " + index);
}
}
};
......
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