From bd91dc7424da6850a9be0e567ea5543d8d5cd3c8 Mon Sep 17 00:00:00 2001
From: lzp <zpli@aidlab.hk>
Date: Tue, 31 Mar 2026 14:36:13 +0800
Subject: [PATCH 1/3] =?UTF-8?q?=E6=B3=A8=E5=86=8C=E5=AF=86=E7=A0=81?=
 =?UTF-8?q?=E6=A0=BC=E5=BC=8F=E6=A0=A1=E9=AA=8C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/lang/en.ts                        |  2 +
 src/lang/zh-cn.ts                     |  2 +
 src/views/login/css/style.css         | 15 +++++++
 src/views/login/less/style.less       | 13 ++++++
 src/views/login/login.vue             | 13 +++++-
 src/views/login/password-tip.vue      | 60 +++++++++++++++++++++++++++
 src/views/login/register.vue          | 11 +++--
 src/views/login/retrieve-password.vue |  9 +++-
 src/views/login/tools.js              | 15 +++++--
 9 files changed, 130 insertions(+), 10 deletions(-)
 create mode 100644 src/views/login/password-tip.vue

diff --git a/src/lang/en.ts b/src/lang/en.ts
index d9005b8..b9d2efa 100644
--- a/src/lang/en.ts
+++ b/src/lang/en.ts
@@ -15,6 +15,8 @@ export default {
 		forgotPassword: 'Forget password?',
 		pleaseInputName: 'Please input the name',
 		nameLengthError: 'Name length must be between {min} and {max} characters',
+		passwordSpecial:'Must contain special characters',
+		passwordCase:'Mix of uppercase, lowercase and numbers',
 		pleaseInputEmail: 'Please input the email',
 		emailFormatError: 'Please input the email again',
 		pleaseInputPassword: 'Please input the password',
diff --git a/src/lang/zh-cn.ts b/src/lang/zh-cn.ts
index 66a84c5..7046d64 100644
--- a/src/lang/zh-cn.ts
+++ b/src/lang/zh-cn.ts
@@ -16,6 +16,8 @@ export default {
 		forgotPassword: '忘记密码？',
 		pleaseInputName: '请输入姓名',
 		nameLengthError: '姓名长度必须在 {min} 到 {max} 个字符之间',
+		passwordSpecial:'必须包含特殊符号',
+		passwordCase:'大小写字母与数字混合组合',
 		pleaseInputEmail: '请输入邮箱',
 		emailFormatError: '请输入正确的邮箱',
 		pleaseInputPassword: '请输入密码',
diff --git a/src/views/login/css/style.css b/src/views/login/css/style.css
index 0c3170e..ac5ab87 100644
--- a/src/views/login/css/style.css
+++ b/src/views/login/css/style.css
@@ -126,8 +126,23 @@
 .retrieve-password > .right > .box:deep(.el-form) .el-form-item,
 .register > .right > .box:deep(.el-form) .el-form-item,
 .login > .right > .box:deep(.el-form) .el-form-item {
+  position: relative;
   margin-bottom: 2rem;
 }
+.retrieve-password > .right > .box:deep(.el-form) .el-form-item__content,
+.register > .right > .box:deep(.el-form) .el-form-item__content,
+.login > .right > .box:deep(.el-form) .el-form-item__content {
+  position: relative;
+}
+.retrieve-password > .right > .box:deep(.el-form) .password-tip,
+.register > .right > .box:deep(.el-form) .password-tip,
+.login > .right > .box:deep(.el-form) .password-tip {
+  position: absolute;
+  z-index: 10;
+  top: -1rem;
+  right: 0;
+  transform: translateY(-100%);
+}
 .retrieve-password > .right > .box:deep(.el-form) .el-form-item__label,
 .register > .right > .box:deep(.el-form) .el-form-item__label,
 .login > .right > .box:deep(.el-form) .el-form-item__label {
diff --git a/src/views/login/less/style.less b/src/views/login/less/style.less
index f4340fb..7dd85a3 100644
--- a/src/views/login/less/style.less
+++ b/src/views/login/less/style.less
@@ -107,9 +107,22 @@
 				font-family: Regular;
 
 				.el-form-item {
+					position: relative;
 					margin-bottom: 2rem;
 				}
 
+				.el-form-item__content {
+					position: relative;
+				}
+
+				.password-tip {
+					position: absolute;
+					z-index: 10;
+					top: -1rem;
+					right: 0;
+					transform: translateY(-100%);
+				}
+
 				.el-form-item__label {
 					color: #252727;
 					font-size: 1.8rem;
diff --git a/src/views/login/login.vue b/src/views/login/login.vue
index f92b594..b92f419 100644
--- a/src/views/login/login.vue
+++ b/src/views/login/login.vue
@@ -71,11 +71,20 @@
 	import OtherLogin from './other-login.vue'
 	import VisibleCode from './visible-code.vue'
 	import { useUserInfoStore } from '@/stores'
+	import { useI18n } from 'vue-i18n'
+	const { t } = useI18n()
 	const userInfoStore = useUserInfoStore()
 	const router = useRouter()
 	const ruleForm = reactive({
-		email: [{ validator: validateEmail, trigger: 'blur' }],
-		password: [{ validator: validatePass, trigger: 'blur' }],
+		email: [{ validator: validateEmail, trigger: 'change' }],
+		password: [
+			{
+				min: 6,
+				max: 12,
+				message: t('Login.passwordLengthError', { min: 6, max: 12 }),
+				trigger: 'change'
+			}
+		],
 		privacy: [{ validator: validatePrivacy, trigger: 'change' }]
 	})
 	const isVisible = ref(false)
diff --git a/src/views/login/password-tip.vue b/src/views/login/password-tip.vue
new file mode 100644
index 0000000..0ca3f14
--- /dev/null
+++ b/src/views/login/password-tip.vue
@@ -0,0 +1,60 @@
+<template>
+	<div class="password-tip">
+		<div>
+			<el-icon>
+				<CloseBold v-if="validateLength(value)" />
+				<Select v-else />
+			</el-icon>
+			<span>{{ $t('Login.passwordLengthError', { min: 6, max: 20 }) }}</span>
+		</div>
+		<div>
+			<el-icon>
+				<CloseBold v-if="validateSpecial(value)" />
+				<Select v-else />
+			</el-icon>
+			<span>{{ $t('Login.passwordSpecial') }}</span>
+		</div>
+		<div>
+			<el-icon>
+				<CloseBold v-if="validateCase(value)" />
+				<Select v-else />
+			</el-icon>
+			<span>{{ $t('Login.passwordCase') }}</span>
+		</div>
+	</div>
+</template>
+
+<script setup lang="ts">
+	import { computed, reactive, ref } from 'vue'
+	import { Select, CloseBold } from '@element-plus/icons-vue'
+	import { validateLength, validateSpecial, validateCase } from './tools'
+	const props = defineProps({
+		value: {
+			type: String,
+			default: ''
+		}
+	})
+</script>
+
+<style lang="less" scoped>
+	.password-tip {
+		background: #404040;
+		color: #fff;
+		font-size: 1.4rem;
+		padding: 2rem;
+		border-radius: 2rem;
+		line-height: normal;
+
+		> div {
+			display: flex;
+			align-items: center;
+			margin-bottom: 0.5rem;
+			&:last-child {
+				margin-bottom: 0;
+			}
+			> .el-icon {
+				margin-right: 1rem;
+			}
+		}
+	}
+</style>
diff --git a/src/views/login/register.vue b/src/views/login/register.vue
index 178961b..d873ebb 100644
--- a/src/views/login/register.vue
+++ b/src/views/login/register.vue
@@ -24,12 +24,15 @@
 							/>
 						</el-form-item>
 						<el-form-item :label="$t('Login.password')" prop="password">
+							<password-tip :value="formData.password" v-show="showPasswordTip" />
 							<el-input
 								name="password"
 								v-model="formData.password"
 								:placeholder="$t('Login.enterPassword')"
 								type="password"
 								show-password
+								@blur="showPasswordTip = false"
+								@focus="showPasswordTip = true"
 							/>
 						</el-form-item>
 						<el-form-item :label="$t('Login.email')" prop="email">
@@ -73,16 +76,18 @@
 	import { validateName, validateEmail, validatePass, validatePrivacy } from './tools'
 	import OtherLogin from './other-login.vue'
 	import VisibleCode from './visible-code.vue'
+	import PasswordTip from './password-tip.vue'
 	import { useUserInfoStore } from '@/stores'
 	const userInfoStore = useUserInfoStore()
 	const router = useRouter()
 	const ruleForm = reactive({
-		name: [{ validator: validateName, trigger: 'blur' }],
-		email: [{ validator: validateEmail, trigger: 'blur' }],
-		password: [{ validator: validatePass, trigger: 'blur' }],
+		name: [{ validator: validateName, trigger: 'change' }],
+		email: [{ validator: validateEmail, trigger: 'change' }],
+		password: [{ validator: validatePass, trigger: 'change' }],
 		privacy: [{ validator: validatePrivacy, trigger: 'change' }]
 	})
 	const isVisible = ref(false)
+	const showPasswordTip = ref(false)
 	const formData = reactive({
 		name: '',
 		email: '',
diff --git a/src/views/login/retrieve-password.vue b/src/views/login/retrieve-password.vue
index 0ecbe51..5ac4a92 100644
--- a/src/views/login/retrieve-password.vue
+++ b/src/views/login/retrieve-password.vue
@@ -23,12 +23,15 @@
 							/>
 						</el-form-item>
 						<el-form-item :label="$t('Login.password')" prop="password">
+							<password-tip :value="formData.password" v-show="showPasswordTip" />
 							<el-input
 								v-model="formData.password"
 								:placeholder="$t('Login.enterPassword')"
 								type="password"
 								show-password
 								name="password"
+								@blur="showPasswordTip = false"
+								@focus="showPasswordTip = true"
 							/>
 						</el-form-item>
 						<br />
@@ -61,14 +64,16 @@
 	import { validateEmail, validatePass } from './tools'
 	import OtherLogin from './other-login.vue'
 	import VisibleCode from './visible-code.vue'
+	import PasswordTip from './password-tip.vue'
 	import { useUserInfoStore } from '@/stores'
 	const userInfoStore = useUserInfoStore()
 	const router = useRouter()
 	const ruleForm = reactive({
-		email: [{ validator: validateEmail, trigger: 'blur' }],
-		password: [{ validator: validatePass, trigger: 'blur' }]
+		email: [{ validator: validateEmail, trigger: 'change' }],
+		password: [{ validator: validatePass, trigger: 'change' }]
 	})
 	const isVisible = ref(false)
+	const showPasswordTip = ref(false)
 	const formData = reactive({
 		email: '',
 		password: ''
diff --git a/src/views/login/tools.js b/src/views/login/tools.js
index b97754d..1638d45 100644
--- a/src/views/login/tools.js
+++ b/src/views/login/tools.js
@@ -19,12 +19,21 @@ export const validateEmail = (rule, value, callback) => {
 	}
 	callback(str ? new Error(str) : undefined)
 }
+// 检查长度
+export const validateLength = (v, min = 6, max = 20) => (v.length < 6 || v.length > 20);
+//检查特殊字符
+export const validateSpecial = (v) => (!/[!@#$%^&*()_+\-=\[\]{};':"\\|,.<>\/?]/.test(v));
+//检查大小写字母和数字
+export const validateCase = (v) => (!/[a-z]/.test(v) || !/[A-Z]/.test(v) || !/\d/.test(v));
+// 检查密码
 export const validatePass = (rule, value, callback) => {
 	var str = ''
-	if (!value) {
-		str = t('Login.pleaseInputPassword')
-	} else if (value.length < 6 || value.length > 20) {
+	if (validateLength(value)) {
 		str = t('Login.passwordLengthError', { min: 6, max: 20 })
+	} else if (validateSpecial(value)) {
+		str = t('Login.passwordSpecial')
+	} else if (validateCase(value)) {
+		str = t('Login.passwordCase')
 	}
 	callback(str ? new Error(str) : undefined)
 }

From f931ce4927674bd87fd76776daf5e77d27adb2d8 Mon Sep 17 00:00:00 2001
From: lzp <zpli@aidlab.hk>
Date: Tue, 31 Mar 2026 15:11:50 +0800
Subject: [PATCH 2/3] =?UTF-8?q?=E5=8A=A0=E6=B2=B9=EF=BC=8C=E5=A5=A5?=
 =?UTF-8?q?=E9=87=8C=E7=BB=99=EF=BC=81?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../DepthCanvas/components/tools/depth-select.vue  | 14 +++++++++++++-
 src/views/login/login.vue                          | 11 ++---------
 src/views/login/tools.js                           |  8 ++++++++
 src/views/nuic/index.vue                           |  4 +++-
 src/views/nuic/nuic-2.vue                          |  1 +
 5 files changed, 27 insertions(+), 11 deletions(-)

diff --git a/src/components/Canvas/DepthCanvas/components/tools/depth-select.vue b/src/components/Canvas/DepthCanvas/components/tools/depth-select.vue
index 4dcf236..10a535f 100644
--- a/src/components/Canvas/DepthCanvas/components/tools/depth-select.vue
+++ b/src/components/Canvas/DepthCanvas/components/tools/depth-select.vue
@@ -1,7 +1,13 @@
 <template>
 	<div class="depth-select">
 		<el-select :model-value="modelValue" @change="onChange" v-bind="attrs">
-			<el-option v-for="v in list" :key="v.value" :label="v.label" :value="v.value" />
+			<el-option
+				v-for="v in list"
+				:key="v.value"
+				:label="v.label"
+				:value="v.value"
+				:disabled="modelValue === v.value"
+			/>
 		</el-select>
 	</div>
 </template>
@@ -22,6 +28,7 @@
 <style scoped lang="less">
 	.depth-select {
 		&:deep(.el-select) {
+			--el-input-text-color: #000;
 			--el-select-input-font-size: 1.2rem;
 			.el-select__wrapper {
 				font-size: 1.2rem;
@@ -46,6 +53,11 @@
 				height: 3rem;
 				line-height: 3rem;
 				font-size: 1.2rem;
+				color: #000;
+				font-weight: 400;
+				&.is-disabled {
+					color: #909399;
+				}
 			}
 		}
 	}
diff --git a/src/views/login/login.vue b/src/views/login/login.vue
index b92f419..5bc58ac 100644
--- a/src/views/login/login.vue
+++ b/src/views/login/login.vue
@@ -67,7 +67,7 @@
 	import { Login } from '@/api/user'
 	import { computed, reactive, ref } from 'vue'
 	import { useRouter } from 'vue-router'
-	import { validateEmail, validatePass, validatePrivacy } from './tools'
+	import { validateEmail, validatePassLength, validatePrivacy } from './tools'
 	import OtherLogin from './other-login.vue'
 	import VisibleCode from './visible-code.vue'
 	import { useUserInfoStore } from '@/stores'
@@ -77,14 +77,7 @@
 	const router = useRouter()
 	const ruleForm = reactive({
 		email: [{ validator: validateEmail, trigger: 'change' }],
-		password: [
-			{
-				min: 6,
-				max: 12,
-				message: t('Login.passwordLengthError', { min: 6, max: 12 }),
-				trigger: 'change'
-			}
-		],
+		password: [{ validator: validatePassLength, trigger: 'change' }],
 		privacy: [{ validator: validatePrivacy, trigger: 'change' }]
 	})
 	const isVisible = ref(false)
diff --git a/src/views/login/tools.js b/src/views/login/tools.js
index 1638d45..b89ba0d 100644
--- a/src/views/login/tools.js
+++ b/src/views/login/tools.js
@@ -37,6 +37,14 @@ export const validatePass = (rule, value, callback) => {
 	}
 	callback(str ? new Error(str) : undefined)
 }
+// 检查密码长度
+export const validatePassLength = (rule, value, callback) => {
+	var str = ''
+	if (validateLength(value)) {
+		str = t('Login.passwordLengthError', { min: 6, max: 20 })
+	}
+	callback(str ? new Error(str) : undefined)
+}
 export const validatePrivacy = (rule, value, callback) => {
 	if (!value) {
 		callback(new Error(t('Login.pleaseTermsPolicy')))
diff --git a/src/views/nuic/index.vue b/src/views/nuic/index.vue
index 732c772..05e2d3d 100644
--- a/src/views/nuic/index.vue
+++ b/src/views/nuic/index.vue
@@ -160,6 +160,8 @@
 			color: #252727;
 			text-align: center;
 			> .btns {
+				position: fixed;
+				bottom: 8rem;
 				width: 100%;
 				display: flex;
 				align-items: center;
@@ -305,7 +307,7 @@
 			height: 72.6rem;
 			left: 50%;
 			bottom: 0;
-			transform: translateX(-50%) translateY(80%);
+			transform: translateX(-50%) translateY(70%);
 			> div.bg-1 {
 				width: 48.4rem;
 				height: 57.2rem;
diff --git a/src/views/nuic/nuic-2.vue b/src/views/nuic/nuic-2.vue
index f925d17..6caa28d 100644
--- a/src/views/nuic/nuic-2.vue
+++ b/src/views/nuic/nuic-2.vue
@@ -78,6 +78,7 @@
 					width: 100%;
 					height: 100%;
 					border-radius: 1.6rem;
+					box-shadow: 0 0 0.5rem rgba(0, 0, 0, 0.1);
 				}
 				> .active {
 					position: absolute;

From ef525256510796cc684b4323cacf3b6aa3b501c6 Mon Sep 17 00:00:00 2001
From: lzp <zpli@aidlab.hk>
Date: Tue, 31 Mar 2026 15:45:15 +0800
Subject: [PATCH 3/3] =?UTF-8?q?=E8=87=AA=E5=AE=9A=E4=B9=89=E6=8C=87?=
 =?UTF-8?q?=E4=BB=A4=E5=BD=92=E7=B1=BB?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/depth-header-tools.vue         | 10 +++++--
 .../manager/AISelectboxToolManager.ts         |  4 +--
 src/directives/clidk-besides.js               | 27 +++++++++++++++++++
 .../ellispsis.ts => directives/ellispsis.js}  | 18 ++++++-------
 src/directives/index.js                       |  9 +++++++
 src/directives/loadimg.js                     | 16 +++++++++++
 src/main.ts                                   | 20 ++------------
 7 files changed, 72 insertions(+), 32 deletions(-)
 create mode 100644 src/directives/clidk-besides.js
 rename src/{utils/ellispsis.ts => directives/ellispsis.js} (72%)
 create mode 100644 src/directives/index.js
 create mode 100644 src/directives/loadimg.js

diff --git a/src/components/Canvas/DepthCanvas/components/depth-header-tools.vue b/src/components/Canvas/DepthCanvas/components/depth-header-tools.vue
index 2926d68..83c8bcd 100644
--- a/src/components/Canvas/DepthCanvas/components/depth-header-tools.vue
+++ b/src/components/Canvas/DepthCanvas/components/depth-header-tools.vue
@@ -13,10 +13,16 @@
 				>
 					<svg-icon :name="v.icon" :size="v.iconSize" />
 				</span>
-				<span class="more" v-if="v.child" @click="onClickMore(v)">
+				<span class="more" v-if="v.child" @click="onClickMore(v)" :bind-id="v.name">
 					<svg-icon name="dc-down_arrow2" size="7" />
 				</span>
-				<div v-if="v.child" class="child" v-show="v.showChild">
+				<div
+					v-if="v.child"
+					class="child"
+					v-show="v.showChild"
+					:bind-id="v.name"
+					v-clidk-besides="() => (v.showChild = false)"
+				>
 					<div v-for="(v_, i_) in v.child" :key="i_" @click="onClickTool(v_, v)">
 						<span v-show="tool === v_.name" class="dui">
 							<svg-icon name="dc-dui" size="9" />
diff --git a/src/components/Canvas/DepthCanvas/manager/AISelectboxToolManager.ts b/src/components/Canvas/DepthCanvas/manager/AISelectboxToolManager.ts
index fd3ccb9..d31cf97 100644
--- a/src/components/Canvas/DepthCanvas/manager/AISelectboxToolManager.ts
+++ b/src/components/Canvas/DepthCanvas/manager/AISelectboxToolManager.ts
@@ -199,8 +199,8 @@ export class AISelectboxToolManager {
 		if (!this.isDragging) return;
 		this.isDragging = false;
 		const object = this.indicatorObject.toJSON("evented")
-		// if (object.width === 0) object.width = 100
-		// if (object.height === 0) object.height = 100
+		if (object.width === 0 || object.height === 0) return
+
 		this.clearIndicatorObject()
 		this.canvasManager.canvas.renderAll()
 
diff --git a/src/directives/clidk-besides.js b/src/directives/clidk-besides.js
new file mode 100644
index 0000000..503b4d5
--- /dev/null
+++ b/src/directives/clidk-besides.js
@@ -0,0 +1,27 @@
+// 点击外部区域触发事件
+// 用法：v-clidk-besides="() => {}"
+// 说明：点击外部区域触发事件，不包括点击元素本身
+// 注意：点击元素本身或者属性bind-id相同元素不会触发事件
+export default {
+	name: 'clidk-besides',
+	mounted(el, binding) {
+		console.log("mounted", el, binding);
+		const call = binding.value
+		const id = el.getAttribute("bind-id");
+		window.addEventListener("touchstart", fun, true);
+		window.addEventListener("mousedown", fun, true);
+		function fun(e) {
+			var k = true;
+			iterator(e.target);
+			if (k) call && call();
+			function iterator(el) {
+				if (!el || el.nodeName == "#document") return;
+				if (el.getAttribute("bind-id") == id) {
+					k = false;
+				} else {
+					iterator(el.parentNode);
+				}
+			}
+		}
+	},
+};
\ No newline at end of file
diff --git a/src/utils/ellispsis.ts b/src/directives/ellispsis.js
similarity index 72%
rename from src/utils/ellispsis.ts
rename to src/directives/ellispsis.js
index 23f6ec8..9fbd26a 100644
--- a/src/utils/ellispsis.ts
+++ b/src/directives/ellispsis.js
@@ -1,11 +1,10 @@
-import type { Directive } from 'vue'
 /**
  * 多行文本省略指令（悬浮显示完整内容)
  * @directive v-ellipsis
  * @param {number} [value=3] - 超过value行数时显示省略号,不传参数默认为3
  */
 
-const applyStyles = (el: HTMLElement, binding: any) => {
+const applyStyles = (el, binding) => {
 	const lines = typeof binding.value === 'number' && binding.value > 0 ? binding.value : 3
 
 	el.style.display = '-webkit-box'
@@ -16,7 +15,7 @@ const applyStyles = (el: HTMLElement, binding: any) => {
 	el.style.maxHeight = `${lines}lh`
 }
 
-const checkTruncated = (el: HTMLElement) => {
+const checkTruncated = (el) => {
 	const isTruncated = el.scrollHeight > el.clientHeight + 1
 	if (isTruncated) {
 		el.title = el.textContent?.trim() || ''
@@ -25,14 +24,15 @@ const checkTruncated = (el: HTMLElement) => {
 	}
 }
 
-const vEllipsis: Directive<HTMLElement> = {
+export default {
+	name: 'ellipsis',
 	mounted(el, binding) {
 		applyStyles(el, binding)
 		checkTruncated(el)
 
 		const ro = new ResizeObserver(() => checkTruncated(el))
-		ro.observe(el)
-		;(el as any)._ellipsisObserver = ro
+		ro.observe(el);
+		el._ellipsisObserver = ro
 	},
 
 	updated(el, binding) {
@@ -41,12 +41,10 @@ const vEllipsis: Directive<HTMLElement> = {
 	},
 
 	unmounted(el) {
-		const ro = (el as any)._ellipsisObserver
+		const ro = el._ellipsisObserver
 		if (ro) {
 			ro.disconnect()
-			delete (el as any)._ellipsisObserver
+			delete el._ellipsisObserver
 		}
 	}
 }
-
-export default vEllipsis
diff --git a/src/directives/index.js b/src/directives/index.js
new file mode 100644
index 0000000..d189b48
--- /dev/null
+++ b/src/directives/index.js
@@ -0,0 +1,9 @@
+export default {
+	install(app) {
+		const directivesList = import.meta.glob('./*.js', { eager: true });
+		// 遍历指令文件实现自动注册
+		Object.keys(directivesList).forEach(key => {
+			app.directive(directivesList[key].default.name, directivesList[key].default);
+		});
+	}
+};
\ No newline at end of file
diff --git a/src/directives/loadimg.js b/src/directives/loadimg.js
new file mode 100644
index 0000000..ef3ede3
--- /dev/null
+++ b/src/directives/loadimg.js
@@ -0,0 +1,16 @@
+// 加载图片
+export default {
+	name: 'loadimg',
+	mounted(el, binding) {
+		const src = binding.value
+		if (el.src === src) return
+		const img = new Image()
+		img.src = src
+		img.onload = () => {
+			el.src = src
+		}
+		img.onerror = () => {
+			console.log('图片加载失败:', src)
+		}
+	},
+};
\ No newline at end of file
diff --git a/src/main.ts b/src/main.ts
index a112d10..6169d44 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -7,6 +7,7 @@ import 'normalize.css'
 import './assets/css/style.css'
 import SvgIcon from "@/components/SvgIcon/index.vue";
 import "virtual:svg-icons-register";
+import directives from "./directives/index.js";
 
 import i18n from "./lang/index";
 import flexible from "./utils/flexible.js";
@@ -17,32 +18,15 @@ import 'element-plus/dist/index.css'
 
 import ignoredWarning from './ignoredWarning'
 
-import vEllipsis from './utils/ellispsis'
-
-
 const app = createApp(App)
 ignoredWarning(app)
-app.directive('ellipsis', vEllipsis)
 app.use(router)
+	.use(directives)
 	.use(ElementPlus)
 	.use(store)
 	.component("SvgIcon", SvgIcon)
 	.use(i18n)
 	.mount('#app')
 
-const vLoadimg = (el, binding) => {
-	const src = binding.value
-	if (el.src === src) return
-	const img = new Image()
-	img.src = src
-	img.onload = () => {
-	  el.src = src
-	}
-	img.onerror = () => {
-	  console.log('图片加载失败:', src)
-	}
-}
-// 注册
-app.directive('loadimg', vLoadimg)
 flexible();