@@ -1,6 +1,6 @@ | |||
const __request_base_url__ = { | |||
develop: "http://192.168.11.11:9061/api", | |||
// develop: "https://qmhhapi-test.t-aaron.com/api", | |||
// develop: "http://192.168.11.11:9061/api", | |||
develop: "https://qmhhapi-test.t-aaron.com/api", | |||
trial: "https://qmhhapi-test.t-aaron.com/api", | |||
release: "https://qmhh.t-aaron.com/api" | |||
} |
@@ -9,15 +9,10 @@ Page({ | |||
* 页面的初始数据 | |||
*/ | |||
data: { | |||
areaName: '芦淞区', // 当前区域位置 | |||
announcementList: [], // 公告列表 | |||
// 快捷入口 | |||
entersList: [ | |||
// { | |||
// title:'上报问题', | |||
// iconPath: '../../assets/first/upload.png', | |||
// path: '/pages/all/index', | |||
// type: 'tabbar' | |||
// }, | |||
{ | |||
title:'护河行动', | |||
iconPath: '../../assets/first/new.png', | |||
@@ -55,7 +50,6 @@ Page({ | |||
type: 'page' | |||
}, | |||
], | |||
infoList: ['name', 'location', 'note'], | |||
liveNum: 0, // 在线人数 | |||
list: [], // 河道展示 | |||
current: '', | |||
@@ -167,6 +161,13 @@ Page({ | |||
} | |||
}, | |||
// 查看更多 | |||
showMoreRivers() { | |||
wx.switchTab({ | |||
url: '/pages/all/index', | |||
}) | |||
}, | |||
// 上报问题 | |||
uploadProblem(e) { | |||
let detail = e.currentTarget.dataset.detail |
@@ -2,12 +2,16 @@ | |||
<view class="first_container"> | |||
<!-- 切换位置 --> | |||
<view class="first_head"> | |||
<view class="select_location" bindtap="goSelectLocation">切换位置</view> | |||
<view class="area_info"> | |||
<image class="area_icon" src="../../assets/first/area_icon.png"></image> | |||
<view class="current_area">当前位置:<text style="font-weight: 600;">{{areaName}}</text></view> | |||
</view> | |||
<view class="select_location" bindtap="goSelectLocation">切换位置 <image style="width: 12rpx;" mode="widthFix" src="../../assets/first/go.png"></image></view> | |||
</view> | |||
<view class="main_container"> | |||
<!-- 图片 --> | |||
<view class="banner"> | |||
<image class="banner_image" src="../../assets/first/home_banner.png" bindtap="redirectToAd"></image> | |||
<image class="banner_image" mode="widthFix" src="../../assets/first/home_banner.png" bindtap="redirectToAd"></image> | |||
</view> | |||
@@ -21,25 +25,30 @@ | |||
<!-- 在线人数 --> | |||
<view class="live_box"> | |||
<image class="live_bg" src="../../assets/first/live_bg.png"></image> | |||
<image class="live_bg" mode="widthFix" src="../../assets/first/live_bg.png"></image> | |||
<view class="live_message"> | |||
<text style="color: #fff;font-size: 26rpx">参与人数</text> | |||
<text style="color: #FFE81AFF;;font-size: 34rpx;font-weight: bold;">{{liveNum}}人</text> | |||
<text style="color: #fff;font-size: 26rpx">参与人次</text> | |||
<text style="color: #ffffff;;font-size: 32rpx;font-weight: 400;font-family: Fontquan-XinYiGuanHeiTi;">{{liveNum}}人</text> | |||
</view> | |||
</view> | |||
<!-- 河道展示 --> | |||
<view class="rivers_box"> | |||
<view class="rivers_title">河道展示</view> | |||
<view class="list_header"> | |||
<view class="list_title">河道展示</view> | |||
<view class="more_btn" bindtap="showMoreRivers">查看更多</view> | |||
</view> | |||
<list class="rivers_list" url="{{current}}" list="{{list}}" params="{{params}}" bind:update-list="updateList" bind:reset-list="resetList"> | |||
<view class="river_item" wx:for="{{list}}" wx:key="index" bindtap="showDetail" data-item="{{item}}"> | |||
<image class="river_image" src="{{item.image}}"></image> | |||
<view class="river_info"> | |||
<view class="text_box" wx:for="{{infoList}}" wx:for-item="m" wx:key="m"> | |||
<text class="info_item">{{item[m] || ''}}</text> | |||
<view class="river_head"> | |||
<view class="river_name">{{item.name}}</view> | |||
<view class="river_button" catchtap="uploadProblem" data-current="{{index}}" data-detail="{{item}}">上报问题</view> | |||
</view> | |||
<view class="river_location">{{item.location}}</view> | |||
<view class="river_note">{{item.note || ''}}</view> | |||
</view> | |||
<view class="river_button" catchtap="uploadProblem" data-current="{{index}}" data-detail="{{item}}">上报问题</view> | |||
</view> | |||
</list> | |||
</view> |
@@ -2,34 +2,52 @@ | |||
.first_container { | |||
width: 100%; | |||
min-height: calc(100vh - 112rpx); | |||
padding: 0 25rpx; | |||
padding-bottom: 112rpx; | |||
display: flex; | |||
flex-direction: column; | |||
justify-content: flex-start; | |||
align-items: center; | |||
color: #333333; | |||
background-color: rgba(240, 242, 245, 1); | |||
background-color: rgba(242, 246, 249, 1); | |||
} | |||
.first_head { | |||
width: 100%; | |||
padding: 10rpx 30rpx; | |||
background-color: #ffffff; | |||
padding: 15rpx 22rpx; | |||
margin-bottom: 28rpx; | |||
background-color: rgba(218, 232, 255, 1); | |||
display: flex; | |||
justify-content: space-between; | |||
align-items: center; | |||
border: 1rpx solid rgba(160, 197, 248, 1); | |||
border-radius: 10rpx; | |||
box-shadow: 0rpx 1rpx 4rpx 0rpx rgba(204,201,201,0.27); | |||
} | |||
.area_info { | |||
display: flex; | |||
justify-content: flex-start; | |||
align-items: center; | |||
} | |||
.area_icon { | |||
width: 24rpx; | |||
height: 34rpx; | |||
margin-right: 30rpx; | |||
} | |||
.current_area { | |||
color: rgba(31, 31, 31, 1); | |||
} | |||
.select_location { | |||
width: 150rpx; | |||
height: 60rpx; | |||
line-height: 60rpx; | |||
width: 152rpx; | |||
height: 48rpx; | |||
line-height: 48rpx; | |||
text-align: center; | |||
background-color: rgba(42, 130, 228, 1); | |||
border-radius: 10rpx; | |||
border-radius: 24rpx; | |||
color: #fff; | |||
font-size: 24rpx; | |||
} | |||
.main_container { | |||
width: 100%; | |||
padding: 0 30rpx; | |||
display: flex; | |||
flex-direction: column; | |||
justify-content: flex-start; | |||
@@ -40,7 +58,6 @@ | |||
} | |||
.banner_image { | |||
width: 100%; | |||
height: 380rpx; | |||
} | |||
/* 公告 */ | |||
@@ -105,26 +122,24 @@ | |||
.fast_enters { | |||
width: 100%; | |||
margin-top: 20rpx; | |||
padding: 20rpx 40rpx; | |||
background-color: #ffffff; | |||
border-radius: 8rpx; | |||
display: flex; | |||
align-items: center; | |||
flex-wrap: wrap; | |||
flex: 0 0 25%; | |||
justify-content: flex-start; | |||
align-content: flex-start; | |||
} | |||
.enter_item { | |||
display: flex; | |||
flex-direction: column; | |||
justify-content: space-between; | |||
justify-content: flex-start; | |||
align-items: center; | |||
padding: 10rpx; | |||
margin-right: 65rpx; | |||
margin-bottom: 10rpx; | |||
margin-right: 27rpx; | |||
} | |||
.enter_item:nth-child(4n+0) { | |||
margin-right: 0; | |||
.fast_enters>.enter_item:nth-child(4n+0) { | |||
margin-right: 0 !important; | |||
} | |||
.enter_icon { | |||
width: 110rpx; | |||
@@ -144,15 +159,11 @@ | |||
} | |||
.live_bg { | |||
width: 100%; | |||
/* height: 180rpx; */ | |||
height: 140rpx; | |||
} | |||
.live_message { | |||
width: 100%; | |||
/* height: 180rpx; */ | |||
height: 140rpx; | |||
/* padding: 35rpx 60rpx; */ | |||
padding: 22rpx 60rpx; | |||
height: 100%; | |||
padding: 30rpx 0 48rpx 60rpx; | |||
display: flex; | |||
flex-direction: column; | |||
justify-content: space-between; | |||
@@ -172,12 +183,32 @@ | |||
align-items: flex-start; | |||
border-radius: 8rpx; | |||
} | |||
.rivers_title { | |||
.list_header { | |||
width: 100%; | |||
padding: 10rpx 20rpx; | |||
background-color: #ffffff; | |||
font-weight: 700; | |||
font-size: 34rpx; | |||
padding: 20rpx; | |||
margin-bottom: 30rpx; | |||
display: flex; | |||
justify-content: space-between; | |||
align-items: center; | |||
font-size: 30rpx; | |||
} | |||
.list_title{ | |||
font-weight: 600; | |||
margin-bottom: -10rpx; | |||
position: relative; | |||
} | |||
.list_title::after { | |||
content: ''; | |||
width: 120rpx; | |||
height: 10rpx; | |||
background-color: rgba(30, 121, 250, 0.5); | |||
position: absolute; | |||
bottom: 0rpx; | |||
left: 0rpx; | |||
} | |||
.more_btn { | |||
color: rgba(153, 153, 153, 1); | |||
} | |||
.rivers_list { | |||
width: 100%; | |||
@@ -189,50 +220,70 @@ | |||
.river_item { | |||
width: 100%; | |||
margin-bottom: 20rpx; | |||
padding: 20rpx; | |||
padding: 30rpx 22rpx 28rpx 27rpx; | |||
display: flex; | |||
justify-content: space-between; | |||
align-items: center; | |||
align-items: flex-start; | |||
background-color: #ffffff; | |||
border-radius: 10rpx; | |||
} | |||
.river_image { | |||
width: 180rpx; | |||
height: 180rpx; | |||
margin-right: 30rpx; | |||
border-radius: 10rpx; | |||
} | |||
.river_info { | |||
height: 180rpx; | |||
flex: 1; | |||
height: 100%; | |||
display: flex; | |||
flex-direction: column; | |||
justify-content: flex-start; | |||
align-items: flex-start; | |||
font-size: 28rpx; | |||
} | |||
.text_box { | |||
margin: 10rpx; | |||
.river_head { | |||
width: 100%; | |||
margin-bottom: 10rpx; | |||
display: flex; | |||
justify-content: flex-start; | |||
justify-content: space-between; | |||
align-items: center; | |||
} | |||
.info_item { | |||
width: 280rpx; | |||
margin-left: 10rpx; | |||
overflow: hidden; | |||
white-space: nowrap; | |||
text-overflow: ellipsis; | |||
} | |||
.info_icon { | |||
width: 24rpx; | |||
height: 24rpx; | |||
.river_name { | |||
font-weight: 600; | |||
} | |||
.river_button { | |||
width: 140rpx; | |||
height: 60rpx; | |||
font-size: 28rpx; | |||
width: 132rpx; | |||
height: 50rpx; | |||
font-size: 26rpx; | |||
color: #fff; | |||
line-height: 60rpx; | |||
line-height: 50rpx; | |||
text-align: center; | |||
background-color: #2a82e4; | |||
border-radius: 8rpx; | |||
align-self: flex-end; | |||
} | |||
.river_location { | |||
max-width: 420rpx; | |||
margin-bottom: 10rpx; | |||
padding: 8rpx 14rpx; | |||
background-color: rgba(40, 127, 251, 0.1); | |||
color: rgba(40, 127, 251, 1); | |||
border-radius: 10rpx; | |||
font-size: 26rpx; | |||
overflow: hidden; | |||
white-space: nowrap; | |||
text-overflow: ellipsis; | |||
} | |||
.river_note { | |||
max-width: 420rpx; | |||
font-size: 28rpx; | |||
color: rgba(118, 120, 129, 1); | |||
display: -webkit-box; | |||
overflow: hidden; | |||
text-overflow: ellipsis; | |||
word-wrap: break-word; | |||
white-space: normal !important; | |||
-webkit-line-clamp: 2; | |||
-webkit-box-orient: vertical; | |||
} | |||
@@ -9,12 +9,14 @@ | |||
</view> | |||
<list id="list" class="river_list" url="{{current}}" bind:update-list="updateList" list="{{list}}" bind:reset-list="resetList" params="{{params}}"> | |||
<view class="river_item" data-item="{{item}}" bindtap="showDetail" wx:for="{{list}}" wx:key="index"> | |||
<image class="river_image" src="{{item.image}}"></image> | |||
<view class="river_info"> | |||
<view class="massage_box"> | |||
<image class="river_img" src="{{item.image}}"></image> | |||
<riverInfo dataSource="{{item}}"></riverInfo> | |||
<view class="river_head"> | |||
<view class="river_name">{{item.name}}</view> | |||
<view class="river_button" catchtap="uploadProblem" data-current="{{index}}" data-detail="{{item}}">上报问题</view> | |||
</view> | |||
<view class="execute_btn" catchtap="uploadProblem" data-current="{{index}}" data-detail="{{item}}">上报问题</view> | |||
<view class="river_location">{{item.location}}</view> | |||
<view class="river_note">{{item.note || ''}}</view> | |||
</view> | |||
</view> | |||
@@ -7,6 +7,7 @@ | |||
justify-content: flex-start; | |||
align-items: center; | |||
color: #333333; | |||
background-color: rgba(242, 246, 249, 1); | |||
} | |||
.protect_head { | |||
width: 100%; | |||
@@ -29,7 +30,8 @@ | |||
.search_container { | |||
width: 100%; | |||
box-sizing: border-box; | |||
padding: 10rpx 30rpx; | |||
padding: 20rpx 30rpx; | |||
margin-bottom: 20rpx; | |||
background: #fff; | |||
position: relative; | |||
} | |||
@@ -62,37 +64,70 @@ | |||
} | |||
.river_item { | |||
width: 100%; | |||
padding: 0 30rpx; | |||
} | |||
.river_info { | |||
width: 100%; | |||
padding: 30rpx 0; | |||
border-bottom: 1rpx solid #E6E6E6; | |||
margin-bottom: 20rpx; | |||
padding: 30rpx; | |||
display: flex; | |||
justify-content: space-between; | |||
align-items: flex-end; | |||
} | |||
.massage_box { | |||
box-sizing: border-box; | |||
width: calc(100% - 150rpx); | |||
align-items: flex-start; | |||
background-color: #ffffff; | |||
border-radius: 10rpx; | |||
} | |||
.river_image { | |||
width: 180rpx; | |||
height: 180rpx; | |||
margin-right: 30rpx; | |||
border-radius: 10rpx; | |||
} | |||
.river_info { | |||
flex: 1; | |||
height: 100%; | |||
display: flex; | |||
flex-direction: column; | |||
justify-content: flex-start; | |||
align-items: flex-start; | |||
} | |||
.river_img { | |||
display: block; | |||
width: 178rpx; | |||
height: 144rpx; | |||
margin-right: 20rpx; | |||
} | |||
.execute_btn { | |||
width: 140rpx; | |||
height: 60rpx; | |||
font-size: 28rpx; | |||
} | |||
.river_head { | |||
width: 100%; | |||
margin-bottom: 10rpx; | |||
display: flex; | |||
justify-content: space-between; | |||
align-items: center; | |||
} | |||
.river_name { | |||
font-weight: 600; | |||
} | |||
.river_button { | |||
width: 132rpx; | |||
height: 50rpx; | |||
font-size: 26rpx; | |||
color: #fff; | |||
line-height: 60rpx; | |||
line-height: 50rpx; | |||
text-align: center; | |||
background-color: #2A82E4FF; | |||
background-color: #2a82e4; | |||
border-radius: 8rpx; | |||
align-self: flex-end; | |||
} | |||
} | |||
.river_location { | |||
max-width: 420rpx; | |||
margin-bottom: 10rpx; | |||
padding: 8rpx 14rpx; | |||
background-color: rgba(40, 127, 251, 0.1); | |||
color: rgba(40, 127, 251, 1); | |||
border-radius: 10rpx; | |||
font-size: 26rpx; | |||
overflow: hidden; | |||
white-space: nowrap; | |||
text-overflow: ellipsis; | |||
} | |||
.river_note { | |||
max-width: 420rpx; | |||
font-size: 28rpx; | |||
color: rgba(118, 120, 129, 1); | |||
display: -webkit-box; | |||
overflow: hidden; | |||
text-overflow: ellipsis; | |||
word-wrap: break-word; | |||
white-space: normal !important; | |||
-webkit-line-clamp: 2; | |||
-webkit-box-orient: vertical; | |||
} |