Skip to content

J
jd-vx-app
Commit a5d8f3f5 authored by lijiongliang's avatar lijiongliang
Browse files
Options

页面优化

parent 0cf38f0e
Show whitespace changes
Inline Side-by-side
Showing with 469 additions and 8 deletions
pages/home-new.vue 0 → 100644
View file @ a5d8f3f5
<template>
<view class="appCotent" v-if="show">
<view class="index-content">
<view class="swiper">
<u-swiper radius="20rpx" :height="130" :list="list5" circular @change="e => current = e.current"
:autoplay="true" keyName="imageUrl" @click="goOtherLink">
<view slot="indicator" class="indicator">
<view class="indicator__dot" v-for="(item, index) in list5" :key="index"
:class="[index === current && 'indicator__dot--active']">
</view>
</view>
</u-swiper>
</view>
<u-gap bgColor="transparent" height="20"></u-gap>
<view class="banner">
<view class="banner-img">
<image src="http://jdnc-oss.uzosp.com/2022/05/31/2260b529e99a472fbe3b6ba33f7987f5.png"></image>
<view class="left" @click="goJdShop(1)"></view>
<view class="right" @click="goJdShop(2)"></view>
</view>
<u-gap bgColor="transparent" height="20"></u-gap>
<view class="banner-btn">
<image src="../static/index/ban-btn.png"></image>
<text>限时领取</text>
</view>
</view>
<u-gap bgColor="transparent" height="15"></u-gap>
<view class="bg-img">
<image src="http://jdnc-oss.uzosp.com/2022/05/31/ecfc20fad7ad483994c524c77647797d.png"></image>
</view>
<!-- 已领取优惠券后弹框 -->
<view class="pooup-get-coupon" v-if="pooupCoupon">
<view class="coupon-box">
<image src="../../../static/index/coupon3.png"></image>
<view class="close" @click="closeCoupon">
X
</view>
<view class="title">
<view style="margin-bottom:10rpx;font-weight: bold;">
您无优惠券可用
</view>
<view class="">
正在跳转中......({{timerNum}}秒)
</view>
</view>
<view class="coupon-btn" @click="goBuy">
去原价购买
</view>
</view>
</view>
</view>
</view>
</template>
<script>
import util from '@/pages/login/util.js'
let plugin = requirePlugin("loginPlugin");
export default {
data() {
return {
show: false,
current: 0,
balance: "0.00",
list5: [],
//免费挪车码
freeCode: {},
carList:[], // 爱车列表
pooupCoupon:false,
timerNum:3,
timer:null,
clickState:false, // 立即领取 防抖
};
},
methods: {
goJdShop(index){
let sku;
if(index == 1){
sku = 100023585323
}else{
sku = 100024041323
}
console.log(sku,777777777)
uni.navigateToMiniProgram({
appId: 'wx91d27dbf599dff74', // 跳转目标小程序的id
path: 'pages/item/detail/detail?sku='+sku, // 目标小程序的页面路径
extraData: { // 需要携带的参数
},
success:(res)=> {
// 打开成功
},
fail:()=>{
}
})
},
goJdLogin(){
let returnPage= '/pages/main';
let pageType = "reLaunch"
uni.navigateTo({
url:"/pages/login/index/index?returnPage="+returnPage+'&pageType='+pageType
})
},
getPrice() {
if(this.clickState == false){
uni.showLoading({
title:"加载中",
mask:true
})
this.clickState = true
let that = this
let token = uni.getStorageSync('userToken');
if (!token) {
uni.hideLoading()
this.clickState = false
uni.showModal({
title: "未绑定账号",
content: "您没有绑定京东账号,请绑定后再领取",
success:function(res){
if (res.confirm) {
that.goJdLogin()
}
}
});
// uni.navigateTo({
// url: '/pages/binding/index?url=/pages/main&index=0'
// })
return;
}
let opts = {
url: '/app/user/info',
method: 'get'
}
that.http.httpTokenRequest(opts, {}).then(res => {
if (res.data.code == 200) {
let freeMoveFlag = res.data.data.freeMoveFlag
if (freeMoveFlag) {
uni.hideLoading()
// uni.showToast({
// title: "您的免费领取次数已用完",
// icon: 'none',
// duration: 2000,
// success:function(){
// }
// });
this.pooupCoupon = true
this.timer = setInterval(()=>{
if(this.timerNum > 0){
this.timerNum --
}else{
this.pooupCoupon = false
this.timerNum = 3
this.clickState = false
uni.navigateToMiniProgram({
appId: 'wx91d27dbf599dff74', // 跳转目标小程序的id
path: 'pages/item/detail/detail?sku=100023585323', // 目标小程序的页面路径
extraData: { // 需要携带的参数
},
success(res) {
// 打开成功
}
})
clearInterval(this.timer)
}
},1000)
} else {
//跳转到领取优惠卷页面
// uni.navigateTo({
// url: '/pagesA/pages/index/getPrice?orderId=' + this.freeCode.id
// });
// uni.showLoading({
// title: '加载中'
// });
setTimeout(()=>{
this.getCarList()
},500)
}
}else{
uni.hideLoading()
uni.showToast({
title: res.data.msg,
icon: "error",
});
}
})
}
},
closeCoupon(){
this.pooupCoupon = false
this.timerNum = 3
this.clickState = false
clearInterval(this.timer)
},
// 已领取优惠券按钮
goBuy(){
this.timerNum = 3
this.clickState = false
clearInterval(this.timer)
uni.navigateToMiniProgram({
appId: 'wx91d27dbf599dff74', // 跳转目标小程序的id
path: 'pages/item/detail/detail?sku=100023585323', // 目标小程序的页面路径
extraData: { // 需要携带的参数
},
success:(res)=> {
// 打开成功
this.pooupCoupon = false
},
fail:()=>{
this.pooupCoupon = false
}
})
},
getMoveCode() {
let opts = {
url: '/app/index/free/code',
method: 'get'
};
this.http.httpRequest(opts, {}).then(res => {
if (res.data.code == 200) {
this.freeCode = res.data.data
}
})
},
getRotationList() {
let opts = {
url: '/app/index/carouse/1',
method: 'get'
};
this.http.httpTokenRequest(opts, {}).then(res => {
if (res.data.code == 200) {
let data = []
data = res.data.data
let imgList = []
data.forEach(e => {
imgList.push(e)
})
this.list5 = imgList
}
})
},
// 轮播跳转其他页面
goOtherLink(index) {
let item = this.list5[index]
let link = item.link;
var newStr = link.indexOf("http");
var newStr2 = link.indexOf("https");
if (newStr == 0 || newStr2 == 0) {
uni.navigateTo({
url: '/pages/webview/webview?url=' + link
})
return
}
uni.navigateTo({
url: link
})
},
// 获取爱车列表
getCarList(){
let opts = { url: '/app/vehicleAdmin/list', method: 'get' };
this.http.httpTokenRequest(opts, {}).then(res => {
uni.hideLoading()
if (res.statusCode == 200) {
this.carList = res.data
if(res.data.length == 0){
uni.navigateTo({
url: '/pages/transitionPage',
success:()=>{
this.clickState = false
}
});
uni.setStorageSync('firstCoupon',true)
// let url = "car.m.jd.com/h5/list.html?final-action=closewebview&source=licenseprocedure"
// util.redirectToH5({page:url})
}else{
// uni.navigateTo({
// url: '/pagesA/pages/index/getPrice?orderId=' + this.freeCode.id
// });
uni.navigateTo({
url: '/pagesA/pages/index/getCoupon',
success:()=>{
this.clickState = false
}
});
}
}else{
this.clickState = false
}
})
},
},
created() {
this.getMoveCode()
this.getRotationList()
},
mounted() {
setTimeout(() => {
this.show = true
}, 100);
},
onReady: function() {
uni.setNavigationBarTitle({
title: '友众挪车牌'
});
}
};
</script>
<style lang="scss">
.index-content {
.swiper{
padding:30rpx;
}
background-color: #f9f9f9;
.u-swiper {
border-radius: 0 0 0 100rpx !important;
}
.indicator {
@include flex(row);
justify-content: center;
position: absolute;
right:240rpx; bottom:0rpx;
&__dot {
height: 20rpx;
width: 20rpx;
border-radius: 100%;
background-color: rgba(255, 255, 255, 0.35);
margin: 0 10rpx;
transition: background-color 0.3s;
&--active {
background-color: #e1251b;
}
}
}
.indicator-num {
padding: 4rpx 0;
background-color: rgba(0, 0, 0, 0.35);
border-radius: 100%;
width: 35px;
text-align: right;
@include flex;
justify-content: center;
&__text {
color: #ffffff;
font-size: 24rpx;
}
}
.banner{
width:100%;
.banner-img,
.banner-btn{
margin: 0 auto;
position: relative;
image{
position: absolute;
top:0;left:0;
width:100%;height:100%;
}
view,text{
position: relative;
z-index:100;
}
}
.banner-img{
width: 690rpx ;height:262rpx;
box-sizing: border-box;
padding:0 110rpx;
display:flex;
justify-content: space-between;
.left{
width: 220rpx;height:220rpx;
}
.right{
width: 220rpx;height:220rpx;
}
}
.banner-btn{
width:511rpx;height:98rpx;
font-weight: bold;
color: #1F335A;
font-size: 34rpx;
text-align: center;
line-height:84rpx;
}
}
.bg-img{
width:100%;
image{
width:100%;height:4296rpx;
}
}
// 弹框
.pooup-get-coupon{
position: fixed;
top:0;right:0;
bottom:0;left:0;
background-color: rgba(0,0,0,.5);
display: flex;
align-items: center;
justify-content: center;
z-index:100;
.coupon-box{
width:500rpx;height:620rpx;
border-radius:20rpx;
text-align: center;
position: relative;
top:-120rpx;
image{
position: absolute;
top:0;left:0;
width:100%;height:100%;
z-index:-11;
}
.close{
padding:20rpx 30rpx;
font-size:32rpx;
position: absolute;
top:0;right:0;
}
.title{
width:100%;
position: absolute;
bottom:180rpx;left:0;
font-size: 32rpx;
}
.coupon-btn{
width:360rpx;height:80rpx;
line-height:80rpx;
position: absolute;
bottom:64rpx;left:50%;
margin-left:-170rpx;
border-radius:50rpx;
font-size: 36rpx;
font-weight: bold;
background: linear-gradient(0deg, #F72B43, #F15C43);
color:#fff;
}
}
}
}
</style>
pages/main.vue
View file @ a5d8f3f5
......@@ -18,7 +18,8 @@
mapState
} from 'vuex';
import tabbar from '@/common/hans-tabbar/hans-tabbar'
import index from './home'
// import index from './home'
import index from './home-new.vue'
import moveCar from './moveCar'
import shop from './shop'
import personal from './personal'
......
pagesA/pages/index/getCoupon.vue
View file @ a5d8f3f5
......@@ -3,7 +3,7 @@
<!-- 我的订单 -->
<view class="get-coupon">
<view class="box">
<image src="../../../static/index/coupon1.png"></image>
<image src="http://jdnc-oss.uzosp.com/2022/05/31/5c01ded6473a44c7b5f1370b6010ae87.png"></image>
<view class="title">
<view style="margin-bottom:20rpx;">
......@@ -22,7 +22,7 @@
<!-- 领取成功后弹框 -->
<view class="pooup-success" v-if="pooupSuccess">
<view class="success-box">
<image src="../../../static/index/coupon2.png"></image>
<image src="http://jdnc-oss.uzosp.com/2022/05/31/7f0a17d1075d47ffb784b4095e79d36a.png"></image>
<view class="close" @click="closeCoupon">
X
</view>
......
pagesB/pages/move-car/oneMoveCar.vue
View file @ a5d8f3f5
......@@ -154,10 +154,10 @@
this.noticeResult = res.data.data
if (this.noticeResult.allowPhone) {
// this.list[0].name = this.noticeResult.secretPhone
this.show = true;
// uni.makePhoneCall({
// phoneNumber: this.noticeResult.secretPhone
// });
// this.show = true;
uni.makePhoneCall({
phoneNumber: this.noticeResult.secretPhone
});
}
} else {
this.noticeResult = res.data.data
......
pagesB/pages/move-car/scan.vue
View file @ a5d8f3f5
......@@ -94,7 +94,7 @@
</view>
<view class="item-input flex align-center">
<input type="number" placeholder="请输入" v-model="model1.verificationCode">
<view class="code text-red" v-if="!smsbtn.status" @click="sendCode">
<view class="code" style="color: #F1251B;" v-if="!smsbtn.status" @click="sendCode">
{{smsbtn.text}}
</view>
<view class="code" v-else>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment