first commit
This commit is contained in:
编码猿
363
金壶/appV1/pages/shoppingCart/sureOrder.vue
Normal file
363
金壶/appV1/pages/shoppingCart/sureOrder.vue
Normal file
@@ -0,0 +1,363 @@
|
||||
<template>
|
||||
<!-- 确认订单 页面 -->
|
||||
<view class="content">
|
||||
<HeaderTop page_title='确认订单'></HeaderTop>
|
||||
<view class="detail bg_F2F2F2">
|
||||
<view class="x-bg-white margin-bottom22">
|
||||
<!-- 传参地址 -->
|
||||
<view class="padding-30" v-if="option_address!==''">
|
||||
<view class="goods_info d-flex j-sb w-50">
|
||||
<view class="font_28">{{address.consignee}}</view>
|
||||
<view class="">{{address.tel}}</view>
|
||||
</view>
|
||||
<view class="goods_info d-flex j-sb a-center" @click="to_addAdress()">
|
||||
<view class="font_28 w-90">
|
||||
{{address.address}}</view>
|
||||
<image src="../../static/shoppingCart/right.png" mode="" class="p_right"></image>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 接口地址 -->
|
||||
<view class="padding-30" v-if="address!='' && option_address==''">
|
||||
<view class="goods_info d-flex j-sb w-50">
|
||||
<view class="font_28">{{address.consignee}}</view>
|
||||
<view class="">{{address.tel}}</view>
|
||||
</view>
|
||||
<view class="goods_info d-flex j-sb a-center" @click="to_addAdress()">
|
||||
<view class="font_28 w-90">
|
||||
{{address.address}}</view>
|
||||
<image src="../../static/shoppingCart/right.png" mode="" class="p_right"></image>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 没有地址 -->
|
||||
<view class="padding-30" v-if="(address.address=='' || address.address==null) && option_address==''">
|
||||
<view class="goods_info d-flex j-sb a-center" @click="to_addAdress()">
|
||||
<view class="font_28 w-90">
|
||||
暂无地址</view>
|
||||
<image src="../../static/shoppingCart/right.png" mode="" class="p_right"></image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="list x-bg-white margin-bottom22 padding-sx30">
|
||||
<view class="list_items" v-if='goods_list' v-for="(item,index) in goods_list" :key="item.index">
|
||||
<view class=" d-flex a-center">
|
||||
<view class="d-flex goods_items a-center w-100">
|
||||
<view class="shixiao" v-if='item.is_buy==0'>失效</view>
|
||||
<view class="box_img">
|
||||
<image :src="item.app_thumb" mode="" class="h-100 w-100"></image>
|
||||
|
||||
</view>
|
||||
<view class="goods_txt flex-1 padding-zy30">
|
||||
<view class="font-weight">{{item.goods_name}}</view>
|
||||
<view class="">{{item.manufacturer_name}}</view>
|
||||
<view class="">{{item.spec_desc}} {{item.unit}}</view>
|
||||
<view class="d-flex j-sb">
|
||||
<view class="x-text-159">￥ {{item.unit_price}}</view>
|
||||
<view class="">X {{item.goods_number}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="list_items" v-for="(item,index) in extend" :key="item.index">
|
||||
<view class=" d-flex a-center">
|
||||
<view class="d-flex goods_items a-center w-100">
|
||||
<view class="shixiao" v-if='item.is_buy==0'>失效</view>
|
||||
<view class="box_img">
|
||||
<image :src="item.app_thumb" mode="" class="h-100 w-100"></image>
|
||||
|
||||
</view>
|
||||
<view class="goods_txt flex-1 padding-zy30">
|
||||
<view class="font-weight">{{item.goods_name}}</view>
|
||||
<view class="">{{item.manufacturer_name}}</view>
|
||||
<view class="">{{item.spec_desc}} {{item.unit}}</view>
|
||||
<view class="d-flex j-sb">
|
||||
<view class="x-text-159">￥ {{item.unit_price}}</view>
|
||||
<view class="">X {{item.goods_number}}</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="bg-white margin-bottom22 padding-30">
|
||||
<view class="d-flex j-sb">
|
||||
<view>商品总额</view>
|
||||
<view class="x-text-159">￥ {{list.goods_amount}}</view>
|
||||
</view>
|
||||
<view class="d-flex j-sb">
|
||||
<view>运费</view>
|
||||
<view class="x-text-159">￥ {{list.shipping_fee}}</view>
|
||||
</view>
|
||||
<view class="d-flex j-sb">
|
||||
<view class="x_text_hui" style="margin-bottom: 30upx;">{{list.shipping_fee_text}}</view>
|
||||
</view>
|
||||
<view class="d-flex j-sb a-center ">
|
||||
<view class="">订单备注</view>
|
||||
<input type="text" value="" class="the_remarks flex-1" v-model="remark" placeholder="如有其他备注内容，请在此填写"/>
|
||||
<!-- <textarea placeholder-style="color:#989898" placeholder="如有其他备注内容，请在此填写" v-model="remark"class="the_remarks" /> -->
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="bottom_menu shadow d-flex">
|
||||
<view class="flex-1 x_textRight padding-zy30">
|
||||
<text class="x_text_hui">共{{list.total_number}}件,</text>
|
||||
<text class="x_text_hei2828 margin-zy20 font-weight" @click="shishi" >合计:</text>
|
||||
<text class="x-text-159">￥ {{list.total_amount}}</text>
|
||||
</view>
|
||||
<view class="buy sameBtn x-text-white text-center" v-if="list.is_buy==0" style="background-color: #a9a1a1;">提交订单</view>
|
||||
<view class="buy sameBtn x-text-white text-center" v-if="list.is_buy!==0" @click="submitOrder()">提交订单</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import store from '@/store/index.js'
|
||||
// import Vuex from "vuex"
|
||||
import X_goods from '../../utils/models/goods.js'
|
||||
import HeaderTop from '../../components/HeaderTop/HeaderTop.vue'
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
goods_num: 10, // 商品的当前数量
|
||||
Stock: 100, //当前商品的总库存
|
||||
sales_type: 10, //销售类型
|
||||
is_collection: false, //判断是否收藏商品 是:true ; 否:false
|
||||
is_pop_show: false, // 判断购物车遮挡层的状态 显示:true ; 隐藏:false
|
||||
Which_one: '', //判断用户点击了哪一个按钮 1：加入购物车； 2：立即购买
|
||||
car_GoodsNum: 0 ,//购物车的商品数量
|
||||
goods_id:'', // 购物车ID（传过来的参数）
|
||||
address:'',
|
||||
goods_list:'',
|
||||
extend:'',
|
||||
list:'',
|
||||
remark:'' ,//备注
|
||||
option_address:'', //从地址列表页传参
|
||||
goods_ids:'' // 订单id的集合
|
||||
}
|
||||
},
|
||||
comments: {
|
||||
HeaderTop
|
||||
},
|
||||
created() {
|
||||
|
||||
},
|
||||
onShow() {
|
||||
this.sure_order()
|
||||
},
|
||||
onLoad(option) {
|
||||
|
||||
this.goods_id = option.goods_id
|
||||
|
||||
if(option.address){
|
||||
this.option_address = option.address
|
||||
|
||||
|
||||
}else{
|
||||
this.address = ''
|
||||
}
|
||||
|
||||
|
||||
},
|
||||
|
||||
methods: {
|
||||
//添加收货地址
|
||||
goodid(){
|
||||
this.$store.commit('goodid',this.goods_id)
|
||||
},
|
||||
to_addAdress(){
|
||||
this.goodid();
|
||||
uni.redirectTo({
|
||||
url:'../my/user-path-list?goods_id='+this.goods_id
|
||||
})
|
||||
},
|
||||
|
||||
// shishi(){
|
||||
// console.log(this.$store.state.goods_id)
|
||||
// },
|
||||
//确认订单 X_orderPreview
|
||||
async sure_order() {
|
||||
this.goods_id = this.$store.state.goods_id
|
||||
let res = await X_goods.X_orderPreview(this.goods_id)
|
||||
this.handleError(res, res => {
|
||||
|
||||
if(res.data.address){
|
||||
|
||||
if(this.option_address){
|
||||
|
||||
this.address = JSON.parse(this.option_address)
|
||||
}else{
|
||||
|
||||
this.address = res.data.address
|
||||
}
|
||||
}
|
||||
|
||||
this.goods_list = res.data.goods_list.plat
|
||||
this.extend = res.data.goods_list.extend
|
||||
this.list = res.data
|
||||
if(!this.address){
|
||||
uni.showToast({
|
||||
title: '请选择收货地址',
|
||||
duration: 2000,
|
||||
icon: 'none'
|
||||
});
|
||||
}
|
||||
})
|
||||
},
|
||||
//提交订单 (创建订单)
|
||||
async submitOrder(){
|
||||
this.goodid();
|
||||
if(this.list.is_buy==1){
|
||||
this.goods_ids = ''
|
||||
if(this.goods_list){
|
||||
this.goods_list.forEach(item=>{
|
||||
this.goods_ids+=item.id+','
|
||||
})
|
||||
}
|
||||
if(this.extend){
|
||||
this.extend.forEach(item=>{
|
||||
this.goods_ids+=item.id+','
|
||||
})
|
||||
}
|
||||
this.goods_ids = this.goods_ids.substr(0, this.goods_ids.length - 1);
|
||||
let res = await X_goods.X_create_order(this.goods_ids,this.address.address,this.address.consignee,this.address.tel,this.remark,this.address.id)
|
||||
if(res.code==200){
|
||||
if(res.data.errcode){
|
||||
uni.showToast({
|
||||
title: res.data.errmsg,
|
||||
duration: 2000,
|
||||
icon: 'none'
|
||||
});
|
||||
setTimeout(function() {
|
||||
uni.switchTab({
|
||||
url: './shoppingCart'
|
||||
})
|
||||
}, 1500);
|
||||
}else{
|
||||
uni.redirectTo({
|
||||
url:'../my/pay_type?order_id='+res.data.order_id
|
||||
})
|
||||
}
|
||||
}
|
||||
this.handleError(res, res => {
|
||||
})
|
||||
}else{
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.content {
|
||||
.the_remarks{
|
||||
font-size: 28upx;
|
||||
}
|
||||
overflow-y: auto;
|
||||
.detail {
|
||||
background-color: #F2F2F2;
|
||||
height: calc(100% - 249upx);
|
||||
overflow-y: auto;
|
||||
.list {
|
||||
|
||||
.list_items {
|
||||
position: relative;
|
||||
.shixiao{
|
||||
position: absolute;
|
||||
right:6%;
|
||||
top:0;
|
||||
padding:5upx 10upx;
|
||||
border-radius: 20upx;
|
||||
background-color: #a9a1a1;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
.box_img {
|
||||
height: 153.3upx;
|
||||
width: 270upx;
|
||||
background-color: #F2F2F2;
|
||||
padding: 10upx 20upx;
|
||||
margin: 0 10upx;
|
||||
}
|
||||
|
||||
.goods_items {
|
||||
position: relative;
|
||||
|
||||
.goods_count {
|
||||
position: absolute;
|
||||
bottom: -14upx;
|
||||
right: 8upx;
|
||||
}
|
||||
}
|
||||
.line {
|
||||
height: 4upx;
|
||||
background-color: #F2F2F2;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.goods_txt {
|
||||
.txt_info {
|
||||
word-break: break-all;
|
||||
}
|
||||
}
|
||||
|
||||
.time {
|
||||
padding: 0 15upx;
|
||||
border-radius: 10upx;
|
||||
margin: 0 15upx;
|
||||
}
|
||||
|
||||
.zhuyi_title {
|
||||
margin: 20upx 0 20upx 0;
|
||||
}
|
||||
}
|
||||
|
||||
.bottom_menu {
|
||||
height: 100upx;
|
||||
overflow: hidden;
|
||||
line-height: 100upx;
|
||||
.car_img {
|
||||
height: 41upx;
|
||||
width: 46upx;
|
||||
margin-top: 4px;
|
||||
}
|
||||
|
||||
.car_txt {
|
||||
font-size: 20upx;
|
||||
color: #989898;
|
||||
line-height: 22upx;
|
||||
margin-top: -4px;
|
||||
}
|
||||
|
||||
.car_GoodsNum {
|
||||
position: absolute;
|
||||
top: -8upx;
|
||||
left: 108upx;
|
||||
color: #EB5159;
|
||||
}
|
||||
|
||||
.sameBtn {
|
||||
line-height: 81.5upx;
|
||||
width: 38%;
|
||||
}
|
||||
|
||||
.the_car {
|
||||
flex: 1;
|
||||
text-align: center;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.add_shopping_car {
|
||||
background-color: #EDCA4A;
|
||||
}
|
||||
|
||||
.buy {
|
||||
background-color: #EB5159;
|
||||
line-height: 100upx;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user