Web/admin-govern
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

t

Browse Source
This commit is contained in:
仲么了
2024-01-05 14:07:53 +08:00
parent 5b42718d6f b65691e062
commit 379732c7d5
12 changed files with 138 additions and 154 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
src/api/Region/index.ts
View File

@@ -1,10 +0,0 @@
import createAxios from '@/utils/request'
//监测网分布查询
export function getAreaLineDetail(data:any) {
return createAxios({
url: '/event-boot/area/getAreaLineDetail',
method: 'post',
data
})
}

11
src/api/test.ts
View File

@@ -1,11 +0,0 @@
import createAxios from '@/utils/request'
//测试页面
export function getAreaCalculation(data: anyObj) {
return createAxios({
url: '/event-boot/areaStatistics/getAreaCalculation',
method: 'post',
data
})
}

58
src/components/table/header/index.vue
View File

@@ -1,42 +1,41 @@
<template>
<div ref='tableHeader' class='cn-table-header'>
<div ref="tableHeader" class="cn-table-header">
<!-- 通用搜索 -->
<transition name='el-zoom-in-bottom' mode='out-in'>
<div id='table-com-search1' class='table-com-search' v-show='showSelect'>
</div>
<transition name="el-zoom-in-bottom" mode="out-in">
<div id="table-com-search1" class="table-com-search" v-show="showSelect"></div>
</transition>
<div class='table-header ba-scroll-style'>
<div id='table-com-search2' style='flex: 1; height: 32px; overflow: hidden; margin-right: 20px'>
<div class="table-header ba-scroll-style">
<div id="table-com-search2" style="flex: 1; height: 32px; overflow: hidden; margin-right: 20px">
<el-form
id='header-form'
@submit.prevent=''
@keyup.enter='onComSearch'
label-position='left'
:inline='true'
class='table-com-search-form'
:label-width='90'
id="header-form"
@submit.prevent=""
@keyup.enter="onComSearch"
label-position="left"
:inline="true"
class="table-com-search-form"
:label-width="90"
>
<el-form-item label='日期' v-if='datePicker' style='grid-column: span 2; max-width: unset'>
<DatePicker ref='Picker'></DatePicker>
<el-form-item label="日期" v-if="datePicker" style="grid-column: span 2; max-width: unset">
<DatePicker ref="Picker"></DatePicker>
</el-form-item>
<slot name='select'></slot>
<slot name="select"></slot>
</el-form>
</div>
<template v-if='$slots.select'>
<el-button @click='onComSearch' type='primary'>查询</el-button>
<el-button @click='onResetForm'>重置</el-button>
<div class='table-search-button-group' v-if='showUnfoldButton'>
<el-button class='table-search-button-item' color='#dcdfe6' plain @click='showSelectChange'>
<Icon size='14' name='el-icon-Search' />
<template v-if="$slots.select">
<el-button @click="onComSearch" type="primary">查询</el-button>
<el-button @click="onResetForm">重置</el-button>
<div class="table-search-button-group" v-if="showUnfoldButton">
<el-button class="table-search-button-item" color="#dcdfe6" plain @click="showSelectChange">
<Icon size="14" name="el-icon-Search" />
</el-button>
</div>
</template>
<slot name='operation'></slot>
<slot name="operation"></slot>
</div>
</div>
</template>
<script setup lang='ts'>
<script setup lang="ts">
import { inject, ref, onMounted, nextTick, onUnmounted } from 'vue'
import type TableStore from '@/utils/tableStore'
import DatePicker from '@/components/form/datePicker/index.vue'
@@ -69,8 +68,11 @@ const resizeObserver = new ResizeObserver(entries => {
})
const showUnfoldButton = ref(false)
onMounted(() => {
if (props.datePicker) {
tableStore.table.params.searchBeginTime = Picker.value.timeValue[0]
tableStore.table.params.searchEndTime = Picker.value.timeValue[1]
tableStore.table.params.timeFlag = Picker.value.timeFlag
}
nextTick(() => {
resizeObserver.observe(tableHeader.value)
const dom = document.getElementById('header-form') as HTMLElement
@@ -102,10 +104,12 @@ const showSelectChange = () => {
}
}
const onComSearch = async () => {
console.log('时间1233123')
if (props.datePicker) {
tableStore.table.params.searchBeginTime = Picker.value.timeValue[0]
tableStore.table.params.searchEndTime = Picker.value.timeValue[1]
tableStore.table.params.timeFlag = Picker.value.timeFlag
}
await tableStore.onTableAction('search', {})
}
const onResetForm = () => {
@@ -117,7 +121,7 @@ const dateChange = () => {
}
</script>
<style scoped lang='scss'>
<style scoped lang="scss">
.table-header {
position: relative;
overflow-x: auto;

3
src/styles/app.scss
View File

@@ -45,6 +45,7 @@ body,
}
.default-main {
background: #fff;
margin: var(--ba-main-space) var(--ba-main-space) 0px var(--ba-main-space);
}
.zoom-handle {
@@ -120,7 +121,7 @@ body,
padding-top: 20px;
padding-bottom: 52px;
}
.ba-operate-dialog .el-dialog__body .el-scrollbar{
.ba-operate-dialog .el-dialog__body .el-scrollbar {
padding-right: 60px;
}
.ba-operate-dialog .el-dialog__footer {

1
src/styles/element.scss
View File

@@ -91,3 +91,4 @@
background: var(--el-color-primary);
color: var(--el-color-white);
}

11
src/styles/vxeTable.scss
View File

@@ -1,16 +1,11 @@
.vxe-table--body-wrapper::-webkit-scrollbar {
width:10px;
width: 10px;
height: 10px;
}
.vxe-table--body-wrapper::-webkit-scrollbar-thumb {
border-radius: 5px;
height: 3px;
background-color: #059f95 !important;
background-color: var(--el-color-primary) !important;
border-radius: 30px !important;
}
.vxe-table--body-wrapper::-webkit-scrollbar-track {
box-shadow: inset 0 0 5px rgb(174, 173, 173);
border-radius: 2px;
background: rgb(235, 233, 233);
}

96
src/views/Event-boot/Region/distribution.vue
View File

@@ -1,6 +1,6 @@
<template>
<div class="default-main">
<el-form :inline="true" :model="formInline" class="demo-form-inline">
<!-- <el-form :inline="true" :model="formInline" class="demo-form-inline">
<el-form-item label="区域">
<Area v-model="formInline.deptIndex" ref="area" />
</el-form-item>
@@ -13,14 +13,29 @@
>
<el-option v-for="item in options" :key="item.id" :label="item.name" :value="item" />
</el-select>
<!-- <el-input v-model="formInline.statisticalType" placeholder="请选择区域" clearable /> -->
</el-form-item>
<el-form-item>
<el-button type="primary" @click="onSubmit">查询</el-button>
</el-form-item>
</el-form>
<div v-loading="loading">
</el-form> -->
<TableHeader>
<template v-slot:select>
<el-form-item label="区域">
<Area ref="area" v-model="tableStore.table.params.deptIndex" />
</el-form-item>
<el-form-item label="统计类型">
<el-select
v-model="tableStore.table.params.statisticalType"
value-key="id"
placeholder="请选择统计类型"
size="large"
>
<el-option v-for="item in options" :key="item.id" :label="item.name" :value="item" />
</el-select>
</el-form-item>
</template>
</TableHeader>
<div v-loading="tableStore.table.loading">
<el-row :gutter="10">
<el-col :span="12">
<MyEchartMap
@@ -62,13 +77,14 @@
</div>
</template>
<script setup lang="ts">
import TableHeader from '@/components/table/header/index.vue'
import Area from '@/components/form/area/index.vue'
import { getAreaLineDetail } from '@/api/Region'
import { useDictData } from '@/stores/dictData'
import { defaultAttribute } from '@/components/table/defaultAttribute'
import MyEchartMap from '@/components/echarts/MyEchartMap.vue'
import MyEchart from '@/components/echarts/MyEchart.vue'
import { ref, reactive, onMounted, provide } from 'vue'
import TableStore from '@/utils/tableStore'
import { ref, onMounted, provide } from 'vue'
import { mainHeight } from '@/utils/layout'
defineOptions({
name: 'Region/distribution'
@@ -79,37 +95,34 @@ const options = dictData.getBasicData('Statistical_Type', ['Report_Type'])
const echartMapList = ref({})
const echartList = ref({})
const titleA = ref('')
const distributionData = ref([])
const distributionData: any = ref([])
const area = ref()
const loading = ref(true)
const formInline = reactive({
deptIndex: dictData.state.area[0].id,
monitorFlag: 2,
powerFlag: 2,
serverName: 'event-boot',
statisticalType: dictData.getBasicData('Statistical_Type', ['Report_Type'])[0]
})
const onSubmit = () => {
loading.value = true
titleA.value = formInline.statisticalType.name
getAreaLineDetail(formInline).then(res => {
const tableStore = new TableStore({
url: '/event-boot/area/getAreaLineDetail',
method: 'POST',
column: [],
loadCallback: () => {
titleA.value = tableStore.table.params.statisticalType.name
area.value.change()
// 处理地图数据
map(res)
tabulation(res)
histogram(res)
map(tableStore.table.data)
tabulation(tableStore.table.data)
histogram(tableStore.table.data)
EchartMap.value.GetEchar(area.value.areaName)
loading.value = false
})
}
}
})
provide('tableStore', tableStore)
tableStore.table.params.deptIndex = dictData.state.area[0].id
tableStore.table.params.statisticalType = dictData.getBasicData('Statistical_Type', ['Report_Type'])[0]
tableStore.table.params.monitorFlag = 2
tableStore.table.params.powerFlag = 2
tableStore.table.params.serverName = 'event-boot'
// 地图点击事件
const getRegionByRegion = (list: any) => {
formInline.deptIndex = list.id
onSubmit()
tableStore.table.params.deptIndex = list.id
tableStore.onTableAction('search', {})
}
// 消除点
const eliminate = (name: string) => {
@@ -158,8 +171,8 @@ const map = (res: any) => {
}
}
let mapList = [[], [], []]
if (res.data.substationDetailVOList != null) {
res.data.substationDetailVOList.forEach((item: any) => {
if (res.substationDetailVOList != null) {
res.substationDetailVOList.forEach((item: any) => {
if (item.color == 'green') {
mapList[0].push(item)
} else if (item.color == 'red') {
@@ -225,12 +238,12 @@ const map = (res: any) => {
// 表格数据处理
const tabulation = (res: any) => {
distributionData.value = []
for (var i = 0; i < res.data.areaValue.length; i++) {
for (var i = 0; i < res.areaValue.length; i++) {
distributionData.value.push({
qy: res.data.areaValue[i][0],
jcd: res.data.areaValue[i][1],
zc: res.data.areaValue[i][2],
zd: res.data.areaValue[i][3]
qy: res.areaValue[i][0],
jcd: res.areaValue[i][1],
zc: res.areaValue[i][2],
zd: res.areaValue[i][3]
})
}
}
@@ -305,15 +318,16 @@ const histogram = (res: any) => {
}
onMounted(() => {
onSubmit()
tableStore.index()
})
const layout = mainHeight(73) as any
const layout = mainHeight(83) as any
const layout1 = mainHeight(93) as any
</script>
<style lang="scss" scoped>
.map {
height: v-bind('layout.height');
}
.tall {
height: calc(v-bind('layout.height') / 2);
height: calc(v-bind('layout1.height') / 2);
}
</style>

5
src/views/auth/menu/index.vue
View File

@@ -80,7 +80,10 @@ onMounted(() => {
if (item.children && item.children.length > 0) {
item.children = handlerRouter(item.children)
}
return item.meta
return {
...item.meta,
...item
}
})
}
tableStore.table.data = handlerRouter(navTabs.state.tabsViewRoutes)

10
src/views/dashboard/components/Tableabove.vue
View File

@@ -47,9 +47,9 @@ import { ref, reactive, defineExpose, computed } from 'vue'
import { defaultAttribute } from '@/components/table/defaultAttribute'
import { mainHeight } from '@/utils/layout'
const areaData = ref([])
const levelData = ref([])
const shareData = ref([])
const areaData:any = ref([])
const levelData:any = ref([])
const shareData:any = ref([])
const tableHeaderAera = ref<any[]>([
{ prop: 'areaName', label: '区域名称', width: '120px' },
@@ -105,8 +105,8 @@ const formatter = (row: any) => {
}
}
defineExpose({ info })
const layout = mainHeight(175) as any
const defaultMain = mainHeight(185) as any
const layout = mainHeight(185) as any
const defaultMain = mainHeight(195) as any
</script>
<style lang="scss" scoped>
::v-deep(.el-tabs--left, ) {

4
src/views/dashboard/components/echart.vue
View File

@@ -192,7 +192,7 @@ const Relation = (list: any, interval: number) => {
})
monthlyStatistics.value = {
title: {
text: interval == 1 ? '年份' : interval == 2 ? '季度' : interval == 3 ? '月份' : ''
text: '时间'
},
tooltip: {
formatter: function (params: any) {
@@ -283,7 +283,7 @@ const Relation = (list: any, interval: number) => {
}
// Processing()
defineExpose({ Processing, Grade, Relation })
const layout = mainHeight(140) as any
const layout = mainHeight(150) as any
</script>
<style lang="scss" scoped>

71
src/views/dashboard/index.vue
View File

@@ -1,17 +1,13 @@
<template>
<div class="default-main">
<el-form :inline="true" :model="formInline" class="demo-form-inline">
<TableHeader date-picker>
<template v-slot:select>
<el-form-item label="区域">
<Area v-model="formInline.deptIndex" />
<Area v-model="tableStore.table.params.deptIndex" />
</el-form-item>
<el-form-item label="时间">
<DatePicker ref="Picker" />
</el-form-item>
<el-form-item>
<el-button type="primary" @click="onSubmit">查询</el-button>
</el-form-item>
</el-form>
<el-tabs v-model="activeName" type="border-card" v-loading="loading">
</template>
</TableHeader>
<el-tabs v-model="activeName" type="border-card" v-loading="tableStore.table.loading">
<el-tab-pane label="图形" name="1">
<Echart :list="list" ref="echarts" />
</el-tab-pane>
@@ -21,56 +17,47 @@
</template>
<script setup lang="ts">
import TableHeader from '@/components/table/header/index.vue'
import Area from '@/components/form/area/index.vue'
import { useDictData } from '@/stores/dictData'
import Echart from '@/views/dashboard/components/echart.vue'
import Tableabove from '@/views/dashboard/components/Tableabove.vue'
import DatePicker from '@/components/form/datePicker/index.vue'
import { onMounted, reactive, ref, onBeforeMount } from 'vue'
import TableStore from '@/utils/tableStore'
import { onMounted, reactive, ref, provide } from 'vue'
import { mainHeight } from '@/utils/layout'
defineOptions({
name: 'Region/overview'
})
const activeName = ref('1')
import { getAreaCalculation } from '@/api/test'
const list = ref([])
const echarts = ref()
const Picker = ref()
const table = ref()
const dictData = useDictData()
const loading = ref(true)
const formInline = reactive({
deptInd: '',
deptIndex: dictData.state.area[0].id,
monitorFlag: 2,
powerFlag: 2,
serverName: 'event-boot',
searchBeginTime: '',
searchEndTime: '',
statisticalType: dictData.getBasicData('Statistical_Type', ['Load_Type'])[3],
timeFlag: 1
const tableStore = new TableStore({
url: '/event-boot/areaStatistics/getAreaCalculation',
method: 'POST',
column: [],
loadCallback: () => {
list.value = tableStore.table.data
echarts.value.Processing(tableStore.table.data.areaStatistics)
echarts.value.Grade(tableStore.table.data.voltageStatistics)
echarts.value.Relation(tableStore.table.data.monthlyStatistics)
table.value.info(tableStore.table.data)
}
})
provide('tableStore', tableStore)
// const locale=zhCn
const onSubmit = async () => {
loading.value = true
formInline.searchBeginTime = Picker.value.timeValue[0]
formInline.searchEndTime = Picker.value.timeValue[1]
formInline.timeFlag = Picker.value.timeFlag
await getAreaCalculation(formInline).then(res => {
list.value = res.data
echarts.value.Processing(res.data.areaStatistics)
echarts.value.Grade(res.data.voltageStatistics)
echarts.value.Relation(res.data.monthlyStatistics,Picker.value.interval)
table.value.info(res.data)
loading.value = false
})
}
tableStore.table.params.deptIndex = dictData.state.area[0].id
tableStore.table.params.statisticalType = dictData.getBasicData('Statistical_Type', ['Load_Type'])[3]
tableStore.table.params.monitorFlag = 2
tableStore.table.params.powerFlag = 2
tableStore.table.params.serverName = 'event-boot'
onMounted(() => {
onSubmit()
tableStore.index()
})
const layout = mainHeight(113) as any
const layout = mainHeight(123) as any
</script>
<style lang="scss" scoped>

2
src/views/voltage/sags/operationsManagement/statistics.vue
View File

@@ -411,6 +411,6 @@ const layout = mainHeight(104) as any
grid-template-columns: 1fr 600px;
grid-template-rows: 1fr 1fr;
grid-gap: 10px;
background: #fff;
}
</style>