|
@@ -1,23 +1,18 @@
|
|
|
<template>
|
|
|
- <!-- <div id="service" :style="{ height: height + 'px' }"> -->
|
|
|
<div id="service">
|
|
|
- <!-- @sort-change="handleSortChang" 需要后端进行排序时使用 :default-sort = "{prop: 'total', order: 'descending'}"-->
|
|
|
<el-table
|
|
|
v-loading="loading"
|
|
|
:data="serveceMapListFavor"
|
|
|
- @row-click="handleRowClick"
|
|
|
+ @row-click="handleRowClick"
|
|
|
>
|
|
|
<el-table-column header-align="left" label="接口名" prop="name" align="left" :show-overflow-tooltip="true"/>
|
|
|
- <!-- <el-table-column header-align="center" label="URL组" prop="url" align="left" :show-overflow-tooltip="true" /> -->
|
|
|
<el-table-column header-align="center" label="rpm" prop="rpm" sortable align="center" :show-overflow-tooltip="true" width='80'>
|
|
|
<template slot-scope="scope">
|
|
|
- <!-- <span>{{ Number(scope.row.rpm).toFixed(2)}}</span> -->
|
|
|
<el-tag>{{ Number(scope.row.rpm).toFixed(2)}}</el-tag>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
<el-table-column header-align="center" label="count" prop="total" sortable align="center" width="100">
|
|
|
<template slot-scope="scope">
|
|
|
- <!-- <span>{{ Number(scope.row.rpm).toFixed(2)}}</span> -->
|
|
|
<el-tag>{{ Number(scope.row.total).toFixed(2)}}</el-tag>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
@@ -27,40 +22,12 @@
|
|
|
<el-tag v-else type="danger">{{ Number(scope.row.error_rate).toFixed(2)}}</el-tag>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
- <!-- <el-table-column header-align="center" label="max(ms)" sortable prop="duration_stats" align="center" width="100">
|
|
|
- <template slot-scope="scope">
|
|
|
- <span>{{ Number(scope.row.max).toFixed(2)}}</span>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column header-align="center" label="avg(ms)" sortable prop="duration_stats" align="center" width="100">
|
|
|
- <template slot-scope="scope">
|
|
|
- <span>{{ Number(scope.row.avg).toFixed(2)}}</span>
|
|
|
- </template>
|
|
|
- </el-table-column> -->
|
|
|
<el-table-column header-align="center" label="延迟比例" prop="duration_stats" align="center">
|
|
|
<template slot-scope="scope">
|
|
|
{{ drawEchartsp(scope.row, scope.$index, 'service') }}
|
|
|
<div :id="`tiger-service-trend-index` + scope.$index" class="tiger-trend-charts"></div>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
- <!-- <el-table-column header-align="center" label="P.50" prop="duration_stats" align="center">
|
|
|
- <template slot-scope="scope">
|
|
|
- {{ drawEchartsp5(scope.row, scope.$index, 'five') }}
|
|
|
- <div :id="`tiger-five-trend-index` + scope.$index" class="tiger-trend-charts"></div>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column header-align="center" label="P.95" prop="duration_stats" align="center">
|
|
|
- <template slot-scope="scope">
|
|
|
- {{ drawEchartsp9(scope.row, scope.$index, 'nine') }}
|
|
|
- <div :id="`tiger-nine-trend-index` + scope.$index" class="tiger-trend-charts"></div>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column header-align="center" label="P.99" prop="duration_stats" align="center">
|
|
|
- <template slot-scope="scope">
|
|
|
- {{ drawEchartsp99(scope.row, scope.$index, 'ninety') }}
|
|
|
- <div :id="`tiger-ninety-trend-index` + scope.$index" class="tiger-trend-charts"></div>
|
|
|
- </template>
|
|
|
- </el-table-column> -->
|
|
|
</el-table>
|
|
|
|
|
|
<el-drawer
|
|
@@ -105,16 +72,6 @@
|
|
|
<el-tag v-if="scope.row.duration<2000" type="info">{{ scope.row.duration }}</el-tag>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
- <!-- <el-table-column header-align="center" label="max(ms)" sortable="custom" prop="duration_stats" align="center" width="100">
|
|
|
- <template slot-scope="scope">
|
|
|
- <span>{{ Number(scope.row.max).toFixed(2)}}</span>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column header-align="center" label="avg(ms)" sortable="custom" prop="duration_stats" align="center" width="100">
|
|
|
- <template slot-scope="scope">
|
|
|
- <span>{{ Number(scope.row.avg).toFixed(2)}}</span>
|
|
|
- </template>
|
|
|
- </el-table-column> -->
|
|
|
</el-table>
|
|
|
<pagination
|
|
|
v-show="total>0"
|
|
@@ -129,10 +86,8 @@
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
-import { listUrlMapping, addUrlMapping, getUrlMapping, updateUrlMapping, delUrlMapping, favor,getUrlMappingRange,favorList } from '@/api/mapping'
|
|
|
-import { formatJson } from '@/utils'
|
|
|
+import { getUrlMappingRange,favorList } from '@/api/mapping'
|
|
|
import storage from '@/utils/storage'
|
|
|
-import bus from '@/utils/bus'
|
|
|
|
|
|
import { getToken } from '@/utils/auth'
|
|
|
// import echarts from 'echarts'
|
|
@@ -267,7 +222,7 @@ export default {
|
|
|
})
|
|
|
},
|
|
|
goto(row){
|
|
|
-
|
|
|
+
|
|
|
let datetime = Date.parse(row.datetime)/1000;
|
|
|
let href = this.$router.resolve({
|
|
|
path:'/latency/index',
|
|
@@ -284,11 +239,11 @@ export default {
|
|
|
},
|
|
|
handleRowClick(row, column, event){
|
|
|
this.drawer=true;
|
|
|
- this.$nextTick(() =>{
|
|
|
+ this.$nextTick(() =>{
|
|
|
this.drawEchartsScale(row);
|
|
|
- })
|
|
|
+ })
|
|
|
setTimeout(()=>{
|
|
|
-
|
|
|
+
|
|
|
this.childQueryParams.id = row.id;
|
|
|
this.childQueryParams.kind = row.kind;
|
|
|
this.handelgetUrlMappingRange();
|
|
@@ -404,7 +359,7 @@ export default {
|
|
|
// }
|
|
|
let data = storage.get('paramsValue')
|
|
|
let timestamp = moment(data[0].name).unix();
|
|
|
-
|
|
|
+
|
|
|
_this.childQueryParams.start_time = timestamp
|
|
|
_this.childQueryParams.end_time =timestamp
|
|
|
_this.handelgetUrlMappingRange();
|
|
@@ -416,7 +371,7 @@ export default {
|
|
|
},timeOut)
|
|
|
},
|
|
|
handleSortChang(column, prop, order) {
|
|
|
-
|
|
|
+
|
|
|
prop = column.prop
|
|
|
order = column.order
|
|
|
if (this.order !== '' && this.order !== prop + 'Order') {
|