You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

295 lines
6.7 KiB
Vue

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<template>
<view class="content">
<kevyloading v-if="loading" type="bsm-loader" color="#618af8" transparent></kevyloading>
<view class=" bg-white sticky top-0 z-50 flex items-center">
<view class="flex-1">
<wd-search @search="search({ value: params.keywords })" @clear="search({ value: params.keywords = '' })"
v-model="params.keywords" hide-cancel></wd-search>
</view>
</view>
<div class="grid p-2">
<yList height="91vh" ref="yListRef" :apiObj="recon.faceList" :params="{ ...params }">
<template #default="{ list: order_list }">
<div v-for="order of order_list" class="rounded-md overflow-hidden">
<wd-card class="rounded-md overflow-hidden" type="rectangle">
<template #title>
<view class="title">
<view>ID{{ order.id }}</view>
<view @click="utils.copy(order.order_no)" class="title-tip">
{{ order.order_no }}
<wd-icon name="file-copy" size="14px"></wd-icon>
</view>
</view>
</template>
<view style="height: 40px;display: block;" class="userBox" v-if="order.detail && order.detail.length > 0">
<view v-for="item of order.detail" style="width: 100%;">
<view style="color: rgba(0,0,0,0.85); font-size: 16px;display: flex;align-items: center;justify-content: space-around;">
<view style="width: 50%;">
{{ item.goods_name }}
</view>
<view style="width: 25%;">
x {{ item.num }}
</view>
<view style="width: 25%;">
<wd-tag class="mx-1" size="small" type="success">
¥{{ item.price }}
</wd-tag>
</view>
</view>
</view>
</view>
<template #footer>
<view class="flex justify-between items-center">
<view style="color: #999;">
{{ order.create_time }}
</view>
<view style="color: rgba(0,0,0,0.85);padding: 30rpx 0">
支付金额:¥{{ order.pay_price }}
</view>
<view>
<wd-button @click="tuikuan_order = order;show_tuikuan=1;tuikuan_info.refund_price = tuikuan_order.pay_price" size="small"
style="margin-right: 0px;">退款</wd-button>
</view>
</view>
</template>
</wd-card>
</div>
</template>
</yList>
</div>
<wd-toast />
<wd-message-box></wd-message-box>
<wd-popup v-model="show_tuikuan" custom-style="padding: 30px 40px;width: 80%;border-radius: 20rpx;" @close="tuikuan_info = {}">
<view style="text-align: center;color: #000;">
退款信息
</view>
<view class="shop_item_box" style="max-height: 1000rpx;overflow: scroll;">
<view style="display: flex;align-items: center;justify-content: space-between;border: none;">
<view style="width: 150rpx;">
订单号:
</view>
<view style="width: calc(100% - 150rpx);">
{{ tuikuan_order.order_no }}
</view>
</view>
<view style="display: flex;align-items: center;justify-content: space-between;border: none;">
<view style="width: 150rpx;">
退款金额:
</view>
<view style="width: calc(100% - 150rpx);">
<wd-input type="digit" style="width: 100%;" v-model="tuikuan_info.refund_price" />
</view>
</view>
<view style="border: none;display: flex;align-items: center;justify-content: space-around;">
<wd-button type="error" @click="show_tuikuan = 0;tuikuan_info = {}">取消</wd-button>
<wd-button @click="tuikuan(tuikuan_order.order_no)"></wd-button>
</view>
</view>
</wd-popup>
</view>
</template>
<script setup>
import {
ref
} from 'vue';
import utils from '@/utils/utils.js';
import recon from '@/api/store/recon.js';
import myTabbar from "../components/myTabbar/index.vue";
import kevyloading from "@/components/kevy-loading/kevy-loading";
import {
useMessage
} from '@/uni_modules/wot-design-uni';
import {
useToast
} from '@/uni_modules/wot-design-uni'
import yList from "/components/yList/index.vue";
import {
onShow,
} from "@dcloudio/uni-app";
const toast = useToast()
const message1 = useMessage();
const originType = ref({
100: 'success',
101: 'success',
200: 'info',
201: 'danger',
300: 'warning',
})
const yListRef = ref(null);
const searchType = ref('订单号');
const popover = ref(false);
const show_tuikuan = ref(0);
const tuikuan_info = ref({})
const tuikuan_order = ref({})
const search = ({
value
}) => {
if (searchType.value == '昵称') {
yListRef.value.upData({
type: 'order_no',
keywords: params.value.keywords
});
}
if (searchType.value == '订单号') {
yListRef.value.upData({
type: 'order_no',
keywords: params.value.keywords
});
}
};
const tuikuan = (order_no) => {
uni.showModal({
title: '提示',
content: '是否确认退款?',
success(res) {
if (res.confirm) {
uni.showLoading({
title: '提交中'
})
recon.tuikuan({
order_no,
refund_price: tuikuan_info.value ? tuikuan_info.value.refund_price : 0
}).then(res => {
uni.hideLoading()
if (res.code == 0) {
uni.showToast({
icon: 'none',
title: '退款成功'
})
show_tuikuan.value = 0
} else {
uni.showToast({
icon: 'none',
title: res.msg
})
}
})
}
}
})
};
const menu = ref([{
content: '昵称'
},
{
content: '订单号'
},
]);
const params = ref({
keywords: "",
type: 'order_no',
status: -2
});
/**
* 切换搜索类型
* @param {Object} item - 切换的项
*/
function changeSearchType({
item,
index
}) {
searchType.value = item.content;
search(params.value.keywords)
}
/**
* @type {Ref<boolean>}
* 控制页面加载状态的 Ref
*/
const loading = ref(false);
const order_list = ref([]);
// 初始化调用获取一行数据
onShow(() => {
})
</script>
<style lang="scss" scoped>
.search-type {
position: relative;
height: 30px;
line-height: 30px;
padding: 0 8px 0 16px;
font-size: 24rpx;
color: rgba(0, 0, 0, .45);
}
.search-type::after {
position: absolute;
content: '';
width: 1px;
right: 0;
top: 5px;
bottom: 5px;
background: rgba(0, 0, 0, 0.25);
}
.search-type {
:deep(.icon-arrow) {
display: inline-block;
font-size: 20px;
vertical-align: middle;
}
}
.userBox,
.title {
display: flex;
flex-direction: row;
justify-content: flex-start;
align-items: center;
}
.userBox {
justify-content: flex-start;
}
.title {
justify-content: space-between;
}
.title-tip {
color: rgba(0, 0, 0, 0.25);
font-size: 12px;
}
.shop_item_box>view {
padding: 20rpx 0;
border-bottom: 1rpx solid #F0F0F0;
}
</style>