销售接待页面，逻辑开发。
This commit is contained in:
zhonghua1
@@ -298,27 +298,29 @@
|
||||
placeholder-style="color: #9ca3af"
|
||||
/>
|
||||
</view>
|
||||
<view class="form-item">
|
||||
<view class="form-item form-item--textarea">
|
||||
<text class="form-item__label">详情</text>
|
||||
<input
|
||||
class="form-item__input"
|
||||
<textarea
|
||||
class="form-item__textarea"
|
||||
v-model="tagForm.detail"
|
||||
placeholder="请输入详情"
|
||||
placeholder-style="color: #9ca3af"
|
||||
:maxlength="500"
|
||||
auto-height
|
||||
/>
|
||||
</view>
|
||||
<view class="form-item">
|
||||
<view class="form-item form-item--textarea">
|
||||
<text class="form-item__label">备注</text>
|
||||
<input
|
||||
class="form-item__input"
|
||||
<textarea
|
||||
class="form-item__textarea"
|
||||
v-model="tagForm.remark"
|
||||
placeholder="请输入备注"
|
||||
placeholder-style="color: #9ca3af"
|
||||
:maxlength="500"
|
||||
auto-height
|
||||
/>
|
||||
</view>
|
||||
<view class="form-item">
|
||||
<view class="form-item form-item--switch">
|
||||
<text class="form-item__label">是否启用</text>
|
||||
<switch
|
||||
:checked="tagForm.enabled"
|
||||
@@ -373,6 +375,15 @@
|
||||
placeholder-style="color: #9ca3af"
|
||||
/>
|
||||
</view>
|
||||
<view class="supplement-form-item">
|
||||
<text class="supplement-form-item__label">录音名</text>
|
||||
<input
|
||||
class="supplement-form-item__input"
|
||||
v-model="supplementForm.recordingName"
|
||||
placeholder="请输入录音名"
|
||||
placeholder-style="color: #9ca3af"
|
||||
/>
|
||||
</view>
|
||||
<view class="supplement-form-item">
|
||||
<text class="supplement-form-item__label">客户详细地址</text>
|
||||
<textarea
|
||||
@@ -482,6 +493,7 @@ import CommonBeginReception from "./common_begin_reception.vue";
|
||||
supplementForm: {
|
||||
customerName: "",
|
||||
contact: "",
|
||||
recordingName: "",
|
||||
remarks: ""
|
||||
}
|
||||
}
|
||||
@@ -718,6 +730,8 @@ import CommonBeginReception from "./common_begin_reception.vue";
|
||||
status: record.syncStatus || '服务中',
|
||||
customerName: record.customerName || '',
|
||||
customerPhone: record.customerPhone || '',
|
||||
customerId: record.customerId || '',
|
||||
recordingName: record.recordingName || '',
|
||||
tags,
|
||||
durationText: formattedUpdateTime ? `最近更新时间：${formattedUpdateTime}` : '最近暂无更新时间'
|
||||
};
|
||||
@@ -841,6 +855,7 @@ import CommonBeginReception from "./common_begin_reception.vue";
|
||||
this.supplementForm = {
|
||||
customerName: item.customerName || "",
|
||||
contact: item.customerPhone || "",
|
||||
recordingName: item.recordingName || "",
|
||||
remarks: item.remarks || ""
|
||||
};
|
||||
this.showSupplementModal = true;
|
||||
@@ -851,6 +866,7 @@ import CommonBeginReception from "./common_begin_reception.vue";
|
||||
this.supplementForm = {
|
||||
customerName: "",
|
||||
contact: "",
|
||||
recordingName: "",
|
||||
remarks: ""
|
||||
};
|
||||
},
|
||||
@@ -902,8 +918,10 @@ import CommonBeginReception from "./common_begin_reception.vue";
|
||||
// 构建请求参数（必须包含id）
|
||||
const params = {
|
||||
id: this.currentSupplementItem.id,
|
||||
customerId: this.currentSupplementItem.customerId || "",
|
||||
customerName: this.supplementForm.customerName?.trim() || "",
|
||||
customerPhone: trimmedContact || "",
|
||||
recordingName: this.supplementForm.recordingName?.trim() || "",
|
||||
remarks: this.supplementForm.remarks?.trim() || ""
|
||||
};
|
||||
|
||||
@@ -1878,107 +1896,229 @@ import CommonBeginReception from "./common_begin_reception.vue";
|
||||
|
||||
.tag-form {
|
||||
height: 100%;
|
||||
padding: 24rpx 32rpx;
|
||||
padding: 32rpx;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
/* 标签弹窗整体高度控制在 70% 视窗，内部通过尺寸缩减而非拉伸变形 */
|
||||
.tag-management {
|
||||
max-height: 70vh;
|
||||
/* 表单卡片样式 */
|
||||
.form-card {
|
||||
background-color: #FFFFFF;
|
||||
border-radius: 24rpx;
|
||||
padding: 32rpx;
|
||||
margin-bottom: 32rpx;
|
||||
box-shadow: 0 2rpx 16rpx rgba(0, 0, 0, 0.06);
|
||||
}
|
||||
|
||||
.tag-management .tag-form {
|
||||
max-height: 70vh;
|
||||
/* 表单项样式 */
|
||||
.form-item {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin-bottom: 32rpx;
|
||||
}
|
||||
|
||||
/* 弹窗内部元素高度约 80%（缩减 padding/字号/高度），保持比例一致 */
|
||||
.tag-management .form-card {
|
||||
padding: 24rpx 20rpx;
|
||||
margin-bottom: 24rpx;
|
||||
.form-item:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.tag-management .form-item {
|
||||
margin-bottom: 24rpx;
|
||||
}
|
||||
|
||||
.tag-management .form-item__label {
|
||||
font-size: 26rpx;
|
||||
}
|
||||
|
||||
.tag-management .form-item__input,
|
||||
.tag-management .form-item__text,
|
||||
.tag-management .form-item__picker,
|
||||
.tag-management .tag-select {
|
||||
height: 70rpx; /* 约为原 88rpx 的 80% */
|
||||
padding: 0 20rpx;
|
||||
font-size: 26rpx;
|
||||
}
|
||||
|
||||
.tag-management .form-item__picker-icon {
|
||||
font-size: 22rpx;
|
||||
}
|
||||
|
||||
.tag-management .tag-select-dropdown__item {
|
||||
padding: 16rpx 28rpx;
|
||||
}
|
||||
|
||||
.tag-management .tag-select-dropdown__item text {
|
||||
font-size: 26rpx;
|
||||
}
|
||||
|
||||
.tag-management .form-item__textarea {
|
||||
padding: 16rpx;
|
||||
font-size: 26rpx;
|
||||
/* 表单项标签样式 */
|
||||
.form-item__label {
|
||||
font-size: 28rpx;
|
||||
color: #333333;
|
||||
font-weight: 500;
|
||||
margin-bottom: 16rpx;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
/* 详情与备注区域缩到约 50% 高度 */
|
||||
.tag-management .form-item__textarea--detail {
|
||||
min-height: 60rpx;
|
||||
}
|
||||
|
||||
.tag-management .form-item__textarea--remark {
|
||||
min-height: 50rpx;
|
||||
}
|
||||
|
||||
.tag-management .form-actions {
|
||||
padding-bottom: 24rpx;
|
||||
gap: 16rpx;
|
||||
}
|
||||
|
||||
.tag-management .form-btn {
|
||||
height: 72rpx; /* 约为原 88rpx 的 80% */
|
||||
/* 输入框样式 */
|
||||
.form-item__input {
|
||||
width: 100%;
|
||||
height: 88rpx;
|
||||
background-color: #F9FAFB;
|
||||
border: 2rpx solid #E5E7EB;
|
||||
border-radius: 16rpx;
|
||||
padding: 0 24rpx;
|
||||
font-size: 28rpx;
|
||||
color: #333333;
|
||||
box-sizing: border-box;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
|
||||
.form-item__input:focus {
|
||||
border-color: #007AFF;
|
||||
background-color: #FFFFFF;
|
||||
box-shadow: 0 0 0 4rpx rgba(0, 122, 255, 0.1);
|
||||
}
|
||||
|
||||
/* 文本域样式 */
|
||||
.form-item__textarea {
|
||||
flex: 1;
|
||||
min-height: 100rpx;
|
||||
background-color: #f9fafb;
|
||||
border-radius: 12rpx;
|
||||
padding: 24rpx;
|
||||
width: 100%;
|
||||
min-height: 160rpx;
|
||||
background-color: #F9FAFB;
|
||||
border: 2rpx solid #E5E7EB;
|
||||
border-radius: 16rpx;
|
||||
padding: 20rpx 24rpx;
|
||||
font-size: 28rpx;
|
||||
color: #333;
|
||||
color: #333333;
|
||||
box-sizing: border-box;
|
||||
line-height: 1.6;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
.form-item__textarea--detail {
|
||||
min-height: 100rpx;
|
||||
|
||||
.form-item__textarea:focus {
|
||||
border-color: #007AFF;
|
||||
background-color: #FFFFFF;
|
||||
box-shadow: 0 0 0 4rpx rgba(0, 122, 255, 0.1);
|
||||
}
|
||||
|
||||
.form-item__textarea--remark {
|
||||
min-height: 88rpx;
|
||||
|
||||
/* 标签选择器样式 */
|
||||
.tag-select-wrapper {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
/* 确保包含 textarea 的表单项 label 在顶部对齐 */
|
||||
.form-item--textarea .form-item__label {
|
||||
padding-top: 24rpx;
|
||||
|
||||
.tag-select {
|
||||
width: 100%;
|
||||
height: 88rpx;
|
||||
background-color: #F9FAFB;
|
||||
border: 2rpx solid #E5E7EB;
|
||||
border-radius: 16rpx;
|
||||
padding: 0 24rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
box-sizing: border-box;
|
||||
cursor: pointer;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
|
||||
.tag-select:active {
|
||||
border-color: #007AFF;
|
||||
background-color: #FFFFFF;
|
||||
box-shadow: 0 0 0 4rpx rgba(0, 122, 255, 0.1);
|
||||
}
|
||||
|
||||
.form-item__picker-text {
|
||||
font-size: 28rpx;
|
||||
color: #333333;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.form-item__picker-placeholder {
|
||||
font-size: 28rpx;
|
||||
color: #9CA3AF;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
/* 下拉菜单样式 */
|
||||
.tag-select-dropdown {
|
||||
position: absolute;
|
||||
top: 100%;
|
||||
left: 0;
|
||||
right: 0;
|
||||
background-color: #FFFFFF;
|
||||
border: 2rpx solid #E5E7EB;
|
||||
border-radius: 16rpx;
|
||||
margin-top: 8rpx;
|
||||
box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.12);
|
||||
z-index: 100;
|
||||
overflow: hidden;
|
||||
max-height: 400rpx;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.tag-select-dropdown__item {
|
||||
padding: 24rpx;
|
||||
border-bottom: 1rpx solid #F3F4F6;
|
||||
transition: background-color 0.2s ease;
|
||||
}
|
||||
|
||||
.tag-select-dropdown__item:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.tag-select-dropdown__item:active {
|
||||
background-color: #F9FAFB;
|
||||
}
|
||||
|
||||
.tag-select-dropdown__item text {
|
||||
font-size: 28rpx;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.tag-select-dropdown__item text.active {
|
||||
color: #007AFF;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
/* 下拉菜单遮罩 */
|
||||
.tag-select-mask {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
background-color: transparent;
|
||||
z-index: 99;
|
||||
}
|
||||
|
||||
/* 开关类型表单项 - 横向布局 */
|
||||
.form-item--switch {
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.form-item--switch .form-item__label {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
/* 开关样式 */
|
||||
.form-item switch {
|
||||
margin-left: auto;
|
||||
transform: scale(0.9);
|
||||
}
|
||||
|
||||
/* 表单操作按钮区域 */
|
||||
.form-actions {
|
||||
display: flex;
|
||||
gap: 24rpx;
|
||||
padding-top: 16rpx;
|
||||
}
|
||||
|
||||
.form-btn {
|
||||
flex: 1;
|
||||
height: 88rpx;
|
||||
border-radius: 16rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 30rpx;
|
||||
font-weight: 500;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
.form-btn--cancel {
|
||||
background-color: #F3F4F6;
|
||||
color: #6B7280;
|
||||
}
|
||||
|
||||
.form-btn--cancel:active {
|
||||
background-color: #E5E7EB;
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
.form-btn--save {
|
||||
background-color: #007AFF;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
.form-btn--save:active {
|
||||
background-color: #0056CC;
|
||||
opacity: 0.9;
|
||||
}
|
||||
|
||||
.form-btn__text {
|
||||
font-size: 30rpx;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
/* 补录弹窗样式 */
|
||||
|
||||
Reference in New Issue
Block a user