|
|
@@ -48,181 +48,152 @@
|
|
|
<ele-card :body-style="{ padding: '10px' }" class="mt-4">
|
|
|
<!-- Tabs -->
|
|
|
<el-tabs v-model="activeTab" @tab-click="handleTabClick">
|
|
|
- <el-tab-pane label="全部售后状态" name="all" />
|
|
|
- <el-tab-pane label="进行中的订单" name="processing" />
|
|
|
- <el-tab-pane label="待商家处理" name="merchant_pending" />
|
|
|
- <el-tab-pane label="待商家收货" name="merchant_receiving" />
|
|
|
- <el-tab-pane label="待买家发货" name="buyer_shipping" />
|
|
|
- <el-tab-pane label="已拒绝退款" name="rejected" />
|
|
|
- <el-tab-pane label="退款成功" name="success" />
|
|
|
- <el-tab-pane label="退款取消" name="cancelled" />
|
|
|
+ <el-tab-pane label="全部" name="" />
|
|
|
+ <el-tab-pane label="申请退款" name="1" />
|
|
|
+ <el-tab-pane label="审核通过" name="2" />
|
|
|
+ <el-tab-pane label="审核驳回" name="3" />
|
|
|
+ <el-tab-pane label="超时关闭" name="4" />
|
|
|
+ <el-tab-pane label="卖家已发货" name="5" />
|
|
|
+ <el-tab-pane label="已完成" name="6" />
|
|
|
</el-tabs>
|
|
|
|
|
|
<!-- Table Header -->
|
|
|
<div class="mt-2">
|
|
|
- <refund-table-header
|
|
|
- v-model:checkAll="checkAll"
|
|
|
- :is-indeterminate="isIndeterminate"
|
|
|
- @change="handleCheckAllChange"
|
|
|
- />
|
|
|
+ <refund-table-header v-model:checkAll="checkAll" :is-indeterminate="isIndeterminate"
|
|
|
+ @change="handleCheckAllChange" />
|
|
|
</div>
|
|
|
|
|
|
<!-- List -->
|
|
|
<div class="refund-list" v-loading="loading">
|
|
|
- <refund-item
|
|
|
- v-for="(item, index) in list"
|
|
|
- :key="index"
|
|
|
- :item="item"
|
|
|
- @push-sms="handlePushSms"
|
|
|
- @send-packet="handleSendPacket"
|
|
|
- />
|
|
|
+ <div v-if="list.length === 0" class="empty-text text-center py-10 text-gray-400">暂无数据</div>
|
|
|
+ <refund-item v-for="(item, index) in list" :key="index" :item="item" @push-sms="handlePushSms"
|
|
|
+ @send-packet="handleSendPacket" @view-detail="handleViewDetail" />
|
|
|
</div>
|
|
|
|
|
|
<!-- Pagination -->
|
|
|
<div class="pagination-wrapper mt-4 flex justify-end">
|
|
|
- <el-pagination
|
|
|
- v-model:current-page="pageParams.page"
|
|
|
- v-model:page-size="pageParams.limit"
|
|
|
- :total="total"
|
|
|
- layout="total, sizes, prev, pager, next, jumper"
|
|
|
- @size-change="handleSizeChange"
|
|
|
- @current-change="handlePageChange"
|
|
|
- />
|
|
|
+ <el-pagination v-model:current-page="pageParams.pageNum" v-model:page-size="pageParams.pageSize"
|
|
|
+ :total="total" layout="total, sizes, prev, pager, next, jumper" @size-change="handleSizeChange"
|
|
|
+ @current-change="handlePageChange" />
|
|
|
</div>
|
|
|
</ele-card>
|
|
|
|
|
|
<!-- Dialogs -->
|
|
|
- <push-sms-dialog ref="pushSmsDialogRef" @success="handleSearch" />
|
|
|
+ <push-sms-dialog ref="pushSmsDialogRef" @success="fetchData" />
|
|
|
</ele-page>
|
|
|
</template>
|
|
|
|
|
|
<script setup>
|
|
|
-import { ref, reactive } from 'vue';
|
|
|
-import { EleMessage } from 'ele-admin-plus/es';
|
|
|
-import PageSearch from './components/page-search.vue';
|
|
|
-import RefundTableHeader from './components/refund-table-header.vue';
|
|
|
-import RefundItem from './components/refund-item.vue';
|
|
|
-import PushSmsDialog from './components/push-sms-dialog.vue';
|
|
|
-
|
|
|
-const activeTab = ref('all');
|
|
|
-const loading = ref(false);
|
|
|
-const total = ref(10);
|
|
|
-const pageParams = reactive({
|
|
|
- page: 1,
|
|
|
- limit: 10
|
|
|
-});
|
|
|
-
|
|
|
-const checkAll = ref(false);
|
|
|
-const isIndeterminate = ref(false);
|
|
|
-
|
|
|
-const list = ref([
|
|
|
- {
|
|
|
- checked: false,
|
|
|
- orderId: '4066879393210936038',
|
|
|
- refundId: '4066879393210936038',
|
|
|
- applyTime: '2024-10-04 12:01:09',
|
|
|
- product: {
|
|
|
- image: 'https://img14.360buyimg.com/n0/jfs/t1/157997/3/36676/122176/65e975a0F98822998/5023348143493720.jpg',
|
|
|
- title: '毛泽东思想和中国特色社会主义理论体系概论（2023年版）',
|
|
|
- isbn: '9787040599012',
|
|
|
- condition: '中等',
|
|
|
- code: 'wk-725154',
|
|
|
- qty: 1,
|
|
|
- price: 2.9
|
|
|
- },
|
|
|
- refundAmount: 2.9,
|
|
|
- buyer: {
|
|
|
- avatar: 'https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png',
|
|
|
- name: '书嗨4654645'
|
|
|
- },
|
|
|
- refundReason: '不喜欢，效果不好',
|
|
|
- logistics: {
|
|
|
- merchantShipped: true,
|
|
|
- buyerReturned: true
|
|
|
- },
|
|
|
- status: '退款成功'
|
|
|
- },
|
|
|
- {
|
|
|
- checked: false,
|
|
|
- orderId: '4066879393210936038',
|
|
|
- refundId: '4066879393210936038',
|
|
|
- applyTime: '2024-10-04 12:01:09',
|
|
|
- product: {
|
|
|
- image: 'https://img14.360buyimg.com/n0/jfs/t1/157997/3/36676/122176/65e975a0F98822998/5023348143493720.jpg',
|
|
|
- title: '毛泽东思想和中国特色社会主义理论体系概论（2023年版）',
|
|
|
- isbn: '9787040599012',
|
|
|
- condition: '中等',
|
|
|
- code: 'wk-725154',
|
|
|
- qty: 1,
|
|
|
- price: 2.9
|
|
|
- },
|
|
|
- refundAmount: 2.9,
|
|
|
- buyer: {
|
|
|
- avatar: 'https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png',
|
|
|
- name: '书嗨4654645'
|
|
|
- },
|
|
|
- refundReason: '不喜欢，效果不好',
|
|
|
- logistics: {
|
|
|
- merchantShipped: true,
|
|
|
- buyerReturned: true
|
|
|
- },
|
|
|
- status: '同意退款'
|
|
|
- }
|
|
|
-]);
|
|
|
-
|
|
|
-const pushSmsDialogRef = ref(null);
|
|
|
-
|
|
|
-const handleSearch = (where) => {
|
|
|
- loading.value = true;
|
|
|
- setTimeout(() => {
|
|
|
- loading.value = false;
|
|
|
- EleMessage.success('查询成功');
|
|
|
- }, 500);
|
|
|
-};
|
|
|
-
|
|
|
-const handleTabClick = (tab) => {
|
|
|
- handleSearch();
|
|
|
-};
|
|
|
-
|
|
|
-const handleSizeChange = (val) => {
|
|
|
- pageParams.limit = val;
|
|
|
- handleSearch();
|
|
|
-};
|
|
|
-
|
|
|
-const handlePageChange = (val) => {
|
|
|
- pageParams.page = val;
|
|
|
- handleSearch();
|
|
|
-};
|
|
|
-
|
|
|
-const handleCheckAllChange = (val) => {
|
|
|
- list.value.forEach(item => item.checked = val);
|
|
|
- isIndeterminate.value = false;
|
|
|
-};
|
|
|
-
|
|
|
-const handlePushSms = (item) => {
|
|
|
- pushSmsDialogRef.value?.handleOpen(item);
|
|
|
-};
|
|
|
-
|
|
|
-const handleSendPacket = (item) => {
|
|
|
- EleMessage.warning('发红包功能暂未实现');
|
|
|
-};
|
|
|
+ import { ref, reactive, onMounted } from 'vue';
|
|
|
+ import { EleMessage } from 'ele-admin-plus/es';
|
|
|
+ import request from '@/utils/request';
|
|
|
+ import PageSearch from './components/page-search.vue';
|
|
|
+ import RefundTableHeader from './components/refund-table-header.vue';
|
|
|
+ import RefundItem from './components/refund-item.vue';
|
|
|
+ import PushSmsDialog from './components/push-sms-dialog.vue';
|
|
|
+
|
|
|
+ const activeTab = ref('');
|
|
|
+ const loading = ref(false);
|
|
|
+ const total = ref(0);
|
|
|
+ const pageParams = reactive({
|
|
|
+ pageNum: 1,
|
|
|
+ pageSize: 10
|
|
|
+ });
|
|
|
+ const searchParams = ref({});
|
|
|
+
|
|
|
+ const checkAll = ref(false);
|
|
|
+ const isIndeterminate = ref(false);
|
|
|
+
|
|
|
+ const list = ref([]);
|
|
|
+
|
|
|
+ const pushSmsDialogRef = ref(null);
|
|
|
+
|
|
|
+ const fetchData = () => {
|
|
|
+ loading.value = true;
|
|
|
+ const params = {
|
|
|
+ ...pageParams,
|
|
|
+ ...searchParams.value,
|
|
|
+ status: activeTab.value
|
|
|
+ };
|
|
|
+
|
|
|
+ request.get('/shop/shopOrder/refundPagelist', { params })
|
|
|
+ .then(res => {
|
|
|
+ const data = res.data;
|
|
|
+ list.value = data.rows || [];
|
|
|
+ total.value = data.total || 0;
|
|
|
+ // Reset check status
|
|
|
+ checkAll.value = false;
|
|
|
+ isIndeterminate.value = false;
|
|
|
+ })
|
|
|
+ .catch(e => {
|
|
|
+ console.error(e);
|
|
|
+ EleMessage.error('获取退款列表失败');
|
|
|
+ })
|
|
|
+ .finally(() => {
|
|
|
+ loading.value = false;
|
|
|
+ });
|
|
|
+ };
|
|
|
+
|
|
|
+ const handleSearch = (where) => {
|
|
|
+ pageParams.pageNum = 1;
|
|
|
+ searchParams.value = where;
|
|
|
+ fetchData();
|
|
|
+ };
|
|
|
+
|
|
|
+ const handleTabClick = ({ props }) => {
|
|
|
+ console.log(props);
|
|
|
+ activeTab.value = props.name;
|
|
|
+ pageParams.pageNum = 1;
|
|
|
+ fetchData();
|
|
|
+ };
|
|
|
+
|
|
|
+ const handleSizeChange = (val) => {
|
|
|
+ pageParams.pageSize = val;
|
|
|
+ fetchData();
|
|
|
+ };
|
|
|
+
|
|
|
+ const handlePageChange = (val) => {
|
|
|
+ pageParams.pageNum = val;
|
|
|
+ fetchData();
|
|
|
+ };
|
|
|
+
|
|
|
+ const handleCheckAllChange = (val) => {
|
|
|
+ list.value.forEach(item => item.checked = val);
|
|
|
+ isIndeterminate.value = false;
|
|
|
+ };
|
|
|
+
|
|
|
+ const handlePushSms = (item) => {
|
|
|
+ pushSmsDialogRef.value?.handleOpen(item);
|
|
|
+ };
|
|
|
+
|
|
|
+ const handleSendPacket = (item) => {
|
|
|
+ EleMessage.warning('发红包功能暂未实现');
|
|
|
+ };
|
|
|
+
|
|
|
+ const handleViewDetail = (item) => {
|
|
|
+ EleMessage.warning('详情页暂未实现');
|
|
|
+ };
|
|
|
+
|
|
|
+ onMounted(() => {
|
|
|
+ fetchData();
|
|
|
+ });
|
|
|
</script>
|
|
|
|
|
|
<style scoped lang="scss">
|
|
|
-.stat-card {
|
|
|
- text-align: center;
|
|
|
- border: none;
|
|
|
-
|
|
|
- .stat-title {
|
|
|
- font-size: 13px;
|
|
|
- color: #606266;
|
|
|
- font-weight: bold;
|
|
|
- }
|
|
|
-
|
|
|
- .stat-value {
|
|
|
- font-size: 24px;
|
|
|
- font-weight: bold;
|
|
|
- color: #303133;
|
|
|
+ .stat-card {
|
|
|
+ text-align: center;
|
|
|
+ border: none;
|
|
|
+
|
|
|
+ .stat-title {
|
|
|
+ font-size: 13px;
|
|
|
+ color: #606266;
|
|
|
+ font-weight: bold;
|
|
|
+ }
|
|
|
+
|
|
|
+ .stat-value {
|
|
|
+ font-size: 24px;
|
|
|
+ font-weight: bold;
|
|
|
+ color: #303133;
|
|
|
+ }
|
|
|
}
|
|
|
-}
|
|
|
</style>
|
