286 lines
9.2 KiB
Vue
286 lines
9.2 KiB
Vue
<template>
|
||
<view class="order-shop">
|
||
<view class="m-l-20">
|
||
<shop-title :shop="{shop_name:item.shop_name}" :is-link="false"></shop-title>
|
||
</view>
|
||
<view class="order-goods">
|
||
<order-goods :list="item.goods"></order-goods>
|
||
</view>
|
||
<view class="item flex row-between" @tap="onShowCoupon" v-if="orderType == 0">
|
||
<view>店铺优惠券</view>
|
||
<view class="flex">
|
||
<text class="primary" v-if="item.discount_amount">-￥{{item.discount_amount }}</text>
|
||
<text v-else class="muted">请选择</text>
|
||
<u-icon name="arrow-right muted" size="24" class="m-l-10"></u-icon>
|
||
</view>
|
||
</view>
|
||
<view class="item flex">
|
||
<view>配送方式</view>
|
||
<view class="flex-1 m-l-20 muted">{{item.delivery_type_text}}</view>
|
||
<view>
|
||
<price-format :price="item.shipping_price"></price-format>
|
||
</view>
|
||
</view>
|
||
<view class="item flex row-between col-top m-t-20" @tap="handleInvoice(item.shop_id)" v-if="item.open_invoice">
|
||
<view>开具发票</view>
|
||
<view class="invoice col-top">
|
||
<text class="muted invoice--text">{{ getCurrentShopInvoice }}</text>
|
||
<u-icon name="arrow-right muted" size="24" class="m-t-10 m-l-10"></u-icon>
|
||
</view>
|
||
</view>
|
||
<view class="item flex row-between">
|
||
<view>订单前置</view>
|
||
<u-switch v-model="is_checked" active-color="red" @change="preposeChange"></u-switch>
|
||
</view>
|
||
<view class="item flex row-between" @tap="contractDownload" >
|
||
<view>我的合同</view>
|
||
<view class="flex">
|
||
<text class="muted">点击下载</text>
|
||
<u-icon name="arrow-right muted" size="24" class="m-l-10"></u-icon>
|
||
</view>
|
||
</view><strong></strong>
|
||
<view class="item flex row-between">
|
||
<view>买家留言</view>
|
||
<u-input v-model="remark" class="flex-1 m-l-20" :clearable="false" placeholder="请添加备注（150字以内）"></u-input>
|
||
</view>
|
||
<view class="item flex row-right">
|
||
共{{item.total_num || (item.goods && item.goods[0].count)}}件，合计： <price-format weight="500"
|
||
:color="colorConfig.primary" :first-size="36" :second-size="36"
|
||
:price="item.total_amount || (item.goods && item.goods[0].team_price)"></price-format>
|
||
</view>
|
||
<u-popup v-if="orderType == 0" v-model="showCoupon" border-radius="14" mode="bottom" closeable
|
||
:safe-area-inset-bottom="true">
|
||
<view class="p-30">
|
||
<view class="title">优惠券</view>
|
||
</view>
|
||
<view v-if="showCoupon">
|
||
<tabs :current="active" :bar-width="100" :is-scroll="false">
|
||
<tab :name="'可使用优惠券 (' + usableCoupon.length + ')'">
|
||
<coupon-order :list="usableCoupon" :type="0" @change="onSelectCoupon" :coupon-id="couponId">
|
||
</coupon-order>
|
||
</tab>
|
||
<tab :name="'不可用优惠券 (' + unusableCoupon.length + ')'">
|
||
<coupon-order :list="unusableCoupon" :type="1" @change="showCoupon = false"></coupon-order>
|
||
</tab>
|
||
</tabs>
|
||
</view>
|
||
</u-popup>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import {
|
||
getOrderCoupon
|
||
} from '@/api/activity'
|
||
import {
|
||
getContractDownload,
|
||
} from '@/api/order';
|
||
import {baseURL} from '@/config/app';
|
||
import { invoiceType } from "@/utils/type.js"
|
||
export default {
|
||
name: "order-shop",
|
||
props: {
|
||
item: {
|
||
type: [Object, Array]
|
||
},
|
||
orderType: {
|
||
type: Number
|
||
},
|
||
invoice: {
|
||
type: [Object, Array]
|
||
}
|
||
},
|
||
data() {
|
||
return {
|
||
active: 0,
|
||
remark: '',
|
||
showCoupon: false,
|
||
usableCoupon: [],
|
||
unusableCoupon: [],
|
||
usableCouponL: 0,
|
||
unusableCouponL: 0,
|
||
isRequest: false,
|
||
couponId: '',
|
||
invoiceInfo: {} ,// 发票内容
|
||
is_checked:false, //是否开启前置
|
||
is_frontend:0, //是否前置
|
||
};
|
||
},
|
||
computed: {
|
||
// 获取当前发票选择显示在视图上
|
||
getCurrentShopInvoice() {
|
||
const invoice = this.invoiceInfo;
|
||
if (invoice.name) {
|
||
return `${ invoice.type == 0 ? '普通发票' : '专用发票' } - ${ invoice.header_type == 0 ? '个人' : '企业' } - ${ invoice.name }`
|
||
} else {
|
||
return '不开发票'
|
||
}
|
||
}
|
||
},
|
||
methods: {
|
||
preposeChange(e) {
|
||
if(e) {
|
||
this.is_frontend = 1;
|
||
}else {
|
||
this.is_frontend = 0;
|
||
}
|
||
},
|
||
// 下载合同
|
||
contractDownload() {
|
||
uni.showLoading({
|
||
title:'加载中...'
|
||
});
|
||
let that = this;
|
||
getContractDownload().then(({
|
||
data
|
||
}) => {
|
||
let downloadUrl = baseURL + '/' + data.path;
|
||
uni.downloadFile({
|
||
url: downloadUrl,
|
||
success: (res) => {
|
||
console.log(res)
|
||
if (res.statusCode === 200) {
|
||
uni.saveFile({
|
||
tempFilePath: res.tempFilePath,
|
||
success: function (red) {
|
||
uni.hideLoading();
|
||
uni.showModal({
|
||
title: '提示',
|
||
content: '文件已保存：' + red.savedFilePath,
|
||
cancelText: '我知道了',
|
||
confirmText: '打开文件',
|
||
success: function (res) {
|
||
if (res.confirm) {
|
||
uni.openDocument({
|
||
filePath: red.savedFilePath,
|
||
showMenu: true,
|
||
success: (sus) => {
|
||
console.log('成功打开');
|
||
}
|
||
})
|
||
}
|
||
}
|
||
});
|
||
},
|
||
fail: function (err) {
|
||
that.$toast({
|
||
title: '保存失败'
|
||
})
|
||
}
|
||
});
|
||
}
|
||
},
|
||
fail: function (err) {
|
||
that.$toast({
|
||
title: '下载失败，请重新下载'
|
||
})
|
||
}
|
||
});
|
||
})
|
||
},
|
||
onShowCoupon() {
|
||
if (!this.isRequest) {
|
||
uni.showLoading({
|
||
title: '加载中...'
|
||
})
|
||
this.getCoupon()
|
||
} else {
|
||
this.showCoupon = true
|
||
}
|
||
},
|
||
async getCoupon() {
|
||
const {
|
||
item: {
|
||
goods,
|
||
shop_id
|
||
}
|
||
} = this
|
||
const params = goods.map(({
|
||
item_id,
|
||
num,
|
||
goods_id
|
||
}) => ({
|
||
item_id,
|
||
num,
|
||
goods_id
|
||
}))
|
||
const {
|
||
data,
|
||
code
|
||
} = await getOrderCoupon({
|
||
goods: params,
|
||
shop_id: shop_id
|
||
})
|
||
if (code == 1) {
|
||
this.isRequest = true
|
||
this.usableCoupon = data.suit
|
||
this.usableCouponL = data.suit.length
|
||
this.unusableCoupon = data.un_suit
|
||
this.unusableCouponL = data.un_suit.length
|
||
this.showCoupon = true
|
||
uni.hideLoading()
|
||
}
|
||
},
|
||
// 选择发票
|
||
handleInvoice(shopId) {
|
||
this.$Router.push({
|
||
path: '/bundle/pages/invoice/invoice',
|
||
query: {
|
||
shop_id: shopId,
|
||
invoice: JSON.stringify(this.invoiceInfo),
|
||
type: invoiceType['SETTLEMENT']
|
||
}
|
||
})
|
||
},
|
||
onSelectCoupon(e) {
|
||
this.couponId = e
|
||
this.$emit('changecoupon', e)
|
||
this.showCoupon = false
|
||
}
|
||
},
|
||
watch: {
|
||
remark(val) {
|
||
this.$emit('changeremark', {
|
||
shop_id: this.item.shop_id,
|
||
remark: val
|
||
})
|
||
},
|
||
is_frontend(val) {
|
||
this.$emit('changeIsFrontend', {
|
||
is_frontend: this.is_frontend
|
||
})
|
||
},
|
||
invoice(val) {
|
||
console.log(val);
|
||
const res = val.filter(el => el.shop_id == this.item.shop_id)
|
||
if (res.length) {
|
||
this.invoiceInfo = res[0];
|
||
} else {
|
||
this.invoiceInfo = {};
|
||
}
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss">
|
||
.order-shop {
|
||
.order-goods {
|
||
border-top: $-solid-border;
|
||
}
|
||
|
||
.item {
|
||
height: 88rpx;
|
||
padding: 0 24rpx;
|
||
|
||
.invoice {
|
||
display: flex;
|
||
&--text {
|
||
width: 300rpx;
|
||
text-align: right;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
</style>
|