TmOct5/barter-app
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

[.区块链z证书展示格式等冲突处理]

Browse Source
This commit is contained in:
张冬雪
2021-10-15 15:06:29 +08:00
parent 6155d93548
commit 2855bb58e6
13 changed files with 9218 additions and 6658 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
pages/goods/chain.vue
View File

@@ -3,7 +3,7 @@
<image src="https://e-chain.cnskl.com/storage/imageresource/chain-bg.png" class='chainBg' />
<view class="chain-content">
<view class="chain-center">
<image src="/static/images/service-logi.png" mode="aspectFill" class="logo" />
<image src="/static/icons/e-logo.png" mode="aspectFill" class="logo" />
<view class="name">易品新境区块链溯源证书</view>
<view class="no">区块链溯源证书：{{info.token}}</view>
<view class="content">
@@ -49,7 +49,6 @@
.GoodsChain {
background-color:fff;
width: 100%;
min-height: 100vh;
position: relative;
z-index: 1;
.chainBg{
@@ -60,7 +59,7 @@
}
.chain-content{
width: 100%;
height: 100vh;
min-height: 100%;
z-index: 2;
padding: 18vh 10vw 15vh 10vw ;
box-sizing: border-box;
@@ -68,7 +67,7 @@
z-index: 3;
.chain-center{
width: 100%;
height: 100%;
min-height: 100%;
.logo{
width: 160rpx;
height: 160rpx;

5
pages/goods/details.vue
View File

@@ -638,8 +638,9 @@
position: relative;
margin-top: $margin;
.coupons-tips {
background-color: #211e17;
color: #efe8d8;
// background-color: #211e17;
background-image: linear-gradient(to right, #f8e5c0, #d6a46a);
color: #8d4928;
position: absolute;
border-radius: 0 0 20rpx 0;
padding: 0 8rpx;

648
pages/property/coupon/confirmOrder.vue Normal file
View File

@@ -0,0 +1,648 @@
<template>
<view class="ConfirmOrder">
<view class="goods-info1">
<view class="top">
<view class="company">
<image :src="shop.cover" mode="aspectFill" />
<view class="name">{{shop.name}}</view>
</view>
</view>
<view class="goods-info">
<image class="goods-img" :src="info.cover" mode="aspectFill" />
<view class="goods">
<view class="name">
<view class="name1 ellipsis-2">{{info.title}}</view> <span>￥{{info.price}}</span>
</view>
<!-- <view class="sku">均码规格/件<span>x {{info.qty}}</span> </view> -->
<view class="sku">
<span>数量</span>
<span>
<u-number-box v-model="params.qty" :min='1' :max='1000'
@change='numberBoxChange' />
</span>
</view>
</view>
</view>
<!-- <view class="goods-type">支付方式<span>在线支付</span></view> -->
<view class="goods-type" @click="showCouponList = true">优惠券
<span>{{coupon_grant_id!==''?'已优惠 - ￥'+coupon_price:'选择优惠券'}}
<u-icon name="arrow-right" color="#666" size="24" />
</span>
</view>
<!-- <view class="goods-type" style="border-top: solid 20rpx #f7f7f7;">创建时间<span>2021-11-20 13:00:15</span></view> -->
<view class="goods-type">商品总价 <span>￥{{amount}}</span></view>
<view class="goods-type" v-if="coupon_price>0">优惠<span> - ￥{{coupon_price}}</span></view>
<!-- <view class="goods-type">运费 <span>免邮</span></view> -->
<view class="goods-type">
<u-input class="order-content" type="textarea" v-model="remark" :clearable='false' :border="true"
:auto-height="true" placeholder="请填写订单备注" />
</view>
<view class="pay-select">请选择支付方式</view>
<view class="pay-select-item" @click="selectPay('2')">
<view class="pay-left">
<u-icon class="wx-icon" name="weixin-fill" color="#fff" size="40"></u-icon>
<view class="pay-wx-title">
微信支付
<span>推荐微信用户使用</span>
</view>
</view>
<u-icon v-if="selectTypeId!== '2'" name="checkmark-circle" color="#f7f7f7" size="50"></u-icon>
<u-icon v-else name="checkmark-circle-fill" color="#e93340" size="50"></u-icon>
</view>
<view class="pay-select-item" @click="selectPay('1')">
<view class="pay-left">
<u-icon class="wx-icon" name="integral-fill" color="#fff" size="40"></u-icon>
<view class="pay-wx-title">
E币交易
<span>可用Eb总额：{{account.getEBBalance}}</span>
</view>
</view>
<u-icon v-if="selectTypeId!== '1'" name="checkmark-circle" color="#f7f7f7" size="50"></u-icon>
<u-icon v-else name="checkmark-circle-fill" color="#e93340" size="50"></u-icon>
</view>
</view>
<!-- 订单 -->
<view class="actions">
<view class="title">
实付金额：<span class="money">￥{{total}}</span>
</view>
<view @click="order" class="nowPay">提交订单</view>
</view>
<!-- 优惠券弹窗 -->
<u-popup v-model="showCouponList" mode="bottom" border-radius="14">
<scroll-view scroll-y="true" style="height: 1000rpx;" class="scrollView">
<view class="coupon-title">可用优惠券列表</view>
<view class="coupon-list-item" v-for="(item,index) in list" :key="index" v-if="list.length>0">
<u-icon v-if="coupon_grant_id!== item.coupon_grant_id" name="checkmark-circle" color="#cacaca"
size="50">
</u-icon>
<u-icon v-else name="checkmark-circle-fill" color="#e93340" size="50"></u-icon>
<couponTemplate style="flex: 1;" :item="{...item}" :showUse='false' />
<!-- 遮挡层用户控制点击事件 -->
<view class="coupon-list-item" @click="selectCoupon(item)"></view>
</view>
<!-- 没有优惠券列表 -->
<no-list v-if="list.length === 0" name='no-counpon' txt="没有任何可用券哦" />
</scroll-view>
</u-popup>
<!-- <u-toast ref="uToast" /> -->
<u-toast ref="uToast" />
</view>
</template>
<script>
import couponTemplate from "@/components/coupon-template/coupon-template-2"
import {
mallBuyGoods
} from '@/apis/interfaces/goods'
import {
wxPay,
ebPay
} from '@/apis/interfaces/order'
export default {
name: 'OrderInfo',
components: {
couponTemplate
},
data() {
return {
// box: {
// min: 1,
// max: 100
// },
amount: 0,
account: {},
total: 0,
shop: {}, // 店铺信息
info: {}, // 商品详情
showCouponList: false, // 默认false不显示优惠券弹窗列表
coupon_grant_id: '', // 默认没有选择任何一个优惠券
list: [], // 优惠券列表
params: {}, // 上个页面携带过来的参数
remark: '', // 备注
order_no: '', // 下单成功的id
selectTypeId: '2', // 微信支付2 E币支付1
coupon_price: '' // 代驾券显示金额，提货券显示什么呢
};
},
onLoad(e) {
// 获取确认订单页面参数
this.params = e
this.params.qty = Number(e.qty)
this.mallBuyGoods(e, 'get') // 确认订单商品信息get
},
methods: {
// 确认商品详情页get，下单页面post
mallBuyGoods(params, method) {
params.coupon_grant_id = this.coupon_grant_id
mallBuyGoods(params, method).then(res => {
if (method === 'get') {
this.amount = res.amount
this.account = res.account
this.total = res.total
this.list = res.coupons
this.shop = res.detail[0].shop
this.info = res.detail[0].items[0]
this.coupon_price = res.coupon_price
} else {
this.order_no = res.order_no
this.$refs.uToast.show({
title: '下单成功',
duration: 1888,
type: 'primary',
})
this.nowPay()
}
}).catch(err => {
this.$refs.uToast.show({
title: err.message,
type: 'primary',
duration: 3000
})
})
},
// 提交订单
order() {
let params = this.params
params.coupon_grant_id = this.coupon_grant_id
params.remark = this.remark
params.channel = 'mini'
this.mallBuyGoods(params, 'post')
},
// 触发支付
nowPay() {
this.canPay = false
let apiUrl = ''
let data = {}
if (this.selectTypeId === '2') {
apiUrl = wxPay
data = {
order_no: this.order_no,
type: 'miniapp',
openid: uni.getStorageSync('openid')
}
} else {
apiUrl = ebPay
data = {
order_no: this.order_no
}
}
apiUrl(data).then(res => {
let payInfo = res
if (this.selectTypeId === '2') {
if (payInfo.timeStamp) {
uni.requestPayment({
provider: 'wxpay',
timeStamp: payInfo.timeStamp,
nonceStr: payInfo.nonceStr,
package: payInfo.package,
signType: payInfo.signType,
paySign: payInfo.paySign,
success: res => {
this.$refs.uToast.show({
title: '支付成功',
type: 'primary',
duration: 3000
})
setTimeout(() => {
this.canPay = true
uni.reLaunch({
url: '/pages/order/payStatus?success=true'
})
}, 3000);
},
fail: (err) => {
this.canPay = true
this.$refs.uToast.show({
title: '支付失败',
type: 'primary',
duration: 3000
})
setTimeout(() => {
this.canPay = true
uni.reLaunch({
url: '/pages/order/payStatus?success=false'
})
}, 3000);
}
});
} else {
this.$refs.uToast.show({
title: '创建订单成功',
type: 'primary',
duration: 3000
})
setTimeout(() => {
this.canPay = true
uni.reLaunch({
url: '/pages/order/payStatus?success=true'
})
}, 3000);
}
} else {
this.$refs.uToast.show({
title: res,
type: 'primary',
duration: 3000
})
setTimeout(() => {
this.canPay = true
uni.reLaunch({
url: '/pages/order/payStatus?success=true'
})
}, 3000);
}
}).catch(err => {
this.$refs.uToast.show({
title: err.message,
type: 'primary',
duration: 3000
})
setTimeout(res => {
this.canPay = true
}, 2000)
})
},
// 选择可用优惠券
selectCoupon(item) {
if (this.coupon_grant_id === item.coupon_grant_id) {
this.coupon_grant_id = ''
// this.coupon_price = ''
} else {
this.coupon_grant_id = item.coupon_grant_id
// this.coupon_price = item.price
}
this.mallBuyGoods(this.params, 'get')
this.showCouponList = false
},
// 增加库存时候触发事件
numberBoxChange(e) {
this.params.qty = e.value
this.mallBuyGoods(this.params, 'get')
},
// 选择支付方式
selectPay(id) {
if (id === '1') {
if (this.info.is_change) {
this.selectTypeId = id
} else {
this.$refs.uToast.show({
title: '当前商品不支持EB支付'
})
}
} else if (id === '2') {
this.selectTypeId = id
}
},
}
}
</script>
<style lang="scss" scoped>
page {
width: 100%;
height: 100%;
}
.pay-select {
padding: 20rpx 30rpx;
border-top: 20rpx #f7f7f7 solid;
}
.pay-select-item {
background-color: #fff;
padding: 30rpx;
border-bottom: solid 1rpx #f7f7f7;
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
box-sizing: border-box;
.pay-left {
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
box-sizing: border-box;
.pay-wx-title {
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: flex-start;
box-sizing: border-box;
margin-left: 30rpx;
font-size: 28rpx;
span {
font-size: 24rpx;
color: #cacaca;
margin-top: 10rpx;
}
}
}
.wx-icon {
background-color: #e93340;
border-radius: 10rpx;
padding: 10rpx;
}
}
.ConfirmOrder {
width: 100%;
min-height: 100vh;
box-sizing: border-box;
background-color: #F7F7F7;
padding-bottom: 80rpx;
.acceptInfo {
margin: 0 30rpx;
// background-color: #fff;
box-shadow: 0 0 14rpx 4rpx rgba($color: $main-color, $alpha: 0.2);
border-radius: 20rpx;
padding: 30rpx;
position: relative;
top: -30rpx;
.name {
font-size: 36rpx;
font-weight: 600;
span {
padding-left: 20rpx;
font-size: 30rpx;
}
}
.address {
padding: 20rpx 40rpx;
font-size: 28rpx;
span {
margin-left: 10rpx;
}
}
}
.goods-info1 {
background-color: #fff;
border-top: solid 20rpx #f7f7f7;
.goods-type {
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
box-sizing: border-box;
padding: 30rpx 40rpx;
color: #666;
border-bottom: solid 1rpx #f7f7f7;
}
.goods-type span {
color: #000;
}
.order-content {
width: 100%;
}
// 顶部信息
.top {
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
padding: 20rpx 40rpx;
border-bottom: solid 1rpx #f7f7f7;
.company {
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
box-sizing: border-box;
image {
width: 60rpx;
height: 60rpx;
border-radius: 50%;
margin-right: 20rpx;
}
}
.name {
font-size: 30rpx;
color: #484848;
}
.no {
margin-top: 20rpx;
font-size: $title-size*0.9;
color: #999;
}
.status {
color: #999;
font-size: $title-size;
}
}
// 商品信息
.goods-info {
display: flex;
flex-direction: row;
align-items: flex-start;
justify-content: flex-start;
box-sizing: border-box;
margin-bottom: 20rpx;
padding: 30rpx 40rpx;
.goods-img {
width: 120rpx;
height: 120rpx;
border-radius: 10rpx;
}
.goods {
flex: 1;
margin-left: 20rpx;
.name {
width: 100%;
display: flex;
flex-direction: row;
align-items: flex-start;
justify-content: space-between;
box-sizing: border-box;
font-size: 30rpx;
// font-weight: bold;
.name1 {
width: 340rpx;
}
span {
font-size: 34rpx;
font-weight: normal;
}
}
.sku {
flex: 1;
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
box-sizing: border-box;
margin-top: 10rpx;
font-size: 28rpx;
color: #999;
}
}
}
// 合计信息
.total {
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-end;
box-sizing: border-box;
font-size: 28rpx;
color: #353535;
flex: 1;
text-align: right;
margin-top: 20rpx;
padding-bottom: 30rpx;
}
.total-btn {
// border: solid 1rpx #f7f7f7;
padding: 10rpx 30rpx;
border-radius: 10rpx;
color: red;
}
}
// 操作信息
.actions {
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-end;
box-sizing: border-box;
flex-wrap: wrap;
flex: 1;
font-size: 30rpx;
color: #666;
width: 100%;
background-color: #Fff;
position: fixed;
bottom: 0;
padding: 20rpx 0;
span {
color: $main-color;
margin-right: 30rpx;
font-weight: 600;
font-size: 32rpx;
}
.nowPay {
padding: 20rpx 50rpx;
text-align: center;
box-sizing: border-box;
background-color: $main-color;
color: #fff;
}
}
// 优惠券弹窗
.scrollView {
// padding: 40rpx;
box-sizing: border-box;
position: relative;
// 标题
.coupon-title {
padding: 40rpx;
font-weight: bold;
font-size: 40rpx;
border-bottom: solid 1rpx #f7f7f7;
}
// 优惠券样式
.coupon-list-item {
border-bottom: solid 1rpx #f7f7f7;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
box-sizing: border-box;
position: relative;
width: 100%;
.coupon-list-item {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
background-color: rgba($color: #000, $alpha: 0);
z-index: 10001;
}
}
}
// 选择收货地址
.add-addr {
width: 100%;
background-color: #fff;
border-bottom: solid rgba($color: $main-color, $alpha:0.2) 10rpx;
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
box-sizing: border-box;
padding: 0 40rpx;
.selectNew {
flex: 1;
text-align: center;
}
.selectNew2 {
padding: 20rpx 0;
flex: 1;
font-size: 34rpx;
color: #353535;
span {
color: #666;
font-size: 28rpx;
margin-left: 20rpx;
}
.addrs {
font-size: 26rpx;
margin-top: 10rpx;
color: #666;
}
}
}
}
</style>

4
pages/property/coupon/coupon.vue
View File

@@ -73,6 +73,9 @@
}
],
categroyList: [{
id: '',
name: '全部'
}, {
id: '4',
name: '新到'
},
@@ -146,6 +149,7 @@
selectNav(id) {
console.log(id)
this.selectNavId = id
this.selectCategoryId = ''
this.getMyCoupon()
},
selectCategory(id) {

3
pages/property/coupon/detail.vue
View File

@@ -95,7 +95,8 @@
// 点击立即购买去商品确认页面
nowBuy(items) {
uni.navigateTo({
url:'/pages/order/buy?qty=1&skuId='+items.goods_sku_id,
url: '/pages/property/coupon/confirmOrder?qty=1&type=2&goods_sku_id=' + items.goods_sku_id,
})
},
goDetail(id){