Merge branch 'hi-ucs-dev' of http://15.2.21.221:3000/wuhongjian/hi-ucs into hi-ucs-dev

back/src/views/modules/sys/CapabilityOperationMonitoring/components/AnalysisOfTheRequest.vue

@@ -1,22 +1,68 @@
+<!-- API请求分析 -->
 <template>
-  <div class="wrapper">请求分析</div>
+  <div class="analysis-of-the-request">
+    <div class="analysis-of-the-request-title">API请求分析</div>
+    <div class="analysis-of-the-request-content">
+      <!-- 请求概况 -->
+      <div class="request-overview">
+        <div class="analysis-of-the-request-content-title">请求概况</div>
+        <div class="request-overview-content"></div>
+      </div>
+      <!-- 能力请求趋势 -->
+      <div>
+        <div></div>
+        <div></div>
+      </div>
+      <!-- 能力排行榜 -->
+      <div></div>
+    </div>
+  </div>
 </template>
 
 <script>
 export default {
   components: {},
   props: {},
-  data() {
+  data () {
-    return {};
+    return {
+      requestOverviewData: [
+        { name: '请求次数', tatol: '99999' },
+        { name: '请求成功次数', tatol: '99999' },
+        { name: '请求失败次数', tatol: '99999' },
+        { name: '平均时延', tatol: '99999' }
+      ] // 请求概况初始化数据
+    }
   },
   watch: {},
   computed: {},
   methods: {},
-  created() {},
+  created () {},
-  mounted() {},
+  mounted () {}
-};
+}
 </script>
 <style lang="scss" scoped>
-.wrapper {
+.analysis-of-the-request {
+  width: 100%;
+  background: #ffffff;
+  padding: 20px;
+  border-radius: 6px;
+  .analysis-of-the-request-title {
+    font-size: 18px;
+    line-height: 18px;
+    color: #333333;
+    margin-bottom: 15px;
+  } //API请求样式
+  .analysis-of-the-request-content-title {
+    font-size: 14px;
+    line-height: 14px;
+    color: #5a83ae;
+    margin-bottom: 20px;
+    font-weight: bold;
+  } //共享二级title样式
+  .request-overview {
+    margin-right: 80px;
+    .request-overview-content {
+    }
+  }
 }
 </style>

back/src/views/modules/sys/CapabilityOperationMonitoring/index.vue

@@ -14,25 +14,25 @@
 </template>
 
 <script>
-import AbnormalSituation from "./components/AbnormalSituation.vue";
+import AbnormalSituation from './components/AbnormalSituation.vue'
-import AnalysisOfTheRequest from "./components/AnalysisOfTheRequest.vue";
+import AnalysisOfTheRequest from './components/AnalysisOfTheRequest.vue'
-import CapabilityOperationMonitoringTime from "./components/CapabilityOperationMonitoringTime.vue";
+import CapabilityOperationMonitoringTime from './components/CapabilityOperationMonitoringTime.vue'
 export default {
   components: {
     AbnormalSituation,
     AnalysisOfTheRequest,
-    CapabilityOperationMonitoringTime,
+    CapabilityOperationMonitoringTime
   },
   props: {},
-  data() {
+  data () {
-    return {};
+    return {}
   },
   watch: {},
   computed: {},
   methods: {},
-  created() {},
+  created () {},
-  mounted() {},
+  mounted () {}
-};
+}
 </script>
 <style lang="scss" scoped>
 .wrapper {