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 | 465 +++++++++++++++++++++++++++++++++++++++++-----------------
1 files changed, 328 insertions(+), 137 deletions(-)
diff --git a/src/views/datamanage/dataStatistics.vue b/src/views/datamanage/dataStatistics.vue
index e1df49b..d793e71 100644
--- a/src/views/datamanage/dataStatistics.vue
+++ b/src/views/datamanage/dataStatistics.vue
@@ -1,115 +1,121 @@
<template>
- <div class="dataStatistics">
- <My-bread
- :list="[
- `${$t('dataManage.dataManage')}`,
- `${$t('dataManage.dataStatistics')}`,
- ]"
- ></My-bread>
+ <div class="box_div dataStatistics">
+ <My-bread :list="[
+ `${$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="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-button
- icon="el-icon-download"
- @click="setCountFlagChange(3)"
- ></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"
- align="center"
- :label="$t('dataManage.dataStaticObj.type1')"
- >
+ <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"
- align="center"
- :label="$t('dataManage.dataStaticObj.type2')"
- >
+ <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"
- align="center"
- :label="$t('dataManage.dataStaticObj.type3')"
- >
+ <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 id="contentEchart" class="contentTable" v-show="!setCountFlag">
+ <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"
- >
+ <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 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 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 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">
@@ -121,11 +127,7 @@
</el-table>
</div>
</el-dialog>
- <iframe
- id="Iframe1"
- src=""
- style="display: none; border: 0; padding: 0; height: 0; width: 0"
- ></iframe>
+ <iframe id="Iframe1" src="" style="display: none; border: 0; padding: 0; height: 0; width: 0"></iframe>
</div>
</template>
@@ -140,7 +142,11 @@
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 },
@@ -148,15 +154,19 @@
return {
treeData: [
{
- id: 1,
- label: "鏈嶅姟璋冪敤閲忕粺璁�",
- value: "countServices",
+ id: 5,
+ label: "椤圭洰缁熻鏁版嵁",
+ value: "countSizesByPrj",
children: [],
- },
- {
+ }, {
id: 2,
- label: "鏁版嵁閲忕粺璁�",
+ label: "鍗曚綅鏁版嵁缁熻",
value: "countSizes",
+ children: [],
+ }, {
+ id: 4,
+ label: "鏁版嵁鏍煎紡缁熻",
+ value: "countSizesByType",
children: [],
},
{
@@ -164,9 +174,23 @@
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",
@@ -181,15 +205,35 @@
tableData: [],
modelData: [],
queryData: null,
- setCountFlag: true,
+ setCountFlag: false,
option: null,
showDownLoadFlag: false,
+ setDownloadType: false,
+ dataVolume: null,
+ reportFormsData: [],
+
};
},
mounted() {
this.setStartDataCount();
},
methods: {
+ 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"
+ }
+ },
+ formatterColumn2(row) {
+ return row.count + "娆�"
+ },
+ formatterColumn3(row) {
+ return row.count + "涓�"
+ },
setDownLoadRow(rows) {
var url =
BASE_URL +
@@ -219,15 +263,33 @@
this.closeDownLoadFlag();
done();
})
- .catch((_) => {});
+ .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:
@@ -241,6 +303,7 @@
}
},
async getQueryDownloadData() {
+ this.modelData = [];
this.listData = {
pageIndex: 1,
pageSize: 10,
@@ -263,8 +326,8 @@
dom.removeAttribute("_echarts_instance_"); // 绉婚櫎瀹瑰櫒涓婄殑 _echarts_instance
}
var resizeMainContainer = function () {
- dom.style.width = window.innerWidth * 0.65 + "px";
- dom.style.height = window.innerHeight * 0.6 + "px";
+ dom.style.width = window.innerWidth * 0.75 + "px";
+ dom.style.height = window.innerHeight * 0.75 + "px";
};
//璁剧疆div瀹瑰櫒楂樺
resizeMainContainer();
@@ -275,24 +338,58 @@
var app = {};
let dataAxis = [];
-
- let data = [];
let yMax = 0;
- for (var i in this.tableData) {
- if (this.tableData[i].count > yMax) {
- yMax = this.tableData[i].count;
- }
+ 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;
- data.push(this.tableData[i].count);
- var m1 = this.tableData[i].m1;
- if (this.tableData[i].m2 != null) {
- m1 += "_" + this.tableData[i].m2;
}
- dataAxis.push(m1);
+ 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);
}
@@ -306,13 +403,32 @@
tooltip: {
//鎻愮ず妗嗙粍浠�
trigger: "axis", //鍧愭爣杞磋Е鍙戯紝涓昏鍦ㄦ煴鐘跺浘锛屾姌绾垮浘绛変細浣跨敤绫荤洰杞寸殑鍥捐〃涓娇鐢�
- axisPointer: { animation: false },
+ // axisPointer: { animation: false },
axisPointer: {
// 鍧愭爣杞存寚绀哄櫒锛屽潗鏍囪酱瑙﹀彂鏈夋晥
type: "line", // 榛樿涓虹洿绾匡紝鍙�変负锛�'line' | 'shadow'
},
- formatter: " {b} : <br/>缁熻閲� : {c}",
+ 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,
@@ -329,6 +445,7 @@
z: 10,
},
yAxis: {
+ name: name,
axisLine: {
show: false,
},
@@ -368,16 +485,18 @@
},
],
};
+
+
+
// Enable data zoom when user click bar.
const zoomSize = 6;
myChart.on("click", function (params) {
- console.log(dataAxis[Math.max(params.dataIndex - zoomSize / 2, 0)]);
myChart.dispatchAction({
type: "dataZoom",
startValue: dataAxis[Math.max(params.dataIndex - zoomSize / 2, 0)],
endValue:
dataAxis[
- Math.min(params.dataIndex + zoomSize / 2, data.length - 1)
+ Math.min(params.dataIndex + zoomSize / 2, data.length - 1)
],
});
});
@@ -397,36 +516,79 @@
});
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() {
- var data;
+ 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") {
+ // 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) {
- data.result[i].count = data.result[i].sizes;
+ if (data.result[i].m2) {
+ data.result[i].m1 = data.result[i].m1 + '\\' + data.result[i].m2
+ }
+
}
}
+
this.tableData = data.result;
+ this.showCountEchart();
+ this.$nextTick(() => {
+ this.$refs.table.doLayout();
+ });
// this.listData.count = data.count;
},
},
@@ -435,28 +597,57 @@
<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: 84%;
+ 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;
+ }
}
}
}
--
Gitblit v1.9.3