<template>
|
<view class="after-sales-handle">
|
<PageHeader :title="operationType === 'approve' ? '售后处理' : '售后详情'" @back="goBack" />
|
|
<view class="form-container">
|
<up-form ref="formRef" :model="form" :rules="rules" label-width="100">
|
<up-form-item label="反馈日期" prop="feedbackDate">
|
<up-input v-model="form.feedbackDate" disabled />
|
</up-form-item>
|
|
<up-form-item label="登记人" prop="checkNickName">
|
<up-input v-model="form.checkNickName" disabled />
|
</up-form-item>
|
|
<up-form-item label="客户名称" prop="customerName">
|
<up-input v-model="form.customerName" disabled />
|
</up-form-item>
|
|
<up-form-item label="问题描述" prop="proDesc" required>
|
<up-textarea v-model="form.proDesc" :disabled="operationType === 'view'" placeholder="请输入问题描述" count autoHeight></up-textarea>
|
</up-form-item>
|
|
<up-form-item label="处理结果" prop="disRes" required>
|
<up-textarea v-model="form.disRes" :disabled="operationType === 'view'" placeholder="请输入处理结果" count autoHeight></up-textarea>
|
</up-form-item>
|
|
<up-form-item label="处理人" prop="disposeNickName" v-if="form.disposeNickName || operationType === 'approve'">
|
<up-input v-model="form.disposeNickName" disabled />
|
</up-form-item>
|
|
<up-form-item label="处理日期" prop="disDate" v-if="form.disDate || operationType === 'approve'">
|
<up-input v-model="form.disDate" disabled />
|
</up-form-item>
|
</up-form>
|
</view>
|
|
<FooterButtons :show="operationType === 'approve'" cancelText="取消" confirmText="提交" @cancel="goBack" @confirm="submitForm" />
|
</view>
|
</template>
|
|
<script setup>
|
import { ref, reactive, onMounted } from 'vue';
|
import { afterSalesServiceDispose } from '@/api/customerService/index';
|
import PageHeader from '@/components/PageHeader.vue';
|
import FooterButtons from '@/components/FooterButtons.vue';
|
import useUserStore from '@/store/modules/user';
|
|
const userStore = useUserStore();
|
const operationType = ref('view');
|
const formRef = ref(null);
|
const form = reactive({
|
id: null,
|
feedbackDate: '',
|
checkUserId: null,
|
checkNickName: '',
|
customerName: '',
|
proDesc: '',
|
disRes: '',
|
disposeUserId: null,
|
disposeNickName: '',
|
disDate: '',
|
});
|
|
const rules = {
|
proDesc: [{ required: true, message: '请输入问题描述', trigger: 'blur' }],
|
disRes: [{ required: true, message: '请输入处理结果', trigger: 'blur' }],
|
};
|
|
const goBack = () => {
|
uni.navigateBack();
|
};
|
|
const submitForm = () => {
|
formRef.value.validate().then(valid => {
|
if (valid) {
|
afterSalesServiceDispose(form).then(() => {
|
uni.showToast({ title: '处理成功', icon: 'success' });
|
setTimeout(() => goBack(), 1500);
|
});
|
}
|
});
|
};
|
|
onMounted(() => {
|
operationType.value = uni.getStorageSync('afterSalesHandleType') || 'view';
|
const dataStr = uni.getStorageSync('afterSalesHandleData');
|
|
if (dataStr) {
|
const data = JSON.parse(dataStr);
|
Object.assign(form, data);
|
|
// Normalize field names if they differ between API and web view
|
if (!form.proDesc) form.proDesc = data.disRes; // Fallback to disRes if proDesc is empty
|
|
if (operationType.value === 'approve') {
|
if (!form.disposeUserId) {
|
form.disposeUserId = userStore.id;
|
form.disposeNickName = userStore.nickName;
|
}
|
if (!form.disDate) {
|
const now = new Date();
|
form.disDate = `${now.getFullYear()}-${String(now.getMonth() + 1).padStart(2, '0')}-${String(now.getDate()).padStart(2, '0')}`;
|
}
|
}
|
}
|
});
|
</script>
|
|
<style scoped lang="scss">
|
.after-sales-handle {
|
min-height: 100vh;
|
background: #f8f9fa;
|
padding-bottom: 100px;
|
}
|
|
.form-container {
|
background: #ffffff;
|
padding: 10px 20px;
|
margin-top: 10px;
|
}
|
</style>
|
