[incubator-shardingsphere-benchmark] branch master updated: feature[shadingsphere-benchmark-ui]: Add promotion_test

[zh...@apache.org]

This is an automated email from the ASF dual-hosted git repository.

zhaoyanan pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/incubator-shardingsphere-benchmark.git


The following commit(s) were added to refs/heads/master by this push:
     new a5445cc  feature[shadingsphere-benchmark-ui]: Add promotion_test
     new fd74538  Merge pull request #25 from wqzwh/master
a5445cc is described below

commit a5445cc943df0fa9e74bea6785e93a47945794ff
Author: wqzwh <wa...@163.com>
AuthorDate: Fri Nov 15 14:43:43 2019 +0800

    feature[shadingsphere-benchmark-ui]: Add promotion_test
---
 shadingsphere-benchmark-ui/src/router/index.js     | 19 +++--
 shadingsphere-benchmark-ui/src/utils/page-apis.js  |  3 +-
 .../src/views/promotion_test/index.vue             | 87 ++++++++++++++++++++++
 3 files changed, 101 insertions(+), 8 deletions(-)

diff --git a/shadingsphere-benchmark-ui/src/router/index.js b/shadingsphere-benchmark-ui/src/router/index.js
index 7efb850..f55dea5 100644
--- a/shadingsphere-benchmark-ui/src/router/index.js
+++ b/shadingsphere-benchmark-ui/src/router/index.js
@@ -9,37 +9,42 @@ export const constantRouterMap = [
   },
   {
     path: '/overview',
-    component: () => import('@/views/overview/index'),
+    component: () => import('@/views/overview'),
     hidden: true
   },
   {
     path: '/encrypt_sharding_test',
-    component: () => import('@/views/encrypt_sharding_test/index'),
+    component: () => import('@/views/encrypt_sharding_test'),
     hidden: true
   },
   {
     path: '/encrypt_test',
-    component: () => import('@/views/encrypt_test/index'),
+    component: () => import('@/views/encrypt_test'),
     hidden: true
   },
   {
     path: '/loss_test',
-    component: () => import('@/views/loss_test/index'),
+    component: () => import('@/views/loss_test'),
     hidden: true
   },
   {
     path: '/master_slave_sharding_test',
-    component: () => import('@/views/master_slave_sharding_test/index'),
+    component: () => import('@/views/master_slave_sharding_test'),
     hidden: true
   },
   {
     path: '/master_slave_test',
-    component: () => import('@/views/master_slave_test/index'),
+    component: () => import('@/views/master_slave_test'),
     hidden: true
   },
   {
     path: '/sharding_test',
-    component: () => import('@/views/sharding_test/index'),
+    component: () => import('@/views/sharding_test'),
+    hidden: true
+  },
+  {
+    path: '/promotion_test',
+    component: () => import('@/views/promotion_test'),
     hidden: true
   }
 ]
diff --git a/shadingsphere-benchmark-ui/src/utils/page-apis.js b/shadingsphere-benchmark-ui/src/utils/page-apis.js
index 1f3b7d3..0fd174b 100644
--- a/shadingsphere-benchmark-ui/src/utils/page-apis.js
+++ b/shadingsphere-benchmark-ui/src/utils/page-apis.js
@@ -9,5 +9,6 @@ export default {
   getMasterSlaveShardingTestData: () =>
     API.get(`/jtl_json/master_slave_sharding_test.json`),
   getMasterSlaveTest: () => API.get(`/jtl_json/master_slave_test.json`),
-  getShardingTest: () => API.get(`/jtl_json/sharding_test.json`)
+  getShardingTest: () => API.get(`/jtl_json/sharding_test.json`),
+  getPromotionTest: () => API.get(`/jtl_json/promotion_test.json`)
 }
diff --git a/shadingsphere-benchmark-ui/src/views/promotion_test/index.vue b/shadingsphere-benchmark-ui/src/views/promotion_test/index.vue
new file mode 100644
index 0000000..4b8fdb3
--- /dev/null
+++ b/shadingsphere-benchmark-ui/src/views/promotion_test/index.vue
@@ -0,0 +1,87 @@
+<template>
+  <Row :gutter="16" style="background:#eee; padding:20px">
+    <Col
+      v-for="(value, name, index) in series"
+      :key="index"
+      :xs="24"
+      :sm="24"
+      :md="24"
+      :lg="24"
+      :xl="24"
+      :xxl="12"
+      class="col-item"
+    >
+      <Card :bordered="false">
+        <p slot="title" style="font-size: 18px">{{ name.toLowerCase() }}</p>
+        <v-chart :options="getOptions(name)" />
+        <Table
+          :columns="columns"
+          :data="[desc[name]]"
+          size="large"
+          style="margin-top: 20px;"
+          border
+        />
+      </Card>
+    </Col>
+    <div v-show="loading" class="spin-container">
+      <Spin fix>
+        <Icon type="ios-loading" size="18" class="spin-icon-load" />
+        <div>Loading</div>
+      </Spin>
+    </div>
+  </Row>
+</template>
+
+<script>
+import ECharts from 'vue-echarts'
+import 'echarts/lib/chart/line'
+import 'echarts/lib/component/tooltip'
+import 'echarts/lib/component/legend'
+import 'echarts/lib/component/title'
+import apis from '../../utils/page-apis'
+import { mountedMixin } from '../../utils/mixin'
+import { getLineOptions } from '../../utils/line'
+
+export default {
+  name: 'PromotionTest',
+  components: {
+    'v-chart': ECharts
+  },
+  mixins: [mountedMixin],
+  data() {
+    return {
+      data: []
+    }
+  },
+  mounted() {
+    this.loading = true
+    apis.getPromotionTest().then(res => {
+      this.formatData(res)
+      this.loading = false
+    })
+  },
+  methods: {
+    getOptions(name) {
+      return getLineOptions(name, this.xAxis, this.legend, this.series)
+    }
+  }
+}
+</script>
+<style>
+.echarts {
+  width: 100%;
+  height: 400px;
+}
+.col-item {
+  margin-bottom: 16px;
+}
+.ivu-form-item {
+  margin-bottom: 10px !important;
+}
+.ivu-form-item-label {
+  font-size: 15px !important;
+}
+.ivu-form-item-content {
+  font-size: 14px !important;
+}
+</style>