初始化代码
This commit is contained in:
876
uniapp/uni-app/land/pages/order.vue
Normal file
876
uniapp/uni-app/land/pages/order.vue
Normal file
@@ -0,0 +1,876 @@
|
||||
<template>
|
||||
<view class="land-order" v-if="orderInfo.land.id">
|
||||
<uni-nav-bar :fixed="true" :shadow="false" :statusBar="true" color="#fff"
|
||||
:backgroundColor="scrollTop < 20 ?``:primaryColor" leftIcon="icon-left" title="确认订单">
|
||||
</uni-nav-bar>
|
||||
<view :style="{height:`${configInfo.navBarHeight}px`}"></view>
|
||||
<image mode="aspectFill" lazy-load class="common-bg abs" :style="{height: `${configInfo.navBarHeight +104}px`}"
|
||||
src="https://lbqny.migugu.com/admin/farm/bg-cash.png"></image>
|
||||
<view class="common-top-img"></view>
|
||||
<view class="common-top-info rel" style="height: 19px;">
|
||||
<view class="top-box abs">
|
||||
<view class="fill-base ml-md mr-md pd-lg box-shadow radius-24">
|
||||
<view class="f-title c-title mt-sm mb-md ellipsis">{{orderInfo.land.title}}</view>
|
||||
<view class="f-caption c-caption">{{`${orderInfo.spe.spe_name} (${orderInfo.spe.area}㎡)`}}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="fill-base mt-md ml-md mr-md f-paragraph box-shadow radius-24">
|
||||
<view class="flex-center ml-md mr-md pl-sm pt-lg pb-lg b-1px-b">
|
||||
<view class="item-text c-black">土地面积</view>
|
||||
<view @tap.stop="toChooseItem('spe')" class="flex-1 flex-between f-paragraph">
|
||||
<view class="c-title max-400">{{`${orderInfo.spe.area}㎡`}}</view>
|
||||
<i class="iconfont icon-right"></i>
|
||||
</view>
|
||||
</view>
|
||||
<view class="flex-center ml-md mr-md pl-sm pt-lg pb-lg b-1px-b">
|
||||
<view class="item-text c-black">服务类型</view>
|
||||
<view @tap.stop="toChooseItem('massif')" class="flex-1 flex-between f-paragraph">
|
||||
<view class="c-title max-400">{{orderInfo.massif.title}}</view>
|
||||
<i class="iconfont icon-right"></i>
|
||||
</view>
|
||||
</view>
|
||||
<view class="flex-center ml-md mr-md pl-sm pt-lg pb-lg">
|
||||
<view class="item-text c-black">租赁周期</view>
|
||||
<view @tap.stop="toChooseItem('cycle')" class="flex-1 flex-between f-paragraph">
|
||||
<view class="c-title max-400">{{`${orderInfo.cycle}天`}}</view>
|
||||
<i class="iconfont icon-right"></i>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="fill-base mt-md ml-md mr-md f-paragraph box-shadow radius-24" v-if="detail.seed.length > 0">
|
||||
<view class="flex-between pd-lg f-sm-title c-title b-1px-b">
|
||||
<view class="text-bold">种子管理</view>
|
||||
<view @tap.stop="toChooseItem('seed')" class="flex-y-center f-paragraph c-caption"
|
||||
v-if="orderInfo.seed.length > 0">选择种子
|
||||
<i class="iconfont icon-right"></i>
|
||||
</view>
|
||||
</view>
|
||||
<view class="pd-lg" v-if="orderInfo.seed.length>0">
|
||||
<view class="flex-center" :class="[{'mt-md':index!=0}]" v-for="(item,index) in orderInfo.seed"
|
||||
:key="index">
|
||||
<image mode="aspectFill" lazy-load class="avatar sm box-shadow radius-10" :src="item.imgs[0]">
|
||||
</image>
|
||||
<view class="flex-1 ml-lg">
|
||||
<view class="f-title c-title max-400 ellipsis">{{item.title}}</view>
|
||||
<view class="flex-between f-caption c-caption">
|
||||
<view>{{item.area}}㎡</view>
|
||||
<view>x{{item.num}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view @tap.stop="toChooseItem('seed')" v-if="!orderInfo.seed || orderInfo.seed.length == 0">
|
||||
<view class="space-lg"></view>
|
||||
<view class="space-lg"></view>
|
||||
<view class="add-btn flex-center f-paragraph c-desc">
|
||||
<i class="iconfont icon-add-circle-fill mr-sm"></i>选择种子
|
||||
</view>
|
||||
<view class="space-lg"></view>
|
||||
<view class="space-lg"></view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="fill-base mt-md ml-md mr-md f-paragraph box-shadow radius-24">
|
||||
<view class="flex-center pd-lg f-sm-title c-title b-1px-b">
|
||||
<view class="flex-y-baseline flex-1">
|
||||
<view class="text-bold">配送信息</view>
|
||||
<view class="f-paragraph c-warning ml-sm">需额外配送费</view>
|
||||
</view>
|
||||
<view @tap.stop="$util.goUrl({url:`/mine/pages/address/list?check=1`})"
|
||||
class="flex-y-center f-paragraph c-caption" v-if="orderInfo.address.id">更换地址
|
||||
<i class="iconfont icon-right"></i>
|
||||
</view>
|
||||
</view>
|
||||
<view class="pd-lg" v-if="orderInfo.address.id">
|
||||
<view class="flex-warp">
|
||||
<i class="iconfont icon-dingwei mr-sm" style="font-size: 28rpx;margin-top: 6rpx;"></i>
|
||||
<view class="f-paragraph c-title flex-1">
|
||||
{{`${orderInfo.address.address}${orderInfo.address.address_info}`}}
|
||||
</view>
|
||||
</view>
|
||||
<view class="flex-y-baseline f-paragraph c-caption" style="margin:5rpx 0 0 38rpx;">
|
||||
{{orderInfo.address.user_name}}
|
||||
<view class="ml-lg">
|
||||
{{orderInfo.address.mobile}}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<block v-if="!orderInfo.address.id">
|
||||
<view class="space-lg"></view>
|
||||
<view class="space-lg"></view>
|
||||
<view @tap.stop="$util.goUrl({url:`/mine/pages/address/list?check=1`})"
|
||||
class="add-btn flex-center f-paragraph c-desc"><i
|
||||
class="iconfont icon-add-circle-fill mr-sm"></i>选择地址
|
||||
</view>
|
||||
<view class="space-lg"></view>
|
||||
<view class="space-lg"></view>
|
||||
</block>
|
||||
</view>
|
||||
|
||||
<view class="fill-base mt-md ml-md mr-md f-paragraph box-shadow radius-24">
|
||||
<view class="pd-lg f-sm-title c-title text-bold b-1px-b">租赁人信息</view>
|
||||
<view class="flex-between ml-md mr-md pl-sm pt-lg pb-lg b-1px-b">
|
||||
<view class="flex-y-center">
|
||||
<i class="iconfont icon-required c-warning"></i>
|
||||
<view class="item-text">姓名</view>
|
||||
</view>
|
||||
<input v-model="subForm.rent_user_name" type="text" class="flex-1 f-paragraph"
|
||||
placeholder-class="c-placeholder" :placeholder="rule[0].errorMsg" />
|
||||
</view>
|
||||
<view class="flex-between ml-md mr-md pl-sm pt-lg pb-lg b-1px-b">
|
||||
<view class="flex-y-center">
|
||||
<i class="iconfont icon-required c-warning"></i>
|
||||
<view class="item-text">手机号</view>
|
||||
</view>
|
||||
<input v-model="subForm.rent_mobile" type="text" class="flex-1 f-paragraph"
|
||||
placeholder-class="c-placeholder" :placeholder="rule[1].errorMsg" />
|
||||
<button open-type="getPhoneNumber" @getphonenumber="toAuthPhone"
|
||||
class="clear-btn auth-phone-btn flex-center" :style="{color:primaryColor}">立即授权</button>
|
||||
</view>
|
||||
<view class="flex-between ml-md mr-md pl-sm pt-lg pb-lg">
|
||||
<view class="flex-y-baseline">
|
||||
<i class="iconfont icon-required c-base"></i>
|
||||
<view class="item-text">备注</view>
|
||||
</view>
|
||||
<input v-model="subForm.text" type="text" class="flex-1 f-paragraph" maxlength="100"
|
||||
placeholder-class="c-placeholder" placeholder="请输入订单备注" />
|
||||
</view>
|
||||
</view>
|
||||
|
||||
|
||||
<view class="fill-base mt-md ml-md mr-md f-paragraph box-shadow radius-24">
|
||||
<view class="flex-between ml-md mr-md pl-sm pt-lg pb-lg">
|
||||
<view class="item-text">土地价格</view>
|
||||
<view>¥{{orderInfo.land_price}}</view>
|
||||
</view>
|
||||
<view class="flex-between ml-md mr-md pl-sm pt-lg pb-lg b-1px-t">
|
||||
<view class="item-text">服务价格</view>
|
||||
<view>¥{{orderInfo.total_massif_price}}</view>
|
||||
</view>
|
||||
<view class="flex-between ml-md mr-md pl-sm pt-lg pb-lg b-1px-t" v-if="orderInfo.seed_price*1>0">
|
||||
<view class="item-text">种子价格</view>
|
||||
<view>¥{{orderInfo.seed_price}}</view>
|
||||
</view>
|
||||
<view class="flex-between ml-md mr-md pl-sm pt-lg pb-lg b-1px-t">
|
||||
<view class="item-text">卡券优惠</view>
|
||||
<view @tap.stop="toUseCoupon" class="flex-y-center">
|
||||
<view class="flex-1 text-right">
|
||||
{{ orderInfo.coupon_id ? `-¥${orderInfo.coupon_discount}` : `${orderInfo.canUseCoupon}张可用` }}
|
||||
</view>
|
||||
<i class="iconfont icon-right"></i>
|
||||
</view>
|
||||
</view>
|
||||
<view class="flex-between ml-md mr-md pl-sm pt-lg pb-lg b-1px-t">
|
||||
<view class="item-text">合计</view>
|
||||
<view class="c-warning">¥{{orderInfo.pay_price}}</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="fill-base mt-md ml-md mr-md f-sm-title box-shadow radius-24">
|
||||
<view @tap.stop="toChangeItem('payInd',index)"
|
||||
class="flex-between ml-md mr-md pl-sm pr-sm pt-lg pb-lg b-1px-b" v-for="(item,index) in payList"
|
||||
:key="index">
|
||||
<view class="pay-item flex-y-center"><i class="iconfont mr-md" :class="[item.icon]"
|
||||
:style="{color:item.id==1?primaryColor:item.id==2?subColor:'#01AAF2'}"></i>
|
||||
<view class="flex-y-baseline">{{item.title}}
|
||||
<view class="f-paragraph c-caption ml-sm" v-if="item.id==2">余额{{userInfo.balance || 0}}元
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<i class="pay-icon iconfont c-caption"
|
||||
:class="[{'icon-xuanze':payInd != index},{'icon-radio-fill':item.is_disabled || payInd == index}]"
|
||||
:style="{color:payInd==index?primaryColor:''}"></i>
|
||||
</view>
|
||||
</view>
|
||||
<view @tap.stop="toAgree" class="flex-warp f-paragraph mt-md pd-md"><i
|
||||
class="agree-icon iconfont c-caption mr-sm"
|
||||
:class="[{'icon-xuanze': !agree},{'icon-xuanze-fill': agree}]" style="margin-top: 3rpx;"
|
||||
:style="{color:agree?primaryColor:''}"></i>
|
||||
<view class="flex-y-center">购买代表您已同意<view @tap.stop="$util.goUrl({url:`/mine/pages/agreement?type=2`})"
|
||||
:style="{color:primaryColor}">
|
||||
《{{agreement}}》</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="space-max-footer"></view>
|
||||
<view class="footer-btn fill-base fix">
|
||||
<view class="footer-item flex-between pl-lg pr-lg">
|
||||
<view class="flex-y-baseline f-paragraph c-title">
|
||||
合计:<view class="f-sm-title c-warning text-bold">¥{{orderInfo.pay_price}}</view>
|
||||
</view>
|
||||
<auth :needAuth="userInfo && !userInfo.nickName" :must="true" type="userInfo" @go="toOrder">
|
||||
<view class="order-btn flex-center f-sm-title c-base text-bold radius-20"
|
||||
:style="{background:primaryColor}">立即支付
|
||||
</view>
|
||||
</auth>
|
||||
</view>
|
||||
<view class="space-safe"></view>
|
||||
</view>
|
||||
|
||||
<uni-popup ref="choose_item" type="bottom" :custom="true">
|
||||
<view @touchmove.stop.prevent class="popup-choose-item flex-center flex-column fill-base radius-top-34"
|
||||
:class="[{'pt-lg pb-lg':chooseType=='seed'},{'pd-lg':chooseType!='seed'}]">
|
||||
<view @tap.stop="chooseType=='seed'?$refs.choose_item.close():''" class="pl-lg pr-lg pb-lg"
|
||||
:class="[{'flex-between':chooseType=='seed'}]" style="width: 100%;">
|
||||
<view class="flex-center f-title c-title text-bold">{{`选择${chooseArr[chooseType]}`}}</view>
|
||||
<i class="iconfont icon-add-circle rotate-45" :style="{color:subColor}"
|
||||
v-if="chooseType=='seed'"></i>
|
||||
</view>
|
||||
<block v-if="chooseType == 'seed'">
|
||||
<scroll-view scroll-y class="seed-list">
|
||||
<block v-for="(item,index) in detail.seed" :key="index">
|
||||
<view class="item-child rel mt-md ml-md mr-md pd-lg fill-base radius-24 box-shadow">
|
||||
<view class="flex-center">
|
||||
<image mode="aspectFill" lazy-load class="goods-img box-shadow-mini radius-24"
|
||||
:src="item.imgs[0]">
|
||||
</image>
|
||||
<view class="flex-1 ml-md">
|
||||
<view class="goods-title f-title c-title text-bold ellipsis">{{item.title}}
|
||||
</view>
|
||||
<view class="goods-title f-caption c-caption ellipsis">
|
||||
预估产量:{{item.output_value}}kg/㎡
|
||||
<text class="ml-md">播种面积:{{item.area}}㎡</text>
|
||||
</view>
|
||||
<view class="flex-between">
|
||||
<view class="f-title c-warning mt-sm"> ¥{{item.seed_price}} </view>
|
||||
<view class="add-remove-item flex-center">
|
||||
<block v-if="item.cur_num">
|
||||
<i @tap.stop="changeNum(-1,index)"
|
||||
class="iconfont icon-remove-square c-caption"></i>
|
||||
<view class="number flex-center f-desc pl-sm pr-sm">{{item.cur_num}}
|
||||
</view>
|
||||
</block>
|
||||
<i @tap.stop="changeNum(1,index)" class="iconfont icon-add-square"
|
||||
:style="{color:primaryColor}"></i>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="space-lg" v-if="index == detail.seed.length -1"></view>
|
||||
</block>
|
||||
</scroll-view>
|
||||
<view class="order-btn-info fill-base">
|
||||
<view class="footer-item flex-between pt-md pb-md pl-md pr-lg">
|
||||
<view class="flex-warp f-desc c-title">
|
||||
<view>已选:{{`${total_area}/${orderInfo.spe.area}㎡`}}</view>
|
||||
<view class="flex-y-center ml-md">总计:<view class="c-warning text-bold">
|
||||
¥{{total_seed_price}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view @tap.stop="toConfirm" class="order-btn flex-center f-title c-base radius-20"
|
||||
:style="{background:primaryColor}">确定
|
||||
</view>
|
||||
</view>
|
||||
<view class="space-safe"></view>
|
||||
</view>
|
||||
</block>
|
||||
<block v-else>
|
||||
<scroll-view scroll-y style="width: 100%;max-height: 60vh;">
|
||||
<view @tap.stop="toCheckItem(index)" class="flex-warp pt-sm pb-sm"
|
||||
:style="{color:chooseInd == index ? primaryColor: ''}"
|
||||
v-for="(item,index) in detail[chooseType]" :key="index">
|
||||
<view class="f-title flex-1">
|
||||
{{chooseType == 'spe' ? item.spe_name : item.title}}
|
||||
</view>
|
||||
<i class="iconfont c-caption"
|
||||
:class="[{'icon-xuanze':chooseInd != index},{'icon-radio-fill':chooseInd == index || chooseType=='spe' && item.is_app}]"
|
||||
style="font-size: 40rpx;" :style="{color:chooseInd == index ? primaryColor: ''}"></i>
|
||||
</view>
|
||||
</scroll-view>
|
||||
<view class="flex-between mt-lg">
|
||||
<view @tap.stop="$refs.choose_item.close()"
|
||||
class="popup-btn flex-center f-title c-desc radius mr-md">取消</view>
|
||||
<view @tap.stop="toConfirm" class="popup-btn flex-center f-title c-base radius ml-md"
|
||||
:style="{background:primaryColor}">
|
||||
确定
|
||||
</view>
|
||||
</view>
|
||||
<view class="space-safe"></view>
|
||||
</block>
|
||||
</view>
|
||||
</uni-popup>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
mapState,
|
||||
mapActions,
|
||||
mapMutations
|
||||
} from "vuex"
|
||||
export default {
|
||||
components: {},
|
||||
data() {
|
||||
return {
|
||||
options: {},
|
||||
detail: {},
|
||||
scrollTop: 0,
|
||||
// 1微信支付;2余额支付;3支付宝支付
|
||||
payList: [{
|
||||
id: 1,
|
||||
title: '微信支付',
|
||||
icon: 'icon-wechat-pay',
|
||||
is_disabled: false
|
||||
}
|
||||
// #ifdef APP-PLUS
|
||||
, {
|
||||
id: 3,
|
||||
title: '支付宝支付',
|
||||
icon: 'icon-alipay',
|
||||
is_disabled: false
|
||||
}
|
||||
// #endif
|
||||
, {
|
||||
id: 2,
|
||||
title: '余额支付',
|
||||
icon: 'icon-qianbao',
|
||||
is_disabled: false
|
||||
}
|
||||
],
|
||||
payInd: 0,
|
||||
// #ifdef APP-PLUS
|
||||
balanceInd: 2,
|
||||
// #endif
|
||||
// #ifndef APP-PLUS
|
||||
balanceInd: 1,
|
||||
// #endif
|
||||
sendList: [{
|
||||
id: 1,
|
||||
title: '自提',
|
||||
}, {
|
||||
id: 2,
|
||||
title: '快递',
|
||||
}],
|
||||
sendInd: 1,
|
||||
agreement: '',
|
||||
agree: false,
|
||||
orderInfo: {
|
||||
address: {},
|
||||
farmer_info: {},
|
||||
land: {},
|
||||
seed: []
|
||||
},
|
||||
chooseArr: {
|
||||
'spe': '土地面积',
|
||||
'massif': '服务类型',
|
||||
'cycle': '租赁周期',
|
||||
'seed': '种子',
|
||||
},
|
||||
chooseType: '',
|
||||
chooseInd: -1,
|
||||
total_area: 0,
|
||||
total_seed_price: 0,
|
||||
subForm: {
|
||||
address_id: '',
|
||||
rent_user_name: '',
|
||||
rent_mobile: '',
|
||||
text: ''
|
||||
},
|
||||
rule: [{
|
||||
name: "rent_user_name",
|
||||
checkType: "isNotNull",
|
||||
errorMsg: "请输入姓名",
|
||||
regType: 2
|
||||
}, {
|
||||
name: "rent_mobile",
|
||||
checkType: "isMobile",
|
||||
errorMsg: "请输入手机号"
|
||||
}, {
|
||||
name: "claim_name",
|
||||
checkType: "isNotNull",
|
||||
errorMsg: "快给你认养的小动物取个名吧"
|
||||
}],
|
||||
}
|
||||
},
|
||||
computed: mapState({
|
||||
primaryColor: state => state.config.configInfo.primaryColor,
|
||||
subColor: state => state.config.configInfo.subColor,
|
||||
configInfo: state => state.config.configInfo,
|
||||
userInfo: state => state.user.userInfo,
|
||||
}),
|
||||
async onLoad(options) {
|
||||
this.options = options
|
||||
let {
|
||||
id
|
||||
} = options
|
||||
let data = await this.$api.land.landInfo({
|
||||
id
|
||||
})
|
||||
data.seed.map(item => {
|
||||
item.num = 0
|
||||
item.cur_num = 0
|
||||
})
|
||||
let arr = data.cycle.map(item => {
|
||||
return {
|
||||
id: item,
|
||||
title: `${item}天`,
|
||||
}
|
||||
})
|
||||
data.cycle = arr
|
||||
this.detail = data
|
||||
this.initIndex()
|
||||
},
|
||||
onPageScroll(e) {
|
||||
this.scrollTop = e.scrollTop
|
||||
},
|
||||
methods: {
|
||||
...mapActions(['getUserInfo', 'getAuthPhone']),
|
||||
...mapMutations(['updateOrderItem']),
|
||||
async initIndex(flag = false) {
|
||||
if (!flag) {
|
||||
await this.getUserInfo()
|
||||
let {
|
||||
title
|
||||
} = await this.$api.home.aboutUsInfoType({
|
||||
type: 2
|
||||
})
|
||||
this.agreement = title
|
||||
}
|
||||
let {
|
||||
id: land_id,
|
||||
spe_id,
|
||||
cycle,
|
||||
massif_id
|
||||
} = this.options
|
||||
let seed = this.$util.deepCopy(this.detail.seed).filter(item => {
|
||||
return item.num * 1 > 0
|
||||
})
|
||||
let seed_data = seed.map(item => {
|
||||
return {
|
||||
id: item.id,
|
||||
num: item.num
|
||||
}
|
||||
})
|
||||
let {
|
||||
address = {}, coupon_id = 0
|
||||
} = this.orderInfo
|
||||
let {
|
||||
id: address_id = 0
|
||||
} = address
|
||||
let param = {
|
||||
land_id,
|
||||
spe_id,
|
||||
cycle,
|
||||
massif_id,
|
||||
address_id,
|
||||
coupon_id,
|
||||
seed_data
|
||||
}
|
||||
let orderInfo = await this.$api.land.landPayOrderInfo(param)
|
||||
if (flag) {
|
||||
orderInfo.address = address
|
||||
}
|
||||
this.orderInfo = orderInfo
|
||||
let {
|
||||
balance,
|
||||
phone
|
||||
} = this.userInfo
|
||||
let {
|
||||
pay_price,
|
||||
} = this.orderInfo
|
||||
let is_disabled = balance * 1 < pay_price * 1
|
||||
let {
|
||||
balanceInd
|
||||
} = this
|
||||
this.payList[balanceInd].is_disabled = is_disabled
|
||||
if (pay_price * 1 == 0) {
|
||||
this.payList[0].is_disabled = true
|
||||
// #ifdef APP-PLUS
|
||||
this.payList[1].is_disabled = true
|
||||
// #endif
|
||||
this.payInd = balanceInd
|
||||
}
|
||||
let {
|
||||
rent_mobile = ''
|
||||
} = this.subForm
|
||||
this.subForm.rent_mobile = rent_mobile || phone
|
||||
},
|
||||
initRefresh() {
|
||||
this.initIndex(true)
|
||||
},
|
||||
toChangeItem(key, index) {
|
||||
if (key == 'payInd' && index === 2 && this.payList[index].is_disabled) return
|
||||
this[key] = index
|
||||
},
|
||||
// 授权手机号
|
||||
async toAuthPhone(e) {
|
||||
let phone = await this.getAuthPhone({
|
||||
e,
|
||||
})
|
||||
if (!phone) return
|
||||
this.$nextTick(() => {
|
||||
this.subForm.rent_mobile = phone
|
||||
})
|
||||
},
|
||||
toAgree() {
|
||||
this.agree = !this.agree
|
||||
},
|
||||
toChooseItem(type) {
|
||||
this.chooseType = type
|
||||
if (type == 'seed') {
|
||||
this.detail.seed.map(item => {
|
||||
item.cur_num = item.num
|
||||
})
|
||||
this.toCountPrice()
|
||||
} else {
|
||||
let id = type == 'cycle' ? this.orderInfo[type] : this.orderInfo[type].id
|
||||
let chooseInd = this.detail[type].findIndex(item => {
|
||||
return item.id == id
|
||||
})
|
||||
this.chooseInd = chooseInd
|
||||
}
|
||||
this.$refs.choose_item.open()
|
||||
},
|
||||
toCheckItem(index) {
|
||||
if (this.chooseType == 'spe') {
|
||||
let {
|
||||
is_app = 0,
|
||||
area
|
||||
} = this.detail.spe[index]
|
||||
if (is_app) return
|
||||
if (this.total_area * 1 > area) {
|
||||
this.$util.showToast({
|
||||
title: `所选种子播种面积大于当前所选面积`
|
||||
})
|
||||
return
|
||||
}
|
||||
}
|
||||
this.chooseInd = index
|
||||
},
|
||||
async changeNum(mod, index) {
|
||||
let {
|
||||
cur_num: goods_num,
|
||||
area
|
||||
} = this.detail.seed[index]
|
||||
let num = goods_num + mod;
|
||||
let {
|
||||
area: cur_area = 0
|
||||
} = this.orderInfo.spe
|
||||
let cur_total_area = this.total_area * 1 + (area * 1 * mod)
|
||||
if (cur_total_area > cur_area * 1) {
|
||||
this.$util.showToast({
|
||||
title: `最多可选择种植${cur_area}㎡`
|
||||
})
|
||||
return
|
||||
}
|
||||
this.detail.seed[index].cur_num = num
|
||||
this.toCountPrice()
|
||||
},
|
||||
toCountPrice() {
|
||||
let area = 0
|
||||
let seed_price = 0
|
||||
this.detail.seed.map(item => {
|
||||
area += item.area * 1 * item.cur_num
|
||||
seed_price += item.seed_price * 1 * item.cur_num
|
||||
})
|
||||
this.total_area = (area * 1).toFixed(2)
|
||||
this.total_seed_price = seed_price.toFixed(2)
|
||||
},
|
||||
toConfirm() {
|
||||
let {
|
||||
chooseType,
|
||||
chooseInd
|
||||
} = this
|
||||
if (chooseType == 'seed') {
|
||||
this.detail.seed.map(item => {
|
||||
item.num = item.cur_num
|
||||
})
|
||||
} else {
|
||||
let {
|
||||
id
|
||||
} = this.detail[chooseType][chooseInd]
|
||||
let key = chooseType == 'cycle' ? chooseType : `${chooseType}_id`
|
||||
this.options[key] = id
|
||||
}
|
||||
this.initRefresh()
|
||||
this.$refs.choose_item.close()
|
||||
},
|
||||
async toUseCoupon() {
|
||||
await this.toOrder(true)
|
||||
this.$util.goUrl({
|
||||
url: `/mine/pages/coupon/use?type=1`
|
||||
})
|
||||
},
|
||||
//表单验证
|
||||
validate(param) {
|
||||
let validate = new this.$util.Validate();
|
||||
let arr = ['rent_user_name', 'rent_mobile']
|
||||
this.rule.map(item => {
|
||||
let {
|
||||
name,
|
||||
} = item
|
||||
if (!arr.includes(name)) return
|
||||
validate.add(param[name], item);
|
||||
})
|
||||
let message = validate.start();
|
||||
return message;
|
||||
},
|
||||
toOrder(use_coupon = false) {
|
||||
let {
|
||||
payList,
|
||||
payInd,
|
||||
sendList,
|
||||
sendInd,
|
||||
subForm,
|
||||
agreement
|
||||
} = this
|
||||
let {
|
||||
id: land_id,
|
||||
spe_id,
|
||||
cycle,
|
||||
massif_id,
|
||||
} = this.options
|
||||
let {
|
||||
id: pay_model
|
||||
} = payList[payInd]
|
||||
let {
|
||||
id: send_type
|
||||
} = sendList[sendInd]
|
||||
let {
|
||||
address = {}, coupon_id = 0
|
||||
} = this.orderInfo
|
||||
let {
|
||||
id: address_id = 0
|
||||
} = address
|
||||
if (!use_coupon && !address_id && send_type == 2) {
|
||||
this.$util.showToast({
|
||||
title: `请选择配送地址`
|
||||
})
|
||||
return
|
||||
}
|
||||
let seed = this.$util.deepCopy(this.detail.seed).filter(item => {
|
||||
return item.num * 1 > 0
|
||||
})
|
||||
let seed_data = seed.map(item => {
|
||||
return {
|
||||
id: item.id,
|
||||
num: item.num
|
||||
}
|
||||
})
|
||||
let param = Object.assign({}, subForm, {
|
||||
land_id,
|
||||
spe_id,
|
||||
cycle,
|
||||
massif_id,
|
||||
pay_model,
|
||||
send_type,
|
||||
address_id,
|
||||
coupon_id,
|
||||
seed_data
|
||||
});
|
||||
if (use_coupon) {
|
||||
this.updateOrderItem({
|
||||
key: 'orderInfo',
|
||||
val: param
|
||||
})
|
||||
}
|
||||
let msg = this.validate(param);
|
||||
if (msg) {
|
||||
this.$util.showToast({
|
||||
title: msg
|
||||
});
|
||||
return;
|
||||
}
|
||||
if (!this.agree) {
|
||||
this.$util.showToast({
|
||||
title: `请勾选${agreement}`
|
||||
})
|
||||
return
|
||||
}
|
||||
this.toPay(param)
|
||||
},
|
||||
async toPay(param) {
|
||||
// #ifdef MP-WEIXIN
|
||||
let that = this
|
||||
let {
|
||||
tmp_list = []
|
||||
} = that.orderInfo
|
||||
let tmplIds = []
|
||||
tmp_list.map(item => {
|
||||
tmplIds.push(item.tmpl_id)
|
||||
})
|
||||
if (tmplIds && tmplIds.length > 0) {
|
||||
uni.requestSubscribeMessage({
|
||||
tmplIds,
|
||||
complete(res) {
|
||||
that.toConfirmPay(param)
|
||||
console.log(res, "complete requestSubscribeMessage");
|
||||
}
|
||||
})
|
||||
} else {
|
||||
that.toConfirmPay(param)
|
||||
}
|
||||
// #endif
|
||||
// #ifndef MP-WEIXIN
|
||||
this.toConfirmPay(param)
|
||||
// #endif
|
||||
},
|
||||
async toConfirmPay(param) {
|
||||
if (this.lockTap) return
|
||||
this.lockTap = true
|
||||
this.$util.showLoading()
|
||||
try {
|
||||
let {
|
||||
pay_list
|
||||
} = await this.$api.land.landPayOrder(param)
|
||||
this.$util.hideAll()
|
||||
if (pay_list) {
|
||||
if (param.pay_model == 3) {
|
||||
pay_list = {
|
||||
orderInfo: pay_list,
|
||||
provider: 'alipay'
|
||||
}
|
||||
}
|
||||
try {
|
||||
await this.$util.pay(pay_list)
|
||||
this.$util.showToast({
|
||||
title: `支付成功`
|
||||
})
|
||||
setTimeout(() => {
|
||||
this.$util.back()
|
||||
this.$util.goUrl({
|
||||
url: '/mine/pages/pay-result?type=land',
|
||||
openType: 'redirectTo'
|
||||
})
|
||||
}, 1000)
|
||||
this.lockTap = false
|
||||
return
|
||||
} catch (e) {
|
||||
this.$util.showToast({
|
||||
title: `支付失败`
|
||||
})
|
||||
setTimeout(() => {
|
||||
this.$util.back()
|
||||
this.$util.goUrl({
|
||||
url: `/land/pages/order/list`,
|
||||
openType: 'redirectTo'
|
||||
})
|
||||
}, 1000)
|
||||
this.lockTap = false
|
||||
return
|
||||
}
|
||||
}
|
||||
this.$util.showToast({
|
||||
title: `支付成功`
|
||||
})
|
||||
setTimeout(() => {
|
||||
this.$util.back()
|
||||
this.$util.goUrl({
|
||||
url: '/mine/pages/pay-result?type=land',
|
||||
openType: 'redirectTo'
|
||||
})
|
||||
}, 1000)
|
||||
} catch (e) {
|
||||
setTimeout(() => {
|
||||
this.lockTap = false
|
||||
this.$util.hideAll()
|
||||
}, 2000)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
<style lang="scss">
|
||||
.land-order {
|
||||
|
||||
.add-btn {
|
||||
width: 296rpx;
|
||||
height: 72rpx;
|
||||
background: #F6F6F6;
|
||||
border-radius: 36rpx;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.pay-item {
|
||||
.iconfont {
|
||||
font-size: 50rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.pay-icon {
|
||||
font-size: 40rpx;
|
||||
}
|
||||
|
||||
.icon-right {
|
||||
font-size: 28rpx;
|
||||
}
|
||||
|
||||
.icon-xuanze,
|
||||
.icon-xuanze-fill {
|
||||
font-size: 36rpx;
|
||||
}
|
||||
|
||||
.item-text {
|
||||
width: 150rpx;
|
||||
height: 40rpx;
|
||||
}
|
||||
|
||||
.auth-phone-btn {
|
||||
width: 106rpx;
|
||||
height: 36rpx;
|
||||
line-height: 36rpx;
|
||||
margin-left: 15rpx;
|
||||
font-size: 20rpx;
|
||||
background: #F0F4EC;
|
||||
border-radius: 10rpx;
|
||||
}
|
||||
|
||||
.footer-btn {
|
||||
bottom: 0;
|
||||
|
||||
.footer-item {
|
||||
height: 114rpx;
|
||||
|
||||
.order-btn {
|
||||
width: 332rpx;
|
||||
height: 88rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.popup-choose-item {
|
||||
.icon-add-circle {
|
||||
font-size: 50rpx;
|
||||
}
|
||||
|
||||
.seed-list {
|
||||
width: 100%;
|
||||
max-height: 70vh;
|
||||
background: #EEEEEE;
|
||||
|
||||
.item-child {
|
||||
.goods-img {
|
||||
width: 160rpx;
|
||||
height: 160rpx;
|
||||
}
|
||||
|
||||
.goods-title {
|
||||
max-width: 470rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.order-btn-info {
|
||||
width: 100%;
|
||||
|
||||
.footer-item {
|
||||
height: 114rpx;
|
||||
}
|
||||
|
||||
.order-btn {
|
||||
width: 226rpx;
|
||||
height: 88rpx;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user