接待 补充

This commit is contained in:
ZLI263
2025-11-27 09:44:19 +08:00
parent 1ccfa25781
commit cca9a36276
2 changed files with 1029 additions and 25 deletions

View File

@@ -35,6 +35,12 @@
@click="switchTab('performance')">
<text>服务表现</text>
</view>
<view
class="tab-item"
:class="{ active: activeTab === 'reception' }"
@click="switchTab('reception')">
<text>开始接待</text>
</view>
</view>
<!-- 服务状态列表 -->
@@ -95,6 +101,93 @@
<view class="performance-content" v-if="activeTab === 'performance'">
<text class="empty-text">服务表现内容</text>
</view>
<!-- 开始接待表单 -->
<scroll-view class="reception-form" scroll-y v-if="activeTab === 'reception'">
<view class="form-card">
<view class="form-item">
<text class="form-item__label">客户姓名</text>
<input
class="form-item__input"
v-model="receptionForm.customerName"
placeholder="请输入客户姓名"
placeholder-style="color: #9ca3af"
/>
</view>
<view class="form-item">
<text class="form-item__label">客户电话</text>
<input
class="form-item__input"
v-model="receptionForm.contact"
type="number"
placeholder="请输入客户电话"
placeholder-style="color: #9ca3af"
/>
</view>
<view class="form-item">
<text class="form-item__label">性别</text>
<picker
mode="selector"
:range="genderOptions"
:value="genderIndex"
@change="onGenderChange"
>
<view class="form-item__picker">
<text :class="receptionForm.gender ? 'form-item__picker-text' : 'form-item__picker-placeholder'">
{{ receptionForm.gender || '请选择性别' }}
</text>
<text class="form-item__picker-icon"></text>
</view>
</picker>
</view>
<view class="form-item">
<text class="form-item__label">年龄</text>
<input
class="form-item__input"
v-model="receptionForm.age"
type="number"
placeholder="请输入年龄"
placeholder-style="color: #9ca3af"
/>
</view>
<view class="form-item">
<text class="form-item__label">销售姓名</text>
<input
class="form-item__input"
v-model="receptionForm.salesName"
placeholder="请输入销售姓名"
placeholder-style="color: #9ca3af"
/>
</view>
<view class="form-item">
<text class="form-item__label">销售电话</text>
<input
class="form-item__input"
v-model="receptionForm.salesPhone"
type="number"
placeholder="请输入销售电话"
placeholder-style="color: #9ca3af"
/>
</view>
<view class="form-item">
<text class="form-item__label">住址</text>
<input
class="form-item__input"
v-model="receptionForm.detailedAddress"
placeholder="请输入详细住址"
placeholder-style="color: #9ca3af"
/>
</view>
</view>
<view class="form-actions">
<view class="form-btn form-btn--cancel" @click="onCancel">
<text class="form-btn__text">取消</text>
</view>
<view class="form-btn form-btn--save" @click="onSave">
<text class="form-btn__text">保存</text>
</view>
</view>
</scroll-view>
</view>
</view>
</template>
@@ -103,6 +196,8 @@
// #ifdef APP
import statusBar from "@/uni_modules/uni-nav-bar/components/uni-nav-bar/uni-status-bar";
// #endif
import { API_BASE_URL } from "@/common/config.js";
export default {
// #ifdef APP
components: {
@@ -112,6 +207,17 @@
data() {
return {
activeTab: 'status',
genderOptions: ["男", "女"],
genderIndex: -1,
receptionForm: {
customerName: "",
contact: "",
gender: "",
age: "",
salesName: "",
salesPhone: "",
detailedAddress: ""
},
serviceStatusList: [
{
staffName: '三多',
@@ -160,6 +266,108 @@
viewServiceDetail(item) {
// 查看服务详情
console.log('查看服务详情', item);
},
onGenderChange(e) {
this.genderIndex = e.detail.value;
this.receptionForm.gender = this.genderOptions[e.detail.value];
},
onCancel() {
// 重置表单
this.receptionForm = {
customerName: "",
contact: "",
gender: "",
age: "",
salesName: "",
salesPhone: "",
detailedAddress: ""
};
this.genderIndex = -1;
uni.showToast({
title: "已取消",
icon: "none"
});
},
async onSave() {
// 表单验证
if (!this.receptionForm.customerName) {
uni.showToast({
title: "请输入客户姓名",
icon: "none"
});
return;
}
if (!this.receptionForm.contact) {
uni.showToast({
title: "请输入客户电话",
icon: "none"
});
return;
}
// 构建请求参数
const params = {
customerName: this.receptionForm.customerName,
contact: this.receptionForm.contact,
dealershipId: "",
dealershipName: "",
salesId: "",
salesName: this.receptionForm.salesName || "",
recordingCount: 0,
intendedModel: "",
infoCard: "",
createTime: "",
updateTime: "",
remark: "",
detailedAddress: this.receptionForm.detailedAddress || "",
salesPhone: this.receptionForm.salesPhone || "",
contactCount: 0
};
try {
uni.showLoading({
title: "保存中..."
});
// 构建URL
let url;
// #ifdef H5
url = `/api/customerManagement/add`;
// #endif
// #ifndef H5
url = `${API_BASE_URL}api/customerManagement/add`;
// #endif
const res = await uni.request({
url: url,
method: "POST",
data: params,
timeout: 10000
});
uni.hideLoading();
if (res.statusCode === 200 && res.data && res.data.success) {
uni.showToast({
title: "保存成功",
icon: "success"
});
// 保存成功后重置表单
this.onCancel();
} else {
uni.showToast({
title: res.data?.message || "保存失败",
icon: "none"
});
}
} catch (error) {
uni.hideLoading();
console.error("保存失败:", error);
uni.showToast({
title: "保存失败,请重试",
icon: "none"
});
}
}
}
}
@@ -433,4 +641,111 @@
font-size: 28rpx;
color: #999;
}
/* 开始接待表单样式 */
.reception-form {
height: calc(100vh - 300rpx);
background-color: #F5F5F5;
padding: 24rpx 32rpx;
}
.form-card {
background-color: #ffffff;
border-radius: 16rpx;
padding: 32rpx 24rpx;
box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.04);
margin-bottom: 32rpx;
}
.form-item {
display: flex;
align-items: center;
margin-bottom: 32rpx;
}
.form-item:last-child {
margin-bottom: 0;
}
.form-item__label {
font-size: 28rpx;
color: #333;
font-weight: 500;
width: 160rpx;
flex-shrink: 0;
}
.form-item__input {
flex: 1;
height: 88rpx;
background-color: #f9fafb;
border-radius: 12rpx;
padding: 0 24rpx;
font-size: 28rpx;
color: #333;
box-sizing: border-box;
}
.form-item__picker {
flex: 1;
height: 88rpx;
background-color: #f9fafb;
border-radius: 12rpx;
padding: 0 24rpx;
display: flex;
align-items: center;
justify-content: space-between;
box-sizing: border-box;
}
.form-item__picker-text {
font-size: 28rpx;
color: #333;
}
.form-item__picker-placeholder {
font-size: 28rpx;
color: #9ca3af;
}
.form-item__picker-icon {
font-size: 24rpx;
color: #9ca3af;
}
.form-actions {
display: flex;
gap: 24rpx;
padding-bottom: 40rpx;
}
.form-btn {
flex: 1;
height: 88rpx;
border-radius: 12rpx;
display: flex;
align-items: center;
justify-content: center;
}
.form-btn--cancel {
background-color: #f3f4f6;
}
.form-btn--save {
background-color: #007AFF;
}
.form-btn__text {
font-size: 32rpx;
font-weight: 500;
}
.form-btn--cancel .form-btn__text {
color: #6b7280;
}
.form-btn--save .form-btn__text {
color: #ffffff;
}
</style>