This commit is contained in:
朱菊兰 2023-09-19 15:45:16 +08:00
parent 282ef45114
commit 5a31498224
14 changed files with 451 additions and 293 deletions

View File

@ -14,13 +14,8 @@ VUE_APP_TITLE = 芋道管理系统
# 芋道管理系统/开发环境 # 芋道管理系统/开发环境
# VUE_APP_BASE_API = 'http://192.168.1.49:48080' # VUE_APP_BASE_API = 'http://192.168.1.49:48080'
# VUE_APP_BASE_API = 'http://192.168.1.8:48080' # VUE_APP_BASE_API = 'http://192.168.1.8:48080'
<<<<<<< HEAD
VUE_APP_BASE_API = 'http://192.168.0.33:48080' VUE_APP_BASE_API = 'http://192.168.0.33:48080'
# VUE_APP_BASE_API = 'http://192.168.1.188:48080' # VUE_APP_BASE_API = 'http://192.168.1.188:48080'
=======
# VUE_APP_BASE_API = 'http://192.168.0.33:48080'
VUE_APP_BASE_API = 'http://192.168.1.188:48080'
>>>>>>> test
# 路由懒加载 # 路由懒加载
VUE_CLI_BABEL_TRANSPILE_MODULES = true VUE_CLI_BABEL_TRANSPILE_MODULES = true

View File

@ -0,0 +1,12 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="18px" height="18px" viewBox="0 0 18 18" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>下拉展开</title>
<g id="页面" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="编组-43" transform="translate(-1870.000000, -119.000000)" fill-rule="nonzero">
<g id="下拉展开" transform="translate(1870.000000, 119.000000)">
<rect id="矩形" fill="#000000" opacity="0" x="0" y="0" width="18" height="18"></rect>
<path d="M9.79014922,13.2165873 L16.1721224,6.15356667 C16.6092925,5.77338351 16.6092925,5.16518371 16.1721224,4.78500055 C15.964758,4.60350795 15.6800768,4.50112918 15.3827707,4.50112918 C15.0854647,4.50112918 14.8007835,4.60350795 14.5934191,4.78500055 L9.00013482,11.162609 L3.40552499,4.78387137 C3.19816065,4.60237877 2.91347942,4.5 2.61617336,4.5 C2.3188673,4.5 2.03418606,4.60237877 1.82682172,4.78387137 C1.39105943,5.16454327 1.39105943,5.77176559 1.82682172,6.15243749 L8.20879489,13.214329 C8.31400161,13.3066969 8.440317,13.3797143 8.57994259,13.4288732 C8.99637706,13.5753327 9.475517,13.4912854 9.79014922,13.2165873 Z" id="路径" fill="#0B58FF"></path>
</g>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.3 KiB

View File

@ -0,0 +1,14 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="18px" height="18px" viewBox="0 0 18 18" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>收起</title>
<g id="页面" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="编组-43" transform="translate(-1870.000000, -485.000000)" fill-rule="nonzero">
<g id="编组-18备份" transform="translate(1.000000, 366.000000)">
<g id="收起" transform="translate(1878.000000, 128.000000) scale(1, -1) translate(-1878.000000, -128.000000) translate(1869.000000, 119.000000)">
<rect id="矩形" fill="#000000" opacity="0" x="0" y="0" width="18" height="18"></rect>
<path d="M9.79014922,13.2165873 L16.1721224,6.15356667 C16.6092925,5.77338351 16.6092925,5.16518371 16.1721224,4.78500055 C15.964758,4.60350795 15.6800768,4.50112918 15.3827707,4.50112918 C15.0854647,4.50112918 14.8007835,4.60350795 14.5934191,4.78500055 L9.00013482,11.162609 L3.40552499,4.78387137 C3.19816065,4.60237877 2.91347942,4.5 2.61617336,4.5 C2.3188673,4.5 2.03418606,4.60237877 1.82682172,4.78387137 C1.39105943,5.16454327 1.39105943,5.77176559 1.82682172,6.15243749 L8.20879489,13.214329 C8.31400161,13.3066969 8.440317,13.3797143 8.57994259,13.4288732 C8.99637706,13.5753327 9.475517,13.4912854 9.79014922,13.2165873 Z" id="路径" fill="#0B58FF"></path>
</g>
</g>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.5 KiB

View File

@ -13,8 +13,17 @@ body {
font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Arial, sans-serif; font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Arial, sans-serif;
} }
label { // label {
font-weight: 700; // font-weight: 700;
// }
.searchBarBox .el-form-item--medium .el-form-item__label {
line-height: 40px;
}
.searchBarBox .el-form-item--medium .el-form-item__content {
line-height: 40px;
}
.searchBarBox .el-range-editor--small.el-input__inner {
height: 34px;
} }
html { html {

View File

@ -52,6 +52,13 @@ Vue.prototype.divide = divide;
Vue.prototype.tableHeight = function(n) { Vue.prototype.tableHeight = function(n) {
return window.innerHeight - n return window.innerHeight - n
} }
Vue.prototype.searchBarWidth = function(name, num) {
if (document.getElementById(name) && document.getElementById(name).offsetWidth < num) {
return true
} else {
return false
}
}
// 全局组件挂载 // 全局组件挂载
Vue.component('DictTag', DictTag); Vue.component('DictTag', DictTag);

View File

@ -1,151 +1,160 @@
<template> <template>
<el-form :inline="true" class="demo-form-inline"> <div class="searchBarBox divHeight" ref="searchBarRef" :style="{ paddingRight: isFold ? '55px' : '0px' }">
<span class="blue-block"></span> <el-form :inline="true" class="demo-form-inline">
<el-form-item label="能源类型"> <span class="blue-block"></span>
<el-select v-model="queryParams.energyTypeId" placeholder="请选择" style="width: 100px;" size="small"> <el-form-item label="能源类型">
<el-option <el-select v-model="queryParams.energyTypeId" placeholder="请选择" style="width: 100px;" size="small">
v-for="item in energyTypeList" <el-option
:key="item.id" v-for="item in energyTypeList"
:label="item.name" :key="item.id"
:value="item.id"> :label="item.name"
</el-option> :value="item.id">
</el-select> </el-option>
</el-form-item> </el-select>
<el-form-item label="时间维度"> </el-form-item>
<el-select v-model="queryParams.timeDim" placeholder="请选择" style="width: 80px;" size="small"> <el-form-item label="时间维度">
<el-option <el-select v-model="queryParams.timeDim" placeholder="请选择" style="width: 80px;" size="small">
v-for="item in getDictDatas(this.DICT_TYPE.TIME_DIM)" <el-option
:key="item.value" v-for="item in getDictDatas(this.DICT_TYPE.TIME_DIM)"
:label="item.label" :key="item.value"
:value="item.value"> :label="item.label"
</el-option> :value="item.value">
</el-select> </el-option>
</el-form-item> </el-select>
<el-form-item label="时间范围"> </el-form-item>
<div v-show="queryParams.timeDim === '1'"> <el-form-item label="时间范围">
<el-date-picker <div v-show="queryParams.timeDim === '1'">
v-model="timeValue" <el-date-picker
type="datetimerange" v-model="timeValue"
range-separator="至" type="datetimerange"
start-placeholder="开始日期" range-separator="至"
end-placeholder="结束日期" start-placeholder="开始日期"
format="yyyy-MM-dd HH:mm" end-placeholder="结束日期"
value-format="timestamp" format="yyyy-MM-dd HH:mm"
:picker-options="pickerOptions" value-format="timestamp"
popper-class="noneMinute" :picker-options="pickerOptions"
@change="timeSelect" popper-class="noneMinute"
size="small" @change="timeSelect"
:clearable="false" size="small"
style='width:350px;'
:clearable="false"
>
</el-date-picker>
</div>
<div v-show="queryParams.timeDim === '2'">
<el-date-picker
v-model="dateValue"
type="daterange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
value-format="timestamp"
:picker-options="pickerOptions"
:clearable="false"
size="small"
style='width:350px;'
@change="timeSelect"
>
</el-date-picker>
</div>
<div v-show="queryParams.timeDim === '3'">
<el-date-picker
v-model="weekValue1"
type="week"
format="yyyy 第 WW 周"
style='width:170px;'
:picker-options="pickerOptionsWeek"
@change="startWeek"
:clearable="false"
size="small"
placeholder="选择周">
</el-date-picker>-
<el-date-picker
v-model="weekValue2"
type="week"
format="yyyy 第 WW 周"
:picker-options="pickerOptionsWeek"
style='width:170px;'
@change="endWeek"
:clearable="false"
size="small"
placeholder="选择周">
</el-date-picker>
</div>
<div v-show="queryParams.timeDim === '4'">
<el-date-picker
v-model="monthValue"
type="monthrange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
value-format="timestamp"
:clearable="false"
:picker-options="pickerOptions"
size="small"
style='width:350px;'
@change="timeSelect"
>
</el-date-picker>
</div>
<div v-show="queryParams.timeDim === '5'">
<el-date-picker
style='width:170px;'
v-model="yearValue1"
type="year"
:picker-options="pickerOptions"
value-format="timestamp"
placeholder="选择年"
@change="startYear"
size="small"
:clearable="false"
> >
</el-date-picker> </el-date-picker>-
</div> <el-date-picker
<div v-show="queryParams.timeDim === '2'"> style='width:170px;'
<el-date-picker v-model="yearValue2"
v-model="dateValue" type="year"
type="daterange" :picker-options="pickerOptions"
range-separator="至" value-format="timestamp"
start-placeholder="开始日期" placeholder="选择年"
end-placeholder="结束日期" @change="endYear"
value-format="timestamp" size="small"
:picker-options="pickerOptions" :clearable="false"
:clearable="false"
size="small"
@change="timeSelect"
> >
</el-date-picker> </el-date-picker>
</div> </div>
<div v-show="queryParams.timeDim === '3'"> </el-form-item>
<el-date-picker <el-form-item label="对象维度">
v-model="weekValue1" <el-select v-model="queryParams.objType" placeholder="请选择" style="width: 80px;" @change="selectObjs" size="small">
type="week" <el-option
format="yyyy 第 WW 周" v-for="item in getDictDatas(this.DICT_TYPE.OBJECT_TYPE)"
style='width:150px;' :key="item.value"
:picker-options="pickerOptionsWeek" :label="item.label"
@change="startWeek" :value="item.value">
:clearable="false" </el-option>
size="small" </el-select>
placeholder="选择周"> </el-form-item>
</el-date-picker>- <el-form-item label="对象选择">
<el-date-picker <el-select v-model="queryParams.objIds" placeholder="请选择" multiple collapse-tags style="width: 200px;" size="small">
v-model="weekValue2" <el-option
type="week" v-for="item in objectList"
format="yyyy 第 WW 周" :key="item.id"
:picker-options="pickerOptionsWeek" :label="item.name"
style='width:150px;' :value="item.id">
@change="endWeek" <span style="float: left">{{ item.name }}</span>
:clearable="false" <span style="float: right; color: #8492a6; font-size: 13px">{{ item.code }}</span>
size="small" </el-option>
placeholder="选择周"> </el-select>
</el-date-picker> </el-form-item>
</div> <el-form-item>
<div v-show="queryParams.timeDim === '4'"> <el-button type="primary" size="small" @click="search">查询</el-button>
<el-date-picker </el-form-item>
v-model="monthValue" </el-form>
type="monthrange" <span v-if="isFold" class="foldClass" @click='switchMode'>
range-separator="至" {{ isExpand ? '收起' : '展开' }}
start-placeholder="开始日期" <svg-icon :icon-class="isExpand ? 'upward' : 'downward'" />
end-placeholder="结束日期" </span>
value-format="timestamp" </div>
:clearable="false"
:picker-options="pickerOptions"
size="small"
@change="timeSelect"
>
</el-date-picker>
</div>
<div v-show="queryParams.timeDim === '5'">
<el-date-picker
style='width:100px;'
v-model="yearValue1"
type="year"
:picker-options="pickerOptions"
value-format="timestamp"
placeholder="选择年"
@change="startYear"
size="small"
:clearable="false"
>
</el-date-picker>-
<el-date-picker
style='width:100px;'
v-model="yearValue2"
type="year"
:picker-options="pickerOptions"
value-format="timestamp"
placeholder="选择年"
@change="endYear"
size="small"
:clearable="false"
>
</el-date-picker>
</div>
</el-form-item>
<el-form-item label="对象维度">
<el-select v-model="queryParams.objType" placeholder="请选择" style="width: 80px;" @change="selectObjs" size="small">
<el-option
v-for="item in getDictDatas(this.DICT_TYPE.OBJECT_TYPE)"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="对象选择">
<el-select v-model="queryParams.objIds" placeholder="请选择" multiple collapse-tags style="width: 200px;" size="small">
<el-option
v-for="item in objectList"
:key="item.id"
:label="item.name"
:value="item.id">
<span style="float: left">{{ item.name }}</span>
<span style="float: right; color: #8492a6; font-size: 13px">{{ item.code }}</span>
</el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" size="small" @click="search">查询</el-button>
</el-form-item>
</el-form>
</template> </template>
<script> <script>
import { getEnergyTypeListAll } from "@/api/base/energyType" import { getEnergyTypeListAll } from "@/api/base/energyType"
@ -155,8 +164,15 @@ import { getEquipmentAll } from "@/api/base/equipment"
import moment from 'moment' import moment from 'moment'
export default { export default {
name: 'searchArea', name: 'searchArea',
props: {
isFold: {//
type: Boolean,
default: false
}
},
data() { data() {
return { return {
isExpand: false, //
// //
queryParams: { queryParams: {
energyTypeId: null, energyTypeId: null,
@ -396,6 +412,15 @@ export default {
let newData = year+'-12-31 23:59:59' let newData = year+'-12-31 23:59:59'
let value = new Date(newData).getTime() let value = new Date(newData).getTime()
return value return value
},
switchMode() {//
this.isExpand = !this.isExpand
const element = this.$refs.searchBarRef
if (this.isExpand) {
element.classList.remove('divHeight')
} else {
element.classList.add('divHeight')
}
} }
} }
} }
@ -421,4 +446,21 @@ export default {
margin-top: 10px; margin-top: 10px;
} }
} }
</style>
<style scoped>
.searchBarBox .foldClass {
position: absolute;
top: 14px;
right: 0;
cursor: pointer;
font-size: 12px;
color:#0B58FF;
}
.searchBarBox .foldClass .iconfont {
font-size: 14px;
}
.divHeight {
height: 45px;
overflow: hidden;
}
</style> </style>

View File

@ -1,7 +1,7 @@
<template> <template>
<div class="app-container"> <div class="app-container" id="contrastAnalysisBox">
<!-- 搜索工作栏 --> <!-- 搜索工作栏 -->
<search-area @submit="getList"/> <search-area :isFold="isFold" @submit="getList"/>
<el-tabs v-model="activeName" @tab-click="switchChart"> <el-tabs v-model="activeName" @tab-click="switchChart">
<el-tab-pane label="柱状图" name="bar"> <el-tab-pane label="柱状图" name="bar">
<bar-chart ref="analysisBarChart" :chartData="chartData" /> <bar-chart ref="analysisBarChart" :chartData="chartData" />
@ -23,11 +23,19 @@ export default {
components: { SearchArea, BarChart, LineChart }, components: { SearchArea, BarChart, LineChart },
data() { data() {
return { return {
isFold: false,
activeName: 'bar', activeName: 'bar',
chartData: [] chartData: []
} }
}, },
mounted() {}, mounted() {
window.addEventListener('resize', () => {
this.tableH = this.tableHeight(260)
this.isFold = this.searchBarWidth('contrastAnalysisBox', 1310)
// console.log(document.getElementById("contrastAnalysisBox").offsetWidth)
})
this.isFold = this.searchBarWidth('contrastAnalysisBox', 1310)
},
methods: { methods: {
getList(params) { getList(params) {
getCompare({ ...params }).then((res) => { getCompare({ ...params }).then((res) => {

View File

@ -1,132 +1,141 @@
<template> <template>
<el-form :inline="true" class="demo-form-inline"> <div class="searchBarBox divHeight" ref="searchBarRef" :style="{ paddingRight: isFold ? '55px' : '0px' }">
<span class="blue-block"></span> <el-form :inline="true" class="demo-form-inline">
<el-form-item label="能源类型"> <span class="blue-block"></span>
<el-select v-model="queryParams.energyTypeId" placeholder="请选择" style="width: 100px;" size="small"> <el-form-item label="能源类型">
<el-option <el-select v-model="queryParams.energyTypeId" placeholder="请选择" style="width: 100px;" size="small">
v-for="item in energyTypeList" <el-option
:key="item.id" v-for="item in energyTypeList"
:label="item.name" :key="item.id"
:value="item.id"> :label="item.name"
</el-option> :value="item.id">
</el-select> </el-option>
</el-form-item> </el-select>
<el-form-item label="对象选择"> </el-form-item>
<el-cascader <el-form-item label="对象选择">
v-model="objArr" <el-cascader
:options="objList" v-model="objArr"
:props="{ checkStrictly: true, value: 'id', label: 'name' }" :options="objList"
popper-class="cascaderParent" :props="{ checkStrictly: true, value: 'id', label: 'name' }"
size="small" popper-class="cascaderParent"
clearable></el-cascader>
</el-form-item>
<el-form-item label="时间维度">
<el-select v-model="queryParams.timeDim" placeholder="请选择" style="width: 80px;" size="small">
<el-option
v-for="item in getDictDatas(this.DICT_TYPE.TIME_DIM)"
:key="item.value"
:label="item.label"
:value="item.value"
size="small">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="时间范围">
<div v-show="queryParams.timeDim === '1'">
<el-date-picker
v-model="timeValue"
type="datetimerange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
format="yyyy-MM-dd HH:mm"
value-format="timestamp"
:picker-options="pickerOptions"
popper-class="noneMinute"
@change="timeSelect"
size="small" size="small"
clearable></el-cascader>
</el-form-item>
<el-form-item label="时间维度">
<el-select v-model="queryParams.timeDim" placeholder="请选择" style="width: 80px;" size="small">
<el-option
v-for="item in getDictDatas(this.DICT_TYPE.TIME_DIM)"
:key="item.value"
:label="item.label"
:value="item.value"
size="small">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="时间范围">
<div v-show="queryParams.timeDim === '1'">
<el-date-picker
v-model="timeValue"
type="datetimerange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
format="yyyy-MM-dd HH:mm"
value-format="timestamp"
:picker-options="pickerOptions"
popper-class="noneMinute"
@change="timeSelect"
size="small"
style='width:350px;'
>
</el-date-picker>
</div>
<div v-show="queryParams.timeDim === '2'">
<el-date-picker
v-model="dateValue"
type="daterange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
value-format="timestamp"
:picker-options="pickerOptions"
@change="timeSelect"
size="small"
style='width:350px;'
>
</el-date-picker>
</div>
<div v-show="queryParams.timeDim === '3'">
<el-date-picker
v-model="weekValue1"
type="week"
format="yyyy 第 WW 周"
style='width:170px;'
:picker-options="pickerOptionsWeek"
@change="startWeek"
size="small"
placeholder="选择周">
</el-date-picker>-
<el-date-picker
v-model="weekValue2"
type="week"
format="yyyy 第 WW 周"
:picker-options="pickerOptionsWeek"
style='width:170px;'
@change="endWeek"
size="small"
placeholder="选择周">
</el-date-picker>
</div>
<div v-show="queryParams.timeDim === '4'">
<el-date-picker
v-model="monthValue"
type="monthrange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
value-format="timestamp"
:picker-options="pickerOptions"
size="small"
style='width:350px;'
@change="timeSelect"
>
</el-date-picker>
</div>
<div v-show="queryParams.timeDim === '5'">
<el-date-picker
style='width:170px;'
v-model="yearValue1"
type="year"
:picker-options="pickerOptions"
value-format="timestamp"
placeholder="选择年"
size="small"
@change="startYear"
> >
</el-date-picker> </el-date-picker>-
</div> <el-date-picker
<div v-show="queryParams.timeDim === '2'"> style='width:170px;'
<el-date-picker v-model="yearValue2"
v-model="dateValue" type="year"
type="daterange" :picker-options="pickerOptions"
range-separator="至" value-format="timestamp"
start-placeholder="开始日期" placeholder="选择年"
end-placeholder="结束日期" size="small"
value-format="timestamp" @change="endYear"
:picker-options="pickerOptions"
@change="timeSelect"
size="small"
> >
</el-date-picker> </el-date-picker>
</div> </div>
<div v-show="queryParams.timeDim === '3'"> </el-form-item>
<el-date-picker <el-form-item>
v-model="weekValue1" <el-button type="primary" size="small" @click="search">查询</el-button>
type="week" </el-form-item>
format="yyyy 第 WW 周" </el-form>
style='width:150px;' <span v-if="isFold" class="foldClass" @click='switchMode'>
:picker-options="pickerOptionsWeek" {{ isExpand ? '收起' : '展开' }}
@change="startWeek" <svg-icon :icon-class="isExpand ? 'upward' : 'downward'" />
size="small" </span>
placeholder="选择周"> </div>
</el-date-picker>-
<el-date-picker
v-model="weekValue2"
type="week"
format="yyyy 第 WW 周"
:picker-options="pickerOptionsWeek"
style='width:150px;'
@change="endWeek"
size="small"
placeholder="选择周">
</el-date-picker>
</div>
<div v-show="queryParams.timeDim === '4'">
<el-date-picker
v-model="monthValue"
type="monthrange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
value-format="timestamp"
:picker-options="pickerOptions"
size="small"
@change="timeSelect"
>
</el-date-picker>
</div>
<div v-show="queryParams.timeDim === '5'">
<el-date-picker
style='width:100px;'
v-model="yearValue1"
type="year"
:picker-options="pickerOptions"
value-format="timestamp"
placeholder="选择年"
size="small"
@change="startYear"
>
</el-date-picker>-
<el-date-picker
style='width:100px;'
v-model="yearValue2"
type="year"
:picker-options="pickerOptions"
value-format="timestamp"
placeholder="选择年"
size="small"
@change="endYear"
>
</el-date-picker>
</div>
</el-form-item>
<el-form-item>
<el-button type="primary" size="small" @click="search">查询</el-button>
</el-form-item>
</el-form>
</template> </template>
<script> <script>
import { getEnergyTypeListAll } from "@/api/base/energyType" import { getEnergyTypeListAll } from "@/api/base/energyType"
@ -134,8 +143,15 @@ import { getTree } from '@/api/base/factory'
import moment from 'moment' import moment from 'moment'
export default { export default {
name: 'searchArea', name: 'searchArea',
props: {
isFold: {//
type: Boolean,
default: false
}
},
data() { data() {
return { return {
isExpand: false, //
// //
queryParams: { queryParams: {
energyTypeId: null, energyTypeId: null,
@ -356,6 +372,15 @@ export default {
let newData = year+'-12-31 23:59:59' let newData = year+'-12-31 23:59:59'
let value = new Date(newData).getTime() let value = new Date(newData).getTime()
return value return value
},
switchMode() {//
this.isExpand = !this.isExpand
const element = this.$refs.searchBarRef
if (this.isExpand) {
element.classList.remove('divHeight')
} else {
element.classList.add('divHeight')
}
} }
} }
} }
@ -385,4 +410,21 @@ export default {
margin-top: 10px; margin-top: 10px;
} }
} }
</style>
<style scoped>
.searchBarBox .foldClass {
position: absolute;
top: 14px;
right: 0;
cursor: pointer;
font-size: 12px;
color:#0B58FF;
}
.searchBarBox .foldClass .iconfont {
font-size: 14px;
}
.divHeight {
height: 45px;
overflow: hidden;
}
</style> </style>

View File

@ -1,7 +1,7 @@
<template> <template>
<div class="app-container"> <div class="app-container" id="trendAnalysisBox">
<!-- 搜索工作栏 --> <!-- 搜索工作栏 -->
<search-area @submit="getList"/> <search-area :isFold="isFold" @submit="getList"/>
<el-tabs v-model="activeName" @tab-click="switchChart"> <el-tabs v-model="activeName" @tab-click="switchChart">
<el-tab-pane label="柱状图" name="bar"> <el-tab-pane label="柱状图" name="bar">
<bar-chart ref="analysisBarChart" :chartData="chartData" /> <bar-chart ref="analysisBarChart" :chartData="chartData" />
@ -23,11 +23,18 @@ export default {
components: { SearchArea, BarChart, LineChart }, components: { SearchArea, BarChart, LineChart },
data() { data() {
return { return {
isFold: false,
activeName: 'bar', activeName: 'bar',
chartData: [] chartData: []
} }
}, },
mounted() {}, mounted() {
window.addEventListener('resize', () => {
this.tableH = this.tableHeight(260)
this.isFold = this.searchBarWidth('trendAnalysisBox', 1146)
})
this.isFold = this.searchBarWidth('trendAnalysisBox', 1146)
},
methods: { methods: {
getList(params) { getList(params) {
getEnergyTrend({ ...params }).then((res) => { getEnergyTrend({ ...params }).then((res) => {

View File

@ -37,12 +37,12 @@
</el-row> </el-row>
<el-row> <el-row>
<el-col :span="12" v-show="form.pricingMethod === 2"> <el-col :span="12" v-show="form.pricingMethod === 2">
<el-form-item label="单价(元)" prop="singlePrice"> <el-form-item label="单价(元)" prop="pricingMethod">
<el-input v-model="form.singlePrice"></el-input> <el-input-number v-model="form.singlePrice" :precision="2" :min="0" :max="999999999" style="width: 100%;"></el-input-number>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="24" v-show="form.pricingMethod === 0"> <el-col :span="24" v-show="form.pricingMethod === 0">
<el-form-item label="时间段"> <el-form-item label="时间段" prop="pricingMethod">
<base-table <base-table
:key='timeKye' :key='timeKye'
:table-props="tableProps1" :table-props="tableProps1"
@ -63,7 +63,7 @@
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="24" v-show="form.pricingMethod === 1"> <el-col :span="24" v-show="form.pricingMethod === 1">
<el-form-item label="使用量"> <el-form-item label="使用量" prop="pricingMethod">
<base-table <base-table
:key='usedKye' :key='usedKye'
:table-props="tableProps2" :table-props="tableProps2"
@ -140,12 +140,13 @@ export default {
name: '', name: '',
code: '', code: '',
nuit: '', nuit: '',
pricingMethod: 1, pricingMethod: 2,
leaderName: '' leaderName: ''
}, },
isEdit: false, // isEdit: false, //
rules: { rules: {
name: [{ required: true, message: '能源类型不能为空', trigger: 'blur' }] name: [{ required: true, message: '能源类型不能为空', trigger: 'blur' }],
pricingMethod: [{ required: true, message: '计价方式不能为空', trigger: 'change' }]
}, },
timeKye: 0, timeKye: 0,
usedKye: 0, usedKye: 0,
@ -275,7 +276,7 @@ export default {
break; break;
default:// default://
if (!this.form.singlePrice) { if (!this.form.singlePrice) {
this.$modal.msgError('单价有误请检查1,请检查') this.$modal.msgError('单价有误请检查,请检查')
return false return false
} }
} }
@ -321,6 +322,7 @@ export default {
}, },
formClear() { formClear() {
this.$refs.form.resetFields() this.$refs.form.resetFields()
this.form.singlePrice = 0
this.isEdit = false this.isEdit = false
this.timeKye = 0 this.timeKye = 0
this.usedKye = 0 this.usedKye = 0

View File

@ -1,10 +1,11 @@
<template> <template>
<div class="app-container"> <div class="app-container" id='energyReportBox'>
<!-- 搜索工作栏 --> <!-- 搜索工作栏 -->
<search-bar <search-bar
:formConfigs="formConfig" :formConfigs="formConfig"
ref="searchBarForm" ref="searchBarForm"
:isFold="isFold"
@headBtnClick="buttonClick" @headBtnClick="buttonClick"
/> />
<!-- 列表 --> <!-- 列表 -->
@ -72,6 +73,7 @@ export default {
name: "EnergyLimit", name: "EnergyLimit",
data() { data() {
return { return {
isFold: false,
formConfig: [ formConfig: [
{ {
type: 'select', type: 'select',
@ -138,10 +140,14 @@ export default {
created() { created() {
window.addEventListener('resize', () => { window.addEventListener('resize', () => {
this.tableH = this.tableHeight(260) this.tableH = this.tableHeight(260)
this.isFold = this.searchBarWidth('energyReportBox', 1198)
}) })
this.getList() this.getList()
this.getTypeList() this.getTypeList()
}, },
mounted() {
this.isFold = this.searchBarWidth('energyReportBox', 1198)
},
methods: { methods: {
getTypeList() { getTypeList() {
getEnergyTypeListAll().then((res) => { getEnergyTypeListAll().then((res) => {

View File

@ -1,10 +1,11 @@
<template> <template>
<div class="app-container"> <div class="app-container" id='energyReportSearchBox'>
<!-- 搜索工作栏 --> <!-- 搜索工作栏 -->
<search-bar <search-bar
:formConfigs="formConfig" :formConfigs="formConfig"
ref="searchBarForm" ref="searchBarForm"
:isFold="isFold"
@headBtnClick="buttonClick" @headBtnClick="buttonClick"
/> />
<!-- 列表 --> <!-- 列表 -->
@ -53,6 +54,7 @@ export default {
name: "EnergyReportSearch", name: "EnergyReportSearch",
data() { data() {
return { return {
isFold: false,
formConfig: [ formConfig: [
{ {
type: 'input', type: 'input',
@ -117,6 +119,7 @@ export default {
created() { created() {
window.addEventListener('resize', () => { window.addEventListener('resize', () => {
this.tableH = this.tableHeight(260) this.tableH = this.tableHeight(260)
this.isFold = this.searchBarWidth('energyReportSearchBox', 1180)
}) })
if (this.$route.params.startTime && this.$route.params.endTime) { if (this.$route.params.startTime && this.$route.params.endTime) {
this.formConfig[2].defaultSelect = [this.$route.params.startTime, this.$route.params.endTime] this.formConfig[2].defaultSelect = [this.$route.params.startTime, this.$route.params.endTime]
@ -128,6 +131,9 @@ export default {
this.getList() this.getList()
this.getTypeList() this.getTypeList()
}, },
mounted() {
this.isFold = this.searchBarWidth('energyReportSearchBox', 1180)
},
methods: { methods: {
getTypeList() { getTypeList() {
getEnergyTypeListAll().then((res) => { getEnergyTypeListAll().then((res) => {

View File

@ -52,7 +52,6 @@
<!-- 日期 --> <!-- 日期 -->
<div class="dateStyle"> <div class="dateStyle">
{{ Number(data.day.split('-')[2]) }} {{ Number(data.day.split('-')[2]) }}
{{ data.day }}
</div> </div>
<!-- 班次班组 --> <!-- 班次班组 -->
<!-- class有两个样式一个是类似class1还有个是选中红框显示 --> <!-- class有两个样式一个是类似class1还有个是选中红框显示 -->

View File

@ -67,6 +67,7 @@ export default {
rangeSeparator: '-', rangeSeparator: '-',
startPlaceholder: '开始日期', startPlaceholder: '开始日期',
endPlaceholder: '结束日期', endPlaceholder: '结束日期',
defaultSelect: [],
defaultTime: ['00:00:00', '23:59:59'], defaultTime: ['00:00:00', '23:59:59'],
param: 'timerange', param: 'timerange',
}, },
@ -212,6 +213,14 @@ export default {
}, },
}, },
mounted() { mounted() {
if (this.$route.params.startTime && this.$route.params.endTime) {
this.searchBarFormConfig[0].defaultSelect = [this.$route.params.startTime, this.$route.params.endTime]
this.queryParams.param = {};
this.$set(this.queryParams.param, 'startTime', this.$route.params.startTime);
this.$set(this.queryParams.param, 'endTime', this.$route.params.endTime);
} else {
this.searchBarFormConfig[0].defaultSelect = []
}
this.getList(); this.getList();
}, },
methods: { methods: {