Skip to content

M
mindinsight

MindSpore / mindinsight

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

!526 Traceability page, full data and sort button violent click event code processing optimization 

Merge pull request !526 from 秦君艳/databutton
上级 85032a3f 8e2dae56
隐藏空白更改
内联 并排
Showing with 202 addition and 160 deletion
mindinsight/ui/src/views/train-manage/data-traceback.vue
浏览文件 @ dc7bbb8e
......@@ -338,6 +338,9 @@ import Echarts from 'echarts';
export default {
data() {
return {
tableSortTimer: null,
showAllTimer: null,
unhideTimer: null,
loading: true,
errorData: true,
tagDialogShow: false,
......@@ -363,6 +366,7 @@ export default {
recordsNumber: 0,
// Number of displayed records.
showNumber: 0,
delayTime: 500,
selectArrayValue: [],
customizedColumnOptions: [],
// Set the type of customized
......@@ -852,37 +856,43 @@ export default {
* Unhide
*/
unhideRecords() {
this.showEchartPic = true;
this.$refs.table.clearSelection();
if (this.parallelEchart) {
this.parallelEchart.clear();
}
this.$store.commit('setHidenDirChecked', []);
if (this.hidenDirChecked.length) {
this.checkedSummary = [];
this.hidenDirChecked = [];
if (this.unhideTimer) {
clearTimeout(this.unhideTimer);
this.unhideTimer = null;
}
this.checkOptions = [];
this.selectArrayValue = [];
this.basearr = [];
const params = {
body: {},
};
const tempParam = {
sorted_name: this.sortInfo.sorted_name,
sorted_type: this.sortInfo.sorted_type,
};
this.summaryDirList = this.$store.state.summaryDirList;
this.tableFilter.summary_dir = {
in: this.summaryDirList,
};
params.body = Object.assign(
params.body,
this.chartFilter,
tempParam,
this.tableFilter,
);
this.queryLineagesData(params);
this.unhideTimer = setTimeout(() => {
this.showEchartPic = true;
this.$refs.table.clearSelection();
if (this.parallelEchart) {
this.parallelEchart.clear();
}
this.$store.commit('setHidenDirChecked', []);
if (this.hidenDirChecked.length) {
this.checkedSummary = [];
this.hidenDirChecked = [];
}
this.checkOptions = [];
this.selectArrayValue = [];
this.basearr = [];
const params = {
body: {},
};
const tempParam = {
sorted_name: this.sortInfo.sorted_name,
sorted_type: this.sortInfo.sorted_type,
};
this.summaryDirList = this.$store.state.summaryDirList;
this.tableFilter.summary_dir = {
in: this.summaryDirList,
};
params.body = Object.assign(
params.body,
this.chartFilter,
tempParam,
this.tableFilter,
);
this.queryLineagesData(params);
}, this.delayTime);
},
/**
* Input search filtering in the select module
......@@ -1579,22 +1589,28 @@ export default {
*/
echartShowAllData() {
// The first page is displayed.
this.initOver = false;
this.echartNoData = false;
this.showEchartPic = true;
this.selectCheckAll = true;
// checkOptions initializate to an empty array
this.checkOptions = [];
this.selectArrayValue = [];
this.basearr = [];
this.pagination.currentPage = 1;
this.$store.commit('setSummaryDirList', undefined);
this.$store.commit('setSelectedBarList', []);
if (this.parallelEchart) {
this.parallelEchart.clear();
if (this.showAllTimer) {
clearTimeout(this.showAllTimer);
this.showAllTimer = null;
}
this.$refs.table.clearSelection();
this.init();
this.showAllTimer = setTimeout(() => {
this.initOver = false;
this.echartNoData = false;
this.showEchartPic = true;
this.selectCheckAll = true;
// checkOptions initializate to an empty array
this.checkOptions = [];
this.selectArrayValue = [];
this.basearr = [];
this.pagination.currentPage = 1;
this.$store.commit('setSummaryDirList', undefined);
this.$store.commit('setSelectedBarList', []);
if (this.parallelEchart) {
this.parallelEchart.clear();
}
this.$refs.table.clearSelection();
this.init();
}, this.delayTime);
},
/**
......@@ -1649,25 +1665,31 @@ export default {
* @param {Object} data
*/
tableSortChange(data) {
this.sortInfo.sorted_name = data.prop;
this.sortInfo.sorted_type = data.order;
const params = {};
const tempParam = {
sorted_name: data.prop,
sorted_type: data.order,
};
this.checkOptions = [];
this.selectArrayValue = [];
this.basearr = [];
this.pagination.currentPage = 1;
this.summaryDirList = this.$store.state.summaryDirList;
if (this.summaryDirList) {
this.tableFilter.summary_dir = {in: this.summaryDirList};
} else {
this.tableFilter.summary_dir = undefined;
if (this.tableSortTimer) {
clearTimeout(this.tableSortTimer);
this.tableSortTimer = null;
}
params.body = Object.assign({}, tempParam, this.tableFilter);
this.queryLineagesData(params);
this.tableSortTimer = setTimeout(() => {
this.sortInfo.sorted_name = data.prop;
this.sortInfo.sorted_type = data.order;
const params = {};
const tempParam = {
sorted_name: data.prop,
sorted_type: data.order,
};
this.checkOptions = [];
this.selectArrayValue = [];
this.basearr = [];
this.pagination.currentPage = 1;
this.summaryDirList = this.$store.state.summaryDirList;
if (this.summaryDirList) {
this.tableFilter.summary_dir = {in: this.summaryDirList};
} else {
this.tableFilter.summary_dir = undefined;
}
params.body = Object.assign({}, tempParam, this.tableFilter);
this.queryLineagesData(params);
}, this.delayTime);
},
/**
......@@ -1946,6 +1968,9 @@ export default {
* Destroy the page
*/
destroyed() {
this.tableSortTimer = null;
this.showAllTimer = null;
this.unhideTimer = null;
if (this.dataCheckedSummary && this.dataCheckedSummary.length) {
const summaryDirList = [];
this.dataCheckedSummary.forEach((item) => {
......
mindinsight/ui/src/views/train-manage/model-traceback.vue
浏览文件 @ dc7bbb8e
......@@ -365,6 +365,8 @@ export default {
watch: {},
data() {
return {
sortChangeTimer: null,
unhideRecordsTimer: null,
tagDialogShow: false,
errorData: true,
tagScope: {},
......@@ -375,6 +377,7 @@ export default {
// Number of data records returned by the interface.
recordsNumber: 0,
showNumber: 0,
delayTime: 500,
showEchartPic: true,
hideRecord: false,
hidenDirChecked: [],
......@@ -1430,58 +1433,64 @@ export default {
* Unhide
*/
unhideRecords() {
this.showEchartPic = true;
this.$refs.table.clearSelection();
this.$store.commit('setHidenDirChecked', []);
if (this.hidenDirChecked.length) {
this.checkedSummary = [];
this.hidenDirChecked = [];
if (this.unhideRecordsTimer) {
clearTimeout(this.unhideRecordsTimer);
this.unhideRecordsTimer = null;
}
const params = {
body: {},
};
const tempParam = {
sorted_name: this.sortInfo.sorted_name,
sorted_type: this.sortInfo.sorted_type,
};
this.summaryDirList = this.$store.state.summaryDirList;
this.tableFilter.summary_dir = {
in: this.summaryDirList,
};
params.body = Object.assign(
params.body,
this.chartFilter,
tempParam,
this.tableFilter,
);
RequestService.queryLineagesData(params).then(
(res) => {
if (res && res.data && res.data.object) {
this.errorData = false;
const list = this.setDataOfModel(res.data.object);
this.echart.allData = list;
this.echart.brushData = list;
this.echart.showData = this.echart.brushData;
this.$nextTick(() => {
this.resizeChart();
this.initChart();
});
const showList = list.slice(
(this.pagination.currentPage - 1) * this.pagination.pageSize,
this.pagination.currentPage * this.pagination.pageSize,
);
this.table.data = showList;
this.recordsNumber = this.table.data.length;
this.showNumber = this.table.data.length;
this.pagination.total = res.data.count || 0;
} else {
this.unhideRecordsTimer = setTimeout(() => {
this.showEchartPic = true;
this.$refs.table.clearSelection();
this.$store.commit('setHidenDirChecked', []);
if (this.hidenDirChecked.length) {
this.checkedSummary = [];
this.hidenDirChecked = [];
}
const params = {
body: {},
};
const tempParam = {
sorted_name: this.sortInfo.sorted_name,
sorted_type: this.sortInfo.sorted_type,
};
this.summaryDirList = this.$store.state.summaryDirList;
this.tableFilter.summary_dir = {
in: this.summaryDirList,
};
params.body = Object.assign(
params.body,
this.chartFilter,
tempParam,
this.tableFilter,
);
RequestService.queryLineagesData(params).then(
(res) => {
if (res && res.data && res.data.object) {
this.errorData = false;
const list = this.setDataOfModel(res.data.object);
this.echart.allData = list;
this.echart.brushData = list;
this.echart.showData = this.echart.brushData;
this.$nextTick(() => {
this.resizeChart();
this.initChart();
});
const showList = list.slice(
(this.pagination.currentPage - 1) * this.pagination.pageSize,
this.pagination.currentPage * this.pagination.pageSize,
);
this.table.data = showList;
this.recordsNumber = this.table.data.length;
this.showNumber = this.table.data.length;
this.pagination.total = res.data.count || 0;
} else {
this.errorData = true;
}
},
(error) => {
this.errorData = true;
}
},
(error) => {
this.errorData = true;
},
);
},
);
}, this.delayTime);
},
/**
......@@ -1489,56 +1498,62 @@ export default {
* @param {Object} column current column
*/
sortChange(column) {
this.sortInfo.sorted_name = column.prop;
this.sortInfo.sorted_type = column.order;
this.recordsNumber = 0;
this.showNumber = 0;
this.getStoreList();
const tempParam = {
limit: this.pagination.pageSize,
offset: 0,
sorted_name: this.sortInfo.sorted_name,
sorted_type: this.sortInfo.sorted_type,
};
const params = {};
params.body = Object.assign(
{},
tempParam,
this.tableFilter,
this.chartFilter || {},
);
RequestService.queryLineagesData(params)
.then(
(res) => {
if (res && res.data && res.data.object) {
this.errorData = false;
const list = this.setDataOfModel(res.data.object);
const tempList = list.slice(0, this.pagination.pageSize);
this.recordsNumber = tempList.length;
if (this.hidenDirChecked.length) {
this.hidenDirChecked.forEach((dir) => {
tempList.forEach((item, index) => {
if (item.summary_dir === dir) {
tempList.splice(index, 1);
}
if (this.sortChangeTimer) {
clearTimeout(this.sortChangeTimer);
this.sortChangeTimer = null;
}
this.sortChangeTimer = setTimeout(() => {
this.sortInfo.sorted_name = column.prop;
this.sortInfo.sorted_type = column.order;
this.recordsNumber = 0;
this.showNumber = 0;
this.getStoreList();
const tempParam = {
limit: this.pagination.pageSize,
offset: 0,
sorted_name: this.sortInfo.sorted_name,
sorted_type: this.sortInfo.sorted_type,
};
const params = {};
params.body = Object.assign(
{},
tempParam,
this.tableFilter,
this.chartFilter || {},
);
RequestService.queryLineagesData(params)
.then(
(res) => {
if (res && res.data && res.data.object) {
this.errorData = false;
const list = this.setDataOfModel(res.data.object);
const tempList = list.slice(0, this.pagination.pageSize);
this.recordsNumber = tempList.length;
if (this.hidenDirChecked.length) {
this.hidenDirChecked.forEach((dir) => {
tempList.forEach((item, index) => {
if (item.summary_dir === dir) {
tempList.splice(index, 1);
}
});
});
});
}
this.showNumber = tempList.length;
this.table.data = tempList;
this.pagination.total = res.data.count || 0;
this.pagination.currentPage = 1;
} else {
this.errorData = true;
}
this.showNumber = tempList.length;
this.table.data = tempList;
this.pagination.total = res.data.count || 0;
this.pagination.currentPage = 1;
} else {
},
(error) => {
this.errorData = true;
}
},
(error) => {
this.errorData = true;
},
)
.catch(() => {
this.errorData = true;
});
},
)
.catch(() => {
this.errorData = true;
});
}, this.delayTime);
},
/**
......@@ -1986,6 +2001,8 @@ export default {
* Destroy the page
*/
destroyed() {
this.sortChangeTimer = null;
this.unhideRecordsTimer = null;
if (this.checkedSummary.length) {
const tempList = [];
this.checkedSummary.forEach((item) => {
......
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或