完善请求

2025-12-01 16:30:31 +08:00
parent 4128cd8c7b
commit 91ce6a597d
12 changed files with 402 additions and 225 deletions
--- a/src/views/customerService/account/component/editAccount.vue
+++ b/src/views/customerService/account/component/editAccount.vue
@@ -0,0 +1,181 @@
+<template>
+	<div class="system-edit-role-container">
+		<el-dialog :title="(formData.id ? '修改' : '添加') + '客服账号'" v-model="isShowDialog" width="769px">
+			<el-form ref="formRef" :model="formData" :rules="rules" size="default" label-width="90px">
+				<el-row :gutter="35">
+					<!-- 客服ID输入框 -->
+					<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
+						<el-form-item label="客服ID" prop="customerServiceId">
+							<el-input v-model="formData.customerServiceId" placeholder="请输入客服ID，如：CS001" clearable />
+						</el-form-item>
+					</el-col>
+
+					<!-- 客服平台选择 -->
+					<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
+						<el-form-item label="客服平台" prop="platform">
+							<el-select v-model="formData.platform" placeholder="请选择客服平台" clearable style="width: 100%">
+								<el-option label="小红书" value="小红书" />
+								<el-option label="抖音" value="抖音" />
+								<el-option label="快手" value="快手" />
+							</el-select>
+						</el-form-item>
+					</el-col>
+				</el-row>
+			</el-form>
+
+			<template #footer>
+				<span class="dialog-footer">
+					<el-button @click="onCancel" size="default">取 消</el-button>
+					<el-button type="primary" @click="onSubmit" size="default" :loading="loading">
+						{{ formData.id ? '修 改' : '新 增' }}
+					</el-button>
+				</span>
+			</template>
+		</el-dialog>
+	</div>
+</template>
+
+<script lang="ts" setup>
+import { ref, reactive, toRefs, nextTick } from 'vue';
+import { ElMessage, type FormInstance, type FormRules } from 'element-plus';
+import { getaccountAdd, updateaccount } from '/@/api/customerService/account';
+
+interface DialogFormData {
+	id?: string;
+	customerServiceId: string;
+	platform: string;
+	status: number;
+	creator: '';
+	modifier: '';
+}
+
+const emit = defineEmits<{
+	(e: 'getRoleList'): void;
+}>();
+
+const state = reactive({
+	loading: false,
+	isShowDialog: false,
+	formData: {
+		id: '',
+		customerServiceId: '',
+		platform: '',
+		status: 1,
+		creator: '',
+		modifier: '',
+	} as DialogFormData,
+});
+
+const rules: FormRules = {
+	customerServiceId: [
+		{ required: true, message: '客服ID不能为空', trigger: 'blur' },
+		{ min: 2, max: 50, message: '客服ID长度在 2 到 50 个字符', trigger: 'blur' },
+	],
+	platform: [{ required: true, message: '请选择客服平台', trigger: 'change' }],
+};
+
+const formRef = ref<FormInstance>();
+const { loading, isShowDialog, formData } = toRefs(state);
+
+/**
+ * 打开对话框
+ */
+const openDialog = (row?: DialogFormData) => {
+	resetForm();
+
+	if (row && row.id) {
+		// 编辑模式：填充数据
+		state.formData = { ...row };
+	} else {
+		// 新增模式：重置ID和状态
+		state.formData.id = '';
+		state.formData.status = 1;
+	}
+
+	state.isShowDialog = true;
+
+	// 下次DOM更新后清除验证
+	nextTick(() => {
+		formRef.value?.clearValidate();
+	});
+};
+
+/**
+ * 关闭对话框
+ */
+const closeDialog = () => {
+	state.isShowDialog = false;
+};
+
+/**
+ * 取消操作
+ */
+const onCancel = () => {
+	closeDialog();
+};
+
+/**
+ * 提交表单
+ */
+const onSubmit = async () => {
+	if (!formRef.value) return;
+
+	try {
+		const valid = await formRef.value.validate();
+		if (!valid) return;
+
+		state.loading = true;
+
+		if (state.formData.id) {
+			// 修改操作 - 不包含状态字段
+			const updateData = {
+				id: state.formData.id,
+				customerServiceId: state.formData.customerServiceId,
+				platform: state.formData.platform,
+				// 注意：修改时不传递status，状态通过单独的开关控制\
+			};
+			await updateaccount(updateData);
+			ElMessage.success('修改成功');
+		} else {
+			// 新增操作
+			await getaccountAdd(state.formData);
+			ElMessage.success('添加成功');
+		}
+
+		closeDialog();
+		emit('getRoleList');
+	} catch (error) {
+		console.error('操作失败:', error);
+		ElMessage.error(state.formData.id ? '修改失败' : '添加失败');
+	} finally {
+		state.loading = false;
+	}
+};
+
+/**
+ * 重置表单
+ */
+const resetForm = () => {
+	state.formData = {
+		id: '',
+		customerServiceId: '',
+		platform: '',
+		status: 1,
+		creator: '',
+		modifier: '',
+	};
+};
+
+defineExpose({
+	openDialog,
+	closeDialog,
+});
+</script>
+
+<style scoped>
+.status-tip {
+	font-size: 12px;
+	color: #999;
+	margin-top: 5px;
+}
+</style>