From 09a1635f5182a166771e0c827450cdfc00f052b8 Mon Sep 17 00:00:00 2001
From: surprise <15810472099@163.com>
Date: 星期一, 26 二月 2024 16:53:38 +0800
Subject: [PATCH] 代码更新
---
src/views/datamanage/dataStatistics.vue | 752 ++++++++++++++++++++++++++++++++++++++++++---------------
1 files changed, 556 insertions(+), 196 deletions(-)
diff --git a/src/views/datamanage/dataStatistics.vue b/src/views/datamanage/dataStatistics.vue
index 2faf051..d793e71 100644
--- a/src/views/datamanage/dataStatistics.vue
+++ b/src/views/datamanage/dataStatistics.vue
@@ -1,295 +1,655 @@
<template>
- <div class="dataStatistics">
+ <div class="box_div dataStatistics">
<My-bread :list="[
- `${$t('dataManage.dataManage')}`,
- `${$t('dataManage.projectManage')}`,
- ]"></My-bread>
+ `${$t('dataManage.dataManage')}`,
+ `${$t('dataManage.dataStatistics')}`,
+ ]"></My-bread>
<el-divider />
- <div class="contentBox ">
- <div class="content_Left subpage_Div">
- <el-tree
- :data="treeData"
- @node-click="handleNodeClick"
- node-key="id"
- ref="tree"
- highlight-current
- :props="defaultProps"
- >
+ <div class="contentBox">
+ <div class="content_Left subpage_Div" style="border: 1px solid #dcdfe6;">
+ <el-tree :data="treeData" @node-click="handleNodeClick" node-key="id" ref="tree" highlight-current
+ :props="defaultProps">
</el-tree>
</div>
- <div class="content_Right subpage_Div">
- <div>
- <el-button
- icon="el-icon-c-scale-to-original"
- @click="setCountFlagChange(1)"
- ></el-button>
- <el-button
- icon="el-icon-pie-chart"
- @click="setCountFlagChange(2)"
- ></el-button>
- <el-divider />
+ <div class="content_Right subpage_Div" style="border: 1px solid #dcdfe6;">
+ <div class=" subpage_Div iquery" style="padding-bottom: 14px">
+ <div>
+
+ <el-form :inline="true" :model="tjlxData" class="demo-form-inline">
+ <el-form-item label="缁熻绫诲瀷" v-show="!setCountFlag && tjlxData.flag">
+ <el-select v-model="tjlxData.region" size="small" @change="setTjlxDataChange">
+
+ <el-option label="鏁版嵁瀛樺偍閲�" value="sjccl">
+ </el-option>
+ <el-option label="鏂囦欢涓暟" value="sjts">
+ </el-option>
+ </el-select>
+
+ </el-form-item>
+ <el-form-item v-show="!setCountFlag" label="鎬昏:">
+ {{ dataVolume }}
+
+ </el-form-item>
+ <el-form-item>
+ <el-button icon="el-icon-c-scale-to-original" size="small" type="warning"
+ @click="setCountFlagChange(1)">{{ $t("shuJuGuanLi.butten.Report") }}</el-button>
+ </el-form-item>
+ <el-form-item>
+ <el-button icon="el-icon-pie-chart" size="small" type="primary" @click="setCountFlagChange(2)">{{
+ $t("shuJuGuanLi.butten.Histogram") }}</el-button>
+ </el-form-item>
+ <el-form-item v-show="setDownloadType">
+ <el-button icon="el-icon-download" size="small" type="success" @click="setCountFlagChange(3)">{{
+ $t("shuJuGuanLi.butten.Download") }}</el-button>
+ </el-form-item>
+ </el-form>
+
+ </div>
</div>
- <div
- class="contentTable"
- v-show="setCountFlag"
- >
- <el-table
- :data="tableData"
- style="width: 100%"
- height="calc(100% - 50px)"
- >
- <el-table-column
- prop="m1"
- label="涓�绾фā鍧�"
- >
+ <div class="dividing-line"></div>
+ <div class="contentTable subpage_Div" v-show="setCountFlag">
+ <el-table :data="reportFormsData" style="width: 100%" height="calc(100% - 1px)" ref="table">
+ <el-table-column v-if="queryData.value == 'countServices'" prop="m1" key="1" align="center"
+ :label="$t('dataManage.dataStaticObj.type1')">
</el-table-column>
- <el-table-column
- prop="m2"
- label="浜岀骇妯″潡"
- >
+ <el-table-column v-if="queryData.value == 'countServices'" :formatter="formatterColumn2" prop="count" key="2"
+ align="center" :label="$t('dataManage.dataStaticObj.type2')">
</el-table-column>
- <el-table-column
- prop="count"
- label="缁熻鏁伴噺"
- >
+ <el-table-column v-if="queryData.value == 'countSizes'" prop="m1" key="3" align="center"
+ :label="$t('dataManage.dataStaticObj.type3')">
+ </el-table-column>
+ <el-table-column v-if="queryData.value == 'countSizes'" prop="sizes" key="4" align="center"
+ :label="$t('dataManage.dataStaticObj.type4')" :formatter="formatterColumn">
+ </el-table-column>
+ <el-table-column v-if="queryData.value == 'countSizes'" :formatter="formatterColumn3" prop="count" key="4"
+ align="center" :label="$t('dataManage.dataStaticObj.type8')">
+ </el-table-column>
+ <el-table-column v-if="queryData.value == 'countOperates'" prop="m1" key="5" align="center"
+ :label="$t('dataManage.dataStaticObj.type5')">
+ </el-table-column>
+ <el-table-column v-if="queryData.value == 'countOperates'" prop="count" :formatter="formatterColumn3" key="6"
+ align="center" :label="$t('dataManage.dataStaticObj.type7')">
+ </el-table-column>
+ <el-table-column v-if="queryData.value == 'countSizesByType'" prop="m1" key="3" align="center"
+ :label="$t('common.fileType')">
+ </el-table-column>
+ <el-table-column v-if="queryData.value == 'countSizesByType'" prop="sizes" key="4" align="center"
+ :label="$t('dataManage.dataStaticObj.type4')" :formatter="formatterColumn">
+ </el-table-column>
+ <el-table-column v-if="queryData.value == 'countSizesByType'" prop="count" :formatter="formatterColumn3"
+ key="4" align="center" :label="$t('dataManage.dataStaticObj.type8')">
+ </el-table-column>
+
+ <el-table-column v-if="queryData.value == 'countSizesByPrj'" prop="m1" key="3" align="center"
+ :label="$t('dataManage.projectObj.projname')">
+ </el-table-column>
+ <el-table-column v-if="queryData.value == 'countSizesByPrj'" prop="sizes" key="4" align="center"
+ :label="$t('dataManage.dataStaticObj.type4')" :formatter="formatterColumn">
+ </el-table-column>
+ <el-table-column v-if="queryData.value == 'countSizesByPrj'" prop="count" :formatter="formatterColumn3"
+ key="4" align="center" :label="$t('dataManage.dataStaticObj.type8')">
+ </el-table-column>
+
+
+ <el-table-column v-if="queryData.value == 'countExplorationPoints'" prop="m1" key="1" align="center"
+ :label="$t('dataManage.dataStaticObj.type1')">
+ </el-table-column>
+
+ <el-table-column v-if="queryData.value == 'countExplorationPoints'" prop="sizes" key="4" align="center"
+ :formatter="formatterColumn" :label="$t('dataManage.dataStaticObj.type4')">
+ </el-table-column>
+ <el-table-column v-if="queryData.value == 'countExplorationPoints'" prop="count" :formatter="formatterColumn3"
+ key="4" align="center" :label="$t('dataManage.dataStaticObj.type9')">
</el-table-column>
</el-table>
- <!-- <div class="pagination_box">
- <el-pagination
- @size-change="handleSizeChange"
- @current-change="handleCurrentChange"
- :current-page="listData.pageIndex"
- :page-sizes="[10, 20, 50, 100]"
- :page-size="listData.pageSize"
- layout="total, sizes, prev, pager, next, jumper"
- :total="listData.count"
- >
- </el-pagination>
- </div> -->
</div>
- <div
-
- class="contentTable"
- v-show="!setCountFlag"
- >
- <div id="countEchart" style = "width:100%;height:100%;border:1px solid red">
-
- </div>
-
-
-
+ <div id="contentEchart subpage_Div" class="contentTable" v-show="!setCountFlag">
+ <div id="chart_11"></div>
</div>
-
</div>
-
</div>
+ <el-dialog title="妯℃澘" :visible.sync="showDownLoadFlag" width="50%" :before-close="handleClose">
+ <div style="height: 50vh">
+ <el-table ref="singleTable" :data="modelData" height="calc(100% - 10px)" style="width: 100%">
+ <el-table-column type="index" :label="$t('common.index')" align="center" width="70">
+ </el-table-column>
+ <el-table-column align="center" property="fname" :label="$t('common.fileNme')">
+ </el-table-column>
+ <el-table-column property="type" :label="$t('common.format')" align="center" :formatter="showFormat">
+ </el-table-column>
+ <el-table-column width="120" :label="$t('common.operate')">
+ <template slot-scope="scope">
+ <el-button @click="setDownLoadRow(scope.row)" size="small">
+ {{ $t("common.download") }}
+ </el-button>
+ </template>
+ </el-table-column>
+ </el-table>
+ </div>
+ </el-dialog>
+ <iframe id="Iframe1" src="" style="display: none; border: 0; padding: 0; height: 0; width: 0"></iframe>
</div>
</template>
<script>
-import * as echarts from 'echarts';
+import $ from "jquery";
+import * as echarts from "echarts";
import MyBread from "../../components/MyBread.vue";
-import { dataCount_selectByPageAndCount, dataCount_selectCountOperates } from '../../api/api.js'
+import { getToken } from "@/utils/auth";
+import {
+ dataCount_selectByPageAndCount,
+ dataCount_selectCountOperates,
+ dataCount_selectCountServices,
+ dataCount_selectCountSizes,
+ dataCount_downloadReport,
+ dataCount_countSizesByType,
+ dataCount_countSizesByPrj,
+ dataCount_countExplorationPoints
+} from "../../api/api.js";
+import { t } from 'element-ui/lib/locale';
export default {
name: "DataStatistics",
components: { MyBread },
data() {
return {
- treeData: [{
- id: 1,
- label: '鏈嶅姟璋冪敤閲忕粺璁�',
- value: 'countServices',
- children: []
- }, {
- id: 2,
- label: '鏁版嵁閲忕粺璁�',
- value: 'countSizes',
- children: []
- }, {
- id: 3,
- label: '鐢ㄦ埛娴侀噺缁熻',
- value: 'countOperates',
- children: []
- }],
-
+ treeData: [
+ {
+ id: 5,
+ label: "椤圭洰缁熻鏁版嵁",
+ value: "countSizesByPrj",
+ children: [],
+ }, {
+ id: 2,
+ label: "鍗曚綅鏁版嵁缁熻",
+ value: "countSizes",
+ children: [],
+ }, {
+ id: 4,
+ label: "鏁版嵁鏍煎紡缁熻",
+ value: "countSizesByType",
+ children: [],
+ },
+ {
+ id: 3,
+ label: "鐢ㄦ埛娴侀噺缁熻",
+ value: "countOperates",
+ children: [],
+ }, {
+ id: 1,
+ label: "鏈嶅姟璋冪敤閲忕粺璁�",
+ value: "countServices",
+ children: [],
+ },
+ {
+ id: 6,
+ label: "閽诲瓟鏁版嵁缁熻",
+ value: "countExplorationPoints",
+ children: [],
+ },
+ ],
+ tjlxData: {
+ region: 'sjccl',
+ flag: false,
+ },
defaultProps: {
- children: 'children',
- label: 'label'
+ children: "children",
+ label: "label",
},
listData: {
pageIndex: 1,
pageSize: 10,
- code: '',
- name: '',
+ code: "",
+ name: "",
count: 0,
},
tableData: [],
+ modelData: [],
queryData: null,
- setCountFlag: true,
+ setCountFlag: false,
+ option: null,
+ showDownLoadFlag: false,
+ setDownloadType: false,
+ dataVolume: null,
+ reportFormsData: [],
- }
+ };
},
mounted() {
this.setStartDataCount();
},
methods: {
- //Echart鍥捐〃鏄剧ず
- showCountEchart(){
-
- var chartDom = document.getElementById('countEchart');
-var myChart = echarts.init(chartDom);
-var option;
- var dataAxis=[];
- var data=[];
- var yMax =0;
- let dataShadow = [];
- for(var i in this.tableData){
- if( this.tableData[i].count >yMax){
- yMax= this.tableData[i].count
- }
- data.push(this.tableData[i].count)
+ setTjlxDataChange() {
+ this.showCountEchart()
+ },
+ formatterColumn(row, column, cellValue, index) {
+ if (row.sizes >= 1024) {
+ return (row.sizes / 1024).toFixed(3) + "GB"
+ } else {
+ return (row.sizes).toFixed(3) + "MB"
}
- yMax = yMax+100;
-for (let i = 0; i < data.length; i++) {
- dataShadow.push(yMax);
-}
-option = {
-
- xAxis: {
- data: dataAxis,
- axisLabel: {
- color: '#000000'
},
-
- axisLine: {
- show: true
+ formatterColumn2(row) {
+ return row.count + "娆�"
},
- z: 10
- },
- yAxis: {
- axisLine: {
- show: false
+ formatterColumn3(row) {
+ return row.count + "涓�"
},
- axisTick: {
- show: false
- },
- axisLabel: {
- color: '#999'
- }
- },
- dataZoom: [
- {
- type: 'inside'
- }
- ],
- series: [
- {
- type: 'bar',
- showBackground: true,
- itemStyle: {
- color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
- { offset: 0, color: '#83bff6' },
- { offset: 0.5, color: '#188df0' },
- { offset: 1, color: '#188df0' }
- ])
- },
- emphasis: {
- itemStyle: {
- color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
- { offset: 0, color: '#2378f7' },
- { offset: 0.7, color: '#2378f7' },
- { offset: 1, color: '#83bff6' }
- ])
- }
- },
- data: data
- }
- ]
-};
-// Enable data zoom when user click bar.
-const zoomSize = 6;
-myChart.on('click', function (params) {
-
- myChart.dispatchAction({
- type: 'dataZoom',
- startValue: dataAxis[Math.max(params.dataIndex - zoomSize / 2, 0)],
- endValue:
- dataAxis[Math.min(params.dataIndex + zoomSize / 2, data.length - 1)]
- });
-});
+ setDownLoadRow(rows) {
+ var url =
+ BASE_URL +
+ "/dataCount/downloadReport?token=" +
+ getToken() +
+ "&id=" +
+ rows.id;
+ $("#Iframe1").attr("src", url).click();
+ },
+ showFormat(row, column, cellValue, index) {
+ if (cellValue) {
+ switch (cellValue) {
+ case "1":
+ return "World";
+ break;
+ case "2":
+ return "Excel";
+ break;
+ }
+ }
+ return " ";
+ },
+ handleClose() {
+ this.$confirm("纭鍏抽棴锛�")
+ .then((_) => {
+ this.closeDownLoadFlag();
+ done();
+ })
+ .catch((_) => { });
+ },
+ closeDownLoadFlag() {
+ this.showDownLoadFlag = false;
+ },
+ getReportForms() {
+ this.reportFormsData = [];
+ var val = JSON.parse(JSON.stringify(this.tableData))[0];
+ var sizes = 0;
+ var count = 0;
+ var m1 = "鎬昏"
+ for (var i in this.tableData) {
+ sizes += this.tableData[i].sizes;
+ count += this.tableData[i].count;
+ }
+ val.count = count;
+ val.sizes = sizes;
+ val.m1 = m1;
+
+ this.reportFormsData = JSON.parse(JSON.stringify(this.tableData));
+ this.reportFormsData.push(val)
},
//缁熻鍒囨崲
setCountFlagChange(res) {
switch (res) {
case 1:
+ this.getReportForms();
this.setCountFlag = true;
break;
case 2:
this.setCountFlag = false;
this.showCountEchart();
- break;
+ break;
+ case 3:
+ this.showDownLoadFlag = true;
+ this.getQueryDownloadData();
+ break;
}
},
+ async getQueryDownloadData() {
+ this.modelData = [];
+ this.listData = {
+ pageIndex: 1,
+ pageSize: 10,
+ code: this.queryData.value,
+ name: "",
+ count: 0,
+ };
+ const data = await dataCount_selectByPageAndCount(this.listData);
+ if (data.code != 200) {
+ return;
+ }
+
+ this.modelData = data.result;
+ this.listData.count = data.count;
+ },
+ //Echart鍥捐〃鏄剧ず
+ showCountEchart() {
+ var dom = document.getElementById("chart_11");
+ if (this.option != null) {
+ dom.removeAttribute("_echarts_instance_"); // 绉婚櫎瀹瑰櫒涓婄殑 _echarts_instance
+ }
+ var resizeMainContainer = function () {
+ dom.style.width = window.innerWidth * 0.75 + "px";
+ dom.style.height = window.innerHeight * 0.75 + "px";
+ };
+ //璁剧疆div瀹瑰櫒楂樺
+ resizeMainContainer();
+ var myChart = echarts.init(dom, null, {
+ renderer: "canvas",
+ useDirtyRect: false,
+ });
+
+ var app = {};
+ let dataAxis = [];
+ let yMax = 0;
+ this.option = {}
+ this.dataVolume = 0;
+ let data = [];
+ window.sjName = this.queryData.value
+ window.sjType = this.tjlxData.region
+ if (sjName == 'countServices' || sjName == 'countOperates') {
+ for (var i in this.tableData) {
+ if (this.tableData[i].count > yMax) {
+ yMax = this.tableData[i].count;
+ }
+ data.push(this.tableData[i].count);
+ var m1 = this.tableData[i].m1;
+ dataAxis.push(m1);
+ this.dataVolume += this.tableData[i].count;
+
+ }
+ this.dataVolume += "娆�"
+ } else {
+
+ for (var i in this.tableData) {
+ if (this.tableData[i].count > yMax) {
+ yMax = this.tableData[i].count;
+ }
+ if (sjType == 'sjts') {
+ data.push(this.tableData[i].count);
+ this.dataVolume += this.tableData[i].count;
+ } else if (sjType == 'sjccl') {
+
+ this.dataVolume = this.dataVolume + this.tableData[i].sizes;
+ data.push(this.tableData[i].sizes);
+
+ }
+ var m1 = this.tableData[i].m1;
+ dataAxis.push(m1);
+ }
+ if (sjType == 'sjts') {
+ this.dataVolume += '涓�';
+ } else if (sjType == 'sjccl') {
+
+ if (parseFloat(this.dataVolume) >= 1024) {
+ this.dataVolume = (this.dataVolume / 1024).toFixed(3) + 'GB';
+ } else {
+ this.dataVolume = this.dataVolume.toFixed(3) + 'MB';
+ }
+
+ }
+ }
+
+ yMax = yMax + 10;
+ let dataShadow = [];
+
+ for (let i = 0; i < data.length; i++) {
+ dataShadow.push(yMax);
+ }
+ this.option = {
+ grid: {
+ left: "5%",
+ right: "5%",
+ bottom: "5%",
+ top: "10px",
+ },
+ tooltip: {
+ //鎻愮ず妗嗙粍浠�
+ trigger: "axis", //鍧愭爣杞磋Е鍙戯紝涓昏鍦ㄦ煴鐘跺浘锛屾姌绾垮浘绛変細浣跨敤绫荤洰杞寸殑鍥捐〃涓娇鐢�
+ // axisPointer: { animation: false },
+ axisPointer: {
+ // 鍧愭爣杞存寚绀哄櫒锛屽潗鏍囪酱瑙﹀彂鏈夋晥
+ type: "line", // 榛樿涓虹洿绾匡紝鍙�変负锛�'line' | 'shadow'
+ },
+
+ formatter: function (params) {
+ var p_name = params[0].axisValue;
+ var p_val;
+ if (sjName == 'countServices' || sjName == 'countOperates') {
+ p_val = p_name + '<br/>璁块棶娆℃暟 锛�' + params[0].data + '娆�'
+
+ } else {
+ if (sjType == 'sjts') {
+ p_val = p_name + '<br/>鏂囦欢涓暟:' + params[0].data + '涓�'
+ } else {
+ if (params[0].data >= 1024) {
+ p_val = p_name + '<br/>鏁版嵁瀛樺偍閲�:' + (params[0].data / 1024).toFixed(3) + 'GB'
+ } else {
+ p_val = p_name + '<br/>鏁版嵁瀛樺偍閲�:' + params[0].data.toFixed(3) + 'MB'
+ }
+
+ }
+ }
+ return p_val;
+ },
+ },
+ xAxis: {
+ data: dataAxis,
+ axisLabel: {
+ inside: false,
+ color: "#999",
+ },
+ axisTick: {
+ show: false,
+ },
+ axisLine: {
+ show: false,
+ },
+ z: 10,
+ },
+ yAxis: {
+ name: name,
+ axisLine: {
+ show: false,
+ },
+ axisTick: {
+ show: false,
+ },
+ axisLabel: {
+ color: "#999",
+ },
+ },
+ dataZoom: [
+ {
+ type: "inside",
+ },
+ ],
+ series: [
+ {
+ type: "bar",
+ showBackground: true,
+ itemStyle: {
+ color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+ { offset: 0, color: "#83bff6" },
+ { offset: 0.5, color: "#188df0" },
+ { offset: 1, color: "#188df0" },
+ ]),
+ },
+ emphasis: {
+ itemStyle: {
+ color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+ { offset: 0, color: "#2378f7" },
+ { offset: 0.7, color: "#2378f7" },
+ { offset: 1, color: "#83bff6" },
+ ]),
+ },
+ },
+ data: data,
+ },
+ ],
+ };
+
+
+
+ // Enable data zoom when user click bar.
+ const zoomSize = 6;
+ myChart.on("click", function (params) {
+ myChart.dispatchAction({
+ type: "dataZoom",
+ startValue: dataAxis[Math.max(params.dataIndex - zoomSize / 2, 0)],
+ endValue:
+ dataAxis[
+ Math.min(params.dataIndex + zoomSize / 2, data.length - 1)
+ ],
+ });
+ });
+
+ if (this.option && typeof this.option === "object") {
+ myChart.setOption(this.option);
+ }
+
+ window.addEventListener("resize", myChart.resize);
+ },
+
//绯荤粺鍒濆鍖�
setStartDataCount() {
this.queryData = this.treeData[0];
this.$nextTick(() => {
- this.$refs.tree.setCurrentKey(this.queryData.id) // 榛樿閫変腑鑺傜偣绗竴涓�
+ this.$refs.tree.setCurrentKey(this.queryData.id); // 榛樿閫変腑鑺傜偣绗竴涓�
});
this.listData.code = this.queryData.value;
this.setQueryCountData();
+
},
//鏍戠偣鍑讳簨浠�
handleNodeClick(data, node, prop) {
- this.setCountFlag = true;
+ this.setCountFlag = false;
this.queryData = data;
this.listData.code = data.value;
this.listData.pageIndex = 1;
this.listData.pageSize = 10;
this.setQueryCountData();
},
+ handleIsopenSelect() {
+ this.$forceUpdate()
+ },
//鏌ヨ缁熻淇℃伅
async setQueryCountData() {
- const data = await dataCount_selectCountOperates();
- if (data.code != 200) {
- return
+ this.tjlxData.region = 'sjccl';
+ var data, val;
+ this.setDownloadType = true;
+ if (this.queryData.value == "countServices") {
+ data = await dataCount_selectCountServices();
+ } else if (this.queryData.value == "countSizes") {
+ data = await dataCount_selectCountSizes();
+ } else if (this.queryData.value == "countOperates") {
+ data = await dataCount_selectCountOperates();
+ } else if (this.queryData.value == "countSizesByType") {
+ data = await dataCount_countSizesByType();
+ this.setDownloadType = false;
+ } else if (this.queryData.value == "countSizesByPrj") {
+ data = await dataCount_countSizesByPrj();
+ this.setDownloadType = false;
+ } else if (this.queryData.value == "countExplorationPoints") {
+ data = await dataCount_countExplorationPoints();
}
+
+
+
+
+
+
+
+ if (this.queryData.value == 'countServices' || this.queryData.value == 'countOperates') {
+ this.tjlxData.flag = false;
+
+ } else {
+ this.tjlxData.flag = true;
+ }
+
+
+ if (data.code != 200) {
+ return;
+ }
+
+ // if (this.queryData.value == "countSizes") {
+ // // for (var i in data.result) {
+ // // data.result[i].count = data.result[i].sizes;
+ // // }
+ // }
+
+ if (this.queryData.value == "countOperates") {
+ for (var i in data.result) {
+ if (data.result[i].m2) {
+ data.result[i].m1 = data.result[i].m1 + '\\' + data.result[i].m2
+ }
+
+ }
+ }
+
this.tableData = data.result;
- this.listData.count = data.count
-
+ this.showCountEchart();
+ this.$nextTick(() => {
+ this.$refs.table.doLayout();
+ });
+ // this.listData.count = data.count;
},
-
- }
-}
+ },
+};
</script>
<style lang="less" scoped>
.dataStatistics {
- height: 98%;
- width: 98%;
- padding: 1%;
+ width: calc(100% - 20px);
+ height: calc(100% - 20px);
+ padding: 10px;
+ position: relative;
+ overflow: hidden;
+
.contentBox {
- height: calc(98% - 63px);
+ padding-top: 10px;
+
+ height: calc(100% - 50px);
width: 100%;
display: flex;
justify-content: space-around;
+
.content_Left {
- width: 18%;
+ width: 15%;
height: calc(95% - 2px);
border-radius: 5px;
padding: 1%;
}
+
.content_Right {
- width: 77%;
+ width: 80%;
height: calc(95% - 2px);
border-radius: 5px;
padding: 1%;
+
+ .iquery {
+ //padding: 1%;
+ border-radius: 5px;
+ display: flex;
+ justify-content: flex-end;
+ padding: 0px !important;
+ }
+
.contentTable {
- width: 100%;
- height: 88%;
+ width: 98%;
+ height: 82%;
+ padding: 1%;
+ border-radius: 5px;
+
+ //margin-top: 1%;
+ .el-table,
+ .el-table /deep/ .el-table__expanded-cell {
+ background-color: transparent !important;
+ }
+
+ .el-table /deep/ th,
+ .el-table /deep/ tr {
+ background-color: transparent !important;
+ }
}
}
}
}
-</style>
\ No newline at end of file
+</style>
--
Gitblit v1.9.3