|
|
<template>
|
|
|
<view>
|
|
|
<uni-nav-bar left-icon="left" fixed="true" title="电站列表" @clickLeft="handleClickLeft"></uni-nav-bar>
|
|
|
<scroll-view :scroll-y="modalName==null" class="page" :class="modalName!=null?'show':''">
|
|
|
<view class="station-box">
|
|
|
<!-- <view>
|
|
|
选择电站：<picker mode="selector" :range="stationData"
|
|
|
range-key="stationName"
|
|
|
:value="index" @change="handlerChangeStation">
|
|
|
<view style="color: royalblue;">{{ stationData[index].stationName }}</view>
|
|
|
</picker>
|
|
|
</view> -->
|
|
|
<view class="card-box">
|
|
|
<uni-section title="电站列表" type="line" padding="0 0 5px 0">
|
|
|
<!-- <uni-card title="">
|
|
|
<template v-slot:title>
|
|
|
<uni-list>
|
|
|
<uni-list-item showArrow clickable :title="station.stationName" @click="goNext" />
|
|
|
</uni-list>
|
|
|
</template>
|
|
|
<view class="station-info">
|
|
|
<view class="flex station-info-item">
|
|
|
<text class="left">装机容量(MW)：</text>
|
|
|
<text>{{ station.capacity }}</text>
|
|
|
</view>
|
|
|
<view class="flex station-info-item">
|
|
|
<text class="left">当日功率(kW)：</text>
|
|
|
<text>{{ station.dayPower }}</text>
|
|
|
</view>
|
|
|
<view class="flex station-info-item">
|
|
|
<text class="left">当日发电(kWh)：</text>
|
|
|
<text>{{ station.dayElectricity }}</text>
|
|
|
</view>
|
|
|
<view class="flex station-info-item">
|
|
|
<text class="left">累计发电(kWh)：</text>
|
|
|
<text>{{ station.totalElectricity }}</text>
|
|
|
</view>
|
|
|
<view class="flex station-info-item">
|
|
|
<text class="left">光照强度(W/m^2)：</text>
|
|
|
<text>{{ station.irradiationLevel }}</text>
|
|
|
</view>
|
|
|
</view>
|
|
|
</uni-card> -->
|
|
|
<view class="station-box-list">
|
|
|
<uni-card title=""
|
|
|
class="arrow animation-slide-right"
|
|
|
:style="[{animationDelay: '0.'+ index +'s'}]"
|
|
|
v-for="(item, index) in stationData" :key="item.id">
|
|
|
<template v-slot:title>
|
|
|
<uni-list>
|
|
|
<uni-list-item showArrow clickable :title="item.stationName" @click="goNext(item.id)" />
|
|
|
</uni-list>
|
|
|
</template>
|
|
|
<!-- <image style="width: 100%;" :src="cover"></image> -->
|
|
|
<view class="station-info">
|
|
|
<view class="flex station-info-item">
|
|
|
<text class="left">装机容量(MW)：</text>
|
|
|
<text class="right">{{ item.capacity }}</text>
|
|
|
</view>
|
|
|
<view class="flex station-info-item">
|
|
|
<text class="left">当日发电(kWh)：</text>
|
|
|
<text class="right">{{ item.dayElectricity }}</text>
|
|
|
</view>
|
|
|
<view class="flex station-info-item">
|
|
|
<text class="left">当日功率(kW)：</text>
|
|
|
<text >{{ item.dayPower }}</text>
|
|
|
</view>
|
|
|
|
|
|
<view class="flex station-info-item">
|
|
|
<text class="left">累计发电(kWh)：</text>
|
|
|
<text>{{ item.totalElectricity }}</text>
|
|
|
</view>
|
|
|
<!-- <view class="flex station-info-item">
|
|
|
<text class="left">光照强度(W/m^2)：</text>
|
|
|
<text>{{ station.irradiationLevel }}</text>
|
|
|
</view> -->
|
|
|
</view>
|
|
|
</uni-card>
|
|
|
</view>
|
|
|
|
|
|
</uni-section>
|
|
|
</view>
|
|
|
</view>
|
|
|
</scroll-view>
|
|
|
</view>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
|
|
|
import { getStationList } from '@/api/modules/station.js'
|
|
|
import _mixin from './mixin.js'
|
|
|
const stationDetailInfo = {
|
|
|
'1052758018': [
|
|
|
{
|
|
|
id: '1',
|
|
|
stationName: '伟创力北厂1区'
|
|
|
}, {
|
|
|
id: '3',
|
|
|
stationName: '伟创力北厂2区'
|
|
|
},
|
|
|
{
|
|
|
id: '4',
|
|
|
stationName: '伟创力南厂区'
|
|
|
},
|
|
|
{
|
|
|
id: '5',
|
|
|
stationName: '伟创力超毅厂区'
|
|
|
},
|
|
|
],
|
|
|
'1052758019': [
|
|
|
{
|
|
|
id: '6',
|
|
|
stationName: '7# 厂房'
|
|
|
},{
|
|
|
id: '7',
|
|
|
stationName: '8# 厂房'
|
|
|
},
|
|
|
{
|
|
|
id: '8',
|
|
|
stationName: '15#-1 厂房'
|
|
|
}, {
|
|
|
id: '9',
|
|
|
stationName: '15#-2 厂房'
|
|
|
}],
|
|
|
'1052758020': [
|
|
|
{
|
|
|
id: '25',
|
|
|
stationName: '总装车间'
|
|
|
},
|
|
|
{
|
|
|
id: '26',
|
|
|
stationName: '综合车间'
|
|
|
},],
|
|
|
'1052758021': [
|
|
|
{
|
|
|
id: '10',
|
|
|
stationName: '红塔一期电房'
|
|
|
},{
|
|
|
id: '11',
|
|
|
stationName: '红塔二期电房'
|
|
|
},],
|
|
|
'1052758022': [
|
|
|
{
|
|
|
id: '27',
|
|
|
stationName: '林殷厂区'
|
|
|
},],
|
|
|
'1052758023': [
|
|
|
{
|
|
|
id: '18',
|
|
|
stationName: 'A栋'
|
|
|
},
|
|
|
{
|
|
|
id: '19',
|
|
|
stationName: 'C2'
|
|
|
},
|
|
|
{
|
|
|
id: '20',
|
|
|
stationName: 'C3'
|
|
|
},
|
|
|
{
|
|
|
id: '21',
|
|
|
stationName: '食堂'
|
|
|
},],
|
|
|
'1052758025': [
|
|
|
{
|
|
|
id: '12',
|
|
|
stationName: 'A16'
|
|
|
}, {
|
|
|
id: '13',
|
|
|
stationName: 'D3'
|
|
|
}, {
|
|
|
id: '14',
|
|
|
stationName: 'A20'
|
|
|
}, {
|
|
|
id: '15',
|
|
|
stationName: 'A7'
|
|
|
}],
|
|
|
'1052758026': [
|
|
|
{
|
|
|
id: '16',
|
|
|
stationName: 'A3'
|
|
|
},{
|
|
|
id: '17',
|
|
|
stationName: 'C3'
|
|
|
}],
|
|
|
'1052758027': [
|
|
|
{
|
|
|
id: '2',
|
|
|
stationName: '堂悠口园区'
|
|
|
},],
|
|
|
'1052758028': [
|
|
|
{
|
|
|
id: '22',
|
|
|
stationName: '枫泾总厂1、2号楼'
|
|
|
},
|
|
|
{
|
|
|
id: '23',
|
|
|
stationName: '枫泾总厂5号楼'
|
|
|
},
|
|
|
],
|
|
|
'1052758029': [ {
|
|
|
id: '24',
|
|
|
stationName: '枫泾兴塔厂'
|
|
|
}],
|
|
|
'1052758031': [ {
|
|
|
id: '28',
|
|
|
stationName: '组装车间'
|
|
|
},
|
|
|
{
|
|
|
id: '29',
|
|
|
stationName: '冲压车间'
|
|
|
}
|
|
|
],
|
|
|
}
|
|
|
|
|
|
export default {
|
|
|
data() {
|
|
|
return {
|
|
|
modalName: null,
|
|
|
index: 0,
|
|
|
station: {}
|
|
|
|
|
|
}
|
|
|
},
|
|
|
mixins: [_mixin],
|
|
|
created() {
|
|
|
this.getStationList()
|
|
|
},
|
|
|
methods: {
|
|
|
getStationList() {
|
|
|
getStationList({
|
|
|
pageSize:20
|
|
|
}).then(res => {
|
|
|
this.stationData = res.data.result.records.filter(v => {
|
|
|
return !v.stationName.includes('户用光伏电站')
|
|
|
}).map(v => {
|
|
|
v.children = stationDetailInfo[v.id]
|
|
|
return v
|
|
|
})
|
|
|
this.station = this.stationData[this.index]
|
|
|
uni.setStorageSync('_pro_stations', this.stationData)
|
|
|
})
|
|
|
},
|
|
|
handleClickLeft() {
|
|
|
this.$router.replace('/')
|
|
|
},
|
|
|
handlerChangeStation(e) {
|
|
|
this.index = e.detail.value
|
|
|
this.station = this.stationData[this.index]
|
|
|
},
|
|
|
goNext(id) {
|
|
|
this.$router.push({
|
|
|
name: 'stationListItem1',
|
|
|
query: {
|
|
|
id
|
|
|
}
|
|
|
})
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss">
|
|
|
.station-box {
|
|
|
position: relative;
|
|
|
padding: 10px 0;
|
|
|
color: #333;
|
|
|
}
|
|
|
.station-box-list {
|
|
|
position: relative;
|
|
|
width: 100%;
|
|
|
max-height: 85vh;
|
|
|
overflow-x: hidden;
|
|
|
overflow-y: scroll;
|
|
|
}
|
|
|
.card-box {
|
|
|
// margin-top: 50px;
|
|
|
// max-height: 90vh;
|
|
|
// overflow-y: scroll;
|
|
|
}
|
|
|
/deep/ .uni-card {
|
|
|
padding: 0 !important;
|
|
|
}
|
|
|
.station-info {
|
|
|
// margin-top: 20px;
|
|
|
display: flex;
|
|
|
// flex-direction:column;
|
|
|
flex-wrap: wrap;
|
|
|
color: #888;
|
|
|
.station-info-item {
|
|
|
|
|
|
font-size: 12px;
|
|
|
width: 50%;
|
|
|
vertical-align: middle;
|
|
|
line-height: 2.5;
|
|
|
// &:not(:first-child) {
|
|
|
// // margin-top: 10px;
|
|
|
// border-top: 1px dashed #cedefb;
|
|
|
// vertical-align: middle;
|
|
|
// line-height: 2.5;
|
|
|
// }
|
|
|
&:nth-child(3), &:nth-child(4) {
|
|
|
width: 100%;
|
|
|
border-top: 1px dashed #cedefb;
|
|
|
}
|
|
|
.left {
|
|
|
// width: 130px;
|
|
|
text-align: justify;
|
|
|
}
|
|
|
.right {
|
|
|
color: #4aaf0b;
|
|
|
// letter-spacing: 2upx;
|
|
|
}
|
|
|
|
|
|
}
|
|
|
}
|
|
|
</style>
|
