作者 李芳银

新增弹窗

... ... @@ -19,6 +19,10 @@ Page({
fen_di: '',
itemid: '',
wait: 0,
showModalStatus: false,
jump_img: '',
jump_url: '',
},
onLoad: function (options) {
let that = this
... ... @@ -31,14 +35,7 @@ Page({
onReady: function () {
},
onShow: function () {
wx.showToast({
title: '加载中',
icon: "loading",
duration: 1500,
mask: false
})
},
onShow: function () {},
toggleDialog() {
},
... ... @@ -58,7 +55,10 @@ Page({
that.setData({
detaillist: data,
shi: data.active.price,
itemid: data.id
itemid: data.id,
jump_img: data.active.jump_img2,
jump_url: data.active.jump_url,
})
console.log(data);
} catch (err) {
... ... @@ -180,37 +180,51 @@ Page({
that.setData({
wait: 1
})
console.log(that.data.jump_img);
if (that.data.jump_img != '') {
that.showModal()
} else {
wx.redirectTo({
url: '/pages/binding4S/binding4S',
})
}
},
fail(res) {
console.log(res)
}
})
} else if (data.data.type == 1) {
console.log(that.data.jump_img);
if (that.data.jump_img != '') {
that.showModal()
} else {
that.setData({
msg: data.msg,
wait: 1
})
that.popSuccessTest()
a.popSuccessTest(data.msg)
setTimeout(() => {
wx.redirectTo({
url: '/pages/binding4S/binding4S',
})
}, 1500);
}
} else {
console.log(that.data.jump_img);
if (that.data.jump_img != '') {
that.showModal()
} else {
that.setData({
msg: data.msg,
wait: 1
})
that.popSuccessTest()
a.popSuccessTest(data.msg)
setTimeout(() => {
wx.redirectTo({
url: '/pages/binding4S/binding4S',
})
}, 1500);
}
}
} else {
that.setData({
msg: data.msg
... ... @@ -218,10 +232,6 @@ Page({
that.popMaskTest()
}
}
} catch (err) {
console.log(err);
that.setData({
... ... @@ -230,6 +240,17 @@ Page({
that.popMaskTest()
}
},
jumpImgUrl() {
let that = this
wx.navigateTo({
url: '/pages/webview/webview?url=' + that.data.jump_url
})
that.hideModal()
},
offclose() {
this.hideModal()
},
popMaskTest() {
wx.showToast({
title: this.data.msg,
... ... @@ -246,6 +267,44 @@ Page({
duration: 2000, //停留时间
})
},
showModal() { //显示对话框
var animation = wx.createAnimation({
duration: 200,
timingFunction: "linear",
delay: 0
})
this.animation = animation
animation.translateY(300).step()
this.setData({
animationData: animation.export(),
showModalStatus: true
})
setTimeout(function () {
animation.translateY(0).step()
this.setData({
animationData: animation.export()
})
}.bind(this), 100)
},
hideModal() { //隐藏对话框
var animation = wx.createAnimation({
duration: 200,
timingFunction: "linear",
delay: 0
})
this.animation = animation
animation.translateY(300).step()
this.setData({
animationData: animation.export(),
})
setTimeout(function () {
animation.translateY(0).step()
this.setData({
animationData: animation.export(),
showModalStatus: false
})
}.bind(this), 100)
},
})
\ No newline at end of file
... ...
... ... @@ -277,4 +277,50 @@ page {
}
}
.login {
// 弹窗
/*使屏幕变暗 */
.commodity_screen {
width: 100%;
height: 100%;
position: fixed;
top: 0;
left: 0;
background: #000;
opacity: 0.2;
overflow: hidden;
z-index: 10;
}
/*对话框 */
.center__nox {
height: 40%;
width: 80%;
position: fixed;
top: 40%;
left: 50%;
transform: translate(-50%, -50%);
z-index: 20;
background: #fff;
padding: 20rpx;
box-sizing: border-box;
border-radius: 24rpx;
// position: relative;
.jump_img {
width: 100%;
}
.jump_close {
width: 32rpx;
height: 32rpx;
position: absolute;
top: -50rpx;
right: 8rpx;
z-index: 10;
}
}
}
}
\ No newline at end of file
... ...
... ... @@ -63,4 +63,11 @@
<button class="btnbuy__" formType="submit">{{wait == 1 ? '已预约': '预约'}}</button>
</view>
</form>
<view class="login" wx:if="{{showModalStatus}}">
<view class="commodity_screen"></view>
<view class="center__nox">
<image src="{{jump_img}}" class="jump_img" mode="widthFix" catchtap="jumpImgUrl" />
<image src="../../static/img/close.png" class="jump_close" catchtap="offclose" />
</view>
</view>
</view>
\ No newline at end of file
... ...
... ... @@ -219,3 +219,42 @@ page {
color: #E8370F;
margin: 0 5rpx;
}
.container .login {
/*使屏幕变暗 */
/*对话框 */
}
.container .login .commodity_screen {
width: 100%;
height: 100%;
position: fixed;
top: 0;
left: 0;
background: #000;
opacity: 0.2;
overflow: hidden;
z-index: 10;
}
.container .login .center__nox {
height: 40%;
width: 80%;
position: fixed;
top: 40%;
left: 50%;
transform: translate(-50%, -50%);
z-index: 20;
background: #fff;
padding: 20rpx;
box-sizing: border-box;
border-radius: 24rpx;
}
.container .login .center__nox .jump_img {
width: 100%;
}
.container .login .center__nox .jump_close {
width: 32rpx;
height: 32rpx;
position: absolute;
top: -50rpx;
right: 8rpx;
z-index: 10;
}
... ...
... ... @@ -21,8 +21,9 @@
"checkSiteMap": true,
"uploadWithSourceMap": true,
"compileHotReLoad": false,
"useMultiFrameRuntime": false,
"useMultiFrameRuntime": true,
"useApiHook": true,
"useApiHostProcess": true,
"babelSetting": {
"ignore": [],
"disablePlugins": [],
... ...