Skip to content

U
uni-pdtravel
Commit 1bcd755c authored by 潘永坪's avatar 潘永坪
Browse files
Options

扫码支付页面效果开发

parent edbb5451
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 825 additions and 438 deletions
App.vue
View file @ 1bcd755c
...@@ -25,7 +25,6 @@ ...@@ -25,7 +25,6 @@
4.灰色字体颜色#666666或者#999999 4.灰色字体颜色#666666或者#999999
5.主色调#3688FF 5.主色调#3688FF
6.正常字体大小28rpx,偏小一点的24rpx 6.正常字体大小28rpx,偏小一点的24rpx
7.命名规范为'-'，例如top-img
8.页面最外层与里面的第一层为padding:0 12px; 8.页面最外层与里面的第一层为padding:0 12px;
9.css单位为rpx 9.css单位为rpx
*/ */
......
common/icon/iconfont.css
View file @ 1bcd755c
@font-face { @font-face {
font-family: "iconfont"; /* Project id 2600842 */ font-family: "iconfont"; /* Project id 2626666 */
src: url('iconfont.woff2?t=1624262426389') format('woff2'), src: url('iconfont.woff2?t=1624355367544') format('woff2'),
url('iconfont.woff?t=1624262426389') format('woff'), url('iconfont.woff?t=1624355367544') format('woff'),
url('iconfont.ttf?t=1624262426389') format('truetype'); url('iconfont.ttf?t=1624355367544') format('truetype');
} }
.iconfont { .iconfont {
...@@ -13,14 +13,6 @@ ...@@ -13,14 +13,6 @@
-moz-osx-font-smoothing: grayscale; -moz-osx-font-smoothing: grayscale;
} }
.icon-tubiaolunkuo-:before {
content: "\e602";
}
.icon-icon-test:before {
content: "\e601";
}
.icon-fl-renminbi:before { .icon-fl-renminbi:before {
content: "\e634"; content: "\e634";
} }
...@@ -33,3 +25,7 @@ ...@@ -33,3 +25,7 @@
content: "\e74e"; content: "\e74e";
} }
.icon-tubiaolunkuo-:before {
content: "\e602";
}
common/icon/iconfont.ttf
View file @ 1bcd755c
No preview for this file type
pages/login/login.vue
View file @ 1bcd755c
...@@ -31,6 +31,7 @@ ...@@ -31,6 +31,7 @@
source:3 source:3
} }
_this.$request('wechat/wx/getUserInfoByCode',data).then(res => { _this.$request('wechat/wx/getUserInfoByCode',data).then(res => {
uni.hideLoading()
if(res.code=='00'){ if(res.code=='00'){
let openid=res.data.openid let openid=res.data.openid
uni.setStorageSync('openid',openid) uni.setStorageSync('openid',openid)
...@@ -43,11 +44,9 @@ ...@@ -43,11 +44,9 @@
title:res.message, title:res.message,
icon:"none" icon:"none"
}) })
uni.hideLoading()
} }
}).catch((err)=>{ }).catch((err)=>{
uni.removeStorageSync('openid') uni.removeStorageSync('openid')
uni.hideLoading()
}) })
} }
} }
......
pages/ourPayment/ourPayment.vue
View file @ 1bcd755c
...@@ -5,7 +5,7 @@ ...@@ -5,7 +5,7 @@
<text class="topIcon"> <text class="topIcon">
<text class="iconfont icon-tubiaolunkuo-"></text> <text class="iconfont icon-tubiaolunkuo-"></text>
</text> </text>
<text>重庆胖丁信息技术有限公司</text> <text>{{name}}</text>
</view> </view>
<view class="topMoney"> <view class="topMoney">
<text class="moneyText">支付金额</text> <text class="moneyText">支付金额</text>
...@@ -15,8 +15,17 @@ ...@@ -15,8 +15,17 @@
<text></text> <text></text>
</view> </view>
</view> </view>
<view class="topConpon"> <view class="topCoupon">
<view class="couponLeft">
<text>券</text>
<text>胖丁9折券</text>
</view>
<view class="couponRight">
<text>-</text>
<text>5.68</text>
<text class="iconfont icon-you" style="font-size:32rpx;"></text>
</view>
</view> </view>
</view> </view>
...@@ -27,31 +36,31 @@ ...@@ -27,31 +36,31 @@
<view class="bottom"> <view class="bottom">
<view class="botLeft"> <view class="botLeft">
<view> <view>
<text @click="clickNum(1)">1</text> <text @click="clickNum(1)" ref="1">1</text>
<text @click="clickNum(2)">2</text> <text @click="clickNum(2)" ref="2">2</text>
<text @click="clickNum(3)">3</text> <text @click="clickNum(3)" ref="3">3</text>
</view> </view>
<view> <view>
<text @click="clickNum(4)">4</text> <text @click="clickNum(4)" ref="4">4</text>
<text @click="clickNum(5)">5</text> <text @click="clickNum(5)" ref="5">5</text>
<text @click="clickNum(6)">6</text> <text @click="clickNum(6)" ref="6">6</text>
</view> </view>
<view> <view>
<text @click="clickNum(7)">7</text> <text @click="clickNum(7)" ref="7">7</text>
<text @click="clickNum(8)">8</text> <text @click="clickNum(8)" ref="8">8</text>
<text @click="clickNum(9)">9</text> <text @click="clickNum(9)" ref="9">9</text>
</view> </view>
<view> <view>
<text @click="clickNum(0)" style="width: 66.7%;">0</text> <text @click="clickNum(0)" ref="0" style="width: 66.7%;">0</text>
<text @click="clickNum('.')" style="width: 33.3%;">.</text> <text @click="clickNum('.')" ref="." style="width: 33.3%;">.</text>
</view> </view>
</view> </view>
<view class="botRight"> <view class="botRight">
<view class="rightOne" @click="clickEnter()"> <view class="rightOne" @click="clickEnter()" ref="enter">
<text class="iconfont icon-im_huige" style="font-size:70rpx;"></text> <text class="iconfont icon-im_huige" style="font-size:70rpx;"></text>
</view> </view>
<view class="rightTwo"> <view class="rightTwo" ref="pay">
<view>立即</view> <view>立即</view>
<view>支付</view> <view>支付</view>
</view> </view>
...@@ -65,16 +74,113 @@ ...@@ -65,16 +74,113 @@
data() { data() {
return { return {
buyMoney:"", //输入金额 buyMoney:"", //输入金额
companyId: "", //公司Id
merchantId: "", //商户Id
name: "", //商家名称
paySign: "", //签名
signType: "", //签名方式
timeStamp: "", //时间戳
nonceStr: "", //随机字符串
package: "", //订单详情扩展字符串
}
},
onLoad(option) {
this.companyId=option.companyId
this.merchantId=option.merchantId
if (this.merchantId) { //大商家的有merchantId
this.init()
} else { //小商家没有merchantId
this.initTwo()
} }
}, },
methods: { methods: {
clickNum(i) {//--------------------------------------------------------输入数字 clickNum(i) {//--------------------------------------------------------输入数字
this.buyMoney += i this.buyMoney += i
this.$refs[i].$el.style.background="#dddddd"
setTimeout(()=>{
this.$refs[i].$el.style.background=""
},200)
}, },
clickEnter(){//--------------------------------------------------------退格 clickEnter(){//--------------------------------------------------------退格
this.buyMoney = this.buyMoney.substr(0, this.buyMoney.length - 1) this.buyMoney = this.buyMoney.substr(0, this.buyMoney.length - 1)
} this.$refs.enter.$el.style.background="#dddddd"
setTimeout(()=>{
this.$refs.enter.$el.style.background=""
},200)
},
init() { //---------------------------------------------------------------------------初始化获取商家名称，大商家
let data = {
"merchantId": this.merchantId,
"companyId": this.companyId,
}
uni.showLoading({title: '加载中',mask:true})
this.$request("scenic/order/findCodePayInfo",data).then((res) => {
uni.hideLoading()
if (res.code =="00") {
this.name = res.data.name
} else {
uni.showToast({
title:res.message,
icon:"none"
})
}
})
},
initTwo() { //-------------------------------------------------------------------------初始化获取商家名称,没有merchantId的小商家
let data = {
"id": this.companyId,
}
uni.showLoading({title: '加载中',mask:true})
this.$request("user/company/detail", data).then((res) => {
uni.hideLoading()
if (res.code=="00"){
this.name = res.data.companyVo.companyName
} else {
uni.showToast({
title:res.message,
icon:"none"
})
}
})
},
initCoupon() { //----------------------------------------------------------------------加载优惠券
let savedMoneyList = []
this.chooseCouponObj = ""
this.ableConpon = ""
let data = {
userId:this.userId, //userId
money:parseFloat(this.buyMoney)||0, //订单总价，不算券，和现金红包
merchantId:this.merchantId, //商户Id
companyId:this.companyId,//公司Id
orderSource:this.orderSource,//订单来源 8扫码支付
openid:this.openId,
}
axios.post(this.httpUrl + "wechatUser/myPage/usableCouponList?token="+this.token,data).then((res) => {
if (res.data.code == "00") {
this.couponList = res.data.data
if (res.data.data.usableCouponList.length > 0) {
res.data.data.usableCouponList.forEach((item) => { //获取最优券
savedMoneyList.push(item.savedMoney)
})
let maxMoney = Math.max.apply(null, savedMoneyList)
let index = res.data.data.usableCouponList.findIndex((item) => {
return maxMoney == item.savedMoney
})
if(index>-1){
this.chooseCouponObj = res.data.data.usableCouponList[index]
}
} else {
if (res.data.data.unusableCouponList.length > 0) {
res.data.data.unusableCouponList.forEach((item, i) => { //没有可用优惠券，有达到条件可以用的优惠券，先显示条件，达到条件时显示可用优惠券
if (item.isProduct == 1) {
this.ableConpon = item
}
})
}
}
}
})
},
}, },
watch: { watch: {
buyMoney(val, oldVal) { buyMoney(val, oldVal) {
...@@ -97,13 +203,20 @@ ...@@ -97,13 +203,20 @@
if (y > 2 && x > 0) { if (y > 2 && x > 0) {
this.buyMoney = oldVal this.buyMoney = oldVal
} }
if (parseFloat(this.buyMoney)) {
this.$refs.pay.$el.style.cssText="background:#1dce2e;"
} else {
this.$refs.pay.$el.style.cssText="background:#cccccc;"
}
} }
} }
} }
</script> </script>
<style> <style lang="scss">
.bigBox{background:#f5f5f5;height: 100%;} .bigBox{background:#f5f5f5;height: 100%;}
/*上部分*/
.top{background: #FFFFFF;} .top{background: #FFFFFF;}
.topName{font-size:28rpx;font-weight: bold;padding-top: 50rpx;display: flex;align-items: center;justify-content: center;} .topName{font-size:28rpx;font-weight: bold;padding-top: 50rpx;display: flex;align-items: center;justify-content: center;}
.topIcon{display:inline-flex;margin-right:10rpx;width:50rpx;height:50rpx;border-radius:50%;background:#FF8B57;align-items:center;justify-content:center;} .topIcon{display:inline-flex;margin-right:10rpx;width:50rpx;height:50rpx;border-radius:50%;background:#FF8B57;align-items:center;justify-content:center;}
...@@ -112,8 +225,15 @@ ...@@ -112,8 +225,15 @@
.moneyText{color: #FF3C00;font-size:28rpx;font-weight: bold;} .moneyText{color: #FF3C00;font-size:28rpx;font-weight: bold;}
.moneyNumber text:nth-child(2){font-size: 58rpx;font-weight: bold;position: relative;left: -6rpx;} .moneyNumber text:nth-child(2){font-size: 58rpx;font-weight: bold;position: relative;left: -6rpx;}
.moneyNumber text:last-child{animation: dis 1.5s infinite;transition: 1s;width: 1px;height:56rpx;display: inline-block;background: #333333;position: relative;top:8rpx;} .moneyNumber text:last-child{animation: dis 1.5s infinite;transition: 1s;width: 1px;height:56rpx;display: inline-block;background: #333333;position: relative;top:8rpx;}
.middle{padding:60rpx 24rpx 0 24rpx;font-size: 22rpx;color: #999999;line-height: 40rpx;} .topCoupon{display: flex;height: 90rpx;border-top:1px solid $dividing-ine;align-items:center;padding:0 24rpx;justify-content: space-between;}
.couponLeft{font-size:24rpx;}
.couponLeft text:first-child{margin-right:10rpx;display: inline-block;width:30rpx;height:30rpx;background: #f9690e;color: #FFFFFF;text-align: center;line-height:28rpx;border-radius:4rpx;}
.couponRight{position:relative;left:8rpx;}
.couponRight text:first-child{font-size:32rpx;color:#f9690e;}
.couponRight text:nth-child(2){font-size: 32rpx;color: #F9690E;font-weight:bold;}
/*中间部分*/
.middle{padding:60rpx 24rpx 0 24rpx;font-size: 22rpx;color: #999999;line-height: 40rpx;}
/*下部分*/
.bottom{position:absolute;bottom:0;height:40%;background: #FFFFFF;width:100%;display: flex;border-top:1px solid #dddddd;font-size:50rpx;} .bottom{position:absolute;bottom:0;height:40%;background: #FFFFFF;width:100%;display: flex;border-top:1px solid #dddddd;font-size:50rpx;}
.botLeft{width:75%;} .botLeft{width:75%;}
.botLeft view{height:25%;display: flex;border-bottom:1px solid #dddddd;} .botLeft view{height:25%;display: flex;border-bottom:1px solid #dddddd;}
...@@ -122,9 +242,7 @@ ...@@ -122,9 +242,7 @@
.botLeft view:last-child text{flex:initial;} .botLeft view:last-child text{flex:initial;}
.botRight{width:25%;} .botRight{width:25%;}
.rightOne{height: 25%;display: flex;align-items:center;justify-content: center;border-bottom:1px solid #dddddd;} .rightOne{height: 25%;display: flex;align-items:center;justify-content: center;border-bottom:1px solid #dddddd;}
.rightTwo{height: 75%;border:none;color: #FFFFFF;background: #CCCCCC;display: flex;flex-direction:column;align-items:center;justify-content: center;} .rightTwo{height: 75%;border:none;color: #FFFFFF;background: #CCCCCC;display: flex;flex-direction:column;align-items:center;justify-content: center;}
@keyframes dis{ @keyframes dis{
from{ from{
opacity: 0; opacity: 0;
......
uni_modules/uni-icons/changelog.md deleted 100644 → 0
View file @ edbb5451
## 1.1.4（2021-02-05）
- 调整为uni_modules目录规范
uni_modules/uni-icons/components/uni-icons/icons.js deleted 100644 → 0
View file @ edbb5451
export default {
"pulldown": "\ue588",
"refreshempty": "\ue461",
"back": "\ue471",
"forward": "\ue470",
"more": "\ue507",
"more-filled": "\ue537",
"scan": "\ue612",
"qq": "\ue264",
"weibo": "\ue260",
"weixin": "\ue261",
"pengyouquan": "\ue262",
"loop": "\ue565",
"refresh": "\ue407",
"refresh-filled": "\ue437",
"arrowthindown": "\ue585",
"arrowthinleft": "\ue586",
"arrowthinright": "\ue587",
"arrowthinup": "\ue584",
"undo-filled": "\ue7d6",
"undo": "\ue406",
"redo": "\ue405",
"redo-filled": "\ue7d9",
"bars": "\ue563",
"chatboxes": "\ue203",
"camera": "\ue301",
"chatboxes-filled": "\ue233",
"camera-filled": "\ue7ef",
"cart-filled": "\ue7f4",
"cart": "\ue7f5",
"checkbox-filled": "\ue442",
"checkbox": "\ue7fa",
"arrowleft": "\ue582",
"arrowdown": "\ue581",
"arrowright": "\ue583",
"smallcircle-filled": "\ue801",
"arrowup": "\ue580",
"circle": "\ue411",
"eye-filled": "\ue568",
"eye-slash-filled": "\ue822",
"eye-slash": "\ue823",
"eye": "\ue824",
"flag-filled": "\ue825",
"flag": "\ue508",
"gear-filled": "\ue532",
"reload": "\ue462",
"gear": "\ue502",
"hand-thumbsdown-filled": "\ue83b",
"hand-thumbsdown": "\ue83c",
"hand-thumbsup-filled": "\ue83d",
"heart-filled": "\ue83e",
"hand-thumbsup": "\ue83f",
"heart": "\ue840",
"home": "\ue500",
"info": "\ue504",
"home-filled": "\ue530",
"info-filled": "\ue534",
"circle-filled": "\ue441",
"chat-filled": "\ue847",
"chat": "\ue263",
"mail-open-filled": "\ue84d",
"email-filled": "\ue231",
"mail-open": "\ue84e",
"email": "\ue201",
"checkmarkempty": "\ue472",
"list": "\ue562",
"locked-filled": "\ue856",
"locked": "\ue506",
"map-filled": "\ue85c",
"map-pin": "\ue85e",
"map-pin-ellipse": "\ue864",
"map": "\ue364",
"minus-filled": "\ue440",
"mic-filled": "\ue332",
"minus": "\ue410",
"micoff": "\ue360",
"mic": "\ue302",
"clear": "\ue434",
"smallcircle": "\ue868",
"close": "\ue404",
"closeempty": "\ue460",
"paperclip": "\ue567",
"paperplane": "\ue503",
"paperplane-filled": "\ue86e",
"person-filled": "\ue131",
"contact-filled": "\ue130",
"person": "\ue101",
"contact": "\ue100",
"images-filled": "\ue87a",
"phone": "\ue200",
"images": "\ue87b",
"image": "\ue363",
"image-filled": "\ue877",
"location-filled": "\ue333",
"location": "\ue303",
"plus-filled": "\ue439",
"plus": "\ue409",
"plusempty": "\ue468",
"help-filled": "\ue535",
"help": "\ue505",
"navigate-filled": "\ue884",
"navigate": "\ue501",
"mic-slash-filled": "\ue892",
"search": "\ue466",
"settings": "\ue560",
"sound": "\ue590",
"sound-filled": "\ue8a1",
"spinner-cycle": "\ue465",
"download-filled": "\ue8a4",
"personadd-filled": "\ue132",
"videocam-filled": "\ue8af",
"personadd": "\ue102",
"upload": "\ue402",
"upload-filled": "\ue8b1",
"starhalf": "\ue463",
"star-filled": "\ue438",
"star": "\ue408",
"trash": "\ue401",
"phone-filled": "\ue230",
"compose": "\ue400",
"videocam": "\ue300",
"trash-filled": "\ue8dc",
"download": "\ue403",
"chatbubble-filled": "\ue232",
"chatbubble": "\ue202",
"cloud-download": "\ue8e4",
"cloud-upload-filled": "\ue8e5",
"cloud-upload": "\ue8e6",
"cloud-download-filled": "\ue8e9",
"headphones":"\ue8bf",
"shop":"\ue609"
}
uni_modules/uni-icons/package.json deleted 100644 → 0
View file @ edbb5451
{
"id": "uni-icons",
"displayName": "Icons 图标",
"version": "1.1.4",
"description": "图标组件，用于展示移动端常见的图标，可自定义颜色、大小。",
"keywords": [
"icon",
"图标",
"uni-icons"
],
"repository": "https://github.com/dcloudio/uni-ui",
"engines": {
"HBuilderX": ""
},
"directories": {
"example": "../../temps/example_temps"
},
"dcloudext": {
"category": [
"前端组件",
"通用组件"
],
"sale": {
"regular": {
"price": "0.00"
},
"sourcecode": {
"price": "0.00"
}
},
"contact": {
"qq": ""
},
"declaration": {
"ads": "无",
"data": "无",
"permissions": "无"
},
"npmurl": "https://www.npmjs.com/package/@dcloudio/uni-ui"
},
"uni_modules": {
"dependencies": [],
"encrypt": [],
"platforms": {
"cloud": {
"tcb": "y",
"aliyun": "y"
},
"client": {
"App": {
"app-vue": "y",
"app-nvue": "y"
},
"H5-mobile": {
"Safari": "y",
"Android Browser": "y",
"微信浏览器(Android)": "y",
"QQ浏览器(Android)": "y"
},
"H5-pc": {
"Chrome": "y",
"IE": "y",
"Edge": "y",
"Firefox": "y",
"Safari": "y"
},
"小程序": {
"微信": "y",
"阿里": "y",
"百度": "y",
"字节跳动": "y",
"QQ": "y"
},
"快应用": {
"华为": "u",
"联盟": "u"
}
}
}
}
}
\ No newline at end of file
uni_modules/uni-icons/readme.md deleted 100644 → 0
View file @ edbb5451
## Icons 图标
> 代码块： `uIcons`
用于展示 icons 图标 。
### 安装方式
本组件符合[easycom](https://uniapp.dcloud.io/collocation/pages?id=easycom)规范，`HBuilderX 2.5.5`起，只需将本组件导入项目，在页面`template`中即可直接使用，无需在页面中`import`和注册`components`。
如需通过`npm`方式使用`uni-ui`组件，另见文档：[https://ext.dcloud.net.cn/plugin?id=55](https://ext.dcloud.net.cn/plugin?id=55)
### 基本用法
在 ``template`` 中使用组件
```html
<uni-icons type="contact" size="30"></uni-icons>
```
## 图标示例
点击复制图标类型
<icons-layouts></icons-layouts>
## API
### Icons Props
|属性名 |类型 |默认值 |说明 |
|:-: |:-: |:-: |:-: |
|size |Number |24 |图标大小 |
|type |String |- |图标图案，参考示例 |
|color |String |- |图标颜色 |
### Icons Events
|事件名 |说明 |返回值|
|:-: |:-: |:-: |
|@click|点击 Icon 触发事件|- |
unpackage/dist/dev/mp-weixin/app.json
View file @ 1bcd755c
...@@ -18,5 +18,6 @@ ...@@ -18,5 +18,6 @@
"desc": "请点击确定" "desc": "请点击确定"
} }
}, },
"usingComponents": {} "usingComponents": {},
"sitemapLocation": "sitemap.json"
} }
\ No newline at end of file
unpackage/dist/dev/mp-weixin/pages/login/login.js
View file @ 1bcd755c
...@@ -161,6 +161,7 @@ var _default = ...@@ -161,6 +161,7 @@ var _default =
source: 3 }; source: 3 };
_this.$request('wechat/wx/getUserInfoByCode', data).then(function (res) { _this.$request('wechat/wx/getUserInfoByCode', data).then(function (res) {
uni.hideLoading();
if (res.code == '00') { if (res.code == '00') {
var openid = res.data.openid; var openid = res.data.openid;
uni.setStorageSync('openid', openid); uni.setStorageSync('openid', openid);
...@@ -173,11 +174,9 @@ var _default = ...@@ -173,11 +174,9 @@ var _default =
title: res.message, title: res.message,
icon: "none" }); icon: "none" });
uni.hideLoading();
} }
}).catch(function (err) { }).catch(function (err) {
uni.removeStorageSync('openid'); uni.removeStorageSync('openid');
uni.hideLoading();
}); });
} }
} }); } });
......
unpackage/dist/dev/mp-weixin/pages/ourPayment/ourPayment.wxml
View file @ 1bcd755c
<view class="bigBox"><view class="top"><view class="topName"><text class="topIcon"><text class="iconfont icon-tubiaolunkuo-"></text></text><text>重庆胖丁信息技术有限公司</text></view><view class="topMoney"><text class="moneyText">支付金额</text><view class="moneyNumber"><text class="iconfont icon-fl-renminbi" style="font-size:56rpx;"></text><text>{{buyMoney}}</text><text></text></view></view><view class="topConpon"></view></view><view class="middle">友情提示：请核对以上付款金额、付款商户等信息与交易一致。经您确认支付的金额，商家不会退回亦无赔偿义务。</view><view class="bottom"><view class="botLeft"><view><text data-event-opts="{{[['tap',[['clickNum',[1]]]]]}}" bindtap="__e">1</text><text data-event-opts="{{[['tap',[['clickNum',[2]]]]]}}" bindtap="__e">2</text><text data-event-opts="{{[['tap',[['clickNum',[3]]]]]}}" bindtap="__e">3</text></view><view><text data-event-opts="{{[['tap',[['clickNum',[4]]]]]}}" bindtap="__e">4</text><text data-event-opts="{{[['tap',[['clickNum',[5]]]]]}}" bindtap="__e">5</text><text data-event-opts="{{[['tap',[['clickNum',[6]]]]]}}" bindtap="__e">6</text></view><view><text data-event-opts="{{[['tap',[['clickNum',[7]]]]]}}" bindtap="__e">7</text><text data-event-opts="{{[['tap',[['clickNum',[8]]]]]}}" bindtap="__e">8</text><text data-event-opts="{{[['tap',[['clickNum',[9]]]]]}}" bindtap="__e">9</text></view><view><text data-event-opts="{{[['tap',[['clickNum',[0]]]]]}}" style="width:66.7%;" bindtap="__e">0</text><text data-event-opts="{{[['tap',[['clickNum',['.']]]]]}}" style="width:33.3%;" bindtap="__e">.</text></view></view><view class="botRight"><view data-event-opts="{{[['tap',[['clickEnter']]]]}}" class="rightOne" bindtap="__e"><text class="iconfont icon-im_huige" style="font-size:70rpx;"></text></view><view class="rightTwo"><view>立即</view><view>支付</view></view></view></view></view> <view class="bigBox"><view class="top"><view class="topName"><text class="topIcon"><text class="iconfont icon-tubiaolunkuo-"></text></text><text>{{name}}</text></view><view class="topMoney"><text class="moneyText">支付金额</text><view class="moneyNumber"><text class="iconfont icon-fl-renminbi" style="font-size:56rpx;"></text><text>{{buyMoney}}</text><text></text></view></view><view class="topCoupon"><view class="couponLeft"><text>券</text><text>胖丁9折券</text></view><view class="couponRight"><text>-</text><text>5.68</text><text class="iconfont icon-you" style="font-size:32rpx;"></text></view></view></view><view class="middle">友情提示：请核对以上付款金额、付款商户等信息与交易一致。经您确认支付的金额，商家不会退回亦无赔偿义务。</view><view class="bottom"><view class="botLeft"><view><text data-ref="1" data-event-opts="{{[['tap',[['clickNum',[1]]]]]}}" class="vue-ref" bindtap="__e">1</text><text data-ref="2" data-event-opts="{{[['tap',[['clickNum',[2]]]]]}}" class="vue-ref" bindtap="__e">2</text><text data-ref="3" data-event-opts="{{[['tap',[['clickNum',[3]]]]]}}" class="vue-ref" bindtap="__e">3</text></view><view><text data-ref="4" data-event-opts="{{[['tap',[['clickNum',[4]]]]]}}" class="vue-ref" bindtap="__e">4</text><text data-ref="5" data-event-opts="{{[['tap',[['clickNum',[5]]]]]}}" class="vue-ref" bindtap="__e">5</text><text data-ref="6" data-event-opts="{{[['tap',[['clickNum',[6]]]]]}}" class="vue-ref" bindtap="__e">6</text></view><view><text data-ref="7" data-event-opts="{{[['tap',[['clickNum',[7]]]]]}}" class="vue-ref" bindtap="__e">7</text><text data-ref="8" data-event-opts="{{[['tap',[['clickNum',[8]]]]]}}" class="vue-ref" bindtap="__e">8</text><text data-ref="9" data-event-opts="{{[['tap',[['clickNum',[9]]]]]}}" class="vue-ref" bindtap="__e">9</text></view><view><text data-ref="0" data-event-opts="{{[['tap',[['clickNum',[0]]]]]}}" class="vue-ref" style="width:66.7%;" bindtap="__e">0</text><text data-ref="." data-event-opts="{{[['tap',[['clickNum',['.']]]]]}}" class="vue-ref" style="width:33.3%;" bindtap="__e">.</text></view></view><view class="botRight"><view data-ref="enter" data-event-opts="{{[['tap',[['clickEnter']]]]}}" class="rightOne vue-ref" bindtap="__e"><text class="iconfont icon-im_huige" style="font-size:70rpx;"></text></view><view data-ref="pay" class="rightTwo vue-ref"><view>立即</view><view>支付</view></view></view></view></view>
\ No newline at end of file \ No newline at end of file
unpackage/dist/dev/mp-weixin/pages/ourPayment/ourPayment.wxss
View file @ 1bcd755c
@charset "UTF-8";
.bigBox{background:#f5f5f5;height: 100%;} /**
.top{background: #FFFFFF;} * 这里是uni-app内置的常用样式变量
.topName{font-size:28rpx;font-weight: bold;padding-top: 50rpx;display: -webkit-box;display: -webkit-flex;display: flex;-webkit-box-align: center;-webkit-align-items: center;align-items: center;-webkit-box-pack: center;-webkit-justify-content: center;justify-content: center;} *
.topIcon{display:-webkit-inline-box;display:-webkit-inline-flex;display:inline-flex;margin-right:10rpx;width:50rpx;height:50rpx;border-radius:50%;background:#FF8B57;-webkit-box-align:center;-webkit-align-items:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;justify-content:center;} * uni-app 官方扩展插件及插件市场（https://ext.dcloud.net.cn）上很多三方插件均使用了这些样式变量
.icon-tubiaolunkuo-{font-size:36rpx;color: #FFFFFF;font-weight: 400;} * 如果你是插件开发者，建议你使用scss预处理，并在插件代码中直接使用这些变量（无需 import 这个文件），方便用户通过搭积木的方式开发整体风格一致的App
.topMoney{padding:80rpx 24rpx 35rpx 24rpx;display: -webkit-box;display: -webkit-flex;display: flex;-webkit-box-pack:justify;-webkit-justify-content:space-between;justify-content:space-between;-webkit-box-align: center;-webkit-align-items: center;align-items: center;} *
.moneyText{color: #FF3C00;font-size:28rpx;font-weight: bold;} */
.moneyNumber text:nth-child(2){font-size: 58rpx;font-weight: bold;position: relative;left: -6rpx;} /**
.moneyNumber text:last-child{-webkit-animation: dis 1.5s infinite;animation: dis 1.5s infinite;-webkit-transition: 1s;transition: 1s;width: 1px;height:56rpx;display: inline-block;background: #333333;position: relative;top:8rpx;} * 如果你是App开发者（插件使用者），你可以通过修改这些变量来定制自己的插件主题，实现自定义主题功能
.middle{padding:60rpx 24rpx 0 24rpx;font-size: 22rpx;color: #999999;line-height: 40rpx;} *
.bottom{position:absolute;bottom:0;height:40%;background: #FFFFFF;width:100%;display: -webkit-box;display: -webkit-flex;display: flex;border-top:1px solid #dddddd;font-size:50rpx;} * 如果你的项目同样使用了scss预处理，你也可以直接在你的 scss 代码中使用如下变量，同时无需 import 这个文件
.botLeft{width:75%;} */
.botLeft view{height:25%;display: -webkit-box;display: -webkit-flex;display: flex;border-bottom:1px solid #dddddd;} /*分割线颜色*/
.botLeft view:last-child{border:none;} /*主题颜色*/
.botLeft view text{-webkit-box-flex:1;-webkit-flex:1;flex:1;height:100%;display:-webkit-inline-box;display:-webkit-inline-flex;display:inline-flex;-webkit-box-align: center;-webkit-align-items: center;align-items: center;-webkit-box-pack: center;-webkit-justify-content: center;justify-content: center;border-right:1px solid #dddddd;} /* 颜色变量 */
.botLeft view:last-child text{-webkit-box-flex:initial;-webkit-flex:initial;flex:initial;} /* 行为相关颜色 */
.botRight{width:25%;} /* 文字基本颜色 */
.rightOne{height: 25%;display: -webkit-box;display: -webkit-flex;display: flex;-webkit-box-align:center;-webkit-align-items:center;align-items:center;-webkit-box-pack: center;-webkit-justify-content: center;justify-content: center;border-bottom:1px solid #dddddd;} /* 背景颜色 */
.rightTwo{height: 75%;border:none;color: #FFFFFF;background: #CCCCCC;display: -webkit-box;display: -webkit-flex;display: flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-flex-direction:column;flex-direction:column;-webkit-box-align:center;-webkit-align-items:center;align-items:center;-webkit-box-pack: center;-webkit-justify-content: center;justify-content: center;} /* 边框颜色 */
@-webkit-keyframes dis{ /* 尺寸变量 */
from{ /* 文字尺寸 */
/* 图片尺寸 */
/* Border Radius */
/* 水平间距 */
/* 垂直间距 */
/* 透明度 */
/* 文章场景相关 */
.bigBox {
background: #f5f5f5;
height: 100%;
}
/*上部分*/
.top {
background: #FFFFFF;
}
.topName {
font-size: 28rpx;
font-weight: bold;
padding-top: 50rpx;
display: -webkit-box;
display: -webkit-flex;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center;
align-items: center;
-webkit-box-pack: center;
-webkit-justify-content: center;
justify-content: center;
}
.topIcon {
display: -webkit-inline-box;
display: -webkit-inline-flex;
display: inline-flex;
margin-right: 10rpx;
width: 50rpx;
height: 50rpx;
border-radius: 50%;
background: #FF8B57;
-webkit-box-align: center;
-webkit-align-items: center;
align-items: center;
-webkit-box-pack: center;
-webkit-justify-content: center;
justify-content: center;
}
.icon-tubiaolunkuo- {
font-size: 36rpx;
color: #FFFFFF;
font-weight: 400;
}
.topMoney {
padding: 80rpx 24rpx 35rpx 24rpx;
display: -webkit-box;
display: -webkit-flex;
display: flex;
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
justify-content: space-between;
-webkit-box-align: center;
-webkit-align-items: center;
align-items: center;
}
.moneyText {
color: #FF3C00;
font-size: 28rpx;
font-weight: bold;
}
.moneyNumber text:nth-child(2) {
font-size: 58rpx;
font-weight: bold;
position: relative;
left: -6rpx;
}
.moneyNumber text:last-child {
-webkit-animation: dis 1.5s infinite;
animation: dis 1.5s infinite;
-webkit-transition: 1s;
transition: 1s;
width: 1px;
height: 56rpx;
display: inline-block;
background: #333333;
position: relative;
top: 8rpx;
}
.topCoupon {
display: -webkit-box;
display: -webkit-flex;
display: flex;
height: 90rpx;
border-top: 1px solid #DBDBDB;
-webkit-box-align: center;
-webkit-align-items: center;
align-items: center;
padding: 0 24rpx;
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
justify-content: space-between;
}
.couponLeft {
font-size: 24rpx;
}
.couponLeft text:first-child {
margin-right: 10rpx;
display: inline-block;
width: 30rpx;
height: 30rpx;
background: #f9690e;
color: #FFFFFF;
text-align: center;
line-height: 28rpx;
border-radius: 4rpx;
}
.couponRight {
position: relative;
left: 8rpx;
}
.couponRight text:first-child {
font-size: 32rpx;
color: #f9690e;
}
.couponRight text:nth-child(2) {
font-size: 32rpx;
color: #F9690E;
font-weight: bold;
}
/*中间部分*/
.middle {
padding: 60rpx 24rpx 0 24rpx;
font-size: 22rpx;
color: #999999;
line-height: 40rpx;
}
/*下部分*/
.bottom {
position: absolute;
bottom: 0;
height: 40%;
background: #FFFFFF;
width: 100%;
display: -webkit-box;
display: -webkit-flex;
display: flex;
border-top: 1px solid #dddddd;
font-size: 50rpx;
}
.botLeft {
width: 75%;
}
.botLeft view {
height: 25%;
display: -webkit-box;
display: -webkit-flex;
display: flex;
border-bottom: 1px solid #dddddd;
}
.botLeft view:last-child {
border: none;
}
.botLeft view text {
-webkit-box-flex: 1;
-webkit-flex: 1;
flex: 1;
height: 100%;
display: -webkit-inline-box;
display: -webkit-inline-flex;
display: inline-flex;
-webkit-box-align: center;
-webkit-align-items: center;
align-items: center;
-webkit-box-pack: center;
-webkit-justify-content: center;
justify-content: center;
border-right: 1px solid #dddddd;
}
.botLeft view:last-child text {
-webkit-box-flex: initial;
-webkit-flex: initial;
flex: initial;
}
.botRight {
width: 25%;
}
.rightOne {
height: 25%;
display: -webkit-box;
display: -webkit-flex;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center;
align-items: center;
-webkit-box-pack: center;
-webkit-justify-content: center;
justify-content: center;
border-bottom: 1px solid #dddddd;
}
.rightTwo {
height: 75%;
border: none;
color: #FFFFFF;
background: #CCCCCC;
display: -webkit-box;
display: -webkit-flex;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-webkit-flex-direction: column;
flex-direction: column;
-webkit-box-align: center;
-webkit-align-items: center;
align-items: center;
-webkit-box-pack: center;
-webkit-justify-content: center;
justify-content: center;
}
@-webkit-keyframes dis {
from {
opacity: 0; opacity: 0;
} }
to{ to {
opacity: 1; opacity: 1;
} }
} }
@keyframes dis{ @keyframes dis {
from{ from {
opacity: 0; opacity: 0;
} }
to{ to {
opacity: 1; opacity: 1;
} }
} }
......
unpackage/dist/dev/mp-weixin/project.config.json
View file @ 1bcd755c
...@@ -4,10 +4,39 @@ ...@@ -4,10 +4,39 @@
"ignore": [] "ignore": []
}, },
"setting": { "setting": {
"urlCheck": true, "urlCheck": false,
"es6": true, "es6": true,
"enhance": false,
"postcss": true, "postcss": true,
"minified": true "preloadBackgroundData": false,
"minified": true,
"newFeature": false,
"coverView": true,
"nodeModules": false,
"autoAudits": false,
"showShadowRootInWxmlPanel": true,
"scopeDataCheck": false,
"uglifyFileName": false,
"checkInvalidKey": true,
"checkSiteMap": true,
"uploadWithSourceMap": true,
"compileHotReLoad": false,
"useMultiFrameRuntime": true,
"useApiHook": true,
"useApiHostProcess": true,
"babelSetting": {
"ignore": [],
"disablePlugins": [],
"outputPath": ""
},
"enableEngineNative": false,
"useIsolateContext": true,
"useCompilerModule": true,
"userConfirmedUseCompilerModuleSwitch": false,
"userConfirmedBundleSwitch": false,
"packNpmManually": false,
"packNpmRelationList": [],
"minifyWXSS": true
}, },
"compileType": "miniprogram", "compileType": "miniprogram",
"libVersion": "", "libVersion": "",
...@@ -15,19 +44,15 @@ ...@@ -15,19 +44,15 @@
"projectname": "uni-pdtravel", "projectname": "uni-pdtravel",
"condition": { "condition": {
"search": { "search": {
"current": -1,
"list": [] "list": []
}, },
"conversation": { "conversation": {
"current": -1,
"list": [] "list": []
}, },
"game": { "game": {
"current": -1,
"list": [] "list": []
}, },
"miniprogram": { "miniprogram": {
"current": 0,
"list": [ "list": [
{ {
"name": "", "name": "",
......
unpackage/dist/dev/mp-weixin/uni_modules/uni-icons/components/uni-icons/uni-icons.bak.json 0 → 100644
View file @ 1bcd755c
{
"usingComponents": {},
"component": true
}
\ No newline at end of file
unpackage/dist/dev/mp-weixin/uni_modules/uni-icons/components/uni-icons/uni-icons.wxml 0 → 100644
View file @ 1bcd755c
<text data-event-opts="{{[['tap',[['_onClick',['$event']]]]]}}" class="{{['uni-icons data-v-a2e81f6e',customIcons,customIcons?type:'']}}" style="{{'color:'+(color)+';'+('font-size:'+(size+'px')+';')}}" bindtap="__e">{{icons[type]}}</text>
\ No newline at end of file
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