|
|
<template>
|
|
|
<!-- <page-meta :page-style="'overflow:'+(showinfo?'hidden':'visible')"></page-meta> -->
|
|
|
<view class="cotainer">
|
|
|
|
|
|
<!-- <date-picker ref="datePickers" @refresh="backDate" :data="listDates" :express="listExpress"></date-picker> -->
|
|
|
<date-picker ref="datePickers" @refresh="backDate" :data="listDates"></date-picker>
|
|
|
|
|
|
|
|
|
|
|
|
<view class="orderForm">
|
|
|
<u-form :model="form" label-width="180" ref="uForm" :error-type="['toast']">
|
|
|
<view class="orderInfo">
|
|
|
<view class="orderInfo-title">
|
|
|
<view>{{cardInfo.sku?cardInfo.sku.name:''}}</view>
|
|
|
</view>
|
|
|
<view class="orderInfo-info">
|
|
|
<block v-if="cardInfo.sku">
|
|
|
<image
|
|
|
:style="cardInfo.sku.image_url?'width:200rpx;height:120rpx':'width:150rpx;height:150rpx'"
|
|
|
:src="cardInfo.sku.image_url?cardInfo.sku.image_url:require('@/static/logo-xietaitai.png')">
|
|
|
</image>
|
|
|
</block>
|
|
|
<block v-else>
|
|
|
<image style="width:150rpx;height:150rpx" :src="require('@/static/logo-xietaitai.png')">
|
|
|
</image>
|
|
|
</block>
|
|
|
<!-- <image
|
|
|
:src="cardInfo.sku?(cardInfo.sku.image_url?cardInfo.sku.image_url:require('@/static/logo-xietaitai.png')):require('@/static/logo-xietaitai.png')">
|
|
|
</image> -->
|
|
|
<view>
|
|
|
<view>
|
|
|
{{cardInfo.sku?cardInfo.sku.specs:''}}
|
|
|
</view>
|
|
|
<!-- <view>
|
|
|
<view>今日剩余可提货量</view>
|
|
|
<view>99</view>
|
|
|
</view> -->
|
|
|
<view>
|
|
|
<view>卡券状态</view>
|
|
|
<view class="status"
|
|
|
v-html="type=='edit'?cardInfo.first_card.status_label:cardInfo.status_label"></view>
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class="orderInfo-status">
|
|
|
<u-form-item label="发货时间" :label-style="{'display':'none','width':0,'flex':0}"
|
|
|
:border-bottom="false" style="width:100%" prop="send_date" label-position="left">
|
|
|
<view style="display: flex;align-items: center;justify-content: space-between;">
|
|
|
<view>
|
|
|
<view>发货时间</view>
|
|
|
</view>
|
|
|
<view class="hh" @click="openDatePicker">
|
|
|
<view class="" v-if="form.send_date">
|
|
|
<!-- <view>{{form.express}}</view> -->
|
|
|
<view>{{form.ymd}} <text
|
|
|
style="color:#b62828;margin:0 10rpx">[{{form.week}}]</text>
|
|
|
<!-- {{form.hh}} -->
|
|
|
</view>
|
|
|
</view>
|
|
|
<view v-else>
|
|
|
<view>选择发货时间</view>
|
|
|
</view>
|
|
|
<view>
|
|
|
<u-icon name="arrow-down-fill" color="#ccc" size='28'></u-icon>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
<view style="color:#b62828;font-size:24rpx">非到货时间，预计发货后48小时左右可到货。</view>
|
|
|
|
|
|
</u-form-item>
|
|
|
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class="orderForm-wrap">
|
|
|
<view class="orderForm-wx" @click="getWxAddress">
|
|
|
<u-icon name="weixin-circle-fill" color="#3fc14d" size="40"></u-icon>
|
|
|
<view>获取微信地址</view>
|
|
|
<u-icon name="arrow-right" size="28"></u-icon>
|
|
|
|
|
|
</view>
|
|
|
<u-form-item label="收货人" prop="contact" label-position="left">
|
|
|
<u-input v-model="form.contact" placeholder="请填写收货人姓名" />
|
|
|
</u-form-item>
|
|
|
<u-form-item label="手机号码" prop="mobile" label-position="left">
|
|
|
<u-input type="number" :maxlength="11" v-model="form.mobile" placeholder="请填写手机号码" />
|
|
|
</u-form-item>
|
|
|
<u-form-item label="备用号码" prop="mobile2" label-position="left">
|
|
|
<u-input v-model="form.mobile2" type="number" :maxlength="11" placeholder="请填写备用号码" />
|
|
|
</u-form-item>
|
|
|
<u-form-item label="所在地区" prop="area" label-position="left">
|
|
|
<u-input type="select" v-model="form.area" placeholder="请选择所在地区" @click="openArea" />
|
|
|
</u-form-item>
|
|
|
<u-form-item label="详细地址" prop="address" label-position="left">
|
|
|
<u-input v-model="form.address" placeholder="请填写详细地址" />
|
|
|
<view slot="right" class="arearight" @click="changeLocation">
|
|
|
<u-icon name="map"></u-icon>
|
|
|
定位
|
|
|
</view>
|
|
|
</u-form-item>
|
|
|
<u-form-item label="设置默认地址" :border-bottom="false" prop="defalut" label-position="left">
|
|
|
<u-switch slot="right" v-model="form.defalut" active-color="#ba8b45" inactive-color="#adadac"
|
|
|
size="40"></u-switch>
|
|
|
</u-form-item>
|
|
|
<u-form-item label="备注" prop="remark" label-position="top">
|
|
|
<u-input type="textarea" v-model="form.remark" placeholder="请填写备注" />
|
|
|
</u-form-item>
|
|
|
</view>
|
|
|
<view class="orderForm-wrap">
|
|
|
<u-form-item label="是否本人收货" prop="myself" label-position="left">
|
|
|
<u-input v-model="myself" placeholder="选填" @click="showIsMySelf = true" type="select" />
|
|
|
</u-form-item>
|
|
|
<u-form-item label="购卡人姓名" prop="buy_name" label-position="left">
|
|
|
<u-input v-model="form.buy_name" placeholder="选填" />
|
|
|
</u-form-item>
|
|
|
<u-form-item label="购卡人电话" :border-bottom="false" prop="buy_mobile" label-position="left">
|
|
|
<u-input v-model="form.buy_mobile" type="number" :maxlength="11" placeholder="选填" />
|
|
|
</u-form-item>
|
|
|
</view>
|
|
|
|
|
|
</u-form>
|
|
|
<view class="orderForm-btn">
|
|
|
<view @click="openShowInfo">{{type=='edit'?'点击修改':'点击提货'}}</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
<aui-picker ref="pickers" :title="'地区选择'" :data="listArea" @callback="changeArea"></aui-picker>
|
|
|
|
|
|
|
|
|
<u-select @confirm="changeIsMySelf" v-model="showIsMySelf" :list="listIsMySelf"></u-select>
|
|
|
|
|
|
<!-- 免责协议 -->
|
|
|
<view class="agreeinfo" v-if="showagree">
|
|
|
<view class="agreeinfo-wrap">
|
|
|
<view class="agreeinfo-title">温馨提示</view>
|
|
|
<view class="agreeinfo-content">
|
|
|
<view v-html="tips"></view>
|
|
|
</view>
|
|
|
<view class="agreeinfo-btn">
|
|
|
<view @click="closeAgree" :class="isAgree?'canAgree':''">我已阅读并知晓<text
|
|
|
v-if="isAgreeTime>0">({{isAgreeTime}})</text></view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
<!-- 确认信息 -->
|
|
|
<view class="ordercontainer" v-if="showinfo">
|
|
|
<view class="confirmbox">
|
|
|
<view class="confirmpicinfo">
|
|
|
<view class="imgbox">
|
|
|
<block v-if="cardInfo.sku">
|
|
|
<image
|
|
|
:style="cardInfo.sku.image_url?'width:200rpx;height:120rpx':'width:150rpx;height:150rpx'"
|
|
|
:src="cardInfo.sku.image_url?cardInfo.sku.image_url:require('@/static/logo-xietaitai.png')">
|
|
|
</image>
|
|
|
</block>
|
|
|
<block v-else>
|
|
|
<image :style="'width:150rpx;height:150rpx'" :src="require('@/static/logo-xietaitai.png')">
|
|
|
</image>
|
|
|
</block>
|
|
|
|
|
|
</view>
|
|
|
<view class="pictitle">{{cardInfo.sku?cardInfo.sku.name:''}}</view>
|
|
|
<text>{{cardInfo.sku?cardInfo.sku.specs:''}}</text>
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class="confirmlist index0">
|
|
|
<view class="iconimg">
|
|
|
<image src="../../static/icon1.png" mode="widthFix"></image>
|
|
|
</view>
|
|
|
<view class="confirmright">
|
|
|
<text class="confirmmarker">发货时间</text>
|
|
|
<view class="flex-li confirmdate">
|
|
|
<text>{{form.ymd}}
|
|
|
<text class="smallfont" style="color:#b62828">[{{form.week}}]</text>
|
|
|
</text>
|
|
|
<text class="smallfont">{{form.lunarData}}</text>
|
|
|
</view>
|
|
|
<view class="flex-li confirmdate">
|
|
|
<!-- <text>{{form.hh}}</text> -->
|
|
|
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class="confirmlist index1">
|
|
|
<view class="iconimg">
|
|
|
<image src="../../static/icon2.png" mode="widthFix"></image>
|
|
|
</view>
|
|
|
<view class="confirmright">
|
|
|
<text class="confirmmarker">收货地址</text>
|
|
|
<view class="flex-li confirmaddress">
|
|
|
<text>{{form.area}}{{form.address}}</text>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class="confirmlist index2">
|
|
|
<view class="iconimg">
|
|
|
<image src="../../static/icon3.png" mode="widthFix"></image>
|
|
|
</view>
|
|
|
<view class="confirmright">
|
|
|
<text class="confirmmarker">收货人</text>
|
|
|
<view class="flex-li confirmcontact">
|
|
|
<text>{{form.contact}}</text>
|
|
|
<text>{{form.mobile}}</text>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class="confirmbtn">
|
|
|
<text class="edit" @click="backShow">返回修改</text>
|
|
|
<text class="confirmtab" @click="submit">{{type=='edit'?'确认修改':'确认提货'}}</text>
|
|
|
</view>
|
|
|
</view>
|
|
|
|
|
|
<!-- 选择地址 -->
|
|
|
<view class="addressinfo" v-if="showAddress">
|
|
|
<u-popup v-model="showAddress" mode="bottom">
|
|
|
<view class="content">
|
|
|
<view class="content-title">
|
|
|
选择地址
|
|
|
</view>
|
|
|
<view class="content-wrap">
|
|
|
<u-radio-group v-model="addressInfo" @change="changeAddress">
|
|
|
<u-radio v-for="(item, index) in listAddress" :key="index" :name="item.id">
|
|
|
<view class="content-contact">{{item.contact}} {{item.mobile}}</view>
|
|
|
<view class="content-address">{{item.area}}{{item.address}}</view>
|
|
|
</u-radio>
|
|
|
</u-radio-group>
|
|
|
</view>
|
|
|
</view>
|
|
|
</u-popup>
|
|
|
</view>
|
|
|
</view>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
import {
|
|
|
toast,
|
|
|
isMobile,
|
|
|
isNull,
|
|
|
parseAddress
|
|
|
} from '@/common/util.js'
|
|
|
import solarLunar from '@/node_modules/solarlunar';
|
|
|
import auiPicker from '@/components/aui-picker.vue';
|
|
|
import datePicker from '@/components/date-picker/date-picker.vue'
|
|
|
export default {
|
|
|
components: {
|
|
|
auiPicker,
|
|
|
datePicker
|
|
|
},
|
|
|
data() {
|
|
|
return {
|
|
|
showinfo: false,
|
|
|
showagree: false,
|
|
|
isAgree: false,
|
|
|
isAgreeTime: 10,
|
|
|
agreeTimer: null,
|
|
|
showAddress: false,
|
|
|
listAddress: [],
|
|
|
addressInfo: '',
|
|
|
cardInfo: {},
|
|
|
tips: '',
|
|
|
type: '',
|
|
|
form: {
|
|
|
card_number: '',
|
|
|
password: '',
|
|
|
|
|
|
send_date: '',
|
|
|
ymd: '',
|
|
|
lunarData: '',
|
|
|
// express: '',
|
|
|
// hh: '',
|
|
|
week: '',
|
|
|
|
|
|
area: '',
|
|
|
address: '',
|
|
|
province_id: '',
|
|
|
city_id: '',
|
|
|
district_id: '',
|
|
|
contact: '',
|
|
|
mobile: '',
|
|
|
mobile2: '',
|
|
|
defalut: false,
|
|
|
myself: 1,
|
|
|
buy_name: '',
|
|
|
buy_mobile: ''
|
|
|
},
|
|
|
// listExpress: [{
|
|
|
// id: 0,
|
|
|
// value: '顺丰快递'
|
|
|
// }, {
|
|
|
// id: 1,
|
|
|
// value: '中通快递'
|
|
|
// }],
|
|
|
listDates: [],
|
|
|
date: '',
|
|
|
listArea: [],
|
|
|
showArea: false,
|
|
|
showIsMySelf: false,
|
|
|
myself: '是',
|
|
|
listIsMySelf: [{
|
|
|
value: 1,
|
|
|
label: '是'
|
|
|
}, {
|
|
|
value: 0,
|
|
|
label: '否'
|
|
|
}],
|
|
|
rules: {
|
|
|
send_date: [{
|
|
|
required: true,
|
|
|
message: '请选择发货时间',
|
|
|
trigger: ['change', 'blur'],
|
|
|
}],
|
|
|
area: [{
|
|
|
required: true,
|
|
|
message: '请选择所在地区',
|
|
|
trigger: ['change', 'blur'],
|
|
|
}],
|
|
|
address: [{
|
|
|
required: true,
|
|
|
message: '请填写详细地址',
|
|
|
trigger: ['blur'],
|
|
|
}],
|
|
|
contact: [{
|
|
|
required: true,
|
|
|
message: '请填写收货人姓名',
|
|
|
trigger: ['blur'],
|
|
|
}],
|
|
|
mobile: [{
|
|
|
required: true,
|
|
|
message: '请填写收货人电话',
|
|
|
trigger: ['blur'],
|
|
|
}, {
|
|
|
validator: (rule, value, callback) => {
|
|
|
return this.$u.test.mobile(value);
|
|
|
},
|
|
|
message: '手机号码不正确',
|
|
|
trigger: ['blur'],
|
|
|
}]
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
onReady() {
|
|
|
this.$refs.uForm.setRules(this.rules);
|
|
|
|
|
|
},
|
|
|
onUnload() {
|
|
|
if (this.agreeTimer) {
|
|
|
clearInterval(this.agreeTimer)
|
|
|
this.agreeTimer = null
|
|
|
}
|
|
|
},
|
|
|
onLoad(option) {
|
|
|
let that = this
|
|
|
if (option.hasCard) {
|
|
|
if (option.type == 'edit') {
|
|
|
this.type = 'edit'
|
|
|
this.form = uni.getStorageSync("vuex_update_card") ? uni.getStorageSync("vuex_update_card") : {},
|
|
|
this.cardInfo = uni.getStorageSync("vuex_update_card") ? uni.getStorageSync("vuex_update_card") :
|
|
|
{},
|
|
|
this.form.ymd = this.momentDay(this.form.send_date).ymd
|
|
|
uni.removeStorageSync("vuex_update_card")
|
|
|
uni.setNavigationBarTitle({
|
|
|
title: '修改订单',
|
|
|
success: function() {
|
|
|
console.log('标题设置成功');
|
|
|
that.showinfo = false
|
|
|
},
|
|
|
fail: function(err) {
|
|
|
console.error('标题设置失败', err);
|
|
|
}
|
|
|
});
|
|
|
// uni.removeStorageSync("vuex_update_card")
|
|
|
} else {
|
|
|
this.cardInfo = uni.getStorageSync("vuex_card") ? uni.getStorageSync("vuex_card").card : {}
|
|
|
this.form.card_number = uni.getStorageSync("vuex_card") ? uni.getStorageSync("vuex_card").card_number :
|
|
|
''
|
|
|
this.form.password = uni.getStorageSync("vuex_card") ? uni.getStorageSync("vuex_card").password : ''
|
|
|
// uni.removeStorageSync("vuex_card")
|
|
|
}
|
|
|
|
|
|
this.getAddress()
|
|
|
this.getDates()
|
|
|
// this.getExpress()
|
|
|
this.getArea()
|
|
|
} else {
|
|
|
toast("未查询到卡券信息")
|
|
|
uni.removeStorageSync("vuex_card")
|
|
|
// uni.redirectTo({
|
|
|
// url: '/packages/change/change'
|
|
|
// })
|
|
|
}
|
|
|
},
|
|
|
methods: {
|
|
|
async getAddress() {
|
|
|
const res = await this.$u.api.getUserAddress()
|
|
|
this.listAddress = res.address
|
|
|
console.log("this.type", this.type)
|
|
|
if (!(this.type == 'edit')) {
|
|
|
this.showAddress = this.listAddress.length > 0 ? true : false
|
|
|
}
|
|
|
console.log("this.type", this.type, this.showAddress)
|
|
|
},
|
|
|
getWxAddress(e) {
|
|
|
let _this = this
|
|
|
uni.authorize({
|
|
|
scope: 'scope.address',
|
|
|
success: (res) => {
|
|
|
console.log("authorize", res)
|
|
|
uni.chooseAddress({
|
|
|
success(res) {
|
|
|
console.log(res)
|
|
|
_this.form.contact = res.userName
|
|
|
_this.form.mobile = res.telNumber
|
|
|
_this.form.area = res.provinceName + res.cityName + res.countyName
|
|
|
_this.form.address = res.detailInfo
|
|
|
_this.$u.api.matchRegion({
|
|
|
province: res.provinceName,
|
|
|
city: res.cityName,
|
|
|
district: res.countyName
|
|
|
}).then(res1 => {
|
|
|
_this.form.province_id = res1.province_id ? res1
|
|
|
.province_id.id : ''
|
|
|
_this.form.city_id = res1.city_id ? res1.city_id.id : ''
|
|
|
_this.form.district_id = res1.district_id ? res1
|
|
|
.district_id.id : ''
|
|
|
if (isNull(_this.form.province_id) || isNull(_this.form
|
|
|
.city_id) ||
|
|
|
isNull(_this.form.district_id)) {
|
|
|
uni.showToast({
|
|
|
title: '未能匹配到所在地区，请手动选择',
|
|
|
icon: 'none'
|
|
|
})
|
|
|
_this.form.area = ""
|
|
|
_this.form.province_id = ''
|
|
|
_this.form.city_id = ''
|
|
|
_this.form.district_id = ''
|
|
|
}
|
|
|
})
|
|
|
console.log("_this", _this.form)
|
|
|
},
|
|
|
fail(res) {
|
|
|
console.log(res)
|
|
|
}
|
|
|
})
|
|
|
},
|
|
|
fail(res) {
|
|
|
console.log("authorize-fail", res)
|
|
|
}
|
|
|
})
|
|
|
|
|
|
},
|
|
|
// async getExpress() {
|
|
|
// const res = await this.$u.api.getExpress()
|
|
|
// this.listExpress = res
|
|
|
// },
|
|
|
changeAddress(e) {
|
|
|
if (e) {
|
|
|
this.listAddress.map(item => {
|
|
|
if (item.id == e) {
|
|
|
this.form.address_id = item.id
|
|
|
this.form.area = item.area
|
|
|
this.form.address = item.address
|
|
|
this.form.province_id = item.province_id
|
|
|
this.form.city_id = item.city_id
|
|
|
this.form.district_id = item.district_id
|
|
|
this.form.contact = item.contact
|
|
|
this.form.mobile = item.mobile
|
|
|
this.showAddress = false
|
|
|
}
|
|
|
})
|
|
|
}
|
|
|
},
|
|
|
|
|
|
async getDates() {
|
|
|
await this.$u.api.getDates({
|
|
|
card_number: this.form.card_number
|
|
|
}).then(res => {
|
|
|
let data = res.card
|
|
|
if (data.open_dates && data.open_dates.length === 0) {
|
|
|
toast("当前无可提货时间")
|
|
|
return
|
|
|
}
|
|
|
if (data.open_dates) {
|
|
|
|
|
|
for (var k in data.open_dates) {
|
|
|
// 去除 没有可提货数量的
|
|
|
if (data.open_dates[k]['quantity'] - data.open_dates[k]['booked'] > 0) {
|
|
|
// 修改的只可以 选择两天之后的日期
|
|
|
if (this.type === 'edit') {
|
|
|
if (this.isAfterTwoDays(k)) {
|
|
|
let _k = this.momentDay(k)
|
|
|
this.listDates.push({
|
|
|
canUse: data.open_dates[k],
|
|
|
..._k
|
|
|
})
|
|
|
}
|
|
|
} else {
|
|
|
//正常提货 当天12点前可提当天，过12点 不可提当天
|
|
|
let _k = this.momentDay(k)
|
|
|
this.listDates.push({
|
|
|
canUse: data.open_dates[k],
|
|
|
..._k
|
|
|
})
|
|
|
// if(this.isBeforeNoon(k)){
|
|
|
|
|
|
// }
|
|
|
}
|
|
|
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
// 温馨提示
|
|
|
let product = res.product
|
|
|
if (!isNull(res.product.tip)) {
|
|
|
this.tips = res.product.tip
|
|
|
} else {
|
|
|
const configs = uni.getStorageSync("configs")
|
|
|
configs.map(item => {
|
|
|
if (item.key === 'tips') {
|
|
|
this.tips = item.value
|
|
|
}
|
|
|
})
|
|
|
}
|
|
|
|
|
|
}).then(res => {
|
|
|
|
|
|
})
|
|
|
},
|
|
|
// 是否是 两天之后的日期
|
|
|
isAfterTwoDays(open_dates) {
|
|
|
const dateToCheck = this.$moment(open_dates, 'YYYY-MM-DD');
|
|
|
const today = this.$moment();
|
|
|
const twoDaysAfterToday = today.add(2, 'days');
|
|
|
|
|
|
return dateToCheck >= twoDaysAfterToday;
|
|
|
},
|
|
|
// 判断 是否大于等于今天 等于今天是否在12点之前
|
|
|
isBeforeNoon(a) {
|
|
|
// 将给定的日期转换为Moment对象
|
|
|
console.log("a", a)
|
|
|
const dateA = this.$moment(a, 'YYYY-MM-DD');
|
|
|
|
|
|
// 获取今天的日期
|
|
|
const today = this.$moment();
|
|
|
if (dateA.isAfter(today)) {
|
|
|
return true
|
|
|
}
|
|
|
// 判断给定的日期是否为今天
|
|
|
if (dateA.isSame(today, 'day')) {
|
|
|
// 获取当前的时间
|
|
|
const now = this.$moment();
|
|
|
// 检查当前时间是否小于12点
|
|
|
if (now.hour() < 12) {
|
|
|
return true; // 当前时间小于12点
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return false; // 不满足条件
|
|
|
},
|
|
|
|
|
|
momentDay(date) {
|
|
|
if (date) {
|
|
|
const weeks = ["周日", '周一', '周二', '周三', '周四', '周五', '周六', ]
|
|
|
let dateArr = date.split("-")
|
|
|
let ymd = this.$moment(date).format("M月DD日")
|
|
|
let week = weeks[this.$moment(date).day()]
|
|
|
const solar2lunarData = solarLunar.solar2lunar(dateArr[0], dateArr[1], dateArr[2]);
|
|
|
|
|
|
return {
|
|
|
date: date,
|
|
|
ymd: ymd,
|
|
|
week: week,
|
|
|
lunarData: `农历${solar2lunarData.monthCn}${solar2lunarData.dayCn}`,
|
|
|
}
|
|
|
}
|
|
|
|
|
|
},
|
|
|
backDate(e) {
|
|
|
if (e) {
|
|
|
this.form.send_date = e.date
|
|
|
this.form.ymd = e.ymd
|
|
|
// this.form.express = e.expressname
|
|
|
// this.form.express_type_id = e.expressid
|
|
|
// this.form.hh = e.hhtime
|
|
|
this.form.week = e.week
|
|
|
this.form.lunarData = e.lunarData
|
|
|
}
|
|
|
},
|
|
|
openDatePicker() {
|
|
|
this.$refs.datePickers.show = true
|
|
|
},
|
|
|
async getArea() {
|
|
|
const res = await this.$u.api.getRegion()
|
|
|
this.listArea = res.regions
|
|
|
},
|
|
|
openArea() {
|
|
|
uni.hideKeyboard()
|
|
|
this.$refs.pickers.open().then(function() {
|
|
|
console.log('picker打开');
|
|
|
});
|
|
|
},
|
|
|
changeArea(e) {
|
|
|
// return
|
|
|
if (e) {
|
|
|
console.log("e", e)
|
|
|
let data = e.data
|
|
|
let _this = this
|
|
|
_this.form.area = ''
|
|
|
data.forEach(function(item, index) {
|
|
|
_this.form.area += item.value + ' ';
|
|
|
});
|
|
|
this.form.province_id = data[0] ? data[0].id : ''
|
|
|
this.form.city_id = data[1] ? data[1].id : ''
|
|
|
this.form.district_id = data[2] ? data[2].id : ''
|
|
|
}
|
|
|
},
|
|
|
changeIsMySelf(e) {
|
|
|
if (e) {
|
|
|
this.myself = e[0].label
|
|
|
this.form.myself = e[0].value
|
|
|
}
|
|
|
},
|
|
|
changeLocation() {
|
|
|
let _this = this
|
|
|
uni.authorize({
|
|
|
scope: 'scope.userLocation',
|
|
|
success: (res) => {
|
|
|
console.log("authorize", res)
|
|
|
uni.chooseLocation({
|
|
|
success(res) {
|
|
|
console.log("res", res)
|
|
|
// _this.form.area = res.address
|
|
|
_this.form.address = res.name
|
|
|
// 根据地址匹配 省市区
|
|
|
let pca = parseAddress(res.address)
|
|
|
console.log("pca",pca)
|
|
|
if (pca.length > 0) {
|
|
|
_this.form.area = pca.join('')
|
|
|
_this.$u.api.matchRegion({
|
|
|
province: pca[0],
|
|
|
city: pca[1],
|
|
|
district: pca[2]
|
|
|
}).then(res => {
|
|
|
_this.form.province_id = res.province_id ? res
|
|
|
.province_id.id : ''
|
|
|
_this.form.city_id = res.city_id ? res.city_id.id : ''
|
|
|
_this.form.district_id = res.district_id ? res
|
|
|
.district_id.id : ''
|
|
|
if (isNull(_this.form.province_id) || isNull(_this.form
|
|
|
.city_id) ||
|
|
|
isNull(_this.form.district_id)) {
|
|
|
uni.showToast({
|
|
|
title: '未能匹配到所在省市区，请手动选择',
|
|
|
icon: 'none'
|
|
|
})
|
|
|
_this.form.area = ""
|
|
|
_this.form.province_id = ''
|
|
|
_this.form.city_id = ''
|
|
|
_this.form.district_id = ''
|
|
|
}
|
|
|
})
|
|
|
} else {
|
|
|
uni.showToast({
|
|
|
title: '未能匹配到所在省市区，请手动选择',
|
|
|
icon: 'none'
|
|
|
})
|
|
|
_this.form.area = ""
|
|
|
_this.form.province_id = ''
|
|
|
_this.form.city_id = ''
|
|
|
_this.form.district_id = ''
|
|
|
|
|
|
}
|
|
|
},
|
|
|
fail(res) {
|
|
|
console.log("fail", res)
|
|
|
|
|
|
}
|
|
|
})
|
|
|
},
|
|
|
fail(res) {
|
|
|
console.log("authorize-fail", res)
|
|
|
}
|
|
|
})
|
|
|
},
|
|
|
backShow() {
|
|
|
let that = this
|
|
|
that.showinfo = false
|
|
|
},
|
|
|
saveDefalutAddress() {
|
|
|
if (this.form.defalut) {
|
|
|
this.$u.api.saveUserAddress({
|
|
|
id: this.form.address_id ? this.form.address_id : '',
|
|
|
area: this.form.area,
|
|
|
address: this.form.address,
|
|
|
contact: this.form.contact,
|
|
|
mobile: this.form.mobile,
|
|
|
province_id: this.form.province_id,
|
|
|
city_id: this.form.city_id,
|
|
|
district_id: this.form.district_id,
|
|
|
defalut: 1
|
|
|
}).then(res => {
|
|
|
if (this.type == 'edit') {
|
|
|
uni.redirectTo({
|
|
|
url: '/packages/myorder/myorder'
|
|
|
})
|
|
|
} else {
|
|
|
uni.redirectTo({
|
|
|
url: '/packages/product/public'
|
|
|
})
|
|
|
}
|
|
|
|
|
|
}).then(res => {
|
|
|
if (this.type == 'edit') {
|
|
|
uni.redirectTo({
|
|
|
url: '/packages/myorder/myorder'
|
|
|
})
|
|
|
} else {
|
|
|
uni.redirectTo({
|
|
|
url: '/packages/product/public'
|
|
|
})
|
|
|
}
|
|
|
})
|
|
|
} else {
|
|
|
if (this.type == 'edit') {
|
|
|
uni.redirectTo({
|
|
|
url: '/packages/myorder/myorder'
|
|
|
})
|
|
|
} else {
|
|
|
uni.redirectTo({
|
|
|
url: '/packages/product/public'
|
|
|
})
|
|
|
}
|
|
|
}
|
|
|
|
|
|
},
|
|
|
openShowInfo() {
|
|
|
let that = this
|
|
|
if (!isNull(this.form.mobile2) && this.form.mobile2.length > 0) {
|
|
|
if (!isMobile(this.form.mobile2)) {
|
|
|
toast('备用电话不正确')
|
|
|
return
|
|
|
}
|
|
|
}
|
|
|
if (!isNull(this.form.buy_mobile) && this.form.buy_mobile.length > 0) {
|
|
|
if (!isMobile(this.form.buy_mobile)) {
|
|
|
toast('购买人电话不正确')
|
|
|
return
|
|
|
}
|
|
|
}
|
|
|
this.$refs.uForm.validate(valid => {
|
|
|
// console.log('验证通过');
|
|
|
if (valid) {
|
|
|
if (!this.showinfo) {
|
|
|
uni.setNavigationBarTitle({
|
|
|
title: '信息确认',
|
|
|
success: function() {
|
|
|
console.log('标题设置成功');
|
|
|
that.showinfo = true
|
|
|
},
|
|
|
fail: function(err) {
|
|
|
console.error('标题设置失败', err);
|
|
|
}
|
|
|
});
|
|
|
}
|
|
|
} else {
|
|
|
console.log('验证失败');
|
|
|
// toast('请填写完整信息')
|
|
|
}
|
|
|
});
|
|
|
},
|
|
|
closeAgree() {
|
|
|
if (this.isAgreeTime > 0) {
|
|
|
return
|
|
|
} else {
|
|
|
this.isAgree = true
|
|
|
this.showagree = false
|
|
|
}
|
|
|
},
|
|
|
reduceAgreeTime() {
|
|
|
let that = this
|
|
|
if (that.isAgreeTime > 0) {
|
|
|
this.agreeTimer = setInterval(function() {
|
|
|
that.isAgreeTime--
|
|
|
if (that.isAgreeTime === 0) {
|
|
|
that.isAgree = true
|
|
|
that.isAgreeTime = 0
|
|
|
clearInterval(that.agreeTimer)
|
|
|
that.agreeTimer = null
|
|
|
}
|
|
|
}, 1000)
|
|
|
}
|
|
|
|
|
|
},
|
|
|
submit() {
|
|
|
let that = this
|
|
|
if (!this.isAgree) {
|
|
|
this.showagree = true
|
|
|
this.isAgreeTime = 10
|
|
|
this.reduceAgreeTime()
|
|
|
} else {
|
|
|
if (this.isAgree) {
|
|
|
this.form.show = 0
|
|
|
if (this.type == 'edit') {
|
|
|
console.log("this.form", this.form)
|
|
|
this.$u.api.saveUserOrder(this.form).then(res => {
|
|
|
uni.removeStorageSync('vuex_update_card')
|
|
|
toast(res.msg, 1000, function() {
|
|
|
setTimeout(function() {
|
|
|
that.saveDefalutAddress()
|
|
|
}, 500)
|
|
|
|
|
|
})
|
|
|
|
|
|
}).then(res => {
|
|
|
console.log('res1', res)
|
|
|
|
|
|
})
|
|
|
} else {
|
|
|
console.log("this.form", this.form)
|
|
|
// return
|
|
|
this.$u.api.addUserOrder(this.form).then(res => {
|
|
|
console.log("res", res)
|
|
|
uni.removeStorageSync('vuex_card')
|
|
|
toast(res.msg, 1000, function() {
|
|
|
setTimeout(function() {
|
|
|
that.saveDefalutAddress()
|
|
|
}, 500)
|
|
|
|
|
|
})
|
|
|
|
|
|
}).then(res => {
|
|
|
console.log('res1', res)
|
|
|
|
|
|
})
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
}
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss">
|
|
|
.cotainer {
|
|
|
padding: 30rpx;
|
|
|
background-color: #f0efed;
|
|
|
padding-bottom: 200rpx;
|
|
|
|
|
|
.addressinfo {
|
|
|
position: fixed;
|
|
|
top: 0;
|
|
|
right: 0;
|
|
|
bottom: 0;
|
|
|
left: 0;
|
|
|
background: rgba(0, 0, 0, .5);
|
|
|
z-index: 9999999;
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
justify-content: center;
|
|
|
|
|
|
.content {
|
|
|
width: 100%;
|
|
|
height: 800rpx;
|
|
|
// overflow: scroll;
|
|
|
position: relative;
|
|
|
|
|
|
&-wrap {
|
|
|
box-sizing: border-box;
|
|
|
background: #fff;
|
|
|
border-radius: 20rpx;
|
|
|
overflow: scroll;
|
|
|
width: 100%;
|
|
|
height: 650rpx;
|
|
|
padding: 40rpx;
|
|
|
padding-top: 0;
|
|
|
}
|
|
|
|
|
|
&-title {
|
|
|
text-align: center;
|
|
|
padding: 30rpx;
|
|
|
font-size: 32rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
.u-radio {
|
|
|
align-items: baseline;
|
|
|
margin-bottom: 20rpx;
|
|
|
}
|
|
|
|
|
|
&-contact {}
|
|
|
|
|
|
&-address {
|
|
|
color: #ccc;
|
|
|
line-height: 1.2;
|
|
|
font-size: 28rpx;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
|
|
|
.orderInfo {
|
|
|
padding: 40rpx 24rpx;
|
|
|
border-radius: 10rpx;
|
|
|
background-color: #fff;
|
|
|
font-size: 24rpx;
|
|
|
color: #000;
|
|
|
|
|
|
&-title {
|
|
|
|
|
|
>view {
|
|
|
font-size: 24rpx;
|
|
|
font-weight: bolder;
|
|
|
margin-bottom: 20rpx;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
&-info {
|
|
|
display: flex;
|
|
|
|
|
|
font-weight: normal;
|
|
|
margin-bottom: 40rpx;
|
|
|
|
|
|
image {
|
|
|
width: 200rpx;
|
|
|
height: 120rpx;
|
|
|
border: 1px solid #ba8b45;
|
|
|
border-radius: 10rpx;
|
|
|
margin-right: 20rpx;
|
|
|
}
|
|
|
|
|
|
>view {
|
|
|
&:last-child {
|
|
|
width: calc(100% - 170rpx);
|
|
|
|
|
|
>view {
|
|
|
display: flex;
|
|
|
justify-content: space-between;
|
|
|
margin-bottom: 20rpx;
|
|
|
|
|
|
.status {
|
|
|
background-color: #ba8b45;
|
|
|
color: #fff;
|
|
|
padding: 5rpx 20rpx;
|
|
|
border-radius: 10rpx;
|
|
|
}
|
|
|
|
|
|
}
|
|
|
}
|
|
|
|
|
|
}
|
|
|
}
|
|
|
|
|
|
&-status {
|
|
|
display: flex;
|
|
|
flex-wrap: wrap;
|
|
|
justify-content: space-between;
|
|
|
|
|
|
.u-form-item {
|
|
|
padding: 0;
|
|
|
|
|
|
.u-form-item__body {
|
|
|
align-items: baseline;
|
|
|
|
|
|
.u-form-item--left {
|
|
|
width: 0 !important;
|
|
|
flex: 0 !important;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
.hh {
|
|
|
&:last-child {
|
|
|
text-align: right;
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
justify-content: flex-end;
|
|
|
|
|
|
>view {
|
|
|
&:first-child {
|
|
|
view {
|
|
|
height: 50rpx;
|
|
|
line-height: 50rpx;
|
|
|
|
|
|
&:last-child {
|
|
|
margin-bottom: 0rpx
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
&:last-child {
|
|
|
margin-left: 20rpx
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
.orderForm {
|
|
|
&-wx {
|
|
|
color: #000;
|
|
|
font-size: 28rpx;
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
|
|
|
>view {
|
|
|
margin: 0 20rpx;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
&-wrap {
|
|
|
padding: 40rpx 24rpx;
|
|
|
border-radius: 10rpx;
|
|
|
background-color: #fff;
|
|
|
font-size: 24rpx;
|
|
|
color: #000;
|
|
|
margin-top: 24rpx;
|
|
|
|
|
|
.u-form-item {
|
|
|
padding-bottom: 0
|
|
|
}
|
|
|
|
|
|
.arearight {
|
|
|
color: #000
|
|
|
}
|
|
|
}
|
|
|
|
|
|
&-address {
|
|
|
height: 72rpx;
|
|
|
display: flex;
|
|
|
justify-content: space-between;
|
|
|
align-items: center;
|
|
|
line-height: 72rpx;
|
|
|
padding-top: 20rpx;
|
|
|
position: relative;
|
|
|
|
|
|
text {
|
|
|
text {
|
|
|
position: absolute;
|
|
|
left: -16rpx;
|
|
|
vertical-align: middle;
|
|
|
color: #fa3534;
|
|
|
padding-top: 6rpx;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
&-btn {
|
|
|
background: #fff;
|
|
|
position: fixed;
|
|
|
bottom: 0;
|
|
|
left: 0;
|
|
|
width: 100%;
|
|
|
padding: 40rpx;
|
|
|
z-index: 9;
|
|
|
|
|
|
>view {
|
|
|
background-color: #ba8b45;
|
|
|
color: #fff;
|
|
|
border-radius: 40rpx;
|
|
|
width: 60%;
|
|
|
margin: 0 auto;
|
|
|
height: 75rpx;
|
|
|
text-align: center;
|
|
|
line-height: 75rpx;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
.ordercontainer {
|
|
|
background: #f0efed;
|
|
|
width: 100%;
|
|
|
height: 100vh;
|
|
|
padding: 42rpx 50rpx 300rpx;
|
|
|
overflow-y: scroll;
|
|
|
position: fixed;
|
|
|
top: 0;
|
|
|
right: 0;
|
|
|
bottom: 0;
|
|
|
left: 0;
|
|
|
z-index: 99;
|
|
|
}
|
|
|
|
|
|
.confirmbox {
|
|
|
width: 100%;
|
|
|
padding-top: 22rpx;
|
|
|
padding-bottom: 35rpx;
|
|
|
background: url(../../static/confirmbg1.jpg) no-repeat center top;
|
|
|
background-size: cover;
|
|
|
border-radius: 10rpx;
|
|
|
box-shadow: 0 5rpx 15rpx rgba(0, 0, 0, .47);
|
|
|
|
|
|
}
|
|
|
|
|
|
.confirmpicinfo {
|
|
|
text-align: center;
|
|
|
font-size: 24rpx;
|
|
|
color: #d5c7b5;
|
|
|
line-height: 42rpx;
|
|
|
}
|
|
|
|
|
|
.imgbox {
|
|
|
width: 200rpx;
|
|
|
// height: 120rpx;
|
|
|
margin: 0 auto;
|
|
|
// border-radius: 10rpx;
|
|
|
// border: 1px solid #ba8b45;
|
|
|
// overflow: hidden;
|
|
|
margin-bottom: 14rpx;
|
|
|
}
|
|
|
|
|
|
.imgbox image {
|
|
|
width: 200rpx;
|
|
|
height: 120rpx;
|
|
|
vertical-align: middle;
|
|
|
border-radius: 10rpx;
|
|
|
border: 1px solid #ba8b45;
|
|
|
}
|
|
|
|
|
|
.confirmpicinfo .pictitle {
|
|
|
color: #ba8b45;
|
|
|
}
|
|
|
|
|
|
.confirmlist {
|
|
|
margin-top: 30rpx;
|
|
|
border-radius: 10rpx;
|
|
|
overflow: hidden;
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
justify-content: space-between;
|
|
|
background-repeat: no-repeat;
|
|
|
background-position: center top;
|
|
|
background-size: cover;
|
|
|
box-shadow: 0 5rpx 15rpx rgba(0, 0, 0, .47);
|
|
|
padding: 10rpx 10rpx 10rpx 20rpx;
|
|
|
}
|
|
|
|
|
|
.confirmlist.index0 {
|
|
|
background-image: url(../../static/confirmbg2.jpg);
|
|
|
}
|
|
|
|
|
|
.confirmlist.index1 {
|
|
|
background-image: url(../../static/confirmbg3.jpg);
|
|
|
}
|
|
|
|
|
|
.confirmlist.index2 {
|
|
|
background-image: url(../../static/confirmbg4.jpg);
|
|
|
}
|
|
|
|
|
|
.confirmlist image {
|
|
|
width: 62rpx;
|
|
|
height: auto;
|
|
|
}
|
|
|
|
|
|
.confirmlist .confirmright {
|
|
|
width: 550rpx;
|
|
|
background: #fff;
|
|
|
border-radius: 10rpx;
|
|
|
padding: 45rpx 20rpx 25rpx;
|
|
|
}
|
|
|
|
|
|
.confirmmarker {
|
|
|
display: block;
|
|
|
font-size: 32rpx;
|
|
|
color: #000;
|
|
|
font-weight: bold;
|
|
|
margin-bottom: 8rpx;
|
|
|
text-align: center;
|
|
|
}
|
|
|
|
|
|
.flex-li {
|
|
|
display: flex;
|
|
|
justify-content: space-between;
|
|
|
color: #000;
|
|
|
font-size: 30rpx;
|
|
|
line-height: 60rpx;
|
|
|
}
|
|
|
|
|
|
.confirmdate text.smallfont {
|
|
|
font-size: 24rpx;
|
|
|
}
|
|
|
|
|
|
.confirmbtn {
|
|
|
position: fixed;
|
|
|
bottom: 0;
|
|
|
left: 0;
|
|
|
width: 100%;
|
|
|
// height: 115rpx;
|
|
|
|
|
|
display: flex;
|
|
|
padding: 40rpx 0rpx;
|
|
|
justify-content: space-between;
|
|
|
background: #fff;
|
|
|
align-items: center;
|
|
|
}
|
|
|
|
|
|
.confirmbtn text {
|
|
|
display: inline-block;
|
|
|
width: 284rpx;
|
|
|
line-height: 74rpx;
|
|
|
height: 74rpx;
|
|
|
text-align: center;
|
|
|
border-radius: 74rpx;
|
|
|
border: 1rpx solid #d1d1d0;
|
|
|
margin: 0 38rpx;
|
|
|
font-size: 29rpx;
|
|
|
color: #000;
|
|
|
}
|
|
|
|
|
|
.confirmbtn text.confirmtab {
|
|
|
color: #fff;
|
|
|
border: 1rpx solid #ba8b45;
|
|
|
background: #ba8b45;
|
|
|
}
|
|
|
|
|
|
.agreeinfo {
|
|
|
position: fixed;
|
|
|
top: 0;
|
|
|
left: 0;
|
|
|
background: rgba(0, 0, 0, 0.7);
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
width: 100vw;
|
|
|
height: 100vh;
|
|
|
z-index: 999;
|
|
|
padding: 0 50rpx;
|
|
|
|
|
|
&-wrap {
|
|
|
background: #fff;
|
|
|
padding: 60rpx 40rpx;
|
|
|
border-radius: 20rpx;
|
|
|
}
|
|
|
|
|
|
&-title {
|
|
|
font-size: 32rpx;
|
|
|
margin-bottom: 30rpx;
|
|
|
color: #b62828;
|
|
|
text-align: center;
|
|
|
}
|
|
|
|
|
|
&-content {
|
|
|
line-height: 1.8;
|
|
|
font-size: 30rpx;
|
|
|
height: 300rpx;
|
|
|
overflow: scroll;
|
|
|
}
|
|
|
|
|
|
&-btn {
|
|
|
|
|
|
>view {
|
|
|
background-color: rgba(0, 0, 0, 0.5);
|
|
|
color: #fff;
|
|
|
border-radius: 40rpx;
|
|
|
width: 60%;
|
|
|
margin: 0 auto;
|
|
|
height: 75rpx;
|
|
|
text-align: center;
|
|
|
line-height: 75rpx;
|
|
|
margin: 20rpx auto;
|
|
|
}
|
|
|
|
|
|
.canAgree {
|
|
|
background-color: #ba8b45;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
</style> |
