|
@@ -1,8 +1,7 @@
|
|
|
<script setup name="prepare">
|
|
|
import searchCop from './components/search.vue'
|
|
|
-import excelCop from '@/components/excel.vue'
|
|
|
-import treeCop from '@/components/tree.vue'
|
|
|
import tableCop from './components/table.vue'
|
|
|
+import barLineChartCop from './components/barLineChart.vue'
|
|
|
import { ElMessage } from 'element-plus';
|
|
|
import { onMounted, ref, onActivated } from 'vue'
|
|
|
import request from '@/api/axios.js'
|
|
@@ -11,124 +10,59 @@ import {baseURL, socketURL} from '@/api/axios.js'
|
|
|
const treeHeight = ref(window.innerHeight - 260 + 'px') //tree高度
|
|
|
const excelHeight = ref(window.innerHeight - 260 + 'px') //excel高度
|
|
|
const tableHeight = ref(window.innerHeight - 260 + 'px')
|
|
|
-/**excel 开始 */
|
|
|
-const excelList = ref([])
|
|
|
-const funExcelChange = async (obj) => { //点击excel项时
|
|
|
- tableShowId.value = obj.id
|
|
|
- tableName.value = obj.name
|
|
|
- tableLoading.value = true
|
|
|
- const res = await request.get('/power/prepare/show', { params: { id: obj.id } })
|
|
|
- if(res.code === 200){
|
|
|
- tableColumn.value = res.data.title.map(o => {
|
|
|
- return {
|
|
|
- prop: o.key,
|
|
|
- label: o.des,
|
|
|
- width: o.des==='时间'? 100: 80,
|
|
|
- }
|
|
|
- })
|
|
|
- tableData.value = res.data.data
|
|
|
- tableLoading.value = false
|
|
|
- }else{
|
|
|
- tableLoading.value = false
|
|
|
- }
|
|
|
-}
|
|
|
-/**tree 开始 */
|
|
|
-const treeData = ref([])
|
|
|
-const actTreeNode = ref(null) //当前激活的treeNode
|
|
|
-const funRepeatMap = (arr) => {
|
|
|
- return arr.map(o => {
|
|
|
- if (o.children) {
|
|
|
- const findIndex = o.children.findIndex(p => !!p.type)
|
|
|
- if (findIndex !== -1) {
|
|
|
- o.childs = o.children
|
|
|
- o.children = []
|
|
|
- if(!actTreeNode.value){ //判断当且仅有process获取tree时 赋值
|
|
|
- actTreeNode.value = o
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- return {
|
|
|
- ...o,
|
|
|
- children: o.children?.length ? funRepeatMap(o.children) : []
|
|
|
- }
|
|
|
- })
|
|
|
-}
|
|
|
-const funGetTree = async () => {
|
|
|
- actTreeNode.value = null
|
|
|
- const res = await request.get("/power/prepare/tree")
|
|
|
- treeData.value = funRepeatMap(res.data)
|
|
|
- excelList.value = []
|
|
|
- if(actTreeNode.value){
|
|
|
- funCurrentChange({current: actTreeNode.value, currentNode: null})
|
|
|
- const child = actTreeNode.value.childs[0]
|
|
|
- const obj = {
|
|
|
- id: child.id,
|
|
|
- interval: child.interval,
|
|
|
- path: child.path,
|
|
|
- prepareid: child.prepareid,
|
|
|
- station: child.station,
|
|
|
- time: child.time,
|
|
|
- type: child.type,
|
|
|
- windturbine: child.windturbine,
|
|
|
- name: child.path.substring(child.path.indexOf(child.station + '_') + (child.station + '_').length)
|
|
|
- }
|
|
|
- funExcelChange(obj)
|
|
|
- }
|
|
|
-}
|
|
|
-const funCurrentChange = ({ current, currentNode }) => {
|
|
|
- if (current.childs) {
|
|
|
- excelList.value = current.childs.map(o => {
|
|
|
- return {
|
|
|
- id: o.id,
|
|
|
- interval: o.interval,
|
|
|
- path: o.path,
|
|
|
- prepareid: o.prepareid,
|
|
|
- station: o.station,
|
|
|
- time: o.time,
|
|
|
- type: o.type,
|
|
|
- windturbine: o.windturbine,
|
|
|
- name: o.path.substring(o.path.indexOf(o.station + '_') + (o.station + '_').length)
|
|
|
- }
|
|
|
- })
|
|
|
- } else {
|
|
|
- excelList.value = []
|
|
|
- }
|
|
|
-}
|
|
|
/**table 开始 */
|
|
|
const tableShowId = ref('')
|
|
|
-const tableName = ref('')
|
|
|
+const tableName = ref('风机绩效榜')
|
|
|
const tableColumn = ref([])
|
|
|
const tableLoading = ref(false)
|
|
|
const tableData = ref([])
|
|
|
-const funExport = async () => {
|
|
|
- const a = document.createElement('a')
|
|
|
- a.href = baseURL + '/power/prepare/download?id=' + tableShowId.value
|
|
|
- a.download = ''
|
|
|
- a.click()
|
|
|
-}
|
|
|
-/**submit */
|
|
|
-/**const progress = ref(0)
|
|
|
-const funWebSocket = () => {
|
|
|
- const webSocket = new WebSocket(`${socketURL}/ws/powerfitting/admin`)
|
|
|
- webSocket.onerror = () => setTimeout(() => { funWebSocket() }, 2000)
|
|
|
-
|
|
|
- webSocket.onmessage = (event) => {
|
|
|
- const message = JSON.parse(event.data)
|
|
|
- if (message.code === 200) {
|
|
|
- progress.value = Number(message.data) * 100
|
|
|
- if (progress.value === 100) {
|
|
|
- ElMessage.success('数据加载完成')
|
|
|
- funGetTree()
|
|
|
- progress.value = 0
|
|
|
+const funSummary = ({columns,data}) => {
|
|
|
+ const sums = []
|
|
|
+ columns.forEach((column, index) => {
|
|
|
+ if (index === 0) {
|
|
|
+ sums[index] = '合计'
|
|
|
+ return
|
|
|
+ }
|
|
|
+ const values = data.map((item) => Number(item[column.property]))
|
|
|
+ if (!values.every((value) => Number.isNaN(value))) {
|
|
|
+ sums[index] = values.reduce((prev, curr) => {
|
|
|
+ const value = Number(curr)
|
|
|
+ if (!Number.isNaN(value)) {
|
|
|
+ return Number((prev + curr).toFixed(2))
|
|
|
+ } else {
|
|
|
+ return Number(prev.toFixed(2))
|
|
|
+ }
|
|
|
+ }, 0)
|
|
|
+ } else {
|
|
|
+ sums[index] = '--'
|
|
|
+ }
|
|
|
+ if(['speed','fnlly'].includes(column.property)){
|
|
|
+ if(!Number.isNaN(sums[index])){
|
|
|
+ sums[index] = Number((sums[index] / data.length).toFixed(2))
|
|
|
}
|
|
|
}
|
|
|
- }
|
|
|
+ })
|
|
|
+
|
|
|
+ return sums
|
|
|
}
|
|
|
-*/
|
|
|
const funSubmit = async (params) => {
|
|
|
tableLoading.value = true
|
|
|
tableData.value = []
|
|
|
- const res = await request.get('/fjjxb/index', { params: params })
|
|
|
+ tableShowId.value = ''
|
|
|
+ barData.value = {
|
|
|
+ area: [],
|
|
|
+ legend: [],
|
|
|
+ data: [],
|
|
|
+ }
|
|
|
+ lineData.value = []
|
|
|
+ const res = await request.get('/fjjxb/index', { params: {
|
|
|
+ station: params.station,
|
|
|
+ line: params.line,
|
|
|
+ project: params.project,
|
|
|
+ type: params.type,
|
|
|
+ st: params.st,
|
|
|
+ et: params.et,
|
|
|
+ } })
|
|
|
if (res.code !== 200) { tableLoading.value = false; return false}
|
|
|
ElMessage.success(res.msg)
|
|
|
tableColumn.value = res.data.title.map(o => {
|
|
@@ -136,14 +70,98 @@ const funSubmit = async (params) => {
|
|
|
prop: o.key,
|
|
|
label: o.des,
|
|
|
width: o.des==='时间'? 100: 80,
|
|
|
+
|
|
|
}
|
|
|
})
|
|
|
tableData.value = res.data.data
|
|
|
+
|
|
|
+ const name = [],
|
|
|
+ data = [],
|
|
|
+ llfdl = [],
|
|
|
+ legend = [
|
|
|
+ "实际电量",
|
|
|
+ "计划检修损失",
|
|
|
+ "非计划检修损失",
|
|
|
+ "限电损失",
|
|
|
+ "受累损失",
|
|
|
+ "性能损失",
|
|
|
+ ],
|
|
|
+ data2 = []; //项目列表
|
|
|
+ if (params.station) {
|
|
|
+ let arr = [];
|
|
|
+ let hj = res.data.data.pop();
|
|
|
+ res.data.data.forEach((ele, index) => {
|
|
|
+ arr[ele.id.split('_')[1] - 1] = ele
|
|
|
+ })
|
|
|
+ arr.push(hj);
|
|
|
+ res.data.data = arr;
|
|
|
+ }
|
|
|
+
|
|
|
+ res.data.data.forEach((item, index) => {
|
|
|
+ name.push(item.name);
|
|
|
+ data.push([
|
|
|
+ item.sjfdl,
|
|
|
+ item.jhjx,
|
|
|
+ item.fjhjx,
|
|
|
+ item.xd,
|
|
|
+ item.sl,
|
|
|
+ item.xn,
|
|
|
+ ]);
|
|
|
+ llfdl.push(item.llfdl);
|
|
|
+ data2.push({
|
|
|
+ index: index + 1,
|
|
|
+ name: item.name,
|
|
|
+ llfdl: item.llfdl,
|
|
|
+ sjfdl: item.sjfdl,
|
|
|
+ speed: item.speed,
|
|
|
+ fjhjx: item.fjhjx,
|
|
|
+ jhjx: item.jhjx,
|
|
|
+ sl: item.sl,
|
|
|
+ xd: item.xd,
|
|
|
+ xn: item.xn,
|
|
|
+ fnlly: item.fnlly,
|
|
|
+ is_light: false,
|
|
|
+ });
|
|
|
+ });
|
|
|
+ if (data.length > 0) {
|
|
|
+ let arr1 = [];
|
|
|
+ const length = data[0].length;
|
|
|
+ for (var i = 0; i < length; i++) {
|
|
|
+ let arr2 = [];
|
|
|
+ data.forEach((ele) => {
|
|
|
+ arr2.push(ele[i]);
|
|
|
+ });
|
|
|
+ arr1.push(arr2);
|
|
|
+ }
|
|
|
+ lineData.value = llfdl;
|
|
|
+ barData.value = {
|
|
|
+ area: name,
|
|
|
+ legend: legend,
|
|
|
+ data: arr1,
|
|
|
+ };
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
tableLoading.value = false
|
|
|
+ tableShowId.value = '1'
|
|
|
}
|
|
|
+/**barlineChart 开始 */
|
|
|
+const barData = ref({
|
|
|
+ area: [],
|
|
|
+ legend: [],
|
|
|
+ data: [],
|
|
|
+})
|
|
|
+const lineData = ref([])
|
|
|
+const barColor = [
|
|
|
+ "#4b55ae",
|
|
|
+ "#e17e23",
|
|
|
+ "#ba3237",
|
|
|
+ "#c531c7",
|
|
|
+ "#ffffff",
|
|
|
+ "#05bb4c",
|
|
|
+]
|
|
|
+
|
|
|
/**created */
|
|
|
-// funGetTree()
|
|
|
-// funWebSocket()
|
|
|
/**mounted */
|
|
|
onMounted(() => {
|
|
|
tableHeight.value = window.innerHeight - 260 + 'px'
|
|
@@ -157,7 +175,6 @@ onMounted(() => {
|
|
|
})
|
|
|
/**activated */
|
|
|
onActivated(() => {
|
|
|
- funGetTree()
|
|
|
})
|
|
|
</script>
|
|
|
<template>
|
|
@@ -167,23 +184,18 @@ onActivated(() => {
|
|
|
<div class="relative shadow rounded-[6px] shadow-blue-500 px-[10px] pt-[20px] pb-[10px]">
|
|
|
<div class="text-[14px] absolute top-[-7px] text-[#838383] left-[20px]">数据展示</div>
|
|
|
<el-row :gutter="10">
|
|
|
- <el-col :span="5">
|
|
|
- <tree-cop :data="treeData" :height="treeHeight" @currentChange="funCurrentChange" @refresh="funGetTree">
|
|
|
- </tree-cop>
|
|
|
+ <el-col :span="10" class="shadow rounded-[6px] shadow-blue-500">
|
|
|
+ <bar-line-chart-cop v-if="lineData.length" :height="tableHeight" :bardata="barData" :lineData="lineData"
|
|
|
+ :color="barColor" lineName="理论发电量"></bar-line-chart-cop>
|
|
|
+ <el-empty v-else description="请选择条件"></el-empty>
|
|
|
</el-col>
|
|
|
- <el-col :span="3">
|
|
|
- <excel-cop :data="excelList" :height="excelHeight" @excelChange="funExcelChange"></excel-cop>
|
|
|
- </el-col>
|
|
|
- <el-col :span="16">
|
|
|
+ <el-col :span="14">
|
|
|
<div>
|
|
|
- <table-cop class="" :data="tableData" :column="tableColumn" :loading="tableLoading" :height="tableHeight"
|
|
|
- :tableId="tableShowId" :tableName="tableName" @export="funExport"></table-cop>
|
|
|
+ <table-cop class="" :data="tableData" :showSummary="true" :summaryMethod="funSummary" :column="tableColumn" :loading="tableLoading" :height="tableHeight"
|
|
|
+ :tableId="tableShowId" :tableName="tableName"></table-cop>
|
|
|
</div>
|
|
|
</el-col>
|
|
|
</el-row>
|
|
|
</div>
|
|
|
-
|
|
|
- <el-progress :percentage="progress" v-if="progress" class="!absolute top-0 right-0 left-0" :indeterminate="false"
|
|
|
- color="rgb(19,206,102)" :stroke-width="4" :show-text="false" />
|
|
|
</div>
|
|
|
</template>
|