|
|
@@ -54,21 +54,21 @@
|
|
|
<view class="img-box">
|
|
|
<img src="/static/img/Frame 198 (1).png" alt="">
|
|
|
</view>
|
|
|
- <view class="text"> -->
|
|
|
- <!-- 站点头部 -->
|
|
|
- <!-- <view class="station-title">
|
|
|
+ <view class="text">
|
|
|
+
|
|
|
+ <view class="station-title">
|
|
|
<text class="title-left">快充</text>
|
|
|
<text class="title-right">荆沙大道救助站充电站</text>
|
|
|
- </view> -->
|
|
|
- <!-- 价格 -->
|
|
|
- <!-- <view class="station-price">
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class="station-price">
|
|
|
<view class="price-left">1.25</view>
|
|
|
<view class="price-right">
|
|
|
起 元/度
|
|
|
</view>
|
|
|
- </view> -->
|
|
|
- <!-- park -->
|
|
|
- <!-- <view class="park">
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class="park">
|
|
|
<text class="park-p">p</text>
|
|
|
<text class="park-text">2小时免费停车</text>
|
|
|
</view>
|
|
|
@@ -94,82 +94,134 @@
|
|
|
</view>
|
|
|
<view class="img-box">
|
|
|
<img src="/static/img/暂无网络信号-缺省页 1.png">
|
|
|
- </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+
|
|
|
</view>
|
|
|
-
|
|
|
- </view>
|
|
|
+
|
|
|
+ <!-- 充电状态 -->
|
|
|
+ <!-- <view class="state1 state">
|
|
|
+ <view class="state-text">
|
|
|
+ <view class="text-1">
|
|
|
+ 排队中
|
|
|
+ </view>
|
|
|
+ <view class="text-2">
|
|
|
+ 前方等待两位
|
|
|
+ </view>
|
|
|
+ <view class="text-3">
|
|
|
+ 荆鹏软件园充电站/1号有序充电桩
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="img-box">
|
|
|
+ <img src="/static/img/等待中-缺省页.png">
|
|
|
+ </view>
|
|
|
+ </view> -->
|
|
|
+ <!-- <view class="state2 state">
|
|
|
+ <view class="state-text">
|
|
|
+ <view class="text-1" style="color: green">
|
|
|
+ 充电中
|
|
|
+ </view>
|
|
|
+ <view class="text-2">
|
|
|
+ 前方等待两位
|
|
|
+ </view>
|
|
|
+ <view class="text-3">
|
|
|
+ 荆鹏软件园充电站/1号有序充电桩
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="img-box">
|
|
|
+ <img src="/static/img/充电中-缺省页.png">
|
|
|
+ </view>
|
|
|
+ </view> -->
|
|
|
+ <!-- <view class="state3 state">
|
|
|
+ <view class="state-text">
|
|
|
+ <view class="text-1" style="color: red;">
|
|
|
+ 已充满
|
|
|
+ </view>
|
|
|
+ <view class="text-2" style="color: red;">
|
|
|
+ 超出时间将收取占位费
|
|
|
+ </view>
|
|
|
+ <view class="text-3">
|
|
|
+ 荆鹏软件园充电站/1号有序充电桩
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="img-box">
|
|
|
+ <img src="/static/img/已充满-缺省页.png">
|
|
|
+ </view>
|
|
|
+ </view> -->
|
|
|
+
|
|
|
<!-- 充值活动 -->
|
|
|
<view class=" top-up">
|
|
|
- <view class="top-up-title"><text class="line"></text>充值活动</view>
|
|
|
- <view class="img-box">
|
|
|
- <view class="img-1" @click="rechargeActivity">
|
|
|
- <img src="/static/img/瓷片区1.png" alt="">
|
|
|
- <view class="img-text">
|
|
|
- 充100送20
|
|
|
- <view class="img-text2">即充即赠 立享优惠</view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view class="img-1">
|
|
|
- <img src="/static/img/瓷片区2.png" alt="">
|
|
|
- <view class="img-text" style="color: #FF7C00;">
|
|
|
- 邀请有礼
|
|
|
- <view class="img-text2 color">最高可得500元</view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
+ <view class="top-up-title"><text class="line"></text>充值活动</view>
|
|
|
+ <view class="img-box">
|
|
|
+ <view class="img-1" @click="rechargeActivity">
|
|
|
+ <img src="/static/img/瓷片区1.png" alt="">
|
|
|
+ <view class="img-text">
|
|
|
+ 充100送20
|
|
|
+ <view class="img-text2">即充即赠 立享优惠</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
- <!-- 新闻 -->
|
|
|
- <view class="news-title">
|
|
|
- <view class="news-title-left">
|
|
|
- <view class="line" style="margin-top:4px;"></view>新闻公告
|
|
|
+ <view class="img-1">
|
|
|
+ <img src="/static/img/瓷片区2.png" alt="">
|
|
|
+ <view class="img-text" style="color: #FF7C00;">
|
|
|
+ 邀请有礼
|
|
|
+ <view class="img-text2 color">最高可得500元</view>
|
|
|
</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <!-- 新闻 -->
|
|
|
+ <view class="news-title">
|
|
|
+ <view class="news-title-left">
|
|
|
+ <view class="line" style="margin-top:4px;"></view>新闻公告
|
|
|
+ </view>
|
|
|
|
|
|
- <view class="more" @click="toNewsNotice">更多<view class="more-icon iconfont"> </view>
|
|
|
- </view>
|
|
|
+ <view class="more" @click="toNewsNotice">更多<view class="more-icon iconfont"> </view>
|
|
|
+ </view>
|
|
|
|
|
|
|
|
|
+ </view>
|
|
|
+ <view class="news">
|
|
|
+
|
|
|
+ <view class="news-content" @click="gotoUrl('pages/article/articleDetails?id=')">
|
|
|
+ <view class="content-text">
|
|
|
+ 日印计划联手开发低成本充电桩 推动新兴市场电动车发展
|
|
|
+ <view class="news-time">05-01 09:00</view>
|
|
|
</view>
|
|
|
- <view class="news">
|
|
|
-
|
|
|
- <view class="news-content" @click="gotoUrl('pages/article/articleDetails?id=')">
|
|
|
- <view class="content-text">
|
|
|
- 日印计划联手开发低成本充电桩 推动新兴市场电动车发展
|
|
|
- <view class="news-time">05-01 09:00</view>
|
|
|
- </view>
|
|
|
- <view class="content-img">
|
|
|
- <img src="/static/img/11091323191.jpg" alt="">
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view class="news-content">
|
|
|
- <view class="content-text">
|
|
|
- 我国新能源汽车市场腾飞在即，充换电何时能够不再“拖后腿”？
|
|
|
- <view class="news-time">05-01 09:00</view>
|
|
|
- </view>
|
|
|
- <view class="content-img">
|
|
|
- <img src="/static/img/103613441.jpg" alt="">
|
|
|
- </view>
|
|
|
- </view>
|
|
|
+ <view class="content-img">
|
|
|
+ <img src="/static/img/11091323191.jpg" alt="">
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="news-content">
|
|
|
+ <view class="content-text">
|
|
|
+ 我国新能源汽车市场腾飞在即，充换电何时能够不再“拖后腿”？
|
|
|
+ <view class="news-time">05-01 09:00</view>
|
|
|
+ </view>
|
|
|
+ <view class="content-img">
|
|
|
+ <img src="/static/img/103613441.jpg" alt="">
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
|
|
|
- <view class="news-content">
|
|
|
- <view class="content-text">
|
|
|
- 新疆建成首个充电桩实验室
|
|
|
- <view class="news-time">05-01 09:00</view>
|
|
|
- </view>
|
|
|
- <view class="content-img">
|
|
|
- <img src="/static/img/180023631.jpg" alt="">
|
|
|
- </view>
|
|
|
- </view>
|
|
|
+ <view class="news-content">
|
|
|
+ <view class="content-text">
|
|
|
+ 新疆建成首个充电桩实验室
|
|
|
+ <view class="news-time">05-01 09:00</view>
|
|
|
</view>
|
|
|
- <view class="bottom" v-if="newsList.length == recordsTotal">
|
|
|
- <view class="bot">
|
|
|
- <view class="bot-line"></view>
|
|
|
- <view class="bot-text">已经到底了</view>
|
|
|
- <view class="bot-line"></view>
|
|
|
- </view>
|
|
|
+ <view class="content-img">
|
|
|
+ <img src="/static/img/180023631.jpg" alt="">
|
|
|
</view>
|
|
|
- <!-- 导航栏 -->
|
|
|
- <view class="navigation">
|
|
|
- <!-- <view class="nav-items">
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="bottom" v-if="newsList.length == recordsTotal">
|
|
|
+ <view class="bot">
|
|
|
+ <view class="bot-line"></view>
|
|
|
+ <view class="bot-text">已经到底了</view>
|
|
|
+ <view class="bot-line"></view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <!-- 导航栏 -->
|
|
|
+ <view class="navigation">
|
|
|
+ <!-- <view class="nav-items">
|
|
|
<view class="nav-icon iconfont ">
|
|
|

|
|
|
</view>
|
|
|
@@ -183,15 +235,16 @@
|
|
|
<view class="nav-icon iconfont"></view>
|
|
|
<view class="nav-text">我的</view>
|
|
|
</view> -->
|
|
|
+ <!-- 登录提示 -->
|
|
|
<view class="login-prompt" v-if="userId.length == 0">
|
|
|
登录显示更多会员服务
|
|
|
<text class="button" @click="toLogin">登录/注册</text>
|
|
|
</view>
|
|
|
- <Tabbar :current="0"></Tabbar>
|
|
|
- </view>
|
|
|
- <!-- 登录提示 -->
|
|
|
-
|
|
|
- </view>
|
|
|
+ <Tabbar :current="0"></Tabbar>
|
|
|
+ </view>
|
|
|
+
|
|
|
+
|
|
|
+ </view>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
@@ -200,7 +253,7 @@
|
|
|
import * as WxJsApi from '@/utils/wxJsApi.js'
|
|
|
import MapLoader from '@/utils/AMap'
|
|
|
import Tabbar from '@/components/Tabbar.vue'
|
|
|
-
|
|
|
+
|
|
|
export default {
|
|
|
components: {
|
|
|
Tabbar
|
|
|
@@ -218,21 +271,21 @@
|
|
|
}
|
|
|
},
|
|
|
onReachBottom() {
|
|
|
- if (this.newsList.length < this.recordsTotal) {
|
|
|
+ if (this.newsList.length < this.recordsTotal) {
|
|
|
this.myLoadmore();
|
|
|
}
|
|
|
},
|
|
|
onReady() {
|
|
|
- if(this.carhelp.getPersonInfo().id != null) {
|
|
|
+ if (this.carhelp.getPersonInfo().id != null) {
|
|
|
this.userId = this.carhelp.getPersonInfo().id;
|
|
|
}
|
|
|
-
|
|
|
- WxJsApi.getWxConfig(['getLocation','addEventListener','scanQRCode']).then((res)=>{
|
|
|
+
|
|
|
+ WxJsApi.getWxConfig(['getLocation', 'addEventListener', 'scanQRCode']).then((res) => {
|
|
|
// console.log(res)
|
|
|
}).catch(error => {
|
|
|
- console.log(res)
|
|
|
+ console.log(res)
|
|
|
})
|
|
|
-
|
|
|
+
|
|
|
this.getPoint();
|
|
|
this.getNewsList();
|
|
|
this.getActivityInfoList();
|
|
|
@@ -250,11 +303,11 @@
|
|
|
},
|
|
|
//微信扫二维码
|
|
|
scanCode() {
|
|
|
- if(this.userId != '') {
|
|
|
+ if (this.userId != '') {
|
|
|
WxJsApi.scanQRCode(1).then(res => {
|
|
|
-
|
|
|
+
|
|
|
}).catch(error => {
|
|
|
-
|
|
|
+
|
|
|
})
|
|
|
} else {
|
|
|
uni.redirectTo({
|
|
|
@@ -263,7 +316,7 @@
|
|
|
}
|
|
|
},
|
|
|
fastRecharge() {
|
|
|
- if(this.userId != '') {
|
|
|
+ if (this.userId != '') {
|
|
|
this.gotoUrl('pages/user/finance/recharge?id=' + this.userId)
|
|
|
} else {
|
|
|
uni.redirectTo({
|
|
|
@@ -272,7 +325,7 @@
|
|
|
}
|
|
|
},
|
|
|
chargingRecord() {
|
|
|
- if(this.userId != '') {
|
|
|
+ if (this.userId != '') {
|
|
|
this.gotoUrl('pages/user/finance/rechargeList?id=' + this.userId)
|
|
|
} else {
|
|
|
uni.redirectTo({
|
|
|
@@ -281,7 +334,7 @@
|
|
|
}
|
|
|
},
|
|
|
rechargeActivity() {
|
|
|
- if(this.userId != '') {
|
|
|
+ if (this.userId != '') {
|
|
|
this.gotoUrl('pages/user/finance/recharge?id=' + this.userId)
|
|
|
} else {
|
|
|
uni.redirectTo({
|
|
|
@@ -290,23 +343,23 @@
|
|
|
}
|
|
|
},
|
|
|
getActivityInfoList() {
|
|
|
-
|
|
|
+
|
|
|
},
|
|
|
getPoint() {
|
|
|
WxJsApi.getLocation().then((res) => {
|
|
|
this.latitude = parseFloat(res.latitude);
|
|
|
this.longitude = parseFloat(res.longitude);
|
|
|
this.message = res.errMsg;
|
|
|
-
|
|
|
- if(res.errMsg != 'getLocation:ok') {
|
|
|
+
|
|
|
+ if (res.errMsg != 'getLocation:ok') {
|
|
|
uni.showToast({
|
|
|
- title:JSON.stringify(res)
|
|
|
+ title: JSON.stringify(res)
|
|
|
})
|
|
|
- }
|
|
|
+ }
|
|
|
}).catch(error => {
|
|
|
uni.showToast({
|
|
|
- title:JSON.stringify(error)
|
|
|
- })
|
|
|
+ title: JSON.stringify(error)
|
|
|
+ })
|
|
|
})
|
|
|
},
|
|
|
getNewsList(bl) {
|
|
|
@@ -318,7 +371,7 @@
|
|
|
this.newsList = [];
|
|
|
this.pageIndex = 1;
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
uni.hideLoading();
|
|
|
},
|
|
|
myLoadmore() {
|
|
|
@@ -497,7 +550,7 @@
|
|
|
|
|
|
// 数量
|
|
|
.count {
|
|
|
- margin-top: 8px;
|
|
|
+ margin-top: 12px !important;
|
|
|
width: 96%;
|
|
|
display: flex;
|
|
|
justify-content: space-between;
|
|
|
@@ -509,7 +562,7 @@
|
|
|
//定位
|
|
|
|
|
|
.location {
|
|
|
- width: 343px;
|
|
|
+
|
|
|
background-color: #ffffff;
|
|
|
height: 120px;
|
|
|
display: flex;
|
|
|
@@ -557,6 +610,47 @@
|
|
|
}
|
|
|
}
|
|
|
|
|
|
+ .state{
|
|
|
+ // width: 343px;
|
|
|
+ width: 91.4%;
|
|
|
+ background-color: #ffffff;
|
|
|
+ height: 120px;
|
|
|
+ display: flex;
|
|
|
+ margin: 70px auto 0;
|
|
|
+ border-radius: 8px;
|
|
|
+ border: #F2F4F4 1px;
|
|
|
+ .state-text{
|
|
|
+ width: 61.8%;
|
|
|
+ padding: 24px 0 0 28px;
|
|
|
+ .text-1 {
|
|
|
+ height: 16px;
|
|
|
+ line-height: 16px;
|
|
|
+ color: blueviolet;
|
|
|
+ font-size: 16px;
|
|
|
+ text-align: left;
|
|
|
+ }
|
|
|
+ .text-2 {
|
|
|
+ height: 17px;
|
|
|
+ line-height: 17px;
|
|
|
+ color: #101010;
|
|
|
+ text-align: left;
|
|
|
+ margin-top: 12px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .text-3 {
|
|
|
+ font-size: 12px;
|
|
|
+ text-align: center;
|
|
|
+ margin-top: 6px;
|
|
|
+ color: #999999;
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+ .img-box {
|
|
|
+ width: 120px;
|
|
|
+ height: 120px;
|
|
|
+ float: right;
|
|
|
+ }
|
|
|
+ }
|
|
|
//充值
|
|
|
.top-up {
|
|
|
margin-left: 16px;
|
|
|
@@ -735,7 +829,7 @@
|
|
|
}
|
|
|
}
|
|
|
|
|
|
-
|
|
|
+
|
|
|
|
|
|
img {
|
|
|
width: 100%;
|
|
|
@@ -960,6 +1054,21 @@
|
|
|
float: right;
|
|
|
}
|
|
|
}
|
|
|
+ // 状态
|
|
|
+ .state{
|
|
|
+ width: 91.4%;
|
|
|
+ background-color: #ffffff;
|
|
|
+ height: 120px;
|
|
|
+ display: flex;
|
|
|
+ margin: 70px auto 0;
|
|
|
+ border-radius: 8px;
|
|
|
+ border: #F2F4F4 1px;
|
|
|
+ .img-box {
|
|
|
+ width: 120px;
|
|
|
+ height: 120px;
|
|
|
+ float: right;
|
|
|
+ }
|
|
|
+ }
|
|
|
|
|
|
//充值
|
|
|
.top-up {
|
|
|
@@ -1136,28 +1245,30 @@
|
|
|
font-size: 14px;
|
|
|
}
|
|
|
}
|
|
|
-// 登录提示
|
|
|
-.login-prompt{
|
|
|
- width: 91.4%;
|
|
|
- height: 40px;
|
|
|
- line-height: 40px;
|
|
|
- border-radius: 50px;
|
|
|
- text-align: left;
|
|
|
- padding-left: 16px;
|
|
|
- padding-right: 4px;
|
|
|
- background-color: rgba(0, 0, 0, 0.6);
|
|
|
- position: fixed;
|
|
|
- bottom: 75px;
|
|
|
- color: #ffffff;
|
|
|
- .button{
|
|
|
- width: 88px;
|
|
|
- height: 32px;
|
|
|
- line-height: 32px;
|
|
|
+
|
|
|
+ // 登录提示
|
|
|
+ .login-prompt {
|
|
|
+ width: 91.4%;
|
|
|
+ height: 40px;
|
|
|
+ line-height: 40px;
|
|
|
border-radius: 50px;
|
|
|
- background-color: rgba(0, 185, 98, 100);
|
|
|
- text-align: center;
|
|
|
- float: right;
|
|
|
- margin-top: 4px;
|
|
|
+ text-align: left;
|
|
|
+ padding-left: 16px;
|
|
|
+ padding-right: 4px;
|
|
|
+ background-color: rgba(0, 0, 0, 0.6);
|
|
|
+ position: fixed;
|
|
|
+ bottom: 75px;
|
|
|
+ color: #ffffff;
|
|
|
+
|
|
|
+ .button {
|
|
|
+ width: 88px;
|
|
|
+ height: 32px;
|
|
|
+ line-height: 32px;
|
|
|
+ border-radius: 50px;
|
|
|
+ background-color: rgba(0, 185, 98, 100);
|
|
|
+ text-align: center;
|
|
|
+ float: right;
|
|
|
+ margin-top: 4px;
|
|
|
+ }
|
|
|
}
|
|
|
-}
|
|
|
</style>
|
