182 lines
3.8 KiB
Vue
182 lines
3.8 KiB
Vue
<template>
|
||
<layout>
|
||
<uv-navbar
|
||
:fixed="false"
|
||
title="选择商品"
|
||
left-arrow
|
||
@leftClick="$onClickLeft"
|
||
/>
|
||
<uv-checkbox-group
|
||
v-if="goodsList"
|
||
v-model="goodsSelect"
|
||
@change="handleGoodsSelect"
|
||
>
|
||
<space
|
||
direction="vertical"
|
||
fill
|
||
>
|
||
<card class="shopping-checkbox">
|
||
<view
|
||
v-for="(item, index) in goodsList"
|
||
class="shopping-checkbox-cell"
|
||
>
|
||
<uv-checkbox
|
||
:name="item.id"
|
||
v-model="goodsSelect"
|
||
checked-color="#ee0a24"
|
||
:disabled="item.isAfterSales != 1"
|
||
/>
|
||
<goods
|
||
list
|
||
interval
|
||
showAction
|
||
model
|
||
:price="item.cartInfo.productInfo.price"
|
||
:data="item.cartInfo.productInfo"
|
||
>
|
||
</goods>
|
||
</view>
|
||
</card>
|
||
</space>
|
||
</uv-checkbox-group>
|
||
<view class="action-bar column">
|
||
<view class="action-info">
|
||
<view class="action-checkbox">
|
||
<uv-checkbox-group>
|
||
<uv-checkbox
|
||
name="all"
|
||
:checked="goodsSelectAll"
|
||
checked-color="#ee0a24"
|
||
@change="handleGoodsSelectAll"
|
||
>
|
||
全选
|
||
</uv-checkbox>
|
||
</uv-checkbox-group>
|
||
</view>
|
||
<view class="action-total">
|
||
{{ goodsSelect.length }} 件商品
|
||
</view>
|
||
<view class="action-total">
|
||
|
||
总计：￥{{ totalPrice }}
|
||
</view>
|
||
</view>
|
||
<view class="action-btns">
|
||
<uv-button
|
||
type="primary"
|
||
text="仅退款"
|
||
@click="toRefund(0)"
|
||
></uv-button>
|
||
<uv-button
|
||
type="primary"
|
||
text="退货退款"
|
||
@click="toRefund(1)"
|
||
></uv-button>
|
||
</view>
|
||
</view>
|
||
</layout>
|
||
</template>
|
||
|
||
<script setup>
|
||
|
||
import { ref, watch } from 'vue'
|
||
import { applyForAfterSalesInfo } from '@/api/order'
|
||
import { navigateTo } from '@/utils/router'
|
||
import { onLoad } from '@dcloudio/uni-app'
|
||
|
||
const goodsList = ref([])
|
||
const goodsSelect = ref([])
|
||
const goodsSelectAll = ref(false)
|
||
const totalPrice = ref(0);
|
||
const orderId = ref(null)
|
||
const id = ref(null)
|
||
const refundType = ref(null)
|
||
|
||
|
||
const handleGoodsSelectAll = (e) => {
|
||
goodsSelectAll.value = e
|
||
if (!goodsSelectAll.value) {
|
||
goodsSelect.value = []
|
||
return
|
||
}
|
||
|
||
goodsSelect.value = goodsList.value.map(item => item.id)
|
||
}
|
||
|
||
const handleGoodsSelect = (value) => {
|
||
goodsSelectAll.value = value.length == goodsList.value.length
|
||
}
|
||
|
||
watch(goodsSelect, (goodsSelect) => {
|
||
let price = 0
|
||
goodsList.value.filter(item => goodsSelect.includes(item.id)).forEach(item => {
|
||
price += item.cartInfo.truePrice * item.cartInfo.cartNum
|
||
})
|
||
|
||
totalPrice.value = price
|
||
})
|
||
|
||
const handleOrderInfo = async (option) => {
|
||
const res = await applyForAfterSalesInfo(option)
|
||
console.log("gxs --> % handleOrderInfo % res:\n", res)
|
||
// orderInfoData.value = res
|
||
goodsList.value = res
|
||
}
|
||
|
||
|
||
const toRefund = (type) => {
|
||
if (goodsSelect.value.length <= 0) {
|
||
return
|
||
}
|
||
|
||
refundType.value = type
|
||
|
||
navigateTo({
|
||
url: '/pages/refund/refund',
|
||
query: {
|
||
refundType: refundType.value,
|
||
goods: goodsSelect.value.toString(),
|
||
orderId: orderId.value,
|
||
id: id.value
|
||
}
|
||
})
|
||
}
|
||
|
||
|
||
onLoad((option) => {
|
||
orderId.value = option.orderId
|
||
id.value = option.id
|
||
handleOrderInfo({
|
||
key: option.id
|
||
})
|
||
})
|
||
|
||
|
||
</script>
|
||
|
||
<style lang="less">
|
||
.shopping-checkbox {}
|
||
|
||
.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>
|