214 lines
4.6 KiB
Vue
214 lines
4.6 KiB
Vue
<template>
|
|
<layout>
|
|
<uv-navbar
|
|
:fixed="false"
|
|
title="填写物流"
|
|
left-arrow
|
|
@leftClick="goBack"
|
|
/>
|
|
<div>
|
|
<div class="mb-20">
|
|
</div>
|
|
|
|
<view class="y-list">
|
|
<uv-list border>
|
|
|
|
<uv-list-item
|
|
border
|
|
clickable
|
|
right-text="请选择"
|
|
show-arrow
|
|
@click=""
|
|
>
|
|
<view class="y-list-content">
|
|
<view class="y-list-label">物流公司</view>
|
|
<view
|
|
class="y-list-select-placeholder"
|
|
@tap="openLogisticsPicker"
|
|
v-if="!data.name"
|
|
>
|
|
请选择
|
|
</view>
|
|
<view
|
|
class="y-list-select"
|
|
@tap="openLogisticsPicker"
|
|
v-else
|
|
>
|
|
{{ data.name }}
|
|
</view>
|
|
</view>
|
|
</uv-list-item>
|
|
<uv-list-item border>
|
|
<view class="y-list-content">
|
|
<view class="y-list-label">物流单号</view>
|
|
<view class="y-list-input">
|
|
<uv-input
|
|
placeholder="请输入内容"
|
|
border="none"
|
|
v-model="data.postalCode"
|
|
></uv-input>
|
|
</view>
|
|
</view>
|
|
</uv-list-item>
|
|
</uv-list>
|
|
<uv-picker
|
|
ref="logisticsPicker"
|
|
:columns="logisticsColumns"
|
|
keyName="name"
|
|
@confirm="logisticsPickerConfirm"
|
|
></uv-picker>
|
|
</view>
|
|
<view class="y-list">
|
|
<uv-list border>
|
|
|
|
<uv-list-item border>
|
|
<view class="y-list-content">
|
|
<view class="y-list-label">退货说明</view>
|
|
<view class="y-list-input">
|
|
<uv-input
|
|
placeholder="请输入内容"
|
|
border="none"
|
|
v-model="data.returnPolicy"
|
|
></uv-input>
|
|
</view>
|
|
</view>
|
|
</uv-list-item>
|
|
</uv-list>
|
|
</view>
|
|
<view class="card noBorder full">
|
|
<view class="card-head">
|
|
<div class="card-title">上传凭证</div>
|
|
</view>
|
|
<view class="card-content">
|
|
<upload-file v-model="list" />
|
|
</view>
|
|
</view>
|
|
|
|
</div>
|
|
<div class="form-buttons">
|
|
<uv-button
|
|
round
|
|
block
|
|
type="primary"
|
|
@tap="handleApplyForAfterSales"
|
|
>
|
|
提交
|
|
</uv-button>
|
|
</div>
|
|
</layout>
|
|
</template>
|
|
|
|
<script setup>
|
|
|
|
import { computed, ref } from 'vue'
|
|
import { addLogisticsInformation,getExpress } from '@/api/order'
|
|
import { onLoad } from '@dcloudio/uni-app'
|
|
import { useRouter } from "@/hooks/useRouter";
|
|
import { useInterface } from "@/hooks/useInterface";
|
|
|
|
const {toast} = useInterface()
|
|
const {getParams, goBack, push} = useRouter()
|
|
const logisticsPicker = ref(null)
|
|
const refundType = ref(null)
|
|
const list = ref([])
|
|
const logisticsColumns = ref([])
|
|
|
|
const data = ref({
|
|
code: '',
|
|
name: '',
|
|
postalCode: '',
|
|
orderCode: '',
|
|
id: '',
|
|
returnPolicy: '',
|
|
returnVoucher: ''
|
|
})
|
|
|
|
|
|
const getExpressList = () =>{
|
|
getExpress().then((res) => {
|
|
logisticsColumns.value = [res]
|
|
})
|
|
}
|
|
|
|
// 打开快递弹窗
|
|
const openLogisticsPicker = () => {
|
|
logisticsPicker.value.open();
|
|
}
|
|
|
|
// 快递弹窗确认
|
|
const logisticsPickerConfirm = (e) => {
|
|
console.log(e)
|
|
data.value.code = e.value[0].code
|
|
data.value.name = e.value[0].name
|
|
logisticsPicker.value.close();
|
|
}
|
|
|
|
const handleApplyForAfterSales = async () => {
|
|
if (!data.value.code) {
|
|
uni.showToast({
|
|
icon: "none",
|
|
title: '请选择快递公司',
|
|
duration: 2000
|
|
});
|
|
return
|
|
}
|
|
if (!data.value.postalCode) {
|
|
uni.showToast({
|
|
icon: "none",
|
|
title: '请选择退货说明',
|
|
duration: 2000
|
|
});
|
|
return
|
|
}
|
|
await addLogisticsInformation({
|
|
...data.value,
|
|
returnVoucher: list.value.map(v => {
|
|
return v.url
|
|
}).join(',')
|
|
})
|
|
toast({
|
|
title: '填写成功'
|
|
})
|
|
push({url: '/pages/refundInfo/refundInfo'}, {
|
|
data: {
|
|
id: data.value.id,
|
|
},
|
|
type:"redirectTo"
|
|
})
|
|
}
|
|
|
|
onLoad((options) => {
|
|
const params = getParams(options)
|
|
data.value.id = params.id
|
|
data.value.orderCode = params.orderCode
|
|
getExpressList()
|
|
})
|
|
|
|
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
|
|
.shopping-action {
|
|
padding-left: 34rpx;
|
|
flex: 1;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
|
|
&-checkbox {
|
|
flex: 1
|
|
}
|
|
|
|
&-total {
|
|
line-height: 48rpx;
|
|
font-size: 34rpx;
|
|
color: #333333;
|
|
margin-right: 10rpx;
|
|
}
|
|
|
|
&-btn {
|
|
width: 224rpx;
|
|
}
|
|
}
|
|
</style>
|