移除客服账号和话术管理页面中新增按钮的自定义样式类

src/api/assets/category/index.ts

@@ -0,0 +1,57 @@
+// import request from '/@/utils/request';
+import request, { newService } from '/@/utils/request';
+
+
+// 获取分类树
+export function getCategoryTree(query?: Object) {
+	return newService({
+		url: '/assets/category/getCategoryTree',
+		method: 'get',
+		params: query,
+	});
+}
+
+// 获取分类详情
+export function getCategory(id: string) {
+	return newService({
+		url: '/assets/category/getCategory',
+		method: 'get',
+		params: { id },
+	});
+}
+
+// 新增分类
+export function addCategory(data: object) {
+	return newService({
+		url: '/assets/category/addCategory',
+		method: 'post',
+		data: data,
+	});
+}
+
+// 修改分类
+export function updateCategory(data: object) {
+	return newService({
+		url: '/assets/category/updateCategory',
+		method: 'put',
+		data: data,
+	});
+}
+
+// 删除分类
+export function deleteCategory(id: string) {
+	return newService({
+		url: '/assets/category/deleteCategory',
+		method: 'delete',
+		params: { id },
+	});
+}
+
+// 更新分类状态
+export function updateCategoryStatus(id: string, status: number) {
+	return newService({
+		url: '/assets/category/updateCategoryStatus',
+		method: 'put',
+		data: { id, status },
+	});
+}

src/stores/bigUpload.ts

@@ -11,3 +11,4 @@ export const bigUpload = defineStore('bigUpload', {
         }
     },
 })
+ 

src/views/assets/category/component/editCategory.vue

@@ -0,0 +1,193 @@
+<template>
+	<div class="assets-edit-category-container">
+		<el-dialog :title="isEdit ? '修改分类' : '添加分类'" v-model="isShowDialog" width="500px">
+			<el-form ref="formRef" :model="ruleForm" :rules="rules" size="default" label-width="90px">
+				<el-form-item label="上级分类">
+					<el-cascader
+						v-model="ruleForm.parentId"
+						:options="categoryData"
+						:props="{ checkStrictly: true, emitPath: false, value: 'id', label: 'name', children: 'children' }"
+						placeholder="请选择上级分类"
+						clearable
+						class="w100"
+					/>
+				</el-form-item>
+				<el-form-item label="分类名称" prop="name">
+					<el-input v-model="ruleForm.name" placeholder="请输入分类名称" clearable />
+				</el-form-item>
+				<el-form-item label="类型" prop="type">
+					<el-select v-model="ruleForm.type" placeholder="请选择类型" class="w100">
+						<el-option label="商品" value="product" />
+						<el-option label="服务" value="service" />
+					</el-select>
+				</el-form-item>
+				<el-form-item label="排序">
+					<el-input-number v-model="ruleForm.sort" :min="0" :max="999" controls-position="right" placeholder="请输入排序" class="w100" />
+				</el-form-item>
+				<el-form-item label="状态">
+					<el-switch
+						v-model="ruleForm.status"
+						active-value="enabled"
+						inactive-value="disabled"
+						inline-prompt
+						active-text="显示"
+						inactive-text="隐藏"
+					/>
+				</el-form-item>
+			</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="submitLoading">{{ isEdit ? '修 改' : '添 加' }}</el-button>
+				</span>
+			</template>
+		</el-dialog>
+	</div>
+</template>
+
+<script lang="ts">
+export default {
+	name: 'assetsEditCategory',
+};
+</script>
+
+<script setup lang="ts">
+import { ref, reactive } from 'vue';
+import { ElMessage } from 'element-plus';
+import { getCategoryTree, getCategory, addCategory, updateCategory } from '/@/api/assets/category';
+
+interface CategoryRow {
+	id: string;
+	name: string;
+	level: number;
+	type: string;
+	status: string;
+	sort?: number;
+	children?: CategoryRow[] | null;
+}
+
+interface RuleForm {
+	id: string;
+	parentId: string;
+	name: string;
+	type: string;
+	sort: number;
+	status: string;
+}
+
+const emit = defineEmits(['getCategoryList']);
+
+const formRef = ref();
+const isShowDialog = ref(false);
+const isEdit = ref(false);
+const submitLoading = ref(false);
+const categoryData = ref<CategoryRow[]>([]);
+
+const ruleForm = reactive<RuleForm>({
+	id: '',
+	parentId: '',
+	name: '',
+	type: 'product',
+	sort: 0,
+	status: 'enabled',
+});
+
+const rules = {
+	name: [{ required: true, message: '分类名称不能为空', trigger: 'blur' }],
+	type: [{ required: true, message: '请选择类型', trigger: 'change' }],
+};
+
+// 重置表单
+const resetForm = () => {
+	ruleForm.id = '';
+	ruleForm.parentId = '';
+	ruleForm.name = '';
+	ruleForm.type = 'product';
+	ruleForm.sort = 0;
+	ruleForm.status = 'enabled';
+};
+
+// 打开弹窗
+const openDialog = (row?: CategoryRow | string, edit?: boolean) => {
+	resetForm();
+	isEdit.value = edit || false;
+
+	// 获取分类树数据
+	getCategoryTree().then((res: any) => {
+		categoryData.value = res.data?.tree ?? [];
+	});
+
+	if (row && typeof row === 'object' && edit) {
+		// 修改模式：获取详情
+		getCategory(row.id).then((res: any) => {
+			const data = res.data;
+			ruleForm.id = data.id || '';
+			ruleForm.parentId = data.parentId || '';
+			ruleForm.name = data.name || '';
+			ruleForm.type = data.type || 'product';
+			ruleForm.sort = data.sort || 0;
+			ruleForm.status = data.status || 'enabled';
+		});
+	} else if (row && typeof row === 'string') {
+		// 新增子分类模式：设置父级ID
+		ruleForm.parentId = row;
+	}
+
+	isShowDialog.value = true;
+};
+
+// 关闭弹窗
+const closeDialog = () => {
+	isShowDialog.value = false;
+};
+
+// 取消
+const onCancel = () => {
+	closeDialog();
+};
+
+// 提交
+const onSubmit = () => {
+	formRef.value.validate((valid: boolean) => {
+		if (valid) {
+			submitLoading.value = true;
+			const submitData = { ...ruleForm };
+
+			if (isEdit.value) {
+				// 修改
+				updateCategory(submitData)
+					.then(() => {
+						ElMessage.success('修改成功');
+						closeDialog();
+						emit('getCategoryList');
+					})
+					.finally(() => {
+						submitLoading.value = false;
+					});
+			} else {
+				// 新增
+				addCategory(submitData)
+					.then(() => {
+						ElMessage.success('添加成功');
+						closeDialog();
+						emit('getCategoryList');
+					})
+					.finally(() => {
+						submitLoading.value = false;
+					});
+			}
+		}
+	});
+};
+
+// 暴露方法
+defineExpose({
+	openDialog,
+});
+</script>
+
+<style scoped lang="scss">
+.w100 {
+	width: 100%;
+}
+</style>

src/views/assets/category/index.vue

@@ -0,0 +1,170 @@
+<template>
+	<div class="assets-category-container">
+		<el-card shadow="hover">
+			<div class="assets-category-search mb15">
+				<el-form :inline="true" :model="tableData.param">
+					<el-form-item label="名称">
+						<el-input size="default" v-model="tableData.param.name" placeholder="请输入分类名称" clearable style="width: 200px" />
+					</el-form-item>
+					<el-form-item label="分类">
+						<el-input size="default" v-model="tableData.param.type" placeholder="请输入分类" clearable style="width: 200px" />
+					</el-form-item>
+					<el-form-item>
+						<el-button size="default" type="primary" @click="getCategoryList">
+							<el-icon><ele-Search /></el-icon>
+							查询
+						</el-button>
+						<el-button size="default" type="success" @click="onOpenAddCategory()">
+							<el-icon><ele-FolderAdd /></el-icon>
+							新增
+						</el-button>
+					</el-form-item>
+				</el-form>
+			</div>
+			<el-table
+				:data="tableData.data"
+				style="width: 100%"
+				row-key="id"
+				default-expand-all
+				:tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
+				v-loading="tableData.loading"
+			>
+				<!-- <el-table-column type="index" label="序号" width="80" /> -->
+				<el-table-column prop="name" label="分类名称" show-overflow-tooltip min-width="180" />
+				<el-table-column prop="type" label="类型" width="100">
+					<template #default="scope">
+						<el-tag v-if="scope.row.type === 'product'" type="primary">商品</el-tag>
+						<el-tag v-else-if="scope.row.type === 'service'" type="success">服务</el-tag>
+					</template>
+				</el-table-column>
+				<el-table-column prop="sort" label="排序" width="80" />
+				<el-table-column prop="createdAt" label="创建时间" width="180" show-overflow-tooltip />
+				<el-table-column prop="updatedAt" label="修改时间" width="180" show-overflow-tooltip />
+				<el-table-column prop="status" label="状态" width="100">
+					<template #default="scope">
+						<el-switch
+							v-model="scope.row.status"
+							:active-value="1"
+							:inactive-value="0"
+							inline-prompt
+							active-text="显示"
+							inactive-text="隐藏"
+							@change="onStatusChange(scope.row)"
+						/>
+					</template>
+				</el-table-column>
+				<el-table-column label="操作" width="200" fixed="right">
+					<template #default="scope">
+						<el-button size="small" text type="primary" @click="onOpenAddCategory(scope.row)">新增</el-button>
+						<el-button size="small" text type="primary" @click="onOpenEditCategory(scope.row)">修改</el-button>
+						<el-button size="small" text type="danger" @click="onRowDel(scope.row)">删除</el-button>
+					</template>
+				</el-table-column>
+			</el-table>
+		</el-card>
+		<EditCategory ref="editCategoryRef" @getCategoryList="getCategoryList" />
+	</div>
+</template>
+
+<script lang="ts">
+export default {
+	name: 'assetsCategory',
+};
+</script>
+
+<script setup lang="ts">
+import { ref, reactive, onMounted } from 'vue';
+import { ElMessageBox, ElMessage } from 'element-plus';
+import EditCategory from './component/editCategory.vue';
+import { getCategoryTree, deleteCategory, updateCategoryStatus } from '/@/api/assets/category';
+
+interface CategoryRow {
+	id: string;
+	name: string;
+	level: number;
+	type: string;
+	status: number;
+	sort?: number;
+	createdAt: string;
+	updatedAt: string;
+	children?: CategoryRow[] | null;
+}
+
+const editCategoryRef = ref();
+const tableData = reactive({
+	data: [] as CategoryRow[],
+	loading: false,
+	param: {
+		name: '',
+		type: '',
+	},
+});
+
+// 获取分类列表
+const getCategoryList = () => {
+	tableData.loading = true;
+	getCategoryTree(tableData.param)
+		.then((res: any) => {
+			// 主类目不做展示，直接取主类目的children
+			const tree = res.data?.tree ?? [];
+			tableData.data = tree.length > 0 && tree[0].children ? tree[0].children : [];
+		})
+		.catch(() => {
+			tableData.data = [];
+		})
+		.finally(() => {
+			tableData.loading = false;
+		});
+};
+
+// 打开新增弹窗
+const onOpenAddCategory = (row?: CategoryRow) => {
+	editCategoryRef.value.openDialog(row?.id);
+};
+
+// 打开修改弹窗
+const onOpenEditCategory = (row: CategoryRow) => {
+	editCategoryRef.value.openDialog(row, true);
+};
+
+// 删除
+const onRowDel = (row: CategoryRow) => {
+	ElMessageBox.confirm(`此操作将永久删除分类："${row.name}"，是否继续?`, '提示', {
+		confirmButtonText: '确认',
+		cancelButtonText: '取消',
+		type: 'warning',
+	})
+		.then(() => {
+			deleteCategory(row.id).then(() => {
+				ElMessage.success('删除成功');
+				getCategoryList();
+			});
+		})
+		.catch(() => {});
+};
+
+// 状态切换
+const onStatusChange = (row: CategoryRow) => {
+	updateCategoryStatus(row.id, row.status)
+		.then(() => {
+			ElMessage.success('状态更新成功');
+		})
+		.catch(() => {
+			// 失败时恢复原状态
+			row.status = row.status === 1 ? 0 : 1;
+		});
+};
+
+onMounted(() => {
+	getCategoryList();
+});
+</script>
+
+<style scoped lang="scss">
+.assets-category-container {
+	.assets-category-search {
+		display: flex;
+		flex-wrap: wrap;
+	}
+}
+</style>

src/views/customerService/account/index.vue

@@ -27,7 +27,7 @@
 							</el-icon>
 							查询
 						</el-button>
-						<el-button size="default" type="success" class="ml10 op-btn-add" @click="onOpenAddRole">
+						<el-button size="default" type="success" class="ml10 " @click="onOpenAddRole">
 							<el-icon>
 								<ele-FolderAdd />
 							</el-icon>

src/views/customerService/script/index.vue

@@ -20,7 +20,7 @@
 							</el-icon>
 							重置
 						</el-button>
-						<el-button size="default" type="success" class="op-btn-add" @click="handleAdd">
+						<el-button size="default" type="success"  @click="handleAdd">
 							<el-icon><FolderAdd /></el-icon>
 							新增话术
 						</el-button>