style(报表统计): 优化测试用例统计图表最大化时的展示

--bug=1015436 --user=宋天阳 【报表统计】项目报表-测试用例统计,柱状图表全屏展示有点丑
https://www.tapd.cn/55049933/s/1216749
This commit is contained in:
song-tianyang 2022-08-01 17:52:22 +08:00 committed by fit2-zhao
parent a3ba0724dd
commit 15a20cb261
2 changed files with 13 additions and 8 deletions

View File

@ -496,11 +496,11 @@ public class TestCaseCountService {
this.add("50%"); this.add("50%");
}}); }});
Map<String,Object> labelMap = new HashMap<>(); Map<String, Object> labelMap = new HashMap<>();
Map<String,Object> normalMap = new HashMap<>(); Map<String, Object> normalMap = new HashMap<>();
normalMap.put("show",true); normalMap.put("show", true);
normalMap.put("formatter","{b}: {c}({d}%)"); normalMap.put("formatter", "{b}: {c}({d}%)");
labelMap.put("normal",normalMap); labelMap.put("normal", normalMap);
series.setLabel(labelMap); series.setLabel(labelMap);
Title title = new Title(); Title title = new Title();

View File

@ -31,7 +31,8 @@
<el-row> <el-row>
<div class="chart-style"> <div class="chart-style">
<ms-chart ref="chart1" v-if="!loading" :options="dataOption" <ms-chart ref="chart1" v-if="!loading" :options="dataOption"
:style="{width: chartWidthNumber+'px', height: (h-70) + 'px'}" class="chart-config" :style="{width: chartWidthNumber+'px', height: (h-70) + 'px'}"
class="chart-config"
:autoresize="true" :autoresize="true"
id="picChart"/> id="picChart"/>
</div> </div>
@ -148,14 +149,19 @@ export default {
this.originalW = this.w; this.originalW = this.w;
this.originalH = this.h; this.originalH = this.h;
this.w = document.body.clientWidth - 50; this.w = document.body.clientWidth - 50;
this.h = document.body.clientHeight;
this.isFullScreen = true; this.isFullScreen = true;
if (this.chartType === 'bar') {
this.chartWidthNumber = this.w;
}
this.$emit('hidePage', true); this.$emit('hidePage', true);
}, },
unFullScreen() { unFullScreen() {
this.w = this.originalW; this.w = this.originalW;
this.h = this.originalH; this.h = this.originalH;
this.isFullScreen = false; this.isFullScreen = false;
if (this.chartType === 'bar') {
this.chartWidthNumber = this.w;
}
this.$emit('hidePage', false); this.$emit('hidePage', false);
}, },
getImages(command) { getImages(command) {
@ -167,7 +173,6 @@ export default {
if (document.getElementById('picChart')) { if (document.getElementById('picChart')) {
let chartsCanvas = document.getElementById('picChart').querySelectorAll('canvas')[0]; let chartsCanvas = document.getElementById('picChart').querySelectorAll('canvas')[0];
if (chartsCanvas) { if (chartsCanvas) {
// toDataURL()canvascanvasbase64
returnImageDatas = chartsCanvas && chartsCanvas.toDataURL(imageType); returnImageDatas = chartsCanvas && chartsCanvas.toDataURL(imageType);
} }
} }