<template>
|
<view class="after-sales-handling">
|
<PageHeader title="售后处理" @back="goBack" />
|
|
<!-- 搜索和筛选区域 -->
|
<view class="search-section">
|
<view class="search-bar">
|
<view class="search-input">
|
<up-input class="search-text" placeholder="请输入工单编号搜索" v-model="searchForm.afterSalesServiceNo" @change="handleQuery" clearable />
|
</view>
|
<view class="filter-button" @click="handleQuery">
|
<up-icon name="search" size="24" color="#999"></up-icon>
|
</view>
|
</view>
|
</view>
|
|
<!-- 售后处理列表 -->
|
<view class="ledger-list" v-if="tableData.length > 0">
|
<view v-for="(item, index) in tableData" :key="index" class="ledger-item" @click="openHandleForm('view', item)">
|
<view class="item-header">
|
<view class="item-left">
|
<view class="document-icon">
|
<up-icon name="file-text" size="16" color="#ffffff"></up-icon>
|
</view>
|
<text class="item-id">{{ item.afterSalesServiceNo }}</text>
|
</view>
|
<view class="item-tag">
|
<up-tag :text="getStatusLabel(item.status)" :type="getStatusType(item.status)" size="mini"></up-tag>
|
</view>
|
</view>
|
<up-divider></up-divider>
|
<view class="item-details">
|
<view class="detail-row">
|
<text class="detail-label">销售单号</text>
|
<text class="detail-value">{{ item.salesContractNo }}</text>
|
</view>
|
<view class="detail-row">
|
<text class="detail-label">客户名称</text>
|
<text class="detail-value">{{ item.customerName }}</text>
|
</view>
|
<view class="detail-row">
|
<text class="detail-label">反馈日期</text>
|
<text class="detail-value">{{ item.feedbackDate }}</text>
|
</view>
|
<view class="detail-row">
|
<text class="detail-label">售后类型</text>
|
<text class="detail-value">{{ getDictLabel(post_sale_waiting_list, item.serviceType) }}</text>
|
</view>
|
<view class="detail-row">
|
<text class="detail-label">紧急程度</text>
|
<text class="detail-value">{{ getDictLabel(degree_of_urgency, item.urgency) }}</text>
|
</view>
|
<view class="detail-row">
|
<text class="detail-label">问题描述</text>
|
<text class="detail-value">{{ item.proDesc || item.disRes }}</text>
|
</view>
|
<view class="detail-row" v-if="item.status === 2">
|
<text class="detail-label">处理结果</text>
|
<text class="detail-value highlight">{{ item.disRes }}</text>
|
</view>
|
</view>
|
<up-divider></up-divider>
|
<view class="detail-buttons">
|
<up-button size="small" type="primary" v-if="item.status === 1" @click.stop="openHandleForm('approve', item)">处理</up-button>
|
<up-button size="small" type="primary" plain @click.stop="openHandleForm('view', item)">查看</up-button>
|
<up-button size="small" type="info" plain @click.stop="openFiles(item)">附件</up-button>
|
</view>
|
</view>
|
</view>
|
<view v-else class="no-data">
|
<text>暂无售后处理数据</text>
|
</view>
|
</view>
|
</template>
|
|
<script setup>
|
import { ref, reactive, computed } from 'vue';
|
import { onShow } from '@dcloudio/uni-app';
|
import { afterSalesServiceListPage } from '@/api/customerService/index';
|
import PageHeader from '@/components/PageHeader.vue';
|
import { useDict } from '@/utils/dict';
|
|
const { post_sale_waiting_list, degree_of_urgency } = useDict('post_sale_waiting_list', 'degree_of_urgency');
|
|
const searchForm = reactive({
|
afterSalesServiceNo: '',
|
status: '',
|
});
|
|
const tableData = ref([]);
|
const loading = ref(false);
|
const page = reactive({
|
current: 1,
|
size: 20,
|
total: 0,
|
});
|
|
const goBack = () => {
|
uni.navigateBack();
|
};
|
|
const handleQuery = () => {
|
page.current = 1;
|
getList();
|
};
|
|
const getList = () => {
|
loading.value = true;
|
uni.showLoading({ title: '加载中...' });
|
|
afterSalesServiceListPage({ ...searchForm, ...page })
|
.then((res) => {
|
const records = res?.data?.records ?? res?.records ?? [];
|
const total = res?.data?.total ?? res?.total ?? 0;
|
tableData.value = Array.isArray(records) ? records : [];
|
page.total = Number.isFinite(Number(total)) ? Number(total) : 0;
|
})
|
.finally(() => {
|
loading.value = false;
|
uni.hideLoading();
|
});
|
};
|
|
const getStatusLabel = (status) => {
|
if (status === 1) return '待处理';
|
if (status === 2) return '已处理';
|
return '未知';
|
};
|
|
const getStatusType = (status) => {
|
if (status === 1) return 'error';
|
if (status === 2) return 'success';
|
return 'info';
|
};
|
|
const getDictLabel = (dict, value) => {
|
if (!dict || !dict.value) return value;
|
const item = dict.value.find(i => i.value == value);
|
return item ? item.label : value;
|
};
|
|
const openHandleForm = (type, row) => {
|
uni.setStorageSync('afterSalesHandleType', type);
|
uni.setStorageSync('afterSalesHandleData', JSON.stringify(row));
|
uni.navigateTo({
|
url: '/pages/customerService/afterSalesHandling/handle'
|
});
|
};
|
|
const openFiles = (row) => {
|
uni.setStorageSync('afterSalesFileData', JSON.stringify(row));
|
uni.setStorageSync('afterSalesServiceFileId', row?.id);
|
uni.navigateTo({
|
url: '/pages/customerService/afterSalesHandling/fileList'
|
});
|
};
|
|
onShow(() => {
|
getList();
|
});
|
</script>
|
|
<style scoped lang="scss">
|
@import "@/styles/sales-common.scss";
|
|
.after-sales-handling {
|
min-height: 100vh;
|
background: #f8f9fa;
|
}
|
|
.detail-buttons {
|
display: flex;
|
gap: 10px;
|
justify-content: flex-end;
|
padding: 12px 0;
|
}
|
|
.ledger-item {
|
padding: 0 16px;
|
}
|
</style>
|
