修复富文本

2025-12-08 14:54:23 +08:00
parent eba8a924a9
commit 38473ab30a
9 changed files with 136 additions and 113 deletions
--- a/src/views/customerService/account/index.vue
+++ b/src/views/customerService/account/index.vue
@@ -286,7 +286,7 @@ const onOpenAddRole = () => {
 /**
 * 打开编辑客服对话框
 */
-const onOpenEditRole = (row: TableDataItem) => {
+const onOpenEditRole = (row: any) => {
 	editRoleRef.value?.openDialog(row);
 };

--- a/src/views/customerService/product/component/editRole.vue
+++ b/src/views/customerService/product/component/editRole.vue
@@ -81,7 +81,10 @@ const state = reactive<ComponentState>({

 // 表单验证规则
 const rules: FormRules = {
-	name: [{ required: true, message: '产品名称不能为空', trigger: 'blur' }, { max: 64, message: '产品名称长度最多 64 个字符', trigger: 'blur' }, 1],
+	name: [
+		{ required: true, message: '产品名称不能为空', trigger: 'blur' },
+		{ max: 64, message: '产品名称长度最多 64 个字符', trigger: 'blur' },
+	],
 	description: [
 		{ required: true, message: '产品详情不能为空', trigger: 'blur' },
 		{ max: 8126, message: '产品详情长度最多8126 个字符', trigger: 'blur' },
@@ -120,7 +123,7 @@ const openDialog = async (row?: ProductFormData) => {
 * 处理编辑模式的数据获取
 * @param id - 产品ID
 */
-const handleEditMode = async (row) => {
+const handleEditMode = async (row: ProductFormData) => {
 	try {
 		state.formData.id = row.id;
 		state.formData.description = row.description;
--- a/src/views/customerService/report/component/exportDialog.vue
+++ b/src/views/customerService/report/component/exportDialog.vue
@@ -1,22 +1,24 @@
 <template>
-	<el-dialog title="导出报表数据" v-model="isShowDialog" width="450px" align-center>
-		<div class="report-export-content">
-			<div class="export-icon">
-				<el-icon class="icon-download"><Download /></el-icon>
+	<div class="product-export-dialog">
+		<el-dialog title="导出数据报表" v-model="isShowDialog" width="450px" align-center>
+			<div class="export-content">
+				<div class="export-icon">
+					<el-icon class="icon-download"><Download /></el-icon>
+				</div>
+				<p class="export-text">确定要导出数据数据报表吗？</p>
+				<p class="export-tip">导出的文件将包含所有数据信息</p>
 			</div>
-			<p class="export-text">确定要导出报表数据吗？</p>
-			<p class="export-tip">导出的文件将包含所有报表信息</p>
-		</div>
-		<template #footer>
-			<div class="dialog-footer">
-				<el-button @click="isShowDialog = false">取消</el-button>
-				<el-button type="primary" @click="handleExport" :loading="loading">
-					<el-icon><Download /></el-icon>
-					导出
-				</el-button>
-			</div>
-		</template>
-	</el-dialog>
+			<template #footer>
+				<div class="dialog-footer">
+					<el-button @click="isShowDialog = false">取消</el-button>
+					<el-button type="primary" @click="handleExport" :loading="loading">
+						<el-icon><Download /></el-icon>
+						导出
+					</el-button>
+				</div>
+			</template>
+		</el-dialog>
+	</div>
 </template>

 <script lang="ts" setup>
--- a/src/views/customerService/script/component/editRole.vue
+++ b/src/views/customerService/script/component/editRole.vue
@@ -11,7 +11,7 @@
 					<!-- 富文本编辑器 -->
 					<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20">
 						<el-form-item label="话术" prop="content">
-							<Editor v-model="formData.content" height="400px" :key="editorKey" placeholder="请输入产品详情" />
+							<Editor v-model="formData.content" height="400px" :key="editorKey" placeholder="请输入产品详情" :disableExceptEmotion="true" />
 						</el-form-item>
 					</el-col>
 				</el-row>
--- a/src/views/login/component/account.vue
+++ b/src/views/login/component/account.vue
@@ -64,7 +64,7 @@ import { toRefs, reactive, defineComponent, computed, onMounted, getCurrentInsta
 import { useRoute, useRouter } from 'vue-router';
 import { ElMessage } from 'element-plus';
 import { useI18n } from 'vue-i18n';
-import Cookies from 'js-cookie';
+// import Cookies from 'js-cookie';
 import { storeToRefs } from 'pinia';
 import { useThemeConfig } from '/@/stores/themeConfig';
 import { initFrontEndControlRoutes } from '/@/router/frontEnd';
@@ -137,7 +137,7 @@ export default defineComponent({
 							// 设置按钮权限
 							Session.set('permissions', res.data.permissions);
 							// 模拟数据，对接接口时，记得删除多余代码及对应依赖的引入。用于 `/src/stores/userInfo.ts` 中不同用户登录判断（模拟数据）
-							Cookies.set('username', state.ruleForm.username);
+							// Cookies.set('username', state.ruleForm.username);
 							if (!themeConfig.value.isRequestRoutes) {
 								// 前端控制路由，2、请注意执行顺序
 								await initFrontEndControlRoutes();
--- a/src/views/login/index.vue
+++ b/src/views/login/index.vue
@@ -16,29 +16,41 @@
 			<!-- 右侧表单区域 -->
 			<div class="login-form-section">
 				<div class="form-wrapper">
-					<div class="form-header">
-						<h2>欢迎登录</h2>
-						<p>请输入您的账户信息</p>
+					<!-- 扫码/账号切换按钮 -->
+					<div class="scan-toggle" @click="state.isScan = !state.isScan">
+						<!-- 电脑图标 (切换回账号登录) -->
+						<svg v-if="state.isScan" viewBox="0 0 1024 1024" width="24" height="24" fill="currentColor">
+							<path d="M128 192h768v448H128V192z m0-64c-35.3 0-64 28.7-64 64v448c0 35.3 28.7 64 64 64h768c35.3 0 64-28.7 64-64V192c0-35.3-28.7-64-64-64H128z m256 640h256v64H384v-64z"></path>
+						</svg>
+						<!-- 二维码图标 (切换到扫码登录) -->
+						<svg v-else viewBox="0 0 1024 1024" width="24" height="24" fill="currentColor">
+							<path d="M64 64h384v384H64V64z m64 64v256h256V128H128zM576 64h384v384H576V64z m64 64v256h256V128H640zM64 576h384v384H64V576z m64 64v256h256V640H128zM576 576h128v128H576V576z m128 128h128v128H704V704z m-128 128h128v128H576V832z m256 0h128v128H832V832z m0-128h128v128H832V704z"></path>
+						</svg>
 					</div>

-					<div v-if="!isScan" class="form-content">
-						<el-tabs v-model="tabsActiveName" class="login-tabs">
-							<el-tab-pane :label="$t('message.label.one1')" name="account">
-								<Account />
-							</el-tab-pane>
-							<el-tab-pane :label="$t('message.label.two2')" name="mobile">
-								<Mobile />
-							</el-tab-pane>
-						</el-tabs>
+					<!-- 正常登录表单 -->
+					<div v-if="!state.isScan">
+						<div class="form-header">
+							<h2>欢迎登录</h2>
+							<p>请输入您的账户信息</p>
+						</div>
+
+						<div class="form-content">
+							<el-tabs v-model="state.tabsActiveName" class="login-tabs">
+								<el-tab-pane label="账号登录" name="account">
+									<Account />
+								</el-tab-pane>
+								<el-tab-pane label="手机号登录" name="mobile">
+									<Mobile />
+								</el-tab-pane>
+							</el-tabs>
+						</div>
 					</div>

-					<div v-if="isScan" class="form-content">
+					<!-- 扫码登录 -->
+					<div v-else class="scan-container">
 						<Scan />
 					</div>
-
-					<div class="scan-toggle" @click="isScan = !isScan" :title="isScan ? '切换为账户登录' : '切换为扫码登录'">
-						<i class="iconfont" :class="isScan ? 'icon-diannao1' : 'icon-barcode-qr'"></i>
-					</div>
 				</div>
 			</div>
 		</div>
@@ -57,9 +69,9 @@ import { useThemeConfig } from '/@/stores/themeConfig';
 import logoMini from '/@/assets/logo-mini.svg';
 import loginIconTwo from '/@/assets/login-icon-two.svg';
 import { NextLoading } from '/@/utils/loading';
-import Account from '/@/views/login/component/account.vue';
-import Mobile from '/@/views/login/component/mobile.vue';
-import Scan from '/@/views/login/component/scan.vue';
+import Account from './component/account.vue';
+import Mobile from './component/mobile.vue';
+import Scan from './component/scan.vue';

 // 定义接口来定义对象的类型
 interface LoginState {
@@ -89,7 +101,7 @@ export default defineComponent({
 			logoMini,
 			loginIconTwo,
 			getThemeConfig,
-			...toRefs(state),
+			state,
 		};
 	},
 });
@@ -100,8 +112,18 @@ export default defineComponent({
 	width: 100%;
 	height: 100%;
 	position: relative;
-	background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
-	background-size: cover;
+	/* 替换原有图片背景，使用 CSS 品牌色融合背景 */
+	/* 基础深色背景 (抖音风格) */
+	background-color: #0f1014;
+	background-image: 
+		/* 右上：抖音青 */
+		radial-gradient(circle at 80% 20%, rgba(36, 246, 250, 0.25) 0%, transparent 35%),
+		/* 左上：小红书/抖音红 */
+		radial-gradient(circle at 20% 20%, rgba(254, 44, 85, 0.25) 0%, transparent 35%),
+		/* 左下：快手橙 */
+		radial-gradient(circle at 20% 80%, rgba(255, 80, 0, 0.25) 0%, transparent 35%),
+		/* 右下：小红书红 */
+		radial-gradient(circle at 80% 80%, rgba(255, 36, 66, 0.25) 0%, transparent 35%);
 	background-attachment: fixed;
 	display: flex;
 	flex-direction: column;