@ -1,209 +1,217 @@ | |||||
<template> | <template> | ||||
<view class="confirmOrder"> | |||||
<navbar :title="$t('pageTitle.confirmOrder')" leftClick @leftClick="$utils.navigateBack"/> | |||||
<view class="frame"> | |||||
<view class="title"> | |||||
{{ $t('other.payDeposit') }} | |||||
</view> | |||||
<!--填写信息--> | |||||
<view class="form"> | |||||
<!--开户名称--> | |||||
<view class="item"> | |||||
<view> {{ $t('components.accountName') }}</view> | |||||
<view> | |||||
<input v-model="form.a" :placeholder="$t('components.enterAccountName')" clearable></input> | |||||
</view> | |||||
</view> | |||||
<!--开户行--> | |||||
<view class="item"> | |||||
<view> {{ $t('components.bankName') }}</view> | |||||
<view> | |||||
<input v-model="form.b" :placeholder="$t('components.enterOpeningBank')" clearable></input> | |||||
</view> | |||||
</view> | |||||
<!--银行账号--> | |||||
<view class="item"> | |||||
<view> {{ $t('components.bankAccount') }}</view> | |||||
<view> | |||||
<input v-model="form.c" :placeholder="$t('components.enterBankAccount')" clearable></input> | |||||
</view> | |||||
</view> | |||||
<view class="tip"> | |||||
{{ $t('components.paymentNotice') }} | |||||
</view> | |||||
</view> | |||||
<!--和联系我们--> | |||||
<view class="btns"> | |||||
<span @click="confirmOrder" class="qrdd"> | |||||
{{ $t('components.confirmOrder') }} | |||||
</span> | |||||
<span @click="closeOrder" class="qxdd"> | |||||
{{ $t('components.cancelOrder') }} | |||||
</span> | |||||
</view> | |||||
</view> | |||||
</view> | |||||
<view class="confirmOrder"> | |||||
<navbar :title="$t('pageTitle.confirmOrder')" leftClick @leftClick="$utils.navigateBack" /> | |||||
<view class="frame"> | |||||
<view class="title"> | |||||
{{ $t('other.payDeposit') }} | |||||
</view> | |||||
<!--填写信息--> | |||||
<view class="form"> | |||||
<!--开户名称--> | |||||
<view class="item"> | |||||
<view> {{ $t('components.accountName') }}</view> | |||||
<view> | |||||
<input v-model="form.companyName" | |||||
disabled | |||||
:placeholder="$t('components.enterAccountName')" clearable></input> | |||||
</view> | |||||
</view> | |||||
<!--开户行--> | |||||
<view class="item"> | |||||
<view> {{ $t('components.bankName') }}</view> | |||||
<view> | |||||
<input v-model="form.bankName" | |||||
disabled :placeholder="$t('components.enterOpeningBank')" clearable></input> | |||||
</view> | |||||
</view> | |||||
<!--银行账号--> | |||||
<view class="item"> | |||||
<view> {{ $t('components.bankAccount') }}</view> | |||||
<view> | |||||
<input v-model="form.bankAccount" | |||||
disabled | |||||
:placeholder="$t('components.enterBankAccount')" clearable></input> | |||||
</view> | |||||
</view> | |||||
<view class="tip"> | |||||
{{ $t('components.paymentNotice') }} | |||||
</view> | |||||
</view> | |||||
<!--和联系我们--> | |||||
<view class="btns"> | |||||
<!-- 确认订单 --> | |||||
<span @click="confirmOrder(0)" class="qrdd"> | |||||
{{ $t('components.confirmOrder') }} | |||||
</span> | |||||
<!-- 取消订单 --> | |||||
<span @click="confirmOrder(1)" class="qxdd"> | |||||
{{ $t('components.cancelOrder') }} | |||||
</span> | |||||
</view> | |||||
</view> | |||||
</view> | |||||
</template> | </template> | ||||
<script> | <script> | ||||
export default { | |||||
name: "confirmOrder", | |||||
onLoad(options) { | |||||
if (options.params) { | |||||
const fatherData = JSON.parse(decodeURIComponent(options.params)); | |||||
console.log(fatherData, "fatherData==========") | |||||
this.fatherData = fatherData; | |||||
} | |||||
}, | |||||
data() { | |||||
return { | |||||
fatherData: {}, | |||||
form: { | |||||
a: "", | |||||
b: "", | |||||
c: "", | |||||
}, | |||||
} | |||||
}, | |||||
methods: { | |||||
//确认下单 | |||||
confirmOrder() { | |||||
this.$api('addProductOrder',this.form, res => { | |||||
if (res.code == 200) { | |||||
uni.redirectTo({ | |||||
url: '/pages/index/clearanceService' | |||||
}) | |||||
} | |||||
}) | |||||
}, | |||||
//取消订单 | |||||
closeOrder() { | |||||
}, | |||||
}, | |||||
} | |||||
export default { | |||||
name: "confirmOrder", | |||||
onLoad(options) { | |||||
// if (options.params) { | |||||
// const fatherData = JSON.parse(decodeURIComponent(options.params)); | |||||
// console.log(fatherData, "fatherData==========") | |||||
this.fatherData = this.$store.state.productDetail; | |||||
this.form = this.$store.state.cartInfo; | |||||
// } | |||||
}, | |||||
data() { | |||||
return { | |||||
fatherData: {}, | |||||
form: { | |||||
}, | |||||
} | |||||
}, | |||||
methods: { | |||||
//0确认 / 1取消订单 | |||||
confirmOrder(type) { | |||||
this.$api('updateOrder', { | |||||
orderId : this.form.orderId, | |||||
type | |||||
}, res => { | |||||
if (res.code == 200) { | |||||
uni.redirectTo({ | |||||
url: '/pages/index/clearanceService' | |||||
}) | |||||
} | |||||
}) | |||||
}, | |||||
//取消订单 | |||||
closeOrder() { | |||||
}, | |||||
}, | |||||
} | |||||
</script> | </script> | ||||
<style scoped lang="scss"> | <style scoped lang="scss"> | ||||
.confirmOrder { | |||||
background-color: #FFF; | |||||
height: 100vh; | |||||
.frame { | |||||
.title { | |||||
display: flex; | |||||
justify-content: center; | |||||
align-items: center; | |||||
font-size: 36rpx; | |||||
color: #000; | |||||
padding: 30rpx; | |||||
} | |||||
.form { | |||||
margin: 20rpx; | |||||
border: 1px solid #efefef; | |||||
border-radius: 20rpx; | |||||
overflow: hidden; | |||||
.item { | |||||
display: flex; | |||||
align-items: center; | |||||
background-color: #FFF; | |||||
height: 100rpx; | |||||
padding: 10rpx 0 0 20rpx; | |||||
border-bottom: 1px solid #efefef; | |||||
> view:nth-of-type(1) { | |||||
width: 30%; | |||||
// font-weight: 700; | |||||
} | |||||
> view:nth-of-type(2) { | |||||
width: 70%; | |||||
border-radius: 10rpx; | |||||
overflow: hidden; | |||||
input { | |||||
background-color: #FFF; | |||||
font-size: 28rpx; | |||||
padding: 16rpx 8rpx 16rpx 15rpx; | |||||
} | |||||
} | |||||
} | |||||
.tip { | |||||
display: flex; | |||||
justify-content: center; | |||||
align-items: center; | |||||
font-size: 28rpx; | |||||
color: #f95e7d; | |||||
background-color: #f5f5f5; | |||||
height: 40rpx; | |||||
//margin-top: 20rpx; | |||||
padding: 10rpx; | |||||
} | |||||
} | |||||
.btns { | |||||
width: 100%; | |||||
display: flex; | |||||
flex-direction: column; | |||||
align-items: center; | |||||
justify-content: center; | |||||
gap: 20rpx; | |||||
position: fixed; | |||||
bottom: 80rpx; | |||||
left: 0; | |||||
right: 0; | |||||
.qrdd { | |||||
display: flex; | |||||
align-items: center; | |||||
justify-content: center; | |||||
width: 500rpx; | |||||
height: 70rpx; | |||||
border-radius: 40rpx; | |||||
color: #FFF; | |||||
font-size: 28rpx; | |||||
margin: 20rpx 10rpx 0 0; | |||||
background: $uni-color; | |||||
//margin-top: 20rpx; | |||||
border-radius: 40rpx; | |||||
} | |||||
.qxdd { | |||||
display: flex; | |||||
align-items: center; | |||||
justify-content: center; | |||||
width: 500rpx; | |||||
height: 70rpx; | |||||
border-radius: 40rpx; | |||||
color: #000000; | |||||
font-size: 28rpx; | |||||
margin: 20rpx 10rpx 0 0; | |||||
background: #f1f1f1; | |||||
//margin-top: 20rpx; | |||||
border-radius: 40rpx; | |||||
} | |||||
} | |||||
} | |||||
} | |||||
.confirmOrder { | |||||
background-color: #FFF; | |||||
height: 100vh; | |||||
.frame { | |||||
.title { | |||||
display: flex; | |||||
justify-content: center; | |||||
align-items: center; | |||||
font-size: 36rpx; | |||||
color: #000; | |||||
padding: 30rpx; | |||||
} | |||||
.form { | |||||
margin: 20rpx; | |||||
border: 1px solid #efefef; | |||||
border-radius: 20rpx; | |||||
overflow: hidden; | |||||
.item { | |||||
display: flex; | |||||
align-items: center; | |||||
background-color: #FFF; | |||||
height: 100rpx; | |||||
padding: 10rpx 0 0 20rpx; | |||||
border-bottom: 1px solid #efefef; | |||||
>view:nth-of-type(1) { | |||||
width: 30%; | |||||
// font-weight: 700; | |||||
} | |||||
>view:nth-of-type(2) { | |||||
width: 70%; | |||||
border-radius: 10rpx; | |||||
overflow: hidden; | |||||
input { | |||||
background-color: #FFF; | |||||
font-size: 28rpx; | |||||
padding: 16rpx 8rpx 16rpx 15rpx; | |||||
} | |||||
} | |||||
} | |||||
.tip { | |||||
display: flex; | |||||
justify-content: center; | |||||
align-items: center; | |||||
font-size: 28rpx; | |||||
color: #f95e7d; | |||||
background-color: #f5f5f5; | |||||
height: 40rpx; | |||||
//margin-top: 20rpx; | |||||
padding: 10rpx; | |||||
} | |||||
} | |||||
.btns { | |||||
width: 100%; | |||||
display: flex; | |||||
flex-direction: column; | |||||
align-items: center; | |||||
justify-content: center; | |||||
gap: 20rpx; | |||||
position: fixed; | |||||
bottom: 80rpx; | |||||
left: 0; | |||||
right: 0; | |||||
.qrdd { | |||||
display: flex; | |||||
align-items: center; | |||||
justify-content: center; | |||||
width: 500rpx; | |||||
height: 70rpx; | |||||
border-radius: 40rpx; | |||||
color: #FFF; | |||||
font-size: 28rpx; | |||||
margin: 20rpx 10rpx 0 0; | |||||
background: $uni-color; | |||||
//margin-top: 20rpx; | |||||
border-radius: 40rpx; | |||||
} | |||||
.qxdd { | |||||
display: flex; | |||||
align-items: center; | |||||
justify-content: center; | |||||
width: 500rpx; | |||||
height: 70rpx; | |||||
border-radius: 40rpx; | |||||
color: #000000; | |||||
font-size: 28rpx; | |||||
margin: 20rpx 10rpx 0 0; | |||||
background: #f1f1f1; | |||||
//margin-top: 20rpx; | |||||
border-radius: 40rpx; | |||||
} | |||||
} | |||||
} | |||||
} | |||||
</style> | </style> |