You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
272 lines
7.1 KiB
272 lines
7.1 KiB
<template> |
|
<view class="page"> |
|
<view class="list_box" v-for="(item,index) in data" :key="index"> |
|
<view class="list_top"> |
|
<view class="unit_tags">管理单位</view> |
|
<view class="unit_name">{{item.organizationName}}</view> |
|
</view> |
|
<view class="report_time">{{item.statDate}}<text style="margin-left:16rpx;">{{item.statPeriod}}</text></view> |
|
<uni-collapse> |
|
<uni-collapse-item titleBorder="none" show-arrow="false" border="false" :show-animation="true"> |
|
<template v-slot:title> |
|
<view class="list_item"> |
|
<view class="list_item_label">收费站名称：</view> |
|
<view class="list_item_cnt">仁兆收费站</view> |
|
</view> |
|
</template> |
|
<view class="content"> |
|
<view class="list_item"> |
|
<view class="list_item_label">高速公路名称：</view> |
|
<view class="list_item_cnt">仁兆收费站</view> |
|
</view> |
|
<view class="list_item"> |
|
<view class="list_item_label">收费站入口车辆数：</view> |
|
<view class="list_item_cnt">仁兆收费站</view> |
|
</view> |
|
<view class="list_item"> |
|
<view class="list_item_label">收费站出口车辆数：</view> |
|
<view class="list_item_cnt">仁兆收费站</view> |
|
</view> |
|
<view class="list_item"> |
|
<view class="list_item_label">免收通行费车辆数：</view> |
|
<view class="list_item_cnt">仁兆收费站</view> |
|
</view> |
|
<view class="list_item"> |
|
<view class="list_item_label">免收通行费金额：</view> |
|
<view class="list_item_cnt">仁兆收费站</view> |
|
</view> |
|
<view class="list_item"> |
|
<view class="list_item_label">出口通行费：</view> |
|
<view class="list_item_cnt">仁兆收费站</view> |
|
</view> |
|
<view class="list_item"> |
|
<view class="list_item_label">报送人员及联系方式：</view> |
|
<view class="list_item_cnt">仁兆收费站</view> |
|
</view> |
|
</view> |
|
</uni-collapse-item> |
|
</uni-collapse> |
|
<!-- 按钮 --> |
|
<view class="act_btn_box"> |
|
<view class="act_btn blue">编辑</view> |
|
<view class="act_btn" style="margin-left: 30rpx;">查看详情</view> |
|
</view> |
|
</view> |
|
<uni-load-more iconType="circle" :status="status" @clickLoadMore="loadMore" |
|
:contentText="contentText"></uni-load-more> |
|
<!-- 筛选 --> |
|
<view class="foot_btn_box"> |
|
<view @click="goPage('/pages/highway/runData/form')" class="act_btn"><uni-icons type="plusempty" size="30" color="#fff"></uni-icons>新建</view> |
|
<view @click="showSearch" class="act_btn btn1"><uni-icons type="search" size="30" color="#2D8CF0"></uni-icons>查询</view> |
|
</view> |
|
<!-- 筛选 --> |
|
<uni-popup ref="search" type="bottom"> |
|
<view class="search_title"> |
|
查询条件 |
|
<uni-icons type="closeempty" size="30" color="#666"></uni-icons> |
|
</view> |
|
<view class="search_item"> |
|
<view class="search_label">统计起止时间</view> |
|
<view class="search_cnt"> |
|
|
|
</view> |
|
</view> |
|
<view class="search_inline_item"> |
|
<view class="search_label">统计时段</view> |
|
<view class="search_cnt"> |
|
|
|
</view> |
|
</view> |
|
</uni-popup> |
|
</view> |
|
</template> |
|
<script> |
|
export default { |
|
data() { |
|
return { |
|
data: [], |
|
current: 0, |
|
size: 10, |
|
hasMore: true, |
|
status: '', |
|
query: { |
|
statDateStart: '', |
|
statDateEnd: '', |
|
statPeriod: '' |
|
}, |
|
contentText: { |
|
contentdown: "点击查看更多", |
|
contentrefresh: "正在加载...", |
|
contentnomore: "没有更多数据了", |
|
}, |
|
} |
|
}, |
|
onLoad() { |
|
this.loadMore(); |
|
}, |
|
onUnload() { |
|
this.hasMore = true; |
|
this.data = []; |
|
}, |
|
onPullDownRefresh() { |
|
console.log('onPullDownRefresh'); |
|
this.data = []; |
|
this.current = 0; |
|
this.hasMore = true; |
|
this.loadMore(); |
|
}, |
|
methods: { |
|
//查询 |
|
showSearch() { |
|
this.showSearch = true; |
|
}, |
|
loadMore() { |
|
if (this.hasMore) { |
|
this.current = this.current + 1; |
|
this.status = 'loading'; |
|
let params = ''; |
|
Object.keys(this.query).map(key => { |
|
params = params + '&' + key + '=' + this.query[key] |
|
}) |
|
this.$request(getApp().globalData.baseUrl + '/api/biz/highwayParentDataController/list?page=' + this.current + |
|
'&pageSize=' + this.size + '&_t=' + Date.parse(new Date()) + params, {}, 'GET').then(res => { |
|
if (res.code == 200) { |
|
this.data = this.data.concat(res.data.list); |
|
if (res.data.list.length == 0 || res.data.totalCount < this.size) { |
|
this.hasMore = false; |
|
this.status = 'nomore'; |
|
} else { |
|
this.status = 'more'; |
|
} |
|
uni.stopPullDownRefresh(); |
|
} else { |
|
this.status = 'more'; |
|
uni.stopPullDownRefresh(); |
|
} |
|
}).catch(() => { |
|
this.status = 'more'; |
|
uni.stopPullDownRefresh(); |
|
}) |
|
} |
|
}, |
|
} |
|
} |
|
</script> |
|
|
|
<style lang="scss" scoped> |
|
.page{ |
|
min-height: 100vh; |
|
padding: 30rpx 30rpx 0; |
|
} |
|
.list_box { |
|
width: 100%; |
|
background-color: #fff; |
|
border-radius: 30rpx; |
|
margin-bottom: 30rpx; |
|
padding: 30rpx; |
|
.list_top{ |
|
display: flex; |
|
.unit_tags{ |
|
color: #E37616; |
|
font-size: 20rpx; |
|
font-family: PingFang SC-Regular, PingFang SC; |
|
font-weight: 400; |
|
background: #FFF7E4; |
|
border-radius: 10rpx; |
|
border: 1rpx solid #EF9A4F; |
|
padding: 5rpx 11rpx; |
|
} |
|
.unit_name{ |
|
color: #333333; |
|
font-size: 30rpx; |
|
font-family: PingFang SC-Bold, PingFang SC; |
|
font-weight: bold; |
|
line-height: 48rpx; |
|
margin-left: 20rpx; |
|
word-break: break-all; |
|
} |
|
.report_time{ |
|
color: #999999; |
|
font-size: 24rpx; |
|
font-family: PingFang SC-Regular, PingFang SC; |
|
font-weight: 400; |
|
line-height: 48rpx; |
|
text-align: center; |
|
margin: 30rpx auto; |
|
} |
|
} |
|
.list_item{ |
|
display: flex; |
|
align-items: center; |
|
justify-content: space-around; |
|
.list_item_label{ |
|
color: #666666; |
|
font-size: 26rpx; |
|
font-family: PingFang SC-Regular, PingFang SC; |
|
font-weight: 400; |
|
line-height: 48rpx; |
|
} |
|
.list_item_cnt{ |
|
color: #333333; |
|
font-size: 28rpx; |
|
font-family: PingFang SC-Regular, PingFang SC; |
|
font-weight: 400; |
|
line-height: 48rpx; |
|
text-align: right; |
|
margin-left: 20rpx; |
|
word-break: break-all; |
|
} |
|
} |
|
.act_btn_box{ |
|
display: flex; |
|
flex-direction: row-reverse; |
|
margin: 10rpx 0; |
|
|
|
.act_btn{ |
|
width: 180rpx; |
|
color: #666666; |
|
font-size: 28rpx; |
|
font-family: PingFang SC-Regular, PingFang SC; |
|
font-weight: 400; |
|
line-height: 70rpx; |
|
background: #FFFFFF; |
|
border-radius: 100rpx; |
|
border: 1rpx solid #C1C1C1; |
|
text-align: center; |
|
&.blue{ |
|
color:#fff; |
|
background: #2D8CF0; |
|
border-color: #2D8CF0; |
|
} |
|
} |
|
} |
|
.foot_btn_box{ |
|
position: fixed; |
|
left: 0; |
|
right: 0; |
|
bottom: 20rpx; |
|
display: flex; |
|
justify-content: space-around; |
|
.act_btn{ |
|
width: 329rpx; |
|
line-height: 90rpx; |
|
display: flex; |
|
justify-content: center; |
|
color: #FFFFFF; |
|
font-size: 28rpx; |
|
font-family: PingFang SC-Regular, PingFang SC; |
|
font-weight: 400; |
|
background: #2D8CF0; |
|
border-radius: 100rpx; |
|
border: 1px solid #2D8CF0; |
|
.txt{ |
|
margin-left: 9rpx; |
|
} |
|
&.btn1{ |
|
color: #2D8CF0; |
|
background: #F6F6F6; |
|
} |
|
} |
|
} |
|
} |
|
</style> |