Skip to content

M
mindinsight

MindSpore / mindinsight

通知 8
Star 3
Fork 2
M
mindinsight
提交 a171ba42 编写于 作者: M mindspore-ci-bot 提交者： Gitee
浏览文件
操作

!597 AI CPU Optimization: support type and all tab 

Merge pull request !597 from 潘慧/master_ph
上级 0556d862 dcd80f20
显示空白变更内容
内联 并排
Showing with 397 addition and 130 deletion
mindinsight/ui/src/views/profiling-gpu/operator.vue
浏览文件 @ a171ba42
...@@ -1152,17 +1152,18 @@ export default { ...@@ -1152,17 +1152,18 @@ export default {
margin-right: 20px; margin-right: 20px;
} }
.cl-profiler-top { .cl-profiler-top {
height: 45%; height: 47%;
.chart-title { .chart-title {
float: left; float: left;
font-weight: bold; font-weight: bold;
height: 32px;
} }
} }
.cl-profiler-top.fullScreen { .cl-profiler-top.fullScreen {
display: none; display: none;
} }
.cl-profiler-bottom { .cl-profiler-bottom {
height: 55%; height: 53%;
padding-top: 10px; padding-top: 10px;
.fullScreen { .fullScreen {
float: right; float: right;
...@@ -1189,16 +1190,16 @@ export default { ...@@ -1189,16 +1190,16 @@ export default {
width: 100%; width: 100%;
height: 100%; height: 100%;
min-width: 1300px; min-width: 1300px;
min-height: 306px; min-height: 321px;
overflow: hidden; overflow: hidden;
} }
} }
.core-tab { .core-tab {
.cl-profiler-top { .cl-profiler-top {
height: 45%; height: 47%;
} }
.cl-profiler-bottom { .cl-profiler-bottom {
height: 55%; height: 53%;
} }
.cl-profiler-echarts { .cl-profiler-echarts {
height: calc(100% - 32px); height: calc(100% - 32px);
......
mindinsight/ui/src/views/profiling-gpu/profiling-dashboard.vue
浏览文件 @ a171ba42
...@@ -430,9 +430,7 @@ export default { ...@@ -430,9 +430,7 @@ export default {
RequestService.queryTimeline(params) RequestService.queryTimeline(params)
.then((res) => { .then((res) => {
if (res && res.data && res.data.length) { if (res && res.data && res.data.length) {
this.timeLine.data = this.stringToUint8Array( this.timeLine.data = JSON.stringify(res.data);
JSON.stringify(res.data),
);
this.timeLine.waiting = false; this.timeLine.waiting = false;
} }
}) })
......
mindinsight/ui/src/views/profiling/operator.vue
浏览文件 @ a171ba42
...@@ -22,7 +22,7 @@ limitations under the License. ...@@ -22,7 +22,7 @@ limitations under the License.
<el-tab-pane label="AI CORE" <el-tab-pane label="AI CORE"
name="core"> name="core">
<div class="cl-profiler-top" <div class="cl-profiler-top"
:class="{fullScreen:fullScreen}" :class="{fullScreen:coreFullScreen}"
v-if="coreCharts.data.length"> v-if="coreCharts.data.length">
<div> <div>
<div class="chart-title">{{$t('profiling.chartTitle')}}</div> <div class="chart-title">{{$t('profiling.chartTitle')}}</div>
...@@ -45,14 +45,14 @@ limitations under the License. ...@@ -45,14 +45,14 @@ limitations under the License.
</div> </div>
</div> </div>
<div class="cl-profiler-bottom" <div class="cl-profiler-bottom"
:class="{fullScreen:fullScreen}" :class="{fullScreen:coreFullScreen}"
v-if="coreCharts.data.length"> v-if="coreCharts.data.length">
<img src="../../assets/images/full-screen.png" <img src="../../assets/images/full-screen.png"
:title="$t('graph.fullScreen')" :title="$t('graph.fullScreen')"
class="fullScreen" class="fullScreen"
@click="fullScreenControl()"> @click="fullScreenControl()">
<div> <div>
<el-radio-group v-model="statisticType" <el-radio-group v-model="coreStatisticType"
@change="coreTableChange" @change="coreTableChange"
fill="#00A5A7" fill="#00A5A7"
text-color="#FFFFFF" text-color="#FFFFFF"
...@@ -66,23 +66,23 @@ limitations under the License. ...@@ -66,23 +66,23 @@ limitations under the License.
</el-radio-group> </el-radio-group>
<div class="cl-search-box"> <div class="cl-search-box">
<el-input v-model="searchByTypeInput" <el-input v-model="searchByTypeInput"
v-if="!statisticType" v-if="!coreStatisticType"
:placeholder="$t('operator.searchByType')" :placeholder="$t('operator.searchByType')"
clearable clearable
@clear="searchOpCoreList()" @clear="searchOpCoreList()"
@keyup.enter.native="searchOpCoreList()"></el-input> @keyup.enter.native="searchOpCoreList()"></el-input>
<el-input v-model="searchByNameInput" <el-input v-model="searchByNameInput"
v-if="statisticType" v-if="coreStatisticType"
:placeholder="$t('operator.searchByName')" :placeholder="$t('operator.searchByName')"
clearable clearable
@clear="searchOpCoreList()" @clear="searchOpCoreList()"
@keyup.enter.native="searchOpCoreList()"></el-input> @keyup.enter.native="searchOpCoreList()"></el-input>
</div> </div>
</div> </div>
<el-table v-show="!statisticType && opTypeCol && opTypeCol.length" <el-table v-show="!coreStatisticType && opTypeCol && opTypeCol.length"
:data="opTypeList" :data="opTypeList"
ref="expandTable" ref="expandTable"
@expand-change="expandTypeItem" @expand-change="expandCoreTypeItem"
@sort-change="opTypeSortChange" @sort-change="opTypeSortChange"
stripe stripe
height="calc(100% - 40px)" height="calc(100% - 40px)"
...@@ -92,7 +92,7 @@ limitations under the License. ...@@ -92,7 +92,7 @@ limitations under the License.
<div class="expand-table"> <div class="expand-table">
<el-table :data="props.row.opDetailList" <el-table :data="props.row.opDetailList"
stripe stripe
ref="expandChild" ref="expandCoreChild"
width="100%" width="100%"
tooltip-effect="light" tooltip-effect="light"
@cell-click="showInfoDetail" @cell-click="showInfoDetail"
...@@ -101,9 +101,8 @@ limitations under the License. ...@@ -101,9 +101,8 @@ limitations under the License.
:property="ele" :property="ele"
:key="key" :key="key"
:sortable="ele === 'op_info' ? false : 'custom'" :sortable="ele === 'op_info' ? false : 'custom'"
:width="(ele==='avg_execution_time'|| ele==='subgraph' || :min-width="(ele === 'op_info') ? 350 : (ele === 'full_op_name') ? 220 : ''"
ele==='op_name'|| ele==='op_type')?'220':''" :show-overflow-tooltip="(ele === 'avg_execution_time')">
show-overflow-tooltip>
<template slot="header"> <template slot="header">
<div class="custom-label" <div class="custom-label"
:title="getHeaderField(ele)"> :title="getHeaderField(ele)">
...@@ -134,7 +133,7 @@ limitations under the License. ...@@ -134,7 +133,7 @@ limitations under the License.
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
<el-table v-show="statisticType && opAllTypeList.opDetailCol && opAllTypeList.opDetailCol.length" <el-table v-show="coreStatisticType && opAllTypeList.opDetailCol && opAllTypeList.opDetailCol.length"
:data="opAllTypeList.opDetailList" :data="opAllTypeList.opDetailList"
stripe stripe
ref="opAllTable" ref="opAllTable"
...@@ -147,9 +146,8 @@ limitations under the License. ...@@ -147,9 +146,8 @@ limitations under the License.
:property="item" :property="item"
:key="$index" :key="$index"
:sortable="item === 'op_info' ? false : 'custom'" :sortable="item === 'op_info' ? false : 'custom'"
:width="(item==='avg_execution_time'|| item==='subgraph' || :min-width="(item === 'op_info') ? 350 : (item === 'full_op_name') ? 220 : ''"
item==='op_name'|| item==='op_type')?'220':''" :show-overflow-tooltip="(item === 'avg_execution_time')">
show-overflow-tooltip>
<template slot="header"> <template slot="header">
<div class="custom-label" <div class="custom-label"
:title="getHeaderField(item)"> :title="getHeaderField(item)">
...@@ -158,7 +156,7 @@ limitations under the License. ...@@ -158,7 +156,7 @@ limitations under the License.
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
<el-pagination v-show="statisticType" <el-pagination v-show="coreStatisticType"
v-if="opAllTypeList.opDetailList.length" v-if="opAllTypeList.opDetailList.length"
:current-page="opAllTypeList.opDetailPage.offset + 1" :current-page="opAllTypeList.opDetailPage.offset + 1"
:page-size="opAllTypeList.opDetailPage.limit" :page-size="opAllTypeList.opDetailPage.limit"
...@@ -180,30 +178,125 @@ limitations under the License. ...@@ -180,30 +178,125 @@ limitations under the License.
class="cpu-tab" class="cpu-tab"
name="cpu"> name="cpu">
<div class="cl-profiler-top" <div class="cl-profiler-top"
v-if="false"> :class="{fullScreen:cpuFullScreen}"
v-if="cpuCharts.data.length">
<div>
<div class="chart-title">{{$t('profiling.chartTitle')}}</div>
<el-radio-group class="chart-radio-group"
v-model="cpuCharts.type"
@change="cpuChartChange"
fill="#00A5A7"
text-color="#FFFFFF"
size="small">
<el-radio-button :label="0">
{{$t('operator.pie')}}
</el-radio-button>
<el-radio-button :label="1">
{{ $t('operator.bar')}}
</el-radio-button>
</el-radio-group>
</div>
<div class="cl-profiler-echarts"> <div class="cl-profiler-echarts">
<div class <div id="cpu-echarts"></div>
id="cpu-echarts"></div>
</div> </div>
</div> </div>
<div class="cl-profiler-bottom" <div class="cl-profiler-bottom"
:class="{fullScreen:cpuFullScreen}"
v-if="cpuCharts.data.length"> v-if="cpuCharts.data.length">
<img src="../../assets/images/full-screen.png"
:title="$t('graph.fullScreen')"
class="fullScreen"
@click="fullScreenControl()">
<div>
<el-radio-group v-model="cpuStatisticType"
@change="cpuTableChange"
fill="#00A5A7"
text-color="#FFFFFF"
size="small">
<el-radio-button :label="1">
{{$t('operator.allOperator')}}
</el-radio-button>
<el-radio-button :label="0">
{{$t('operator.classificationOperator')}}
</el-radio-button>
</el-radio-group>
<div class="cl-search-box"> <div class="cl-search-box">
<el-input v-model="searchByCPUTypeInput" <el-input v-model="searchByCpuTypeInput"
v-if="!cpuStatisticType"
:placeholder="$t('operator.searchByType')"
clearable
@clear="searchOpCpuList()"
@keyup.enter.native="searchOpCpuList()"></el-input>
<el-input v-model="searchAllByCpuTypeInput"
v-if="cpuStatisticType"
:placeholder="$t('operator.searchByType')" :placeholder="$t('operator.searchByType')"
clearable clearable
@clear="searchOpCpuList()" @clear="searchOpCpuList()"
@keyup.enter.native="searchOpCpuList()"></el-input> @keyup.enter.native="searchOpCpuList()"></el-input>
</div> </div>
<el-table v-show="opCpuList.opDetailCol && opCpuList.opDetailCol.length" </div>
:data="opCpuList.opDetailList" <el-table v-show="!cpuStatisticType && opCpuTypeCol && opCpuTypeCol.length"
:data="opCpuTypeList"
ref="expandCpuTable"
@expand-change="expandCpuTypeItem"
@sort-change="opCpuTypeSortChange"
stripe
height="calc(100% - 40px)"
width="100%">
<el-table-column type="expand">
<template slot-scope="props">
<div class="expand-table">
<el-table :data="props.row.opDetailList"
stripe
ref="expandCpuChild"
width="100%"
tooltip-effect="light"
@sort-change="(...args)=>{cpuDetailSortChange(props.row, ...args)}">
<el-table-column v-for="(ele, key) in props.row.opDetailCol"
:property="ele"
:key="key"
sortable="custom"
show-overflow-tooltip>
<template slot="header">
<div class="custom-label"
:title="getHeaderField(ele)">
{{getHeaderField(ele)}}
</div>
</template>
</el-table-column>
</el-table>
<el-pagination :current-page="props.row.opDetailPage.offset + 1"
:page-size="props.row.opDetailPage.limit"
@current-change="(...args)=>{opCpuDetailPageChange(props.row, ...args)}"
layout="total, prev, pager, next, jumper"
:total="props.row.pageTotal">
</el-pagination>
<div class="clear"></div>
</div>
</template>
</el-table-column>
<el-table-column v-for="(item, $index) in opTypeCol"
:property="item"
:key="$index"
sortable>
<template slot="header">
<div class="custom-label"
:title="getHeaderField(item)">
{{getHeaderField(item)}}
</div>
</template>
</el-table-column>
</el-table>
<el-table v-show="cpuStatisticType && opCpuAllTypeList.opDetailCol && opCpuAllTypeList.opDetailCol.length"
:data="opCpuAllTypeList.opDetailList"
stripe stripe
ref="opCPUTable" ref="opCpuAllTable"
width="100%" width="100%"
height="calc(100% - 82px)" height="calc(100% - 80px)"
tooltip-effect="light" tooltip-effect="light"
@sort-change="(...args)=>{cpuDetailSortChange(opCpuList, ...args)}"> @sort-change="(...args)=>{cpuDetailSortChange(opCpuAllTypeList, ...args)}">
<el-table-column v-for="(item, $index) in opCpuList.opDetailCol" <el-table-column v-for="(item, $index) in opCpuAllTypeList.opDetailCol"
:property="item" :property="item"
:key="$index" :key="$index"
sortable="custom" sortable="custom"
...@@ -216,12 +309,13 @@ limitations under the License. ...@@ -216,12 +309,13 @@ limitations under the License.
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
<el-pagination v-if="opCpuList.opDetailList.length" <el-pagination v-show="cpuStatisticType"
:current-page="opCpuList.opDetailPage.offset + 1" v-if="opCpuAllTypeList.opDetailList.length"
:page-size="opCpuList.opDetailPage.limit" :current-page="opCpuAllTypeList.opDetailPage.offset + 1"
@current-change="(...args)=>{opCpuPageChange(opCpuList, ...args)}" :page-size="opCpuAllTypeList.opDetailPage.limit"
@current-change="(...args)=>{opCpuDetailPageChange(opCpuAllTypeList, ...args)}"
layout="total, prev, pager, next, jumper" layout="total, prev, pager, next, jumper"
:total="opCpuList.pageTotal"> :total="opCpuAllTypeList.pageTotal">
</el-pagination> </el-pagination>
</div> </div>
<div class="image-noData" <div class="image-noData"
...@@ -272,7 +366,7 @@ export default { ...@@ -272,7 +366,7 @@ export default {
apiType: 'core', apiType: 'core',
currentCard: '', currentCard: '',
cpuCharts: { cpuCharts: {
type: 1, type: 0,
id: 'cpu-echarts', id: 'cpu-echarts',
chartDom: null, chartDom: null,
data: [], data: [],
...@@ -283,13 +377,17 @@ export default { ...@@ -283,13 +377,17 @@ export default {
chartDom: null, chartDom: null,
data: [], data: [],
}, // ai core chart }, // ai core chart
statisticType: 0, // ai core table statistic type coreStatisticType: 0, // ai core table statistic type
cpuStatisticType: 0, // ai cpu table statistic type
searchByTypeInput: '', // search by ai core type name searchByTypeInput: '', // search by ai core type name
searchByNameInput: '', // search by ai core detail name searchByNameInput: '', // search by ai core detail name
searchByCPUTypeInput: '', // search by ai cpu name searchByCpuTypeInput: '', // search by ai cpu type
searchAllByCpuTypeInput: '', // search by ai cpu type in all list
opTypeCol: [], // table headers list of operator type opTypeCol: [], // table headers list of operator type
opTypeList: [], // table list of operator type opTypeList: [], // table list of operator type
opCpuList: { opCpuTypeCol: [], // table headers list of operator type
opCpuTypeList: [], // table list of operator type
opCpuAllTypeList: {
opDetailCol: [], opDetailCol: [],
opDetailList: [], opDetailList: [],
pageTotal: 0, pageTotal: 0,
...@@ -324,6 +422,11 @@ export default { ...@@ -324,6 +422,11 @@ export default {
name: 'execution_time', name: 'execution_time',
type: 'descending', type: 'descending',
}, // operator type filter }, // operator type filter
op_cpu_filter_condition: {},
op_cpu_sort_condition: {
name: 'execution_time',
type: 'descending',
}, // operator cpu type filter
initOver: false, initOver: false,
objectType: 'object', objectType: 'object',
curActiveRow: { curActiveRow: {
...@@ -331,7 +434,13 @@ export default { ...@@ -331,7 +434,13 @@ export default {
childProp: null, childProp: null,
childOrder: null, childOrder: null,
}, },
fullScreen: false, curCpuActiveRow: {
rowItem: null,
childProp: null,
childOrder: null,
},
coreFullScreen: false,
cpuFullScreen: false,
}; };
}, },
watch: { watch: {
...@@ -379,28 +488,38 @@ export default { ...@@ -379,28 +488,38 @@ export default {
} }
}, },
fullScreenControl() { fullScreenControl() {
this.fullScreen = !this.fullScreen; if (this.apiType === 'core') {
if (this.coreCharts.chartDom && !this.fullScreen) { this.coreFullScreen = !this.coreFullScreen;
if (this.coreCharts.chartDom && !this.coreFullScreen) {
this.$nextTick(() => { this.$nextTick(() => {
this.coreCharts.chartDom.resize(); this.coreCharts.chartDom.resize();
}); });
} }
} else {
this.cpuFullScreen = !this.cpuFullScreen;
if (this.cpuCharts.chartDom && !this.cpuFullScreen) {
this.$nextTick(() => {
this.cpuCharts.chartDom.resize();
});
}
}
}, },
/** /**
* Current device change * Current device change
*/ */
cardChange() { cardChange() {
if (this.apiType === 'core') { if (this.apiType === 'core') {
this.statisticType = 0; this.coreStatisticType = 0;
this.clearCoreData(); this.clearCoreData();
this.getCoreTypeList(); this.getCoreTypeList();
} else if (this.apiType === 'cpu') { } else if (this.apiType === 'cpu') {
this.cpuStatisticType = 0;
this.clearCpuData(); this.clearCpuData();
this.getCpuList(true); this.getCpuTypeList();
} }
}, },
/** /**
* Operators type sort * Operators core type sort
* @param {Object} sort Sort data * @param {Object} sort Sort data
*/ */
opTypeSortChange(sort) { opTypeSortChange(sort) {
...@@ -409,18 +528,38 @@ export default { ...@@ -409,18 +528,38 @@ export default {
type: sort.order, type: sort.order,
}; };
this.$nextTick(() => { this.$nextTick(() => {
const item = this.$refs['expandChild']; const item = this.$refs['expandCoreChild'];
if (item && this.curActiveRow.rowItem) { if (item && this.curActiveRow.rowItem) {
item.sort(this.curActiveRow.childProp, this.curActiveRow.childOrder); item.sort(this.curActiveRow.childProp, this.curActiveRow.childOrder);
} }
}); });
}, },
/**
* Operators cpu type sort
* @param {Object} sort Sort data
*/
opCpuTypeSortChange(sort) {
this.op_cpu_sort_condition = {
name: sort.prop,
type: sort.order,
};
this.$nextTick(() => {
const item = this.$refs['expandCpuChild'];
if (item && this.curCpuActiveRow.rowItem) {
item.sort(this.curCpuActiveRow.childProp, this.curCpuActiveRow.childOrder);
}
});
},
/** /**
* clear cpu data * clear cpu data
*/ */
clearCpuData() { clearCpuData() {
this.searchByCPUTypeInput = ''; this.searchByCpuTypeInput = '';
this.opCpuList = { this.searchAllByCpuTypeInput = '';
this.op_cpu_filter_condition = {};
this.opCpuTypeCol = [];
this.opCpuTypeList = [];
this.opCpuAllTypeList = {
opDetailCol: [], opDetailCol: [],
opDetailList: [], opDetailList: [],
pageTotal: 0, pageTotal: 0,
...@@ -429,10 +568,7 @@ export default { ...@@ -429,10 +568,7 @@ export default {
limit: 15, limit: 15,
}, },
op_filter_condition: {}, op_filter_condition: {},
op_sort_condition: { op_sort_condition: {},
name: 'total_time',
type: 'descending',
},
}; };
}, },
/** /**
...@@ -457,7 +593,7 @@ export default { ...@@ -457,7 +593,7 @@ export default {
}; };
}, },
/** /**
* get core list * get core type list
*/ */
getCoreTypeList() { getCoreTypeList() {
const params = {}; const params = {};
...@@ -573,10 +709,10 @@ export default { ...@@ -573,10 +709,10 @@ export default {
this.formatterDetailData(row, res.data); this.formatterDetailData(row, res.data);
this.$nextTick(() => { this.$nextTick(() => {
let item = null; let item = null;
if (this.statisticType) { if (this.coreStatisticType) {
item = this.$refs['opAllTable']; item = this.$refs['opAllTable'];
} else { } else {
item = this.$refs['expandChild']; item = this.$refs['expandCoreChild'];
this.curActiveRow = { this.curActiveRow = {
rowItem: row, rowItem: row,
childProp: row.op_sort_condition.name, childProp: row.op_sort_condition.name,
...@@ -596,28 +732,59 @@ export default { ...@@ -596,28 +732,59 @@ export default {
.catch(() => {}); .catch(() => {});
}, },
/** /**
* get cpu list * get cpu type list
* @param {Boolean} isSort if sort
*/ */
getCpuList(isSort) { getCpuTypeList() {
const params = {}; const params = {};
params.params = { params.params = {
profile: this.profile_dir, profile: this.profile_dir,
train_id: this.train_id, train_id: this.train_id,
}; };
params.body = { params.body = {
op_type: 'aicpu', op_type: 'aicpu_type',
device_id: this.currentCard, device_id: this.currentCard,
filter_condition: this.opCpuList.op_filter_condition, filter_condition: this.op_cpu_filter_condition,
sort_condition: this.opCpuList.op_sort_condition, sort_condition: this.op_cpu_sort_condition,
group_condition: this.opCpuList.opDetailPage,
}; };
requestService requestService
.getProfilerOpData(params) .getProfilerOpData(params)
.then((res) => { .then((res) => {
this.initOver = true; this.initOver = true;
this.opCpuTypeList = [];
if (res && res.data) { if (res && res.data) {
this.opCpuTypeCol = res.data.col_name;
if (res.data.object) { if (res.data.object) {
res.data.object.forEach((k) => {
const object = {
isExpanded: false,
opDetailList: [],
opDetailCol: [],
opDetailPage: {
offset: 0,
limit: 15,
},
pageTotal: 0,
op_filter_condition: {
op_type: {
in: [k[0]],
},
},
op_sort_condition: {},
};
res.data.col_name.forEach((item, index) => {
object[item] = k[index];
});
this.opCpuTypeList.push(object);
});
this.$nextTick(() => {
const elementItem = this.$refs['expandCpuTable'];
if (elementItem) {
elementItem.sort(
this.op_sort_condition.name,
this.op_sort_condition.type,
);
}
});
if ( if (
!this.cpuCharts.device_id || !this.cpuCharts.device_id ||
this.cpuCharts.device_id !== this.currentCard this.cpuCharts.device_id !== this.currentCard
...@@ -625,33 +792,84 @@ export default { ...@@ -625,33 +792,84 @@ export default {
this.cpuCharts.device_id = this.currentCard; this.cpuCharts.device_id = this.currentCard;
this.cpuCharts.data = []; this.cpuCharts.data = [];
res.data.object.forEach((k) => { res.data.object.forEach((k) => {
if (
this.cpuCharts.data &&
this.cpuCharts.data.length < 19
) {
this.cpuCharts.data.push({ this.cpuCharts.data.push({
name: k[0], name: k[0],
op_name: k[1], value: k[1],
value: k[2], percent: k[3],
});
}); });
this.setOption(this.cpuCharts); } else {
if (!this.cpuCharts.data[19]) {
this.cpuCharts.data[19] = {
name: 'Other',
value: 0,
percent: 0,
};
} }
this.formatterDetailData(this.opCpuList, res.data); this.cpuCharts.data[19].value += k[1];
if (isSort) { this.cpuCharts.data[19].percent += k[3];
this.$nextTick(() => {
const item = this.$refs['opCPUTable'];
if (item) {
item.sort(
this.opCpuList.op_sort_condition.name,
this.opCpuList.op_sort_condition.type,
);
} }
}); });
this.setOption(this.cpuCharts);
} }
} }
} }
}) })
.catch(() => { .catch(() => {
this.opTypeList = [];
this.initOver = true; this.initOver = true;
}); });
}, },
/**
* get cpu list
* @param {Object} row type row
* @param {Boolean} isSort if sort
*/
getCpuDetailList(row, isSort) {
const params = {};
params.params = {
profile: this.profile_dir,
train_id: this.train_id,
};
params.body = {
op_type: 'aicpu_detail',
device_id: this.currentCard,
filter_condition: row.op_filter_condition,
sort_condition: row.op_sort_condition,
group_condition: row.opDetailPage,
};
requestService
.getProfilerOpData(params)
.then((res) => {
if (res && res.data) {
this.formatterDetailData(row, res.data);
this.$nextTick(() => {
let item = null;
if (this.cpuStatisticType) {
item = this.$refs['opCpuAllTable'];
} else {
item = this.$refs['expandCpuChild'];
this.curCpuActiveRow = {
rowItem: row,
childProp: row.op_sort_condition.name,
childOrder: row.op_sort_condition.type,
};
}
if (item && isSort) {
item.sort(
row.op_sort_condition.name,
row.op_sort_condition.type,
);
}
this.$refs.expandCpuTable.doLayout();
});
}
})
.catch(() => {});
},
/** /**
* operator detail list page change * operator detail list page change
* @param {Object} row table cell * @param {Object} row table cell
...@@ -666,15 +884,15 @@ export default { ...@@ -666,15 +884,15 @@ export default {
* @param {Object} row table cell * @param {Object} row table cell
* @param {Number} pageIndex current page * @param {Number} pageIndex current page
*/ */
opCpuPageChange(row, pageIndex) { opCpuDetailPageChange(row, pageIndex) {
row.opDetailPage.offset = pageIndex - 1; row.opDetailPage.offset = pageIndex - 1;
this.getCpuList(false); this.getCpuDetailList(row, false);
}, },
/** /**
* get core list by search * get core list by search
*/ */
searchOpCoreList() { searchOpCoreList() {
if (this.statisticType) { if (this.coreStatisticType) {
this.opAllTypeList.op_filter_condition = {}; this.opAllTypeList.op_filter_condition = {};
if (this.searchByNameInput) { if (this.searchByNameInput) {
this.opAllTypeList.op_filter_condition = { this.opAllTypeList.op_filter_condition = {
...@@ -708,16 +926,35 @@ export default { ...@@ -708,16 +926,35 @@ export default {
* get cpu list by search * get cpu list by search
*/ */
searchOpCpuList() { searchOpCpuList() {
this.opCpuList.op_filter_condition = {}; if (this.cpuStatisticType) {
if (this.searchByCPUTypeInput) { this.opCpuAllTypeList.op_filter_condition = {};
this.opCpuList.op_filter_condition = { if (this.searchAllByCpuTypeInput) {
op_type: {partial_match_str_in: [this.searchByCPUTypeInput]}, this.opCpuAllTypeList.op_filter_condition = {
op_type: {partial_match_str_in: [this.searchAllByCpuTypeInput]},
};
} else {
this.opCpuAllTypeList.op_filter_condition = {};
}
this.opCpuAllTypeList.opDetailPage.offset = 0;
this.getCpuDetailList(this.opCpuAllTypeList, false);
} else {
this.op_cpu_filter_condition = {};
if (this.searchByCpuTypeInput) {
this.op_cpu_filter_condition = {
op_type: {partial_match_str_in: [this.searchByCpuTypeInput]},
}; };
} else { } else {
this.opCpuList.op_filter_condition = {}; this.op_cpu_filter_condition = {};
}
if (this.curCpuActiveRow.rowItem) {
this.curCpuActiveRow = {
rowItem: null,
childProp: null,
childOrder: null,
};
}
this.getCpuTypeList();
} }
this.opCpuList.opDetailPage.offset = 0;
this.getCpuList(false);
}, },
/** /**
* core detail sort * core detail sort
...@@ -743,7 +980,7 @@ export default { ...@@ -743,7 +980,7 @@ export default {
type: column.order, type: column.order,
}; };
row.opDetailPage.offset = 0; row.opDetailPage.offset = 0;
this.getCpuList(false); this.getCpuDetailList(row, false);
}, },
/** /**
* format detail data * format detail data
...@@ -772,7 +1009,7 @@ export default { ...@@ -772,7 +1009,7 @@ export default {
* expand core type table * expand core type table
* @param {Object} row table cell * @param {Object} row table cell
*/ */
expandTypeItem(row) { expandCoreTypeItem(row) {
row.isExpanded = !row.isExpanded; row.isExpanded = !row.isExpanded;
if (row.isExpanded) { if (row.isExpanded) {
if (this.curActiveRow.rowItem) { if (this.curActiveRow.rowItem) {
...@@ -803,6 +1040,41 @@ export default { ...@@ -803,6 +1040,41 @@ export default {
}; };
} }
}, },
/**
* expand cpu type table
* @param {Object} row table cell
*/
expandCpuTypeItem(row) {
row.isExpanded = !row.isExpanded;
if (row.isExpanded) {
if (this.curCpuActiveRow.rowItem) {
const item = this.$refs['expandCpuTable'];
if (item) {
item.toggleRowExpansion(this.curCpuActiveRow.rowItem, false);
}
}
this.curCpuActiveRow = {
rowItem: row,
childProp: null,
childOrder: null,
};
row.opDetailList = [];
row.opDetailCol = [];
row.opDetailPage.offset = 0;
row.pageTotal = 0;
row.op_sort_condition = {
name: 'total_time',
type: 'descending',
};
this.getCpuDetailList(row, true);
} else {
this.curCpuActiveRow = {
rowItem: null,
childProp: null,
childOrder: null,
};
}
},
/** /**
* tab change * tab change
*/ */
...@@ -813,7 +1085,7 @@ export default { ...@@ -813,7 +1085,7 @@ export default {
) { ) {
this.initOver = false; this.initOver = false;
this.clearCpuData(); this.clearCpuData();
this.getCpuList(true); this.getCpuTypeList();
} else if ( } else if (
this.apiType === 'core' && this.apiType === 'core' &&
this.coreCharts.device_id !== this.currentCard this.coreCharts.device_id !== this.currentCard
...@@ -830,7 +1102,7 @@ export default { ...@@ -830,7 +1102,7 @@ export default {
* core table type change * core table type change
*/ */
coreTableChange() { coreTableChange() {
if (this.statisticType && !this.opAllTypeList.opDetailCol.length) { if (this.coreStatisticType && !this.opAllTypeList.opDetailCol.length) {
this.opAllTypeList.op_sort_condition = { this.opAllTypeList.op_sort_condition = {
name: 'avg_execution_time', name: 'avg_execution_time',
type: 'descending', type: 'descending',
...@@ -838,6 +1110,18 @@ export default { ...@@ -838,6 +1110,18 @@ export default {
this.getCoreDetailList(this.opAllTypeList, true); this.getCoreDetailList(this.opAllTypeList, true);
} }
}, },
/**
* cpu table type change
*/
cpuTableChange() {
if (this.cpuStatisticType && !this.opCpuAllTypeList.opDetailCol.length) {
this.opCpuAllTypeList.op_sort_condition = {
name: 'total_time',
type: 'descending',
};
this.getCpuDetailList(this.opCpuAllTypeList, true);
}
},
/** /**
* operator cpu chart change * operator cpu chart change
*/ */
...@@ -998,16 +1282,9 @@ export default { ...@@ -998,16 +1282,9 @@ export default {
type: 'value', type: 'value',
}; };
chart.data.forEach((item) => { chart.data.forEach((item) => {
const name = this.apiType === 'cpu' ? item.op_name : item.name; option.xAxis.data.push(item.name);
option.xAxis.data.push(name);
option.series[0].data.push(item.value); option.series[0].data.push(item.value);
}); });
if (this.apiType === 'cpu') {
option.xAxis.axisLabel.formatter = (params, dataIndex) => {
const xAxisValue = chart.data[dataIndex].op_name;
return xAxisValue.replace(/^.+\//g, '');
};
}
} }
this.$nextTick(() => { this.$nextTick(() => {
const cpuDom = document.getElementById(chart.id); const cpuDom = document.getElementById(chart.id);
...@@ -1050,7 +1327,7 @@ export default { ...@@ -1050,7 +1327,7 @@ export default {
} }
} }
this.$nextTick(() => { this.$nextTick(() => {
this.rowName = `${column.label}${this.$t('dataTraceback.details')}`; this.rowName = `op_info${this.$t('dataTraceback.details')}`;
this.detailsDialogVisible = true; this.detailsDialogVisible = true;
this.detailsDataList = this.formateJsonString(val); this.detailsDataList = this.formateJsonString(val);
}); });
...@@ -1191,17 +1468,18 @@ export default { ...@@ -1191,17 +1468,18 @@ export default {
margin-right: 20px; margin-right: 20px;
} }
.cl-profiler-top { .cl-profiler-top {
height: 45%; height: 47%;
.chart-title { .chart-title {
float: left; float: left;
font-weight: bold; font-weight: bold;
height: 32px;
} }
} }
.cl-profiler-top.fullScreen { .cl-profiler-top.fullScreen {
display: none; display: none;
} }
.cl-profiler-bottom { .cl-profiler-bottom {
height: 55%; height: 53%;
padding-top: 10px; padding-top: 10px;
.fullScreen { .fullScreen {
float: right; float: right;
...@@ -1212,14 +1490,6 @@ export default { ...@@ -1212,14 +1490,6 @@ export default {
.cl-profiler-bottom.fullScreen { .cl-profiler-bottom.fullScreen {
height: 100%; height: 100%;
} }
.cpu-tab {
.cl-profiler-top {
height: calc(36% + 32px);
}
.cl-profiler-bottom {
height: 100%;
}
}
.cl-profiler-echarts { .cl-profiler-echarts {
width: 100%; width: 100%;
height: calc(100% - 32px); height: calc(100% - 32px);
...@@ -1231,7 +1501,7 @@ export default { ...@@ -1231,7 +1501,7 @@ export default {
width: 100%; width: 100%;
height: 100%; height: 100%;
min-width: 1300px; min-width: 1300px;
min-height: 306px; min-height: 321px;
overflow: hidden; overflow: hidden;
} }
} }
......
mindinsight/ui/src/views/profiling/profiling-dashboard.vue
浏览文件 @ a171ba42
...@@ -1142,9 +1142,7 @@ export default { ...@@ -1142,9 +1142,7 @@ export default {
RequestService.queryTimeline(params) RequestService.queryTimeline(params)
.then((res) => { .then((res) => {
if (res && res.data && res.data.length) { if (res && res.data && res.data.length) {
this.timeLine.data = this.stringToUint8Array( this.timeLine.data = JSON.stringify(res.data);
JSON.stringify(res.data),
);
this.timeLine.waiting = false; this.timeLine.waiting = false;
} }
}) })
......
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或