Commit cec1724d authored by gaodapeng's avatar gaodapeng

增加动画,去除弹窗中的close

parent 0e3880a1
...@@ -48,6 +48,47 @@ popUpScanBg{ ...@@ -48,6 +48,47 @@ popUpScanBg{
margin-left: 34rpx; margin-left: 34rpx;
} }
.loading{
position:relative;
top:307rpx;
width:239rpx;
height:239rpx;
margin:0 auto;
-webkit-animation:loadingAnim .8s linear infinite;
}
@-webkit-keyframes loadingAnim{
0%{
-webkit-transform:rotate(0deg);
}
25%{
-webkit-transform:rotate(90deg);
}
50%{
-webkit-transform:rotate(180deg);
}
75%{
-webkit-transform:rotate(270deg);
}
100%{
-webkit-transform:rotate(360deg);
}
}
.loadingText{
position:absolute;
font-size:38rpx;
font-family:PingFangSC-Medium,PingFang SC;
font-weight:500;
color:rgba(0,0,0,0.85);
line-height:45rpx;
margin-top:404rpx;
align-text:center;
}
.resultContainer{ .resultContainer{
display: flex; display: flex;
flex-direction: column; flex-direction: column;
......
...@@ -3,7 +3,9 @@ ...@@ -3,7 +3,9 @@
<view style="position:absolute;width:100%;height:100%;left:0rpx;top:0rpx;background-color: rgba(0, 0, 0, 0.65);background-size:100% 100%;"/> <view style="position:absolute;width:100%;height:100%;left:0rpx;top:0rpx;background-color: rgba(0, 0, 0, 0.65);background-size:100% 100%;"/>
<view class="popUpScan"> <view class="popUpScan">
<image class="close" mode="aspectFit" src="/images/icon_dialog_cancel.png" onTap="dialogClose"/> <!-- <view class="close" onTap="dialogClose">
<image style="width:28rpx;height:28rpx;left:0rpx;top:0rpx;" mode="aspectFit" src="/images/icon_dialog_cancel.png" />
</view> -->
<!-- 初始状态 --> <!-- 初始状态 -->
<view style="display:flex;flex-direction:column;" a:if="{{dialogDisplay == show}}"> <view style="display:flex;flex-direction:column;" a:if="{{dialogDisplay == show}}">
...@@ -14,8 +16,8 @@ ...@@ -14,8 +16,8 @@
</view> </view>
<!-- loading --> <!-- loading -->
<view style="position:absolute;width:100%;height:100%;display:flex;flex-direction:column;align-items:center;" a:if="{{dialogDisplay == loading}}" > <view style="position:absolute;width:100%;height:100%;display:flex;flex-direction:column;align-items:center;" a:if="{{dialogDisplay == loading}}" >
<image mode="aspectFit" src="/images/icon_dialog_loading.png" style="position:relative;top:307rpx;width:239rpx;height:239rpx;margin:0 auto;"/> <image mode="aspectFit" src="/images/icon_dialog_loading.png" class="loading"/>
<view style="position:absolute;font-size:38rpx;font-family:PingFangSC-Medium,PingFang SC;font-weight:500;color:rgba(0,0,0,0.85);line-height:45rpx;margin-top:404rpx;align-text:center;">{{loadingText}}</view> <view class="loadingText">{{loadingText}}</view>
</view> </view>
<!-- 结果页面-成功 --> <!-- 结果页面-成功 -->
<view class="resultContainer" a:if="{{dialogDisplay == resultSuccess}}"> <view class="resultContainer" a:if="{{dialogDisplay == resultSuccess}}">
......
...@@ -6,7 +6,7 @@ Component({ ...@@ -6,7 +6,7 @@ Component({
resultSuccess: 3, resultSuccess: 3,
resultFailed: 4, resultFailed: 4,
dialogDisplay:0, dialogDisplay:0,//本地存储更新
},// 组件内部数据 },// 组件内部数据
props: { props: {
...@@ -18,25 +18,22 @@ Component({ ...@@ -18,25 +18,22 @@ Component({
resultFailureRemind:"", resultFailureRemind:"",
resultFailureText:"", resultFailureText:"",
displayDialog: 0, displayDialog: 0,
},// 可给外部传入的属性添加默认值 },// 可给外部传入的属性添加默认值
didMount() { didMount() {
},// 生命周期函数,加载成功 },// 生命周期函数,加载成功
didUpdate() {},//刷新 didUpdate() {
didUnmount() {},//生命周期 },//刷新
didUnmount() {//生命周期
},
deriveDataFromProps(nextProps) { // 组件创建时触发或更新时触发 deriveDataFromProps(nextProps) { // 组件创建时触发或更新时触发
this.setData({ this.setData({
dialogDisplay:nextProps.displayDialog dialogDisplay:nextProps.displayDialog
} }
) )
console.log(" deriveDataFromProps", nextProps, this.props, this.data); console.log("deriveDataFromProps", nextProps, this.props, this.data);
}, },
methods: {// 自定义方法 methods: {// 自定义方法
dialogClose(){
//隐藏
this.props.dialogDisplay = 0;
},
}, },
}); });
\ No newline at end of file
...@@ -6,6 +6,16 @@ page{ ...@@ -6,6 +6,16 @@ page{
align-items: center; align-items: center;
} }
.bg{
position:absolute;
width:100%;
height:100%;
left:0rpx;
top:0rpx;
background:url(/images/bg_home.png) no-repeat fixed top;
background-size:100% 100%;
}
.container{ .container{
position: relative; position: relative;
width: 750rpx; width: 750rpx;
......
<view class="page" > <view class="page" >
<view style="position:absolute;width:100%;height:100%;left:0rpx;top:0rpx;background:url(/images/bg_home.png) no-repeat fixed top;background-size:100% 100%;" onTap="homeTap"/> <view class="bg" onTap="homeTap"/>
<scandialog displayDialog="{{scanDialogDisplay}}" <scandialog displayDialog="{{scanDialogDisplay}}"
remindText="请扫描兑换码" remindText="请扫描兑换码"
...@@ -8,6 +8,7 @@ ...@@ -8,6 +8,7 @@
resultSuccessText="恭喜您!兑换成功 " resultSuccessText="恭喜您!兑换成功 "
resultFailureRemind="兑换码未识别" resultFailureRemind="兑换码未识别"
resultFailureText="兑换失败,请稍后重试!" resultFailureText="兑换失败,请稍后重试!"
/> />
</view> </view>
\ No newline at end of file
...@@ -17,22 +17,24 @@ Page({ ...@@ -17,22 +17,24 @@ Page({
} }
}, },
scanDialog(ref) {
// if(ref.getAttribute("id") == "drawbackDialog"){
// }else if(ref.getAttribute("id") == ""){
// }
},
homeTap() { homeTap() {
// this.showDialog();
//FIXME 这里是跳转到新的界面 //FIXME 这里是跳转到新的界面
my.navigateTo({ my.navigateTo({
url: "/pages/balance/balance" url: "/pages/scan/scan"
}); });
}, },
//显示弹窗,>1为显示,2loading 3 result success 4 result failed
showDialog() {
this.setData({
scanDialogDisplay: 1
}
)
console.log(this.data.scanDialogDisplay);
},
//外接扫码枪事件 //外接扫码枪事件
onKeyPress(r) { onKeyPress(r) {
...@@ -47,18 +49,6 @@ Page({ ...@@ -47,18 +49,6 @@ Page({
}); });
}, },
//显示弹窗,>1为显示,2loading 3 result success 4 result failed
showDialog() {
this.setData({
scanDialogDisplay: 1
}
)
console.log(this.data.scanDialogDisplay);
},
//核销券 //核销券
verifyCoupon(code) { verifyCoupon(code) {
this.setData({scanDialogDisplay:2}) this.setData({scanDialogDisplay:2})
......
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