diff --git a/admin/src/app/api/aliapp.ts b/admin/src/app/api/aliapp.ts
index e3df32a9b..57e3846be 100644
--- a/admin/src/app/api/aliapp.ts
+++ b/admin/src/app/api/aliapp.ts
@@ -14,7 +14,7 @@ export function getAliappConfig() {
  * @returns
  */
 export function setAliappConfig(params: Record<string, any>) {
-    return request.put('aliapp/config', params, {showSuccessMessage: true})
+    return request.put('aliapp/config', params, { showSuccessMessage: true })
 }
 
 /**
diff --git a/admin/src/app/api/auth.ts b/admin/src/app/api/auth.ts
index ea2892d3a..bfff98aec 100644
--- a/admin/src/app/api/auth.ts
+++ b/admin/src/app/api/auth.ts
@@ -6,7 +6,7 @@ import request from '@/utils/request'
  * @param app_type
  */
 export function login(params: Record<string, any>, app_type: string) {
-    return request.get(`login/${app_type}`, {params})
+    return request.get(`login/${ app_type }`, { params })
 }
 
 /**
@@ -21,7 +21,7 @@ export function logout() {
  * @returns
  */
 export function getAuthMenus(params: Record<string, any>) {
-    return request.get('auth/authmenu', {params})
+    return request.get('auth/authmenu', { params })
 }
 
 /**
diff --git a/admin/src/app/api/diy.ts b/admin/src/app/api/diy.ts
index 1888d262c..1fe09fc66 100644
--- a/admin/src/app/api/diy.ts
+++ b/admin/src/app/api/diy.ts
@@ -8,7 +8,7 @@ import request from '@/utils/request'
  * @returns
  */
 export function getDiyPageList(params: Record<string, any>) {
-	return request.get(`diy/diy`, {params})
+    return request.get(`diy/diy`, { params })
 }
 
 /**
@@ -17,7 +17,7 @@ export function getDiyPageList(params: Record<string, any>) {
  * @returns
  */
 export function getDiyPageListByCarouselSearch(params: Record<string, any>) {
-	return request.get(`diy/carousel_search`, {params})
+    return request.get(`diy/carousel_search`, { params })
 }
 
 /**
@@ -26,7 +26,7 @@ export function getDiyPageListByCarouselSearch(params: Record<string, any>) {
  * @returns
  */
 export function getDiyList(params: Record<string, any>) {
-	return request.get(`diy/list`, {params})
+    return request.get(`diy/list`, { params })
 }
 
 /**
@@ -35,7 +35,7 @@ export function getDiyList(params: Record<string, any>) {
  * @returns
  */
 export function getDiyPageInfo(id: number) {
-	return request.get(`diy/diy/${id}`);
+    return request.get(`diy/diy/${ id }`);
 }
 
 /**
@@ -44,7 +44,7 @@ export function getDiyPageInfo(id: number) {
  * @returns
  */
 export function addDiyPage(params: Record<string, any>) {
-	return request.post('diy/diy', params, {showSuccessMessage: true})
+    return request.post('diy/diy', params, { showSuccessMessage: true })
 }
 
 /**
@@ -52,7 +52,7 @@ export function addDiyPage(params: Record<string, any>) {
  * @param params
  */
 export function editDiyPage(params: Record<string, any>) {
-	return request.put(`diy/diy/${params.id}`, params, {showSuccessMessage: true})
+    return request.put(`diy/diy/${ params.id }`, params, { showSuccessMessage: true })
 }
 
 /**
@@ -60,7 +60,7 @@ export function editDiyPage(params: Record<string, any>) {
  * @param params
  */
 export function setUseDiyPage(params: Record<string, any>) {
-	return request.put(`diy/use/${params.id}`, params, {showSuccessMessage: true})
+    return request.put(`diy/use/${ params.id }`, params, { showSuccessMessage: true })
 }
 
 /**
@@ -68,7 +68,7 @@ export function setUseDiyPage(params: Record<string, any>) {
  * @param params
  */
 export function editDiyPageShare(params: Record<string, any>) {
-	return request.put(`diy/diy/share`, params, {showSuccessMessage: true})
+    return request.put(`diy/diy/share`, params, { showSuccessMessage: true })
 }
 
 /**
@@ -77,35 +77,35 @@ export function editDiyPageShare(params: Record<string, any>) {
  * @returns
  */
 export function deleteDiyPage(id: number) {
-	return request.delete(`diy/diy/${id}`, {showSuccessMessage: true})
+    return request.delete(`diy/diy/${ id }`, { showSuccessMessage: true })
 }
 
 /**
  * 获取自定义页面初始化数据
  */
 export function initPage(params: Record<string, any>) {
-	return request.get(`diy/init`, {params})
+    return request.get(`diy/init`, { params })
 }
 
 /**
  * 获取自定义链接列表
  */
 export function getLink(params: Record<string, any>) {
-	return request.get(`diy/link`, {params})
+    return request.get(`diy/link`, { params })
 }
 
 /**
  * 获取底部导航列表
  */
 export function getDiyBottomList(params: Record<string, any>) {
-	return request.get(`diy/bottom`, {params})
+    return request.get(`diy/bottom`, { params })
 }
 
 /**
  * 获取底部导航数据
  */
 export function getDiyBottomConfig(params: Record<string, any>) {
-	return request.get(`diy/bottom/config`, {params})
+    return request.get(`diy/bottom/config`, { params })
 }
 
 /**
@@ -114,21 +114,21 @@ export function getDiyBottomConfig(params: Record<string, any>) {
  * @returns
  */
 export function setDiyBottomConfig(params: Record<string, any>) {
-	return request.post('diy/bottom', params, {showSuccessMessage: true})
+    return request.post('diy/bottom', params, { showSuccessMessage: true })
 }
 
 /**
  * 获取页面模板类型
  */
 export function getDiyTemplate(params: Record<string, any>) {
-	return request.get(`diy/template`, {params})
+    return request.get(`diy/template`, { params })
 }
 
 /**
  * 获取模板页面列表
  */
 export function getDiyTemplatePages(params: Record<string, any>) {
-	return request.get(`diy/template/pages`, {params})
+    return request.get(`diy/template/pages`, { params })
 }
 
 /**
@@ -137,7 +137,7 @@ export function getDiyTemplatePages(params: Record<string, any>) {
  * @returns
  */
 export function getDiyRouteList(params: Record<string, any>) {
-	return request.get(`diy/route`, {params})
+    return request.get(`diy/route`, { params })
 }
 
 /**
@@ -145,7 +145,7 @@ export function getDiyRouteList(params: Record<string, any>) {
  * @returns
  */
 export function getDiyRouteAppList() {
-	return request.get(`diy/route/apps`)
+    return request.get(`diy/route/apps`)
 }
 
 /**
@@ -153,7 +153,7 @@ export function getDiyRouteAppList() {
  * @param params
  */
 export function getDiyRouteInfo(params: Record<string, any>) {
-	return request.get(`diy/route/info`, {params});
+    return request.get(`diy/route/info`, { params });
 }
 
 /**
@@ -161,7 +161,7 @@ export function getDiyRouteInfo(params: Record<string, any>) {
  * @param params
  */
 export function editDiyRouteShare(params: Record<string, any>) {
-	return request.put(`diy/route/share`, params, {showSuccessMessage: true})
+    return request.put(`diy/route/share`, params, { showSuccessMessage: true })
 }
 
 /**
@@ -170,7 +170,7 @@ export function editDiyRouteShare(params: Record<string, any>) {
  * @returns
  */
 export function getDecoratePage(params: Record<string, any>) {
-	return request.get(`diy/decorate`, {params})
+    return request.get(`diy/decorate`, { params })
 }
 
 /**
@@ -179,7 +179,7 @@ export function getDecoratePage(params: Record<string, any>) {
  * @returns
  */
 export function changeTemplate(params: Record<string, any>) {
-	return request.put(`diy/change`, params, {showSuccessMessage: true})
+    return request.put(`diy/change`, params, { showSuccessMessage: true })
 }
 
 /**
@@ -188,7 +188,7 @@ export function changeTemplate(params: Record<string, any>) {
  * @returns
  */
 export function getApps(params: Record<string, any>) {
-	return request.get(`diy/apps`)
+    return request.get(`diy/apps`)
 }
 
 /**
@@ -207,7 +207,7 @@ export function copyDiy(params: Record<string, any>) {
  * @param params
  */
 export function getDefaultTheme(params: Record<string, any>) {
-    return request.get(`diy/theme/color`, {params})
+    return request.get(`diy/theme/color`, { params })
 }
 
 
@@ -216,7 +216,7 @@ export function getDefaultTheme(params: Record<string, any>) {
  * @param params
  */
 export function getDiyTheme(params: Record<string, any>) {
-    return request.get(`diy/theme`, {params})
+    return request.get(`diy/theme`, { params })
 }
 
 /**
@@ -232,7 +232,7 @@ export function addTheme(params: Record<string, any>) {
  * @param params
  */
 export function editTheme(params: Record<string, any>) {
-    return request.put(`diy/theme/edit/${params.id}`, params, {showSuccessMessage: true})
+    return request.put(`diy/theme/edit/${ params.id }`, params, { showSuccessMessage: true })
 }
 
 /**
@@ -240,13 +240,13 @@ export function editTheme(params: Record<string, any>) {
  * @param params
  */
 export function deleteTheme(id: number) {
-    return request.delete(`diy/theme/delete/${id}`, {showSuccessMessage: true})
+    return request.delete(`diy/theme/delete/${ id }`, { showSuccessMessage: true })
 }
 
 /**
- * 设置主题配色 
+ * 设置主题配色
  * @param params
  */
 export function setDiyTheme(params: Record<string, any>) {
     return request.post(`diy/theme`, params, { showSuccessMessage: true })
-}
\ No newline at end of file
+}
diff --git a/admin/src/app/api/diy_form.ts b/admin/src/app/api/diy_form.ts
index 7d1aa3fb8..ae6cb9edc 100644
--- a/admin/src/app/api/diy_form.ts
+++ b/admin/src/app/api/diy_form.ts
@@ -19,6 +19,7 @@ export function getDiyFormPageList(params: Record<string, any>) {
 export function getDiyFormList(params: Record<string, any>) {
     return request.get(`diy/form/list`, { params })
 }
+
 /**
  * 获取万能表单分页列表（用于弹框选择）
  * @param params
diff --git a/admin/src/app/api/module.ts b/admin/src/app/api/module.ts
index 26b13b73d..1ceaa51a6 100644
--- a/admin/src/app/api/module.ts
+++ b/admin/src/app/api/module.ts
@@ -11,7 +11,7 @@ export function getAuthInfo() {
  * 设置 授权配置
  */
 export function setAuthInfo(params: Record<string, any>) {
-    return request.post('niucloud/authinfo', params, {showSuccessMessage: true})
+    return request.post('niucloud/authinfo', params, { showSuccessMessage: true })
 }
 
 /**
@@ -43,7 +43,7 @@ export function getModuleVersion() {
  * @returns
  */
 export function downloadVersion(params: Record<string, any>) {
-    return request.post(`addon/download/${params.addon}`, params, { showSuccessMessage: true })
+    return request.post(`addon/download/${ params.addon }`, params, { showSuccessMessage: true })
 }
 
 /**
@@ -61,3 +61,11 @@ export function getFrameworkNewVersion() {
 export function getFrameworkVersionList() {
     return request.get(`niucloud/framework/version/list`)
 }
+
+/**
+ * 获取应用/插件的版本更新记录
+ * @param params
+ */
+export function getAppVersionList(params: Record<string, any>) {
+    return request.get(`niucloud/app_version/list`, { params })
+}
diff --git a/admin/src/app/api/notice.ts b/admin/src/app/api/notice.ts
index 8f1a173e3..6104b721c 100644
--- a/admin/src/app/api/notice.ts
+++ b/admin/src/app/api/notice.ts
@@ -7,7 +7,7 @@ import request from '@/utils/request'
  * @returns
  */
 export function getNoticeList(params: any) {
-    return request.get('notice/notice', {params})
+    return request.get('notice/notice', { params })
 }
 
 /**
@@ -16,7 +16,7 @@ export function getNoticeList(params: any) {
  * @returns
  */
 export function getNoticeLog(params: any) {
-    return request.get(`notice/log`, {params})
+    return request.get(`notice/log`, { params })
 }
 
 /**
@@ -25,7 +25,7 @@ export function getNoticeLog(params: any) {
  * @returns
  */
 export function getNoticeInfo(key: string) {
-    return request.get(`notice/notice/${key}`)
+    return request.get(`notice/notice/${ key }`)
 }
 
 /**
@@ -34,7 +34,7 @@ export function getNoticeInfo(key: string) {
  * @returns
  */
 export function editNoticeStatus(params: Record<string, any>) {
-    return request.post(`notice/notice/editstatus`, params, {showSuccessMessage: true})
+    return request.post(`notice/notice/editstatus`, params, { showSuccessMessage: true })
 }
 
 /**
@@ -43,7 +43,7 @@ export function editNoticeStatus(params: Record<string, any>) {
  * @returns
  */
 export function editNotice(params: Record<string, any>) {
-    return request.post(`notice/notice/edit`, params, {showSuccessMessage: true})
+    return request.post(`notice/notice/edit`, params, { showSuccessMessage: true })
 }
 
 /**
@@ -60,7 +60,7 @@ export function getSmsList() {
  * @returns
  */
 export function getSmsInfo(sms_type: string) {
-    return request.get(`notice/notice/sms/${sms_type}`,)
+    return request.get(`notice/notice/sms/${ sms_type }`,)
 }
 
 /**
@@ -68,7 +68,7 @@ export function getSmsInfo(sms_type: string) {
  * @param params
  */
 export function editSms(params: Record<string, any>) {
-    return request.put(`notice/notice/sms/${params.sms_type}`, params, {showSuccessMessage: true})
+    return request.put(`notice/notice/sms/${ params.sms_type }`, params, { showSuccessMessage: true })
 }
 
 /**
diff --git a/admin/src/app/api/pay.ts b/admin/src/app/api/pay.ts
index 5df0b2837..911f2848b 100644
--- a/admin/src/app/api/pay.ts
+++ b/admin/src/app/api/pay.ts
@@ -54,6 +54,14 @@ export function getPayRefundInfo(refund_no: string) {
     return request.get(`pay/refund/${refund_no}`)
 }
 
+/**
+ * 获取退款状态字典
+ * @param refund_no
+ */
+export function getRefundStatus() {
+    return request.get(`pay/refund/status`)
+}
+
 /**
  * 退款方式
  */
diff --git a/admin/src/app/api/pc.ts b/admin/src/app/api/pc.ts
index 5237a7057..01bf2c0fc 100644
--- a/admin/src/app/api/pc.ts
+++ b/admin/src/app/api/pc.ts
@@ -14,5 +14,5 @@ export function getPcConfig() {
  * @returns
  */
 export function setPcConfig(params: Record<string, any>) {
-    return request.put('channel/pc/config', params, {showSuccessMessage: true})
+    return request.put('channel/pc/config', params, { showSuccessMessage: true })
 }
diff --git a/admin/src/app/api/personal.ts b/admin/src/app/api/personal.ts
index 105925f9f..1278a4e72 100644
--- a/admin/src/app/api/personal.ts
+++ b/admin/src/app/api/personal.ts
@@ -13,6 +13,6 @@ export function getUserInfo() {
  * @returns
  */
 export function setUserInfo(params: Record<string, any>) {
-    return request.put(`auth/edit`, params, {showSuccessMessage: true});
+    return request.put(`auth/edit`, params, { showSuccessMessage: true });
 }
 
diff --git a/admin/src/app/api/poster.ts b/admin/src/app/api/poster.ts
index 21d51fd4d..8c6ca639d 100644
--- a/admin/src/app/api/poster.ts
+++ b/admin/src/app/api/poster.ts
@@ -6,7 +6,7 @@ import request from '@/utils/request'
  * @returns
  */
 export function getPosterPageList(params: Record<string, any>) {
-    return request.get(`sys/poster`, {params})
+    return request.get(`sys/poster`, { params })
 }
 
 /**
@@ -15,7 +15,7 @@ export function getPosterPageList(params: Record<string, any>) {
  * @returns
  */
 export function getPosterList(params: Record<string, any>) {
-    return request.get(`sys/poster/list`, {params})
+    return request.get(`sys/poster/list`, { params })
 }
 
 /**
@@ -24,7 +24,7 @@ export function getPosterList(params: Record<string, any>) {
  * @returns
  */
 export function getPosterInfo(id: number) {
-    return request.get(`sys/poster/${id}`);
+    return request.get(`sys/poster/${ id }`);
 }
 
 /**
@@ -33,7 +33,7 @@ export function getPosterInfo(id: number) {
  * @returns
  */
 export function addPoster(params: Record<string, any>) {
-    return request.post('sys/poster', params, {showErrorMessage: true, showSuccessMessage: true})
+    return request.post('sys/poster', params, { showErrorMessage: true, showSuccessMessage: true })
 }
 
 /**
@@ -42,7 +42,7 @@ export function addPoster(params: Record<string, any>) {
  * @returns
  */
 export function editPoster(params: Record<string, any>) {
-    return request.put(`sys/poster/${params.id}`, params, {
+    return request.put(`sys/poster/${ params.id }`, params, {
         showErrorMessage: true,
         showSuccessMessage: true
     })
@@ -54,7 +54,7 @@ export function editPoster(params: Record<string, any>) {
  * @returns
  */
 export function deletePoster(id: number) {
-    return request.delete(`sys/poster/${id}`, {showErrorMessage: true, showSuccessMessage: true})
+    return request.delete(`sys/poster/${ id }`, { showErrorMessage: true, showSuccessMessage: true })
 }
 
 /**
@@ -62,7 +62,7 @@ export function deletePoster(id: number) {
  * @param params
  */
 export function modifyPosterStatus(params: Record<string, any>) {
-    return request.put(`sys/poster/status`, params, {showSuccessMessage: true})
+    return request.put(`sys/poster/status`, params, { showSuccessMessage: true })
 }
 
 /**
@@ -70,7 +70,7 @@ export function modifyPosterStatus(params: Record<string, any>) {
  * @param params
  */
 export function modifyPosterDefault(params: Record<string, any>) {
-    return request.put(`sys/poster/default`, params, {showSuccessMessage: true})
+    return request.put(`sys/poster/default`, params, { showSuccessMessage: true })
 }
 
 /**
@@ -79,7 +79,7 @@ export function modifyPosterDefault(params: Record<string, any>) {
  * @returns
  */
 export function getPosterType(params: Record<string, any>) {
-    return request.get(`sys/poster/type`, {params})
+    return request.get(`sys/poster/type`, { params })
 }
 
 /**
@@ -88,21 +88,21 @@ export function getPosterType(params: Record<string, any>) {
  * @returns
  */
 export function getPosterTemplate(params: Record<string, any>) {
-    return request.get(`sys/poster/template`, {params})
+    return request.get(`sys/poster/template`, { params })
 }
 
 /**
  * 获取自定义海报初始化数据
  */
 export function initPoster(params: Record<string, any>) {
-    return request.get(`sys/poster/init`, {params})
+    return request.get(`sys/poster/init`, { params })
 }
 
 /**
  * 获取自定义海报预览
  */
 export function getPreviewPoster(params: Record<string, any>) {
-    return request.get(`sys/poster/preview`, {params})
+    return request.get(`sys/poster/preview`, { params })
 }
 
 /**
@@ -111,5 +111,5 @@ export function getPreviewPoster(params: Record<string, any>) {
  * @returns
  */
 export function getPosterGenerate(params: Record<string, any>) {
-    return request.get(`sys/poster/generate`, {params, showErrorMessage: false})
-}
\ No newline at end of file
+    return request.get(`sys/poster/generate`, { params, showErrorMessage: false })
+}
diff --git a/admin/src/app/api/site.ts b/admin/src/app/api/site.ts
index fdc215ce7..282144fde 100644
--- a/admin/src/app/api/site.ts
+++ b/admin/src/app/api/site.ts
@@ -18,7 +18,7 @@ export function getSiteList(params: Record<string, any>) {
  * @param site_id
  */
 export function getSiteInfo(site_id: number) {
-    return request.get(`site/site/${site_id}`);
+    return request.get(`site/site/${ site_id }`);
 }
 
 /**
@@ -35,7 +35,7 @@ export function addSite(params: Record<string, any>) {
  * @param params
  */
 export function editSite(params: Record<string, any>) {
-    return request.put(`site/site/${params.site_id}`, params, { showSuccessMessage: true })
+    return request.put(`site/site/${ params.site_id }`, params, { showSuccessMessage: true })
 }
 
 /**
@@ -43,7 +43,7 @@ export function editSite(params: Record<string, any>) {
  * @param siteId
  */
 export function deleteSite(siteId: number) {
-    return request.delete(`site/site/${siteId}`)
+    return request.delete(`site/site/${ siteId }`)
 }
 
 /**
@@ -51,7 +51,7 @@ export function deleteSite(siteId: number) {
  * @param params
  */
 export function closeSite(params: Record<string, any>) {
-    return request.put(`site/closesite/${params.site_id}`, params, { showSuccessMessage: true })
+    return request.put(`site/closesite/${ params.site_id }`, params, { showSuccessMessage: true })
 }
 
 /**
@@ -59,7 +59,7 @@ export function closeSite(params: Record<string, any>) {
  * @param params
  */
 export function openSite(params: Record<string, any>) {
-    return request.put(`site/opensite/${params.site_id}`, params, { showSuccessMessage: true })
+    return request.put(`site/opensite/${ params.site_id }`, params, { showSuccessMessage: true })
 }
 
 /**
@@ -85,7 +85,7 @@ export function getSiteGroupList(params: Record<string, any>) {
  * @param groupId
  */
 export function getSiteGroupInfo(groupId: number) {
-    return request.get(`site/group/${groupId}`);
+    return request.get(`site/group/${ groupId }`);
 }
 
 /**
@@ -102,7 +102,7 @@ export function addSiteGroup(params: Record<string, any>) {
  * @param params
  */
 export function editSiteGroup(params: Record<string, any>) {
-    return request.put(`site/group/${params.group_id}`, params, { showSuccessMessage: true })
+    return request.put(`site/group/${ params.group_id }`, params, { showSuccessMessage: true })
 }
 
 /**
@@ -110,7 +110,7 @@ export function editSiteGroup(params: Record<string, any>) {
  * @param group_id
  */
 export function deleteSiteGroup(group_id: number) {
-    return request.delete(`site/group/${group_id}`, { showSuccessMessage: true });
+    return request.delete(`site/group/${ group_id }`, { showSuccessMessage: true });
 }
 
 /**
@@ -146,7 +146,7 @@ export function getUserList(params: Record<string, any>) {
  * @param uid
  */
 export function getUserInfo(uid: number) {
-    return request.get(`site/user/${uid}`);
+    return request.get(`site/user/${ uid }`);
 }
 
 /**
@@ -163,7 +163,7 @@ export function addUser(params: Record<string, any>) {
  * @param params
  */
 export function editUser(params: Record<string, any>) {
-    return request.put(`site/user/${params.uid}`, params, { showSuccessMessage: true })
+    return request.put(`site/user/${ params.uid }`, params, { showSuccessMessage: true })
 }
 
 /**
@@ -172,7 +172,7 @@ export function editUser(params: Record<string, any>) {
  * @returns
  */
 export function lockUser(uid: number) {
-    return request.put(`site/user/lock/${uid}`)
+    return request.put(`site/user/lock/${ uid }`)
 }
 
 /**
@@ -181,7 +181,7 @@ export function lockUser(uid: number) {
  * @returns
  */
 export function unlockUser(uid: number) {
-    return request.put(`site/user/unlock/${uid}`)
+    return request.put(`site/user/unlock/${ uid }`)
 }
 
 /**
@@ -190,7 +190,7 @@ export function unlockUser(uid: number) {
  * @param uid
  */
 export function deleteUser(uid: number) {
-    return request.delete(`site/user/${uid}`)
+    return request.delete(`site/user/${ uid }`)
 }
 
 /***************************************************** 操作日志 **************************************************/
@@ -209,7 +209,7 @@ export function getLogList(params: Record<string, any>) {
  * @param id
  */
 export function getLogInfo(id: number) {
-    return request.get(`site/log/${id}`)
+    return request.get(`site/log/${ id }`)
 }
 
 /***************************************************** 账单列表 **************************************************/
@@ -228,7 +228,7 @@ export function getAccountList(params: Record<string, any>) {
  * @param id
  */
 export function getAccountInfo(id: number) {
-    return request.get(`site/account/${id}`)
+    return request.get(`site/account/${ id }`)
 }
 
 /**
diff --git a/admin/src/app/api/sys.ts b/admin/src/app/api/sys.ts
index 5d9576c2b..3f366ff26 100644
--- a/admin/src/app/api/sys.ts
+++ b/admin/src/app/api/sys.ts
@@ -788,3 +788,11 @@ export function deleteExport(id: number) {
 export function getWxoplatform() {
     return request.get('sys/wxoplatform/config')
 }
+
+/**
+ * 获取二维码
+ * @returns
+ */
+export function getQrcode(params: Record<string, any>) {
+    return request.get(`sys/qrcode`, { params, showErrorMessage: false })
+}
diff --git a/admin/src/app/api/tools.ts b/admin/src/app/api/tools.ts
index fb0872a2a..82fc7b098 100644
--- a/admin/src/app/api/tools.ts
+++ b/admin/src/app/api/tools.ts
@@ -6,7 +6,7 @@ import request from '@/utils/request'
  * @returns
  */
 export function getAddonDevelop(params: Record<string, any>) {
-    return request.get(`addon_develop`, {params});
+    return request.get(`addon_develop`, { params });
 }
 
 /**
@@ -22,7 +22,7 @@ export function getAddontype() {
  * @returns
  */
 export function getAddonDevelopInfo(key: any) {
-    return request.get(`addon_develop/${key}`)
+    return request.get(`addon_develop/${ key }`)
 }
 
 /**
@@ -30,7 +30,7 @@ export function getAddonDevelopInfo(key: any) {
  * @returns
  */
 export function getAddonDevelopCheck(key: any) {
-    return request.get(`addon_develop/check/${key}`)
+    return request.get(`addon_develop/check/${ key }`)
 }
 
 /**
@@ -48,7 +48,7 @@ export function getAddonKeyBlackList() {
  * @returns
  */
 export function addAddonDevelop(key: any, params: Record<string, any>) {
-    return request.post(`addon_develop/${key}`, params)
+    return request.post(`addon_develop/${ key }`, params)
 }
 
 /**
@@ -58,7 +58,7 @@ export function addAddonDevelop(key: any, params: Record<string, any>) {
  * @returns
  */
 export function editAddonDevelop(key: any, params: Record<string, any>) {
-    return request.put(`addon_develop/${key}`, params)
+    return request.put(`addon_develop/${ key }`, params)
 }
 
 /**
@@ -67,7 +67,7 @@ export function editAddonDevelop(key: any, params: Record<string, any>) {
  * @returns
  */
 export function deleteAddonDevelop(key: any) {
-    return request.delete(`addon_develop/${key}`, {showSuccessMessage: true})
+    return request.delete(`addon_develop/${ key }`, { showSuccessMessage: true })
 }
 
 /**
@@ -75,7 +75,7 @@ export function deleteAddonDevelop(key: any) {
  * @returns
  */
 export function addonDevelopBuild(key: any) {
-    return request.post(`addon_develop/build/${key}`)
+    return request.post(`addon_develop/build/${ key }`)
 }
 
 /**
@@ -83,8 +83,9 @@ export function addonDevelopBuild(key: any) {
  * @returns
  */
 export function addonDevelopDownload(key: any) {
-    return request.post(`addon_develop/download/${key}`, {})
+    return request.post(`addon_develop/download/${ key }`, {})
 }
+
 /***************************************************** 代码生成 ****************************************************/
 
 /**
@@ -93,7 +94,7 @@ export function addonDevelopDownload(key: any) {
  * @returns
  */
 export function getGenerateTableList(params: Record<string, any>) {
-    return request.get(`generator/generator`, {params})
+    return request.get(`generator/generator`, { params })
 }
 
 /**
@@ -102,7 +103,7 @@ export function getGenerateTableList(params: Record<string, any>) {
  * @returns
  */
 export function getGenerateTableInfo(id: number) {
-    return request.get(`generator/generator/${id}`);
+    return request.get(`generator/generator/${ id }`);
 }
 
 /**
@@ -111,7 +112,7 @@ export function getGenerateTableInfo(id: number) {
  * @returns
  */
 export function addGenerateTable(params: Record<string, any>) {
-    return request.post('generator/generator', params, {showSuccessMessage: true})
+    return request.post('generator/generator', params, { showSuccessMessage: true })
 }
 
 /**
@@ -119,7 +120,7 @@ export function addGenerateTable(params: Record<string, any>) {
  * @param params
  */
 export function editGenerateTable(params: Record<string, any>) {
-    return request.put(`generator/generator/${params.id}`, params, {showSuccessMessage: true})
+    return request.put(`generator/generator/${ params.id }`, params, { showSuccessMessage: true })
 }
 
 /**
@@ -128,7 +129,7 @@ export function editGenerateTable(params: Record<string, any>) {
  * @returns
  */
 export function deleteGenerateTable(id: number) {
-    return request.delete(`generator/generator/${id}`, {showSuccessMessage: true})
+    return request.delete(`generator/generator/${ id }`, { showSuccessMessage: true })
 }
 
 /**
@@ -146,7 +147,7 @@ export function generateCreate(params: Record<string, any>) {
  * @returns
  */
 export function generatePreview(id: number) {
-    return request.get(`generator/preview/${id}`)
+    return request.get(`generator/preview/${ id }`)
 }
 
 /**
@@ -167,26 +168,26 @@ export function getSystem() {
  * 获取全部模型
  */
 export function getGeneratorAllModel(params: any) {
-    return request.get(`generator/all_model`, {params})
+    return request.get(`generator/all_model`, { params })
 }
 
 /**
  * 获取 表字段
  */
 export function getGeneratorTableColumn(params: any) {
-    return request.get(`generator/table_column`, {params})
+    return request.get(`generator/table_column`, { params })
 }
 
 /**
  * 同步校验
  */
 export function generatorCheckFile(params: Record<string, any>) {
-    return request.get(`generator/check_file`, {params})
+    return request.get(`generator/check_file`, { params })
 }
 
 /**
  * 根据模型获取表字段
  */
 export function getGeneratorModelTableColumn(params: any) {
-    return request.get(`generator/model_table_column`, {params})
+    return request.get(`generator/model_table_column`, { params })
 }
diff --git a/admin/src/app/api/upgrade.ts b/admin/src/app/api/upgrade.ts
index ed2f93fbe..e6995f683 100644
--- a/admin/src/app/api/upgrade.ts
+++ b/admin/src/app/api/upgrade.ts
@@ -6,7 +6,7 @@ import request from '@/utils/request'
  * @param addon
  */
 export function getUpgradeContent(addon: string = '') {
-    return request.get(addon ? `upgrade/${addon}` : 'upgrade')
+    return request.get(addon ? `upgrade/${ addon }` : 'upgrade')
 }
 
 /**
@@ -21,21 +21,21 @@ export function getUpgradeTask() {
  * @param addon
  */
 export function upgradeAddon(addon: string = '') {
-    return request.post(addon ? `upgrade/${addon}` : 'upgrade')
+    return request.post(addon ? `upgrade/${ addon }` : 'upgrade')
 }
 
 /**
  * 执行升级
  */
 export function executeUpgrade() {
-    return request.post('upgrade/execute', {})
+    return request.post('upgrade/execute', {}, { showErrorMessage: false })
 }
 
 /**
  * 升级前检测
  */
 export function preUpgradeCheck(addon: string = '') {
-    return request.get(addon ? `upgrade/check/${addon}` : 'upgrade/check')
+    return request.get(addon ? `upgrade/check/${ addon }` : 'upgrade/check')
 }
 
 /**
@@ -44,3 +44,88 @@ export function preUpgradeCheck(addon: string = '') {
 export function clearUpgradeTask() {
     return request.post('upgrade/clear')
 }
+
+/**
+ * 用户操作
+ * @param operate
+ */
+export function upgradeUserOperate(operate: string) {
+    return request.post(`upgrade/operate/${ operate }`)
+}
+
+/**
+ * 获取升级记录分页列表
+ * @param params
+ * @returns
+ */
+export function getUpgradeRecords(params: Record<string, any>) {
+    return request.get(`upgrade/records`, { params })
+}
+
+/**
+ * 获取备份记录分页列表
+ * @param params
+ * @returns
+ */
+export function getBackupRecords(params: Record<string, any>) {
+    return request.get(`backup/records`, { params })
+}
+
+/**
+ * 修改备份备注
+ * @param params
+ */
+export function modifyBackupRemark(params: Record<string, any>) {
+    return request.put(`backup/remark`, params, { showSuccessMessage: true })
+}
+
+/**
+ * 备份功能 检测目录权限
+ */
+export function checkDirExist(params: Record<string, any>) {
+    return request.post('backup/check_dir', params)
+}
+
+/**
+ * 备份功能 检测目录权限
+ */
+export function checkPermission(params: Record<string, any>) {
+    return request.post('backup/check_permission', params)
+}
+
+/**
+ * 备份功能 恢复升级备份
+ */
+export function restoreUpgradeBackup(params: Record<string, any>) {
+    return request.post('backup/restore', params)
+}
+
+/**
+ * 备份功能 删除升级记录
+ */
+export function deleteRecords(params: Record<string, any>) {
+    return request.post('backup/delete', params, { showSuccessMessage: true })
+}
+
+/**
+ * 手动备份
+ */
+export function manualBackup(params: Record<string, any>) {
+    return request.post("backup/manual", params)
+}
+
+/**
+ * 获取进行中的恢复
+ * @param params
+ */
+export function performRecoveryTasks(params: Record<string, any>) {
+    return request.get("backup/restore_task", params)
+}
+
+/**
+ * 获取进行中的备份
+ * @param params
+ */
+export function performBackupTasks(params: Record<string, any>) {
+    return request.get("backup/task", params)
+}
\ No newline at end of file
diff --git a/admin/src/app/api/user.ts b/admin/src/app/api/user.ts
index e479878f1..c0d4776e3 100644
--- a/admin/src/app/api/user.ts
+++ b/admin/src/app/api/user.ts
@@ -36,7 +36,7 @@ export function addUser(params: Record<string, any>) {
  * @param uid
  */
 export function deleteUser(uid: number) {
-    return request.delete(`user/user/${uid}`, { showSuccessMessage: true })
+    return request.delete(`user/user/${ uid }`, { showSuccessMessage: true })
 }
 
 /**
@@ -44,7 +44,7 @@ export function deleteUser(uid: number) {
  * @param uid
  */
 export function editUser(params: Record<string, any>) {
-    return request.put(`user/user/${params.uid}`, params, { showSuccessMessage: true })
+    return request.put(`user/user/${ params.uid }`, params, { showSuccessMessage: true })
 }
 
 /**
diff --git a/admin/src/app/api/verify.ts b/admin/src/app/api/verify.ts
index 16af87419..be897fd64 100644
--- a/admin/src/app/api/verify.ts
+++ b/admin/src/app/api/verify.ts
@@ -18,7 +18,7 @@ export function getVerifyRecord(params: Record<string, any>) {
  * @returns
  */
 export function getVerifyDetail(verifyCode: string) {
-    return request.get(`verify/verify/${verifyCode}`)
+    return request.get(`verify/verify/${ verifyCode }`)
 }
 
 /***************************************************** 核销员 ****************************************************/
@@ -64,5 +64,21 @@ export function addVerifier(params: Record<string, any>) {
  * @returns
  */
 export function deleteVerifier(id: number) {
-    return request.delete(`verify/verifier/${id}`, { showSuccessMessage: true })
-}
\ No newline at end of file
+    return request.delete(`verify/verifier/${ id }`, { showSuccessMessage: true })
+}
+
+/**
+ * 获取核销员信息
+ * @returns
+ */
+export function getVerifyInfo(id: number) {
+    return request.get(`verify/verifier/${ id }`)
+}
+
+/**
+ * 修改核销员信息
+ * @returns
+ */
+export function editVerifier(params: Record<string, any>) {
+    return request.post(`verify/verifier/${ params.id }`, params,{ showSuccessMessage: true })
+}
diff --git a/admin/src/app/api/weapp.ts b/admin/src/app/api/weapp.ts
index 921629eaa..99b30fa12 100644
--- a/admin/src/app/api/weapp.ts
+++ b/admin/src/app/api/weapp.ts
@@ -33,6 +33,7 @@ export function getTemplateList() {
 export function getBatchAcquisition(params: Record<string, any>) {
     return request.put('weapp/template/sync', params, { showSuccessMessage: true })
 }
+
 /**
  * 添加微信小程序版本
  * @param params
@@ -65,7 +66,7 @@ export function getWeappVersionList(params: Record<string, any>) {
  * @returns
  */
 export function getWeappUploadLog(key: string) {
-    return request.get(`weapp/upload/${key}`)
+    return request.get(`weapp/upload/${ key }`)
 }
 
 /***************************************************** 管理端 ****************************************************/
@@ -103,7 +104,7 @@ export function getVersionList(params: Record<string, any>) {
  * @returns
  */
 export function getVersionInfo(id: string) {
-    return request.get(`applet/version/${id}`)
+    return request.get(`applet/version/${ id }`)
 }
 
 /**
@@ -112,7 +113,7 @@ export function getVersionInfo(id: string) {
  * @returns
  */
 export function editVersion(params: Record<string, any>) {
-    return request.put(`applet/version/${params.id}`, params, { showSuccessMessage: true })
+    return request.put(`applet/version/${ params.id }`, params, { showSuccessMessage: true })
 }
 
 /**
@@ -121,7 +122,7 @@ export function editVersion(params: Record<string, any>) {
  * @returns
  */
 export function deleteVersion(id: string) {
-    return request.delete(`applet/version/${id}`)
+    return request.delete(`applet/version/${ id }`)
 }
 
 /**
diff --git a/admin/src/app/api/wechat.ts b/admin/src/app/api/wechat.ts
index 336476650..74b08f69e 100644
--- a/admin/src/app/api/wechat.ts
+++ b/admin/src/app/api/wechat.ts
@@ -21,7 +21,7 @@ export function getWechatStatic() {
  * @returns
  */
 export function editWechatConfig(params: Record<string, any>) {
-    return request.put('wechat/config', params, {showSuccessMessage: true})
+    return request.put('wechat/config', params, { showSuccessMessage: true })
 }
 
 /**
@@ -38,7 +38,7 @@ export function getWechatMenu() {
  * @returns
  */
 export function editWechatMenu(params: Record<string, any>) {
-    return request.put('wechat/menu', params, {showSuccessMessage: true})
+    return request.put('wechat/menu', params, { showSuccessMessage: true })
 }
 
 /**
@@ -55,7 +55,7 @@ export function getTemplateList() {
  * @returns
  */
 export function getBatchAcquisition(params: Record<string, any>) {
-    return request.put('wechat/template/sync', params, {showSuccessMessage: true})
+    return request.put('wechat/template/sync', params, { showSuccessMessage: true })
 }
 
 /**
@@ -69,7 +69,7 @@ export function getKeywordsReplyList(params: Record<string, any>) {
  * 修改关键字回复
  */
 export function editKeywordsReply(params: Record<string, any>) {
-    return request.put(`wechat/reply/keywords/${params.id}`, params, { showSuccessMessage: true })
+    return request.put(`wechat/reply/keywords/${ params.id }`, params, { showSuccessMessage: true })
 }
 
 /**
@@ -84,14 +84,14 @@ export function addKeywordsReply(params: Record<string, any>) {
  * @param id
  */
 export function getKeywordsReplyInfo(id: number) {
-    return request.get(`wechat/reply/keywords/${id}`)
+    return request.get(`wechat/reply/keywords/${ id }`)
 }
 
 /**
  * 修改关键字回复
  */
 export function delKeywordsReply(id: number) {
-    return request.delete(`wechat/reply/keywords/${id}`, { showSuccessMessage: true })
+    return request.delete(`wechat/reply/keywords/${ id }`, { showSuccessMessage: true })
 }
 
 /**
diff --git a/admin/src/app/api/wxoplatform.ts b/admin/src/app/api/wxoplatform.ts
index 5938ba931..ee10da735 100644
--- a/admin/src/app/api/wxoplatform.ts
+++ b/admin/src/app/api/wxoplatform.ts
@@ -42,8 +42,8 @@ export function getAuthorizationResult(params: Record<string, any>) {
  * 小程序代码提交
  * @returns
  */
-export function weappCommit() {
-    return request.post('wxoplatform/weapp/version/commit', {}, { showSuccessMessage: true })
+export function weappCommit(params: Record<string, any>) {
+    return request.post('wxoplatform/weapp/version/commit', params, { showSuccessMessage: true })
 }
 
 /**
@@ -67,3 +67,11 @@ export function getWeappLastCommitRecord() {
 export function siteWeappCommit() {
     return request.post('wxoplatform/site/weapp/commit', {}, { showSuccessMessage: true })
 }
+
+/**
+ * 按站点套餐获取提交记录
+ */
+export function getSiteGroupCommitRecord(params: Record<string, any>) {
+    return request.get('wxoplatform/sitegroup/commit', { params })
+}
+
diff --git a/admin/src/app/assets/images/login/login_bg.jpg b/admin/src/app/assets/images/login/login_bg.jpg
index e027a9ba6..f5c5aa8f6 100644
Binary files a/admin/src/app/assets/images/login/login_bg.jpg and b/admin/src/app/assets/images/login/login_bg.jpg differ
diff --git a/admin/src/app/assets/images/tools/tools_backup_records.png b/admin/src/app/assets/images/tools/tools_backup_records.png
new file mode 100644
index 000000000..9a0a4c542
Binary files /dev/null and b/admin/src/app/assets/images/tools/tools_backup_records.png differ
diff --git a/admin/src/app/assets/images/tools/tools_cloud_compile.png b/admin/src/app/assets/images/tools/tools_cloud_compile.png
new file mode 100644
index 000000000..63220eca7
Binary files /dev/null and b/admin/src/app/assets/images/tools/tools_cloud_compile.png differ
diff --git a/admin/src/app/assets/images/tools/tools_upgrade.png b/admin/src/app/assets/images/tools/tools_upgrade.png
new file mode 100644
index 000000000..815257d54
Binary files /dev/null and b/admin/src/app/assets/images/tools/tools_upgrade.png differ
diff --git a/admin/src/app/assets/images/tools/tools_upgrade_records.png b/admin/src/app/assets/images/tools/tools_upgrade_records.png
new file mode 100644
index 000000000..8d91963c7
Binary files /dev/null and b/admin/src/app/assets/images/tools/tools_upgrade_records.png differ
diff --git a/admin/src/app/assets/images/white_logo.png b/admin/src/app/assets/images/white_logo.png
new file mode 100644
index 000000000..3c70387a0
Binary files /dev/null and b/admin/src/app/assets/images/white_logo.png differ
diff --git a/admin/src/app/components/cloud-build/index.vue b/admin/src/app/components/cloud-build/index.vue
index 6f2678d03..46c805bae 100644
--- a/admin/src/app/components/cloud-build/index.vue
+++ b/admin/src/app/components/cloud-build/index.vue
@@ -84,7 +84,6 @@ const active = ref('build')
 const cloudBuildCheck = ref<null | AnyObject>(null)
 const loading = ref(false)
 const terminalRef = ref(null)
-const emits = defineEmits(['complete'])
 
 let cloudBuildLog = []
 /**
@@ -127,7 +126,7 @@ const getCloudBuildLogFn = () => {
 
             data[0].forEach(item => {
                 if (!cloudBuildLog.includes(item.action)) {
-                    terminalRef.value.pushMessage({ content: `正在执行：${item.action}` })
+                    terminalRef.value.pushMessage({ content: `${item.action}` })
                     cloudBuildLog.push(item.action)
 
                     if (item.code == 0) {
diff --git a/admin/src/app/components/upgrade-log/index.vue b/admin/src/app/components/upgrade-log/index.vue
new file mode 100644
index 000000000..f126d0851
--- /dev/null
+++ b/admin/src/app/components/upgrade-log/index.vue
@@ -0,0 +1,239 @@
+<template>
+    <el-dialog v-model="dialogVisible" :title="t('gxx')" width="850">
+        <el-card class="box-card !border-none" shadow="never" >
+            <div v-loading="loading">
+                <div class="text-page-title mb-[20px]">历史版本</div>
+                <div class="time-dialog h-[500px]" style="overflow: auto">
+                    <el-scrollbar>
+                        <el-timeline style="width: 100%" v-if="!loading">
+                            <el-timeline-item v-for="(item, index) in frameworkVersionList" :key="index" placement="left" :color="color">
+                                <div class="relative">
+                                    <span class="text-[#333333] text-[14px] absolute">{{ timeSplit(item.release_time)[0] }}</span>
+                                    <br />
+                                    <span class="text-[#999999] text-[14px] w-[78px] block mt-[10px] absolute text-right">{{ timeSplit(item.release_time)[1] }}</span>
+                                </div>
+                                <el-collapse v-model="activeName" accordion>
+                                    <el-collapse-item :name="index">
+                                        <template #title>
+                                            <span class="text-[#333] text-[14px]"> v{{ item.version_no }} </span>
+                                        </template>
+                                        <div class="px-[20px] py-[20px] bg-overlay timeline-log-wrap whitespace-pre-wrap rounded-[4px]" style="background: rgba(25, 103, 249, 0.03);" v-if="item['upgrade_log']">
+                                            <div v-html="item['upgrade_log']"></div>
+                                        </div>
+                                    </el-collapse-item>
+                                </el-collapse>
+                            </el-timeline-item>
+                        </el-timeline>
+                    </el-scrollbar>
+                </div>
+            </div>
+        </el-card>
+    </el-dialog>
+</template>
+<script lang="ts" setup>
+import { computed, ref, defineProps, nextTick } from "vue"
+import { t } from "@/lang"
+import { getAppVersionList, getFrameworkVersionList } from "@/app/api/module"
+
+const props = defineProps({
+    upgradeKey: {
+        type: String,
+        required: true
+    }
+})
+
+const frameworkVersionList = ref([])
+
+const newVersion: any = computed(() => {
+    return frameworkVersionList.value.length ? frameworkVersionList.value[0] : null
+})
+
+const getAppVersionListFn = () => {
+    getAppVersionList({ app_key: props.upgradeKey }).then(({ data }) => {
+        loading.value = false
+        data.forEach((item: any, index) => {
+            if (index == 0) {
+                item.important = 1
+            } else {
+                item.important = 0
+            }
+        })
+
+        frameworkVersionList.value = data
+    })
+}
+const getFrameworkVersionListFn = () => {
+    getFrameworkVersionList().then(({ data }) => {
+        loading.value = false
+        data.forEach((item: any, index) => {
+            if (index == 0) {
+                item.important = 1
+            } else {
+                item.important = 0
+            }
+        })
+        frameworkVersionList.value = data
+    })
+}
+
+const activeName = ref(0)
+
+// 提交信息
+const loading = ref(true)
+const dialogVisible = ref(false)
+const open = async () => {
+    nextTick(() => {
+
+        if (props.upgradeKey) {
+            getAppVersionListFn()
+        } else {
+            getFrameworkVersionListFn()
+        }
+        dialogVisible.value = true
+    })
+
+}
+const timeSplit = (str: string) => {
+    const [date, time] = str.split(" ")
+    const [hours, minutes] = time.split(":")
+    return [date, `${ hours }:${ minutes }`]
+}
+defineExpose({
+    open
+})
+</script>
+<style lang="scss" scoped></style>
+<style scoped>
+.el-timeline-item {
+    min-height: 75px;
+}
+
+.el-timeline-item >>> .el-timeline-item__node--normal {
+    left: 117px;
+    width: 18px;
+    height: 18px;
+
+    background: rgba(25, 103, 249, 0.12) !important;
+    border-radius: 50%;
+    /* 创建圆形 */
+    position: relative;
+    /* 用于定位伪元素 */
+}
+
+.el-timeline-item >>> .el-timeline-item__node--normal::before {
+    content: "";
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    width: 8px;
+    /* 中心圆直径 */
+    height: 8px;
+    background-color: var(--el-color-primary);
+    /* 中心圆颜色 */
+    border-radius: 50%;
+    /* 中心圆为圆形 */
+    transform: translate(-50%, -50%);
+    /* 居中显示 */
+}
+
+.el-timeline-item >>> .el-timeline-item__tail {
+    left: 125px;
+    border-left-color: #dddddd;
+    border-left-style: dashed;
+    margin: 12px 0;
+    margin-top: 24px;
+    height: calc(100% - 24px - 12px);
+}
+
+.time-dialog >>> .el-dialog__header {
+    padding: 10px 20px;
+    height: 25px;
+    line-height: 25px;
+    text-align: left;
+    background: #fff;
+    border-bottom: solid 1px #e4e7ed;
+}
+
+.time-dialog >>> .el-card__body {
+    padding: 8px;
+}
+
+.time-dialog >>> .el-card.is-always-shadow {
+    box-shadow: none;
+}
+
+.time-dialog >>> .el-dialog__headerbtn .el-dialog__close {
+    color: #666;
+}
+
+.time-dialog >>> .el-dialog__headerbtn:hover .el-dialog__close {
+    color: #666;
+}
+
+.time-dialog >>> .el-dialog__headerbtn {
+    top: 14px;
+}
+
+.time-dialog >>> .el-collapse {
+    margin-left: 119px;
+    border: none;
+    margin-top: -22px;
+}
+
+.time-dialog >>> .el-collapse-item__header {
+    border: none;
+    line-height: 25px;
+    height: 25px;
+    position: relative;
+    z-index: 999;
+}
+
+.time-dialog >>> .el-collapse-item__wrap {
+    border: none;
+}
+
+.time-dialog >>> .el-collapse-item__content {
+    margin-top: 15px;
+    padding-bottom: 0px !important;
+}
+
+.time-dialog >>> .el-timeline-item__node--01 {
+    width: 18px !important;
+    height: 18px !important;
+    left: 117px !important;
+}
+</style>
+<style>
+.time-dialog .el-dialog {
+    margin: 0 auto !important;
+    max-height: 90%;
+    overflow: hidden;
+    top: 5%;
+}
+
+.time-dialog .el-dialog {
+    margin: 0 auto !important;
+    height: 65%;
+    overflow: hidden;
+    top: 10%;
+}
+
+.time-dialog .el-dialog__body {
+    position: absolute;
+    left: 0;
+    top: 46px;
+    bottom: 0;
+    right: 0;
+    z-index: 1;
+    overflow: hidden;
+    overflow-y: auto;
+    padding: 10px 20px 0 0;
+}
+
+.time-dialog .el-timeline-item__wrapper {
+    top: -20px !important;
+}
+.el-scrollbar__bar{
+    z-index:999;
+}
+</style>
diff --git a/admin/src/app/components/upgrade/index.vue b/admin/src/app/components/upgrade/index.vue
index fb2019786..08cc2a12f 100644
--- a/admin/src/app/components/upgrade/index.vue
+++ b/admin/src/app/components/upgrade/index.vue
@@ -1,140 +1,252 @@
 <template>
     <el-dialog v-model="showDialog" :title="t('upgrade.title')" width="850px" :close-on-click-modal="false" :close-on-press-escape="false" :before-close="dialogClose">
 
-        <div v-show="active == 'content'">
-
-            <div class="h-[60vh] flex flex-col" v-if="upgradeContent">
+        <template v-if="upgradeContent">
+            <!-- 检测服务是否到期 -->
+            <template v-if="step == 1 && upgradeContent.upgrade_version != upgradeContent.last_version">
                 <div class="text-lg">
-                    本次升级将从<span class="font-bold">{{ upgradeContent.version }}</span>升级到<span class="font-bold">{{ upgradeContent.upgrade_version }}</span>版本
+                    <template v-if="upgradeContent.upgrade_version">
+                        <span>本次升级将从</span>
+                        <span class="font-bold px-[2px]">{{ upgradeContent.version }}</span>
+                        <span>升级到</span>
+                        <span class="font-bold px-[2px]">{{ upgradeContent.upgrade_version }}</span>
+                        <span>版本</span>
+                    </template>
+                    <template v-else>
+                        <span>当前版本</span>
+                        <span class="font-bold px-[2px]">{{ upgradeContent.version }}</span>
+                    </template>
                 </div>
-                <div class="mt-[10px]" v-if="upgradeContent.upgrade_version != upgradeContent.last_version">
-                    <el-alert type="info" show-icon>
+                <div class="mt-[10px]">
+                    <el-alert type="info" show-icon :closable="false">
                         <template #title>
-                            当前最新版本为{{ upgradeContent.last_version }}，您的服务{{ upgradeContent.expire_time ? `已于${upgradeContent.expire_time}到期` : '长期有效' }}。如需升级到最新版可在<a class="text-primary" href="https://www.niucloud.com" target="_blank">niucloud-admin官网</a>购买相关服务后再进行升级
+                            <span>当前最新版本为{{ upgradeContent.last_version }}，您的服务{{ upgradeContent.expire_time ? `已于${upgradeContent.expire_time}到期` : '长期有效' }}。</span>
+                            <span>如需升级到最新版可在<a class="text-primary" href="https://www.niucloud.com" target="_blank">niucloud-admin官网</a>购买相关服务后再进行升级</span>
                         </template>
                     </el-alert>
                 </div>
-                <el-scrollbar class="flex-1 h-0 mt-[20px]">
-                    <div class="mt-[20px]" v-for="(item, index) in upgradeContent.version_list" :key="index">
-                        <div class="font-bold text-lg">{{ item.version_no }}</div>
-                        <div class="mt-[5px]" v-if="item.release_time">{{ item.release_time }}</div>
-                        <div class="mt-[10px] p-[10px] rounded bg-[#f4f4f5] whitespace-pre-wrap !break-all" v-if="item.upgrade_log" v-html="item.upgrade_log"></div>
-                    </div>
-                </el-scrollbar>
-            </div>
-            <div class="flex justify-end" v-if="upgradeContent.version_list.length">
-                <el-button type="primary" @click="handleUpgrade" :loading="uploading">{{ t('upgrade.upgradeButton') }}</el-button>
-            </div>
-        </div>
+            </template>
+            <div v-if="step == 2">
+                <el-steps :active="numberOfSteps" align-center class="number-of-steps" finish-status="success" process-status="process">
+                    <el-step :title="t('testDirectoryPermissions')" />
+                    <el-step :title="t('backupFiles')" />
+                    <el-step :title="t('startUpgrade')" />
+                    <el-step :title="t('upgradeEnd')" />
+                </el-steps>
+                <div class="h-[400px]" style="overflow: auto">
+<!--                    <div class="time-dialog-wrap mt-[30px]" v-show="active == 'content'">-->
+<!--                        <el-timeline style="width: 100%">-->
+<!--                            <el-timeline-item v-for="(item, index) in upgradeContent.version_list" :key="index" placement="left">-->
+<!--                                <div class="relative">-->
+<!--                                    <span class="text-[#333333] text-[16px] absolute">{{ timeSplit(item.release_time)[0] }}</span>-->
+<!--                                    <br />-->
+<!--                                    <span class="text-[#999999] text-[14px] w-[78px] block mt-[10px] absolute" style="text-align: right"> {{ timeSplit(item.release_time)[1] }}</span>-->
+<!--                                </div>-->
+<!--                                <el-collapse v-model="activeName" accordion>-->
+<!--                                    <el-collapse-item :name="index">-->
+<!--                                        <template #title>-->
+<!--                                            <span class="text-[#333] text-[16px]"> v{{ item.version_no }} </span>-->
+<!--                                        </template>-->
 
-        <div v-show="active == 'upgrade'">
-            <div class="h-[60vh] flex flex-col" v-if="upgradeCheck && !upgradeTask">
-                <el-scrollbar>
-                    <div class="bg-[#fff] my-3" v-if="upgradeCheck.dir">
-                        <p class="pt-[20px] pl-[20px] ">{{ t('upgrade.dirPermission') }}</p>
-                        <div class="px-[20px] pt-[10px] text-[14px] el-table">
-                            <el-row class="py-[10px] items table-head-bg pl-[15px] mb-[10px]">
-                                <el-col :span="12">
-                                    <span>{{ t('upgrade.path') }}</span>
-                                </el-col>
-                                <el-col :span="6">
-                                    <span>{{ t('upgrade.demand') }}</span>
-                                </el-col>
-                                <el-col :span="6">
-                                    <span>{{ t('status') }}</span>
-                                </el-col>
-                            </el-row>
-                            <el-row class="pb-[10px] items pl-[15px]" v-for="item in upgradeCheck.dir.is_readable">
-                                <el-col :span="12">
-                                    <span>{{ item.dir }}</span>
-                                </el-col>
-                                <el-col :span="6">
-                                    <span>{{ t('upgrade.readable') }}</span>
-                                </el-col>
-                                <el-col :span="6">
-                                    <span v-if="item.status"><el-icon color="green"><Select /></el-icon></span>
-                                    <span v-else>
-                                        <el-icon color="red">
-                                            <CloseBold />
-                                        </el-icon>
-                                    </span>
-                                </el-col>
-                            </el-row>
-                            <el-row class="pb-[10px] items pl-[15px]" v-for="item in upgradeCheck.dir.is_write">
-                                <el-col :span="12">
-                                    <span>{{ item.dir }}</span>
-                                </el-col>
-                                <el-col :span="6">
-                                    <span>{{ t('upgrade.write') }}</span>
-                                </el-col>
-                                <el-col :span="6">
-                                    <span v-if="item.status"><el-icon color="green"><Select /></el-icon></span>
-                                    <span v-else>
-                                        <el-icon color="red">
-                                            <CloseBold />
-                                        </el-icon>
-                                    </span>
-                                </el-col>
-                            </el-row>
+<!--                                        <div class="px-[20px] py-[20px] bg-overlay timeline-log-wrap whitespace-pre-wrap rounded-[4px]" style="background: rgba(25, 103, 249, 0.03);" v-if="item['upgrade_log']">-->
+<!--                                            <div v-html="item['upgrade_log']"></div>-->
+<!--                                        </div>-->
+<!--                                    </el-collapse-item>-->
+<!--                                </el-collapse>-->
+<!--                            </el-timeline-item>-->
+<!--                        </el-timeline>-->
+<!--                    </div>-->
+
+                    <!-- 判断文件权限 -->
+                    <div v-show="active == 'upgrade'">
+                        <div class="flex flex-col" v-if="upgradeCheck && !upgradeTask">
+                            <el-scrollbar>
+                                <div class="bg-[#fff] my-3" v-if="upgradeCheck.dir">
+                                    <div class="px-[20px] pt-[10px] text-[14px] el-table">
+                                        <el-row class="py-[10px] items table-head-bg pl-[15px] mb-[10px]">
+                                            <el-col :span="12">
+                                                <span>{{ t("upgrade.path") }}</span>
+                                            </el-col>
+                                            <el-col :span="6">
+                                                <span>{{ t("upgrade.demand") }}</span>
+                                            </el-col>
+                                            <el-col :span="6">
+                                                <span>{{ t("status") }}</span>
+                                            </el-col>
+                                        </el-row>
+
+                                        <div style="height: calc(300px); overflow: auto">
+                                            <el-row class="pb-[10px] items pl-[15px]" v-for="item in upgradeCheck.dir.is_readable">
+                                                <el-col :span="12">
+                                                    <span>{{ item.dir }}</span>
+                                                </el-col>
+                                                <el-col :span="6">
+                                                    <span>{{ t("upgrade.readable") }}</span>
+                                                </el-col>
+                                                <el-col :span="6">
+                                                    <span v-if="item.status">
+                                                        <el-icon color="green">
+                                                            <Select />
+                                                        </el-icon>
+                                                    </span>
+                                                    <span v-else>
+                                                        <el-icon color="red">
+                                                            <CloseBold />
+                                                        </el-icon>
+                                                    </span>
+                                                </el-col>
+                                            </el-row>
+                                            <el-row class="pb-[10px] items pl-[15px]" v-for="item in upgradeCheck.dir.is_write">
+                                                <el-col :span="12">
+                                                    <span>{{ item.dir }}</span>
+                                                </el-col>
+                                                <el-col :span="6">
+                                                    <span>{{ t("upgrade.write") }}</span>
+                                                </el-col>
+                                                <el-col :span="6">
+                                                    <span v-if="item.status">
+                                                        <el-icon color="green">
+                                                            <Select />
+                                                        </el-icon>
+                                                    </span>
+                                                    <span v-else>
+                                                        <el-icon color="red">
+                                                            <CloseBold />
+                                                        </el-icon>
+                                                    </span>
+                                                </el-col>
+                                            </el-row>
+                                        </div>
+                                    </div>
+                                </div>
+                            </el-scrollbar>
+                        </div>
+                        <div class="h-[370px] mt-[30px]" v-show="upgradeTask">
+                            <terminal ref="terminalRef" :context="upgradeTask ? upgradeTask.upgrade.app_key : ''" :init-log="null" :show-header="false" :show-log-time="true" @exec-cmd="onExecCmd" />
                         </div>
                     </div>
-                </el-scrollbar>
-            </div>
-            <div class="h-[60vh]" v-show="upgradeTask">
-                <terminal ref="terminalRef" :context="upgradeTask ? upgradeTask.upgrade.app_key : ''" :init-log="null" :show-header="false" :show-log-time="true" @exec-cmd="onExecCmd"/>
-            </div>
-        </div>
+                    <!-- 是否备份选择 -->
+                    <div class="flex flex-col" v-show="active == 'backup'">
+                        <el-scrollbar>
+                            <div class="bg-[#fff] my-3">
 
-        <div v-show="active == 'complete'">
-            <div class="h-[60vh] flex flex-col">
-                <div class="flex-1 h-0">
-                    <el-result icon="success" :title="t('upgrade.upgradeSuccess')"></el-result>
-                    <el-alert :title="t('upgrade.upgradeCompleteTips')" type="error" :closable="false" />
-                </div>
-                <div class="flex justify-end">
-                    <el-button type="default" @click="showDialog = false">{{ t('upgrade.localBuild') }}</el-button>
-                    <el-button type="primary" @click="handleCloudBuild">{{ t('upgrade.cloudBuild') }}</el-button>
+                                <div class="px-[20px] pt-[10px] text-[14px] el-table">
+                                    <el-row class="py-[10px] items table-head-bg pl-[15px] mb-[10px]">
+                                        <el-col :span="20">
+                                            <span>功能操作</span>
+                                        </el-col>
+                                        <el-col :span="4">
+                                            <span>状态</span>
+                                        </el-col>
+                                    </el-row>
+                                    <el-row class="pb-[10px] items pl-[15px]" v-for="item in excludeSteps">
+                                        <el-col :span="20">
+                                            <span>{{ item.name }}</span>
+                                        </el-col>
+                                        <el-col :span="4">
+                                            <span>
+                                                <el-icon color="green">
+                                                    <Select />
+                                                </el-icon>
+                                            </span>
+                                        </el-col>
+                                    </el-row>
+                                </div>
+                            </div>
+                        </el-scrollbar>
+                    </div>
+                    <div class="mt-[50px]" v-show="active == 'complete'">
+                        <el-result icon="success" :title="t('upgrade.upgradeSuccess')"></el-result>
+                        <el-alert :title="t('upgrade.upgradeCompleteTips')" type="error" :closable="false" v-show="upgradeTask && upgradeTask.executed && !upgradeTask.executed.includes('cloudBuild')"/>
+                    </div>
                 </div>
             </div>
-        </div>
+        </template>
+        <template #footer>
+            <div class="dialog-footer">
+                <!-- 查看升级内容 -->
+                <el-button v-if="step == 1 && upgradeContent.version_list.length" @click="step = 2" type="primary">{{ t("upgrade.upgradeButton") }}</el-button>
+
+                <template v-if="step == 2">
+                <!--                <el-button v-if="active == 'content'" @click="showDialog = false">{{ t("return") }}</el-button>-->
+                    <el-button type="primary" :disabled="!is_pass" v-if="active == 'upgrade' && !upgradeTask" @click="() => { active = 'backup'; numberOfSteps = 1 }">{{ t("nextStep") }}</el-button>
+                    <el-button v-if="active == 'backup'" @click="() => { active = 'upgrade'; numberOfSteps = 1 } ">{{ t("prev") }}</el-button>
+                    <el-button type="primary" v-if="active == 'backup'" :loading="uploading" @click="() => { upgradeAddonFn() }">{{ t("nextStep") }}</el-button>
+                    <el-button v-if="active == 'complete'" @click="showDialog = false">{{ t("complete") }}</el-button>
+                </template>
+            </div>
+        </template>
     </el-dialog>
 
     <el-dialog v-model="upgradeTipsShowDialog" :title="t('warning')" width="500px" draggable>
         <span v-html="t('upgrade.upgradeTips')"></span>
         <template #footer>
             <div class="flex justify-end">
-                <el-button @click="upgradeTipsConfirm(true)" type="primary">{{ t('upgrade.knownToKnow') }}</el-button>
-                <el-button @click="upgradeTipsConfirm()" type="primary" plain>{{ t('upgrade.upgradeButton') }}</el-button>
-                <el-button @click="upgradeTipsShowDialog = false">{{ t('cancel') }}</el-button>
+                <el-button @click="upgradeTipsConfirm(true)" type="primary">{{ t("upgrade.knownToKnow") }}</el-button>
+                <el-button @click="handleUpgrade()" type="primary" plain>{{ t("upgrade.upgradeButton") }}</el-button>
+                <el-button @click="upgradeTipsShowDialog = false">{{ t("cancel") }}</el-button>
+            </div>
+        </template>
+    </el-dialog>
+
+    <el-dialog v-model="cloudBuildErrorTipsShowDialog" :title="t('warning')" width="500px" draggable :show-close="false">
+        <span v-html="t('upgrade.cloudBuildErrorTips')"></span>
+        <template #footer>
+            <div class="flex justify-end">
+                <el-button @click="cloudBuildError('local')" type="primary">{{ t("upgrade.localBuild") }}</el-button>
+                <el-button @click="cloudBuildError('retry')" type="primary">{{ t("upgrade.cloudBuild") }}（{{ retrySecond }}S）</el-button>
+                <el-button @click="cloudBuildError('rollback')" type="primary">{{ t("upgrade.rollback") }}</el-button>
             </div>
         </template>
     </el-dialog>
 </template>
 
 <script lang="ts" setup>
-import { ref, h, watch } from 'vue'
-import { t } from '@/lang'
-import { getVersions } from '@/app/api/auth'
-import { getFrameworkNewVersion } from '@/app/api/module'
-import { getUpgradeContent, getUpgradeTask, upgradeAddon, executeUpgrade, preUpgradeCheck, clearUpgradeTask } from '@/app/api/upgrade'
-import { Terminal, TerminalFlash } from 'vue-web-terminal'
-import 'vue-web-terminal/lib/theme/dark.css'
-import { AnyObject } from '@/types/global'
-import { ElNotification, ElMessage, ElMessageBox } from 'element-plus'
-import Storage from '@/utils/storage'
+import { ref, h, watch } from "vue"
+import { t } from "@/lang"
+import { getVersions } from "@/app/api/auth"
+import { getFrameworkNewVersion } from "@/app/api/module"
+import {
+    getUpgradeContent,
+    getUpgradeTask,
+    upgradeAddon,
+    executeUpgrade,
+    preUpgradeCheck,
+    clearUpgradeTask, upgradeUserOperate
+} from "@/app/api/upgrade"
+import { Terminal, TerminalFlash } from "vue-web-terminal"
+import "vue-web-terminal/lib/theme/dark.css"
+import { AnyObject } from "@/types/global"
+import { ElNotification, ElMessage, ElMessageBox } from "element-plus"
+import Storage from "@/utils/storage"
 
 const showDialog = ref<boolean>(false)
 const upgradeContent = ref<null | AnyObject>(null)
 const upgradeTask = ref<null | AnyObject>(null)
-const active = ref('content')
+const active = ref('upgrade')
+const step = ref(1)
 const upgradeCheck = ref<null | AnyObject>(null)
 const uploading = ref(false)
 const terminalRef: any = ref(null)
-const emits = defineEmits(['complete', 'cloudbuild'])
+const emits = defineEmits(["complete", "cloudbuild"])
 const upgradeTipsShowDialog = ref<boolean>(false)
-
 let upgradeLog: any = []
 let errorLog: any = []
+const cloudBuildErrorTipsShowDialog = ref<boolean>(false)
+const retrySecond = ref(30)
+let retrySecondInterval: any = null
+
+// 升级步骤排除，backupCode 备份代码，backupSql 备份数据库
+const excludeSteps: any = ref([
+    {
+        name: "备份源码",
+        code: "backupCode"
+    },
+    {
+        name: "备份数据库",
+        code: "backupSql"
+    }
+])
 /**
  * 查询升级任务
  */
@@ -142,66 +254,88 @@ const getUpgradeTaskFn = () => {
     getUpgradeTask().then(({ data }) => {
         if (!data) return
 
+        if (!upgradeContent.value) upgradeContent.value = data.upgrade_content
+
         // 检测有没有正在进行中的升级任务
         if (!showDialog.value) {
             showElNotification()
             return
         }
         if (!upgradeTask.value) {
-            terminalRef.value.execute('clear')
-            terminalRef.value.execute('开始升级')
+            terminalRef.value.execute("clear")
+            terminalRef.value.execute("开始升级")
         }
-        data.log.forEach(item => {
+
+        upgradeTask.value = data
+
+        data.log.forEach((item) => {
             if (!upgradeLog.includes(item)) {
-                terminalRef.value.pushMessage({content: `正在执行：${item}`})
+                terminalRef.value.pushMessage({ content: `${ item }` })
                 upgradeLog.push(item)
             }
         })
         // 安装失败
         if (data.error) {
-            data.error.forEach(item => {
+            data.error.forEach((item) => {
                 if (!errorLog.includes(item)) {
-                    terminalRef.value.pushMessage({ content: item, class: 'error' })
+                    terminalRef.value.pushMessage({ content: item, class: "error" })
                     errorLog.push(item)
                 }
             })
         }
         // 恢复完毕
-        if (data.step == 'restoreComplete') {
+        if (data.step == "restoreComplete") {
+            flashInterval && clearInterval(flashInterval)
             return
         }
         // 升级完成
-        if (data.step == 'upgradeComplete') {
-            active.value = 'complete'
+        if (data.step == "upgradeComplete") {
+            active.value = "complete"
+            numberOfSteps.value = 4
             notificationEl && notificationEl.close()
-            emits('complete')
+            emits("complete")
             clearUpgradeTask()
             return
         }
-        upgradeTask.value = data
+        numberOfSteps.value = 2
+        active.value = "upgrade"
         executeUpgradeFn()
-    }).catch()
+    })
 }
+
 getUpgradeTaskFn()
 
 const executeUpgradeFn = () => {
     executeUpgrade().then(() => {
         getUpgradeTaskFn()
-    }).catch()
+    }).catch((err) => {
+        if (err.message.indexOf('队列') != -1) {
+            retrySecond.value = 30
+            retrySecondInterval = setInterval(() => {
+                retrySecond.value--
+                if (retrySecond.value == 0) {
+                    cloudBuildError('retry')
+                }
+            }, 1000)
+            cloudBuildErrorTipsShowDialog.value = true
+        } else {
+            ElMessage({ message: err.message, type: 'error' })
+        }
+    })
 }
 
-let notificationEl : any = null
+let notificationEl: any = null
 /**
  * 升级中任务提示
  */
 const showElNotification = () => {
     notificationEl = ElNotification.success({
-        title: t('warning'),
+        title: t("warning"),
         dangerouslyUseHTMLString: true,
-        message: h('div', {}, [
-            t('upgrade.upgradingTips'),
-            h('span', { class: 'text-primary cursor-pointer', onClick: elNotificationClick }, [t('upgrade.clickView')])
-        ]),
+        message: h("div", {}, [t("upgrade.upgradingTips"), h("span", {
+            class: "text-primary cursor-pointer",
+            onClick: elNotificationClick
+        }, [t("upgrade.clickView")])]),
         duration: 0,
         showClose: false
     })
@@ -209,13 +343,13 @@ const showElNotification = () => {
 
 const elNotificationClick = () => {
     showDialog.value = true
-    active.value = 'upgrade'
     getUpgradeTaskFn()
+    active.value = "upgrade"
     notificationEl && notificationEl.close()
 }
 
-const frameworkVersion = ref('')
-getVersions().then(res => {
+const frameworkVersion = ref("")
+getVersions().then((res) => {
     frameworkVersion.value = res.data.version.version
 })
 const newFrameworkVersion = ref("")
@@ -226,44 +360,63 @@ getFrameworkNewVersion().then(({ data }) => {
 /**
  * 执行升级
  */
-const handleUpgrade = async () => {
+const is_pass = ref(false)
+const repeat = ref(false)
+
+const handleUpgrade = async() => {
+    if (repeat.value) return
+    repeat.value = true
+    const appKey = upgradeContent.value?.app.app_key != "niucloud-admin" ? upgradeContent.value?.app.app_key : ""
+
+    await preUpgradeCheck(appKey).then(async ({ data }) => {
+        upgradeCheck.value = data
+        is_pass.value = data.is_pass
+        active.value = "upgrade"
+        !upgradeTask.value ? (numberOfSteps.value = 0) : numberOfSteps.value
+        upgradeTipsShowDialog.value = false
+        showDialog.value = true
+        repeat.value = false
+    }).catch(() => {
+        repeat.value = true
+    })
+}
+
+const upgradeAddonFn = () => {
+    if (!is_pass.value) return
     if (uploading.value) return
     uploading.value = true
 
-    const appKey = upgradeContent.value?.app.app_key != 'niucloud-admin' ? upgradeContent.value?.app.app_key : ''
+    const appKey = upgradeContent.value?.app.app_key != "niucloud-admin" ? upgradeContent.value?.app.app_key : ""
 
-    await preUpgradeCheck(appKey).then(async({ data }) => {
-        if (data.is_pass) {
-            await upgradeAddon(appKey).then(() => {
-                getUpgradeTaskFn()
-            }).catch(() => {
-                uploading.value = false
-            })
-        } else {
-            upgradeCheck.value = data
-        }
-    }).catch()
-
-    if (uploading.value) active.value = 'upgrade'
+    upgradeAddon(appKey).then(() => {
+        getUpgradeTaskFn()
+    }).catch(() => {
+        uploading.value = false
+    })
 }
 
-const open = (addonKey: string = '') => {
+const open = (addonKey: string = "", callback = null) => {
     if (upgradeTask.value) {
-        ElMessage({ message: '已有正在执行中的升级任务', type: 'error' })
+        ElMessage({ message: "已有正在执行中的升级任务", type: "error" })
         showDialog.value = true
+        if (callback) callback()
     } else {
         if (addonKey && frameworkVersion.value != newFrameworkVersion.value) {
-            ElMessage({ message: '存在新版本框架，请先升级框架', type: 'error' })
+            ElMessage({ message: "存在新版本框架，请先升级框架", type: "error" })
+            if (callback) callback()
             return
         }
         getUpgradeContent(addonKey).then(({ data }) => {
             upgradeContent.value = data
-            if (Storage.get('upgradeTipsLock')) {
-                showDialog.value = true
+            if (Storage.get("upgradeTipsLock")) {
+                handleUpgrade()
             } else {
                 upgradeTipsShowDialog.value = true
             }
-        }).catch()
+            if (callback) callback()
+        }).catch(() => {
+            if (callback) callback()
+        })
     }
 }
 
@@ -273,11 +426,11 @@ const open = (addonKey: string = '') => {
 let flashInterval: any = null
 const terminalFlash = new TerminalFlash()
 const onExecCmd = (key, command, success, failed, name) => {
-    if (command == '开始升级') {
+    if (command == "开始升级") {
         success(terminalFlash)
-        const frames = makeIterator(['/', '——', '\\', '|'])
+        const frames = makeIterator(["/", "——", "\\", "|"])
         flashInterval = setInterval(() => {
-            terminalFlash.flush('> ' + frames.next().value)
+            terminalFlash.flush("> " + frames.next().value)
         }, 150)
     }
 }
@@ -286,7 +439,7 @@ const makeIterator = (array: string[]) => {
     var nextIndex = 0
     return {
         next() {
-            if ((nextIndex + 1) == array.length) {
+            if (nextIndex + 1 == array.length) {
                 nextIndex = 0
             }
             return { value: array[nextIndex++] }
@@ -295,53 +448,78 @@ const makeIterator = (array: string[]) => {
 }
 
 const dialogClose = (done: () => {}) => {
-    if (active.value == 'upgrade' && upgradeTask.value && !upgradeTask.value.error) {
-        ElMessageBox.confirm(
-            t('upgrade.showDialogCloseTips'),
-            t('warning'),
-            {
-                confirmButtonText: t('confirm'),
-                cancelButtonText: t('cancel'),
-                type: 'warning'
-            }
-        ).then(() => {
+    if (active.value == "upgrade" && upgradeTask.value && ['upgradeComplete', 'restoreComplete'].includes(upgradeTask.value.step) === false) {
+        ElMessageBox.confirm(t("upgrade.showDialogCloseTips"), t("warning"), {
+            confirmButtonText: t("confirm"),
+            cancelButtonText: t("cancel"),
+            type: "warning"
+        }).then(() => {
             done()
-        }).catch(() => { })
+        })
     } else {
         done()
     }
 }
 
-watch(() => showDialog.value, () => {
-    if (!showDialog.value) {
-        clearUpgradeTaskFn()
+watch(
+    () => showDialog.value,
+    () => {
+        if (!showDialog.value) {
+            clearUpgradeTaskFn()
+        }
     }
-})
+)
 
 const clearUpgradeTaskFn = () => {
-    active.value = 'content'
+    active.value = "upgrade"
     uploading.value = false
     upgradeTask.value = null
     upgradeLog = []
     errorLog = []
+    numberOfSteps.value = 0
     flashInterval && clearInterval(flashInterval)
-    clearUpgradeTask().then(() => {}).catch()
+    retrySecondInterval && clearInterval(retrySecondInterval)
+    clearUpgradeTask().then(() => {
+    })
 }
 
 /**
- * 云编译
+ * 云编译队列不足操作
+ * @param event
  */
-const handleCloudBuild = () => {
-    showDialog.value = false
-    emits('cloudbuild')
+const cloudBuildError = (event: string) => {
+    cloudBuildErrorTipsShowDialog.value = false
+    switch (event) {
+        case "local":
+            upgradeUserOperate(event).then(() => {
+                getUpgradeTaskFn()
+            })
+            break
+        case "retry":
+            executeUpgradeFn()
+            retrySecondInterval && clearInterval(retrySecondInterval)
+            break
+        case "rollback":
+            upgradeUserOperate(event).then(() => {
+                getUpgradeTaskFn()
+            })
+            break
+    }
+}
+
+const timeSplit = (str: string) => {
+    const [date, time] = str.split(" ")
+    const [hours, minutes] = time.split(":")
+    return [date, `${ hours }:${ minutes }`]
 }
 
 const upgradeTipsConfirm = (isLock: boolean = false) => {
-    isLock && Storage.set({ key: 'upgradeTipsLock', data: isLock })
+    isLock && Storage.set({ key: "upgradeTipsLock", data: isLock })
     upgradeTipsShowDialog.value = false
     !isLock && (showDialog.value = true)
 }
-
+const activeName = ref(0)
+const numberOfSteps = ref(0)
 defineExpose({
     open
 })
@@ -351,7 +529,187 @@ defineExpose({
 .table-head-bg {
     background-color: var(--el-table-header-bg-color);
 }
+
 :deep(.terminal .t-log-box span) {
     white-space: pre-wrap;
 }
+
+::v-deep .number-of-steps {
+    .el-step__line {
+        margin: 0 25px;
+        background: #dddddd;
+    }
+
+    .el-step__head {
+        margin-top: 10px;
+    }
+
+    .is-success {
+        color: var(--el-color-primary);
+        border-color: var(--el-color-primary);
+
+        .el-step__icon {
+            background: var(--el-color-primary);
+
+            box-shadow: 0 0 0 4px var(--el-color-primary-light-9);
+
+            i {
+                color: #fff;
+            }
+        }
+
+        .el-step__line {
+            margin: 0 25px;
+            background: var(--el-color-primary);
+        }
+    }
+
+    .is-process {
+        color: var(--el-color-primary);
+        font-weight: inherit;
+
+        // font-size: 18px;
+        .el-step__icon {
+            padding: 10px;
+            border: 1px solid var(--el-color-primary);
+            box-shadow: 0 0 0 4px var(--el-color-primary-light-9);
+        }
+    }
+
+    .is-wait {
+        color: #333;
+    }
+}
+</style>
+
+<style scoped>
+.el-timeline-item {
+    min-height: 100px;
+}
+
+.el-timeline-item >>> .el-timeline-item__node--normal {
+    left: 117px;
+    width: 18px;
+    height: 18px;
+
+    background: rgba(25, 103, 249, 0.12) !important;
+    border-radius: 50%;
+    /* 创建圆形 */
+    position: relative;
+    /* 用于定位伪元素 */
+}
+
+.el-timeline-item >>> .el-timeline-item__node--normal::before {
+    content: "";
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    width: 8px;
+    /* 中心圆直径 */
+    height: 8px;
+    background-color: var(--el-color-primary);
+    /* 中心圆颜色 */
+    border-radius: 50%;
+    /* 中心圆为圆形 */
+    transform: translate(-50%, -50%);
+    /* 居中显示 */
+}
+
+.el-timeline-item >>> .el-timeline-item__tail {
+    left: 125px;
+    border-left-color: #dddddd;
+    border-left-style: dashed;
+    margin: 12px 0;
+    margin-top: 24px;
+    height: calc(100% - 24px - 12px);
+}
+
+.time-dialog-wrap >>> .el-dialog__header {
+    padding: 10px 20px;
+    height: 25px;
+    line-height: 25px;
+    text-align: left;
+    background: #fff;
+    border-bottom: solid 1px #e4e7ed;
+}
+
+.time-dialog-wrap >>> .el-card__body {
+    padding: 8px;
+}
+
+.time-dialog-wrap >>> .el-card.is-always-shadow {
+    box-shadow: none;
+}
+
+.time-dialog-wrap >>> .el-dialog__headerbtn .el-dialog__close {
+    color: #666;
+}
+
+.time-dialog-wrap >>> .el-dialog__headerbtn:hover .el-dialog__close {
+    color: #666;
+}
+
+.time-dialog-wrap >>> .el-dialog__headerbtn {
+    top: 14px;
+}
+
+.time-dialog-wrap >>> .el-collapse {
+    margin-left: 119px;
+    border: none;
+    margin-top: -22px;
+}
+
+.time-dialog-wrap >>> .el-collapse-item__header {
+    border: none;
+    line-height: 25px;
+    height: 25px;
+    position: relative;
+    z-index: 999;
+}
+
+.time-dialog-wrap >>> .el-collapse-item__wrap {
+    border: none;
+}
+
+.time-dialog-wrap >>> .el-collapse-item__content {
+    margin-top: 15px;
+    padding-bottom: 0 !important;
+}
+
+.time-dialog-wrap >>> .el-timeline-item__node--01 {
+    width: 18px !important;
+    height: 18px !important;
+    left: 117px !important;
+}
+</style>
+<style>
+.time-dialog-wrap .el-dialog {
+    margin: 0 auto !important;
+    max-height: 90%;
+    overflow: hidden;
+    top: 5%;
+}
+
+.time-dialog-wrap .el-dialog {
+    margin: 0 auto !important;
+    height: 65%;
+    overflow: hidden;
+    top: 10%;
+}
+
+.time-dialog-wrap .el-dialog__body {
+    position: absolute;
+    left: 0;
+    top: 46px;
+    bottom: 0px;
+    right: 0;
+    z-index: 1;
+    overflow: hidden;
+    overflow-y: auto;
+    padding: 10px 20px 0 0;
+}
+
+.time-dialog-wrap .el-timeline-item__wrapper {
+    top: -20px !important;
+}
 </style>
diff --git a/admin/src/app/components/user-info-edit/index.vue b/admin/src/app/components/user-info-edit/index.vue
index a65159fd4..592e574fd 100644
--- a/admin/src/app/components/user-info-edit/index.vue
+++ b/admin/src/app/components/user-info-edit/index.vue
@@ -25,11 +25,9 @@ import { t } from '@/lang'
 import type { FormInstance } from 'element-plus'
 import { deepClone } from '@/utils/common'
 import { getUserInfo, setUserInfo } from '@/app/api/personal'
-import { useRouter } from 'vue-router'
 import useUserStore from '@/stores/modules/user'
 
 const userStore = useUserStore()
-const router = useRouter()
 // 提交信息
 const saveInfo: any = reactive({})
 const formRef = ref<FormInstance>()
diff --git a/admin/src/app/lang/zh-cn/app.authorize.json b/admin/src/app/lang/zh-cn/app.authorize.json
index 5337560cb..b4c89a708 100644
--- a/admin/src/app/lang/zh-cn/app.authorize.json
+++ b/admin/src/app/lang/zh-cn/app.authorize.json
@@ -1,19 +1,19 @@
 {
-	"companyName": "授权主体",
-	"siteAddress": "授权域名",
-	"contactName": "授权联系人",
-	"authCode": "授权码",
-	"authSecret": "授权秘钥",
-	"createTime": "授权时间",
-	"expireTime": "到期时间",
-	"authApp": "授权应用",
-	"authAppKey": "应用标识",
-	"siteAddressTips": "授权域名不匹配",
-	"authCodePlaceholder": "请输入授权码",
-	"authSecretPlaceholder": "请输入授权秘钥",
-	"updateCode": "重新绑定",
-	"notHaveAuth": "还没有授权？去购买",
-	"authInfoTips": "授权码和授权秘钥可在Niucloud官网我的授权 授权详情中查看",
-	"cloudBuildTips": "是否要进行云编译该操作可能会影响到正在访问的客户是否要继续操作？",
-	"versionTips":"已经升级到最新版本"
+  "companyName": "授权主体",
+  "siteAddress": "授权域名",
+  "contactName": "授权联系人",
+  "authCode": "授权码",
+  "authSecret": "授权秘钥",
+  "createTime": "授权时间",
+  "expireTime": "到期时间",
+  "authApp": "授权应用",
+  "authAppKey": "应用标识",
+  "siteAddressTips": "授权域名不匹配",
+  "authCodePlaceholder": "请输入授权码",
+  "authSecretPlaceholder": "请输入授权秘钥",
+  "updateCode": "重新绑定",
+  "notHaveAuth": "还没有授权？去购买",
+  "authInfoTips": "授权码和授权秘钥可在Niucloud官网我的授权 授权详情中查看",
+  "cloudBuildTips": "是否要进行云编译该操作可能会影响到正在访问的客户是否要继续操作？",
+  "versionTips": "已经升级到最新版本"
 }
diff --git a/admin/src/app/lang/zh-cn/app.shorezj.json b/admin/src/app/lang/zh-cn/app.shorezj.json
new file mode 100644
index 000000000..03f37179f
--- /dev/null
+++ b/admin/src/app/lang/zh-cn/app.shorezj.json
@@ -0,0 +1,67 @@
+{
+	"search": "搜索应用名称",
+	"appName": "应用名/版本信息",
+	"introduction": "简介",
+	"type": "类型",
+	"app": "应用",
+	"addon": "插件",
+	"noPlug": "暂无应用",
+	"install": "安装",
+	"unload": "卸载",
+	"installLabel": "已安装",
+	"uninstalledLabel": "未安装",
+	"version": "版本",
+	"title": "名称",
+	"desc": "简介",
+	"plugDetail": "插件信息",
+	"author": "作者",
+	"detail": "详情",
+	"addonInstall": "插件安装",
+	"dirPermission": "目录读写权限",
+	"path": "路径",
+	"demand": "要求",
+	"readable": "可读",
+	"write": "可写",
+	"packageManageTool": "包管理工具",
+	"name": "名称",
+	"addonInstallSuccess": "插件安装成功",
+	"envCheck": "环境检查",
+	"installProgress": "安装进度",
+	"installComplete": "安装完成",
+	"localAppText": "插件管理",
+	"marketAppText": "官方市场",
+	"installShowDialogCloseTips": "安装任务尚未完成，关闭将取消安装任务，是否要继续关闭？",
+	"marketDevelopMessage": "官方市场正在开发中！",
+	"jobError": "任务队列未启动 请在服务端源码部署目录打开终端执行 php think queue:listen",
+	"conflictFiles": "冲突文件",
+	"process": "启动进程",
+	"open": "开启",
+	"down": "下载",
+	"addonVersion": "插件版本",
+	"versionCode": "版本号",
+	"createTime": "发布时间",
+	"buyLabel": "已购买",
+	"installTips": "安装后需手动更新插件引用的依赖和编译各个端口的前端源码",
+	"localInstall": "本地安装",
+	"cloudInstall": "一键云安装",
+	"cloudInstallTips": "云安装可实现一键安装，安装后无需手动更新依赖和编译前端源码",
+	"installingTips": "有插件正在安装中请等待安装完成之后再进行其他操作，点击查看",
+	"installPercent": "安装进度",
+	"downloading": "下载中",
+	"authTips": "云安装需先绑定授权码，如果已有授权请先进行绑定，没有授权可到niucloud官网购买云服务之后再进行操作",
+	"toBind": "绑定授权",
+	"toNiucloud": "去niucloud官网",
+	"descriptionLeft": "暂无任何应用，马上去",
+	"link": "官方应用市场",
+	"descriptionRight": "逛逛",
+	"installed-empty": "暂未安装任何应用，请先安装",
+	"siteAddressTips": "授权域名不匹配",
+	"authCodePlaceholder": "请输入授权码",
+	"authSecretPlaceholder": "请输入授权秘钥",
+	"updateCode": "重新绑定",
+	"notHaveAuth": "还没有授权？去购买",
+	"authInfoTips": "授权码和授权秘钥可在Niucloud官网我的授权 授权详情中查看",
+	"addonUninstall": "插件卸载",
+	"appIdentification": "应用标识",
+	"tipText": "标识指开发应用或插件的文件夹名称"
+}
diff --git a/admin/src/app/lang/zh-cn/app.upgrade.json b/admin/src/app/lang/zh-cn/app.upgrade.json
new file mode 100644
index 000000000..a0d91c6dc
--- /dev/null
+++ b/admin/src/app/lang/zh-cn/app.upgrade.json
@@ -0,0 +1,18 @@
+{
+  "companyName": "授权主体",
+  "siteAddress": "授权域名",
+  "contactName": "授权联系人",
+  "authCode": "授权码",
+  "authSecret": "授权秘钥",
+  "createTime": "授权时间",
+  "expireTime": "到期时间",
+  "authApp": "授权应用",
+  "authAppKey": "应用标识",
+  "siteAddressTips": "授权域名不匹配",
+  "authCodePlaceholder": "请输入授权码",
+  "authSecretPlaceholder": "请输入授权秘钥",
+  "updateCode": "重新绑定",
+  "notHaveAuth": "还没有授权？去购买",
+  "authInfoTips": "授权码和授权秘钥可在Niucloud官网我的授权 授权详情中查看",
+  "versionTips": "已经升级到最新版本"
+}
diff --git a/admin/src/app/lang/zh-cn/finance.cash_out.json b/admin/src/app/lang/zh-cn/finance.cash_out.json
index 67faf2dfc..be03dc891 100644
--- a/admin/src/app/lang/zh-cn/finance.cash_out.json
+++ b/admin/src/app/lang/zh-cn/finance.cash_out.json
@@ -50,7 +50,7 @@
 	"cashOutInfo":"收款方信息",
 	"transferCode":"收款码",
 	"realname":"真实姓名",
-	"account":"账号",
+	"account":"收款账号",
 	"bankRealname":"持卡人姓名",
 	"remark":"备注",
 	"remarkPlaceholder":"请输入备注",
diff --git a/admin/src/app/lang/zh-cn/index.store.json b/admin/src/app/lang/zh-cn/index.store.json
index 906a50b0f..6be77b0c7 100644
--- a/admin/src/app/lang/zh-cn/index.store.json
+++ b/admin/src/app/lang/zh-cn/index.store.json
@@ -1,76 +1,78 @@
 {
-	"search":"搜索应用名称",
-	"appName":"应用名/版本信息",
-	"introduction":"简介",
-	"type":"类型",
-	"app":"应用",
-	"addon":"插件",
-	"noPlug":"暂无应用",
-	"install":"安装",
-	"unload":"卸载",
-	"installLabel":"已安装",
-	"uninstalledLabel":"未安装",
-	"version":"版本",
-	"title":"名称",
-	"desc":"简介",
-	"plugDetail": "插件信息",
-	"author":  "作者",
-	"detail":"详情",
-	"addonInstall": "插件安装",
-	"dirPermission": "目录读写权限",
-	"path": "路径",
-	"demand": "要求",
-	"readable": "可读",
-	"write": "可写",
-	"packageManageTool": "包管理工具",
-	"name": "名称",
-	"addonInstallSuccess": "插件安装成功",
-	"envCheck": "环境检查",
-	"installProgress": "安装进度",
-	"installComplete": "安装完成",
-	"localAppText":"插件管理",
-	"marketAppText":"官方市场",
-	"installShowDialogCloseTips": "安装任务尚未完成，关闭将取消安装任务，是否要继续关闭？",
-	"marketDevelopMessage":"官方市场正在开发中！",
-	"jobError": "任务队列未启动 请在服务端源码部署目录打开终端执行 php think queue:listen",
-	"conflictFiles": "冲突文件",
-	"process": "启动进程",
-	"open": "开启",
-	"down": "下载",
-	"installDown":"未安装(重新下载)",
-	"unloadDown":"已安装(重新下载)",
-	"addonVersion": "插件版本",
-	"versionCode": "版本号",
-	"createTime": "发布时间",
-	"buyLabel": "已购买",
-	"installTips": "安装后需手动更新插件引用的依赖和编译各个端口的前端源码",
-	"localInstall":"本地安装",
-	"cloudInstall": "一键云安装",
-	"cloudInstallTips": "云安装可实现一键安装，安装后无需手动更新依赖和编译前端源码",
-	"installingTips": "有插件正在安装中请等待安装完成之后再进行其他操作，点击查看",
-	"installPercent": "安装进度",
-	"downloading": "下载中",
-	"authTips": "云安装需先绑定授权码，如果已有授权请先进行绑定，没有授权可到niucloud官网购买云服务之后再进行操作",
-	"toBind": "绑定授权",
-	"toNiucloud": "去niucloud官网",
-	"descriptionLeft": "暂无任何应用，马上去",
-	"buyDescriptionLeft": "您还没有购买过应用，马上去",
-	"link": "官方应用市场",
-	"descriptionRight": "逛逛",
-	"installed-empty": "暂未安装任何应用",
-	"siteAddressTips": "授权域名不匹配",
-	"authCodePlaceholder": "请输入授权码",
-	"authSecretPlaceholder": "请输入授权秘钥",
-	"updateCode": "重新绑定",
-	"notHaveAuth": "还没有授权？去购买",
-	"authInfoTips": "授权码和授权秘钥可在Niucloud官网我的授权 授权详情中查看",
-	"addonUninstall": "插件卸载",
-	"appIdentification":"应用标识",
-	"tipText":"标识指开发应用或插件的文件夹名称",
-	"uninstallTips": "是否要卸载该插件？",
-	"upgrade": "升级",
-	"newVersion": "最新版本",
-	"cloudBuild": "云编译",
-	"cloudBuildTips": "是否要进行云编译该操作可能会影响到正在访问的客户是否要继续操作？",
-	"deleteAddonTips": "删除插件会把插件目录连同文件全部删除，确定要删除吗？"
+  "search": "搜索应用名称",
+  "appName": "应用名/版本信息",
+  "introduction": "简介",
+  "type": "类型",
+  "app": "应用",
+  "addon": "插件",
+  "noPlug": "暂无应用",
+  "install": "安装",
+  "unload": "卸载",
+  "installLabel": "已安装",
+  "uninstalledLabel": "未安装",
+  "version": "版本",
+  "title": "名称",
+  "desc": "简介",
+  "plugDetail": "插件信息",
+  "author": "作者",
+  "detail": "详情",
+  "addonInstall": "插件安装",
+  "dirPermission": "目录读写权限",
+  "path": "路径",
+  "demand": "要求",
+  "readable": "可读",
+  "write": "可写",
+  "packageManageTool": "包管理工具",
+  "name": "名称",
+  "addonInstallSuccess": "插件安装成功",
+  "envCheck": "环境检查",
+  "installProgress": "安装进度",
+  "installComplete": "安装完成",
+  "localAppText": "插件管理",
+  "marketAppText": "官方市场",
+  "installShowDialogCloseTips": "安装任务尚未完成，关闭将取消安装任务，是否要继续关闭？",
+  "marketDevelopMessage": "官方市场正在开发中！",
+  "jobError": "任务队列未启动 请在服务端源码部署目录打开终端执行 php think queue:listen",
+  "conflictFiles": "冲突文件",
+  "process": "启动进程",
+  "open": "开启",
+  "down": "下载",
+  "installDown": "未安装(重新下载)",
+  "unloadDown": "已安装(重新下载)",
+  "addonVersion": "插件版本",
+  "versionCode": "版本号",
+  "createTime": "发布时间",
+  "buyLabel": "已购买",
+  "recentlyUpdated": "最近更新",
+  "installTips": "安装后需手动更新插件引用的依赖和编译各个端口的前端源码",
+  "localInstall": "本地安装",
+  "cloudInstall": "一键云安装",
+  "cloudInstallTips": "云安装可实现一键安装，安装后无需手动更新依赖和编译前端源码",
+  "installingTips": "有插件正在安装中请等待安装完成之后再进行其他操作，点击查看",
+  "installPercent": "安装进度",
+  "downloading": "下载中",
+  "authTips": "云安装需先绑定授权码，如果已有授权请先进行绑定，没有授权可到niucloud官网购买云服务之后再进行操作",
+  "toBind": "绑定授权",
+  "toNiucloud": "去niucloud官网",
+  "descriptionLeft": "暂无任何应用，马上去",
+  "buyDescriptionLeft": "您还没有购买过应用，马上去",
+  "link": "官方应用市场",
+  "descriptionRight": "逛逛",
+  "installed-empty": "暂未安装任何应用",
+  "recentlyUpdatedEmpty": "暂无最近更新应用",
+  "siteAddressTips": "授权域名不匹配",
+  "authCodePlaceholder": "请输入授权码",
+  "authSecretPlaceholder": "请输入授权秘钥",
+  "updateCode": "重新绑定",
+  "notHaveAuth": "还没有授权？去购买",
+  "authInfoTips": "授权码和授权秘钥可在Niucloud官网我的授权 授权详情中查看",
+  "addonUninstall": "插件卸载",
+  "appIdentification": "应用标识",
+  "tipText": "标识指开发应用或插件的文件夹名称",
+  "uninstallTips": "是否要卸载该插件？",
+  "upgrade": "一键升级",
+  "newVersion": "最新版本",
+  "cloudBuild": "云编译",
+  "cloudBuildTips": "是否要进行云编译该操作可能会影响到正在访问的客户是否要继续操作？",
+  "deleteAddonTips": "删除插件会把插件目录连同文件全部删除，确定要删除吗？"
 }
diff --git a/admin/src/app/lang/zh-cn/marketing.sign_config.json b/admin/src/app/lang/zh-cn/marketing.sign_config.json
index 7f2ff7aea..2d6a54d72 100644
--- a/admin/src/app/lang/zh-cn/marketing.sign_config.json
+++ b/admin/src/app/lang/zh-cn/marketing.sign_config.json
@@ -29,6 +29,7 @@
 	"continueSign": "连签天数",
 	"continueSignFormatError": "连签天数格式错误",
 	"continueSignBerweenDays": "连签天数为2-365天",
+    "continueSignMustLessThanSignPeriod": "连签天数不能大于签到周期",
 	"receiveLimit": "领取限制",
 	"noLimit": "不限制",
 	"everyOneLimit": "每人限领",
diff --git a/admin/src/app/lang/zh-cn/marketing.verifier.json b/admin/src/app/lang/zh-cn/marketing.verifier.json
index 732d6361f..4e8a6347a 100644
--- a/admin/src/app/lang/zh-cn/marketing.verifier.json
+++ b/admin/src/app/lang/zh-cn/marketing.verifier.json
@@ -1,31 +1,31 @@
 {
-    "hotelVerify": "订单核销",
-    "verifyRecord": "核销记录",
-    "verifyTime": "核销时间",
-    "orderNo": "订单编号",
-	"orderNoPlaceholder": "请输入订单编号",
-    "OrderInfo": "订单信息",
-    "buyerInfo": "购买人信息",
-    "verifyCode": "核销码",
-    "verifyCodePlaceholder": "请输入核销码",
-    "verifyer": "核销人",
-    "startDate": "开始时间",
-	"endDate": "结束时间",
-    "mobile": "联系方式",
-    "searchValueEmptyTips": "请输入搜索内容",
-    "verify": "核销",
-    "buyInfo": "预订信息",
-    "orderRefunding": "该订单正在维权中不能进行核销",
-    "verifyTips": "是否要核销该订单？",
-    "toOrder": "查看订单",
-    "verifyType": "核销类型",
-    "verifyTypePlaceholder": "请选择核销类型",
-    "verifier": "核销员",
-    "createTime":"添加时间",
-	"addVerifier":"添加核销员",
-	"verifierDeleteTips":"确定要删除该核销员吗？",
-	"memberInfo": "会员信息",
-	"memberIdPlaceholder": "请选择会员",
-	"member": "会员",
-	"searchPlaceholder": "请输入会员昵称搜索"
+  "hotelVerify": "订单核销",
+  "verifyRecord": "核销记录",
+  "verifyTime": "核销时间",
+  "orderNo": "订单编号",
+  "orderNoPlaceholder": "请输入订单编号",
+  "OrderInfo": "订单信息",
+  "buyerInfo": "购买人信息",
+  "verifyCode": "核销码",
+  "verifyCodePlaceholder": "请输入核销码",
+  "verifyer": "核销人",
+  "startDate": "开始时间",
+  "endDate": "结束时间",
+  "mobile": "联系方式",
+  "searchValueEmptyTips": "请输入搜索内容",
+  "verify": "核销",
+  "buyInfo": "预订信息",
+  "orderRefunding": "该订单正在维权中不能进行核销",
+  "verifyTips": "是否要核销该订单？",
+  "toOrder": "查看订单",
+  "verifyType": "核销类型",
+  "verifyTypePlaceholder": "请选择核销类型",
+  "verifier": "核销员",
+  "createTime": "添加时间",
+  "addVerifier": "添加核销员",
+  "verifierDeleteTips": "确定要删除该核销员吗？",
+  "memberInfo": "会员信息",
+  "memberIdPlaceholder": "请选择会员",
+  "member": "会员",
+  "searchPlaceholder": "请输入会员编号/昵称/手机号"
 }
\ No newline at end of file
diff --git a/admin/src/app/lang/zh-cn/marketing.verify.json b/admin/src/app/lang/zh-cn/marketing.verify.json
index 32798d112..1136c0d9d 100644
--- a/admin/src/app/lang/zh-cn/marketing.verify.json
+++ b/admin/src/app/lang/zh-cn/marketing.verify.json
@@ -1,32 +1,32 @@
 {
-    "hotelVerify": "订单核销",
-    "verifyRecord": "核销记录",
-    "verifyTime": "核销时间",
-    "orderNo": "订单编号",
-	"orderNoPlaceholder": "请输入订单编号",
-    "verifyInfo": "核销信息",
-    "buyerInfo": "购买人信息",
-    "verifyCode": "核销码",
-    "verifyCodePlaceholder": "请输入核销码",
-    "verifyer": "核销人",
-    "startDate": "开始时间",
-	"endDate": "结束时间",
-    "mobile": "联系方式",
-    "searchValueEmptyTips": "请输入搜索内容",
-    "verify": "核销",
-    "buyInfo": "预订信息",
-    "orderRefunding": "该订单正在维权中不能进行核销",
-    "verifyTips": "是否要核销该订单？",
-    "toOrder": "查看订单",
-    "verifyType": "核销类型",
-    "verifyTypePlaceholder": "请选择核销类型",
-    "verifier": "核销员",
-    "verifierPlaceholder": "请选择核销员",
-    "createTime":"添加时间",
-	"addVerifier":"添加核销员",
-	"verifierDeleteTips":"确定要删除该核销员吗？",
-	"memberInfo": "会员信息",
-	"memberIdPlaceholder": "请选择会员",
-	"member": "会员",
-	"searchPlaceholder": "请输入会员昵称搜索"
+  "hotelVerify": "订单核销",
+  "verifyRecord": "核销记录",
+  "verifyTime": "核销时间",
+  "orderNo": "订单编号",
+  "orderNoPlaceholder": "请输入订单编号",
+  "verifyInfo": "核销信息",
+  "buyerInfo": "购买人信息",
+  "verifyCode": "核销码",
+  "verifyCodePlaceholder": "请输入核销码",
+  "verifyer": "核销人",
+  "startDate": "开始时间",
+  "endDate": "结束时间",
+  "mobile": "联系方式",
+  "searchValueEmptyTips": "请输入搜索内容",
+  "verify": "核销",
+  "buyInfo": "预订信息",
+  "orderRefunding": "该订单正在维权中不能进行核销",
+  "verifyTips": "是否要核销该订单？",
+  "toOrder": "查看订单",
+  "verifyType": "核销类型",
+  "verifyTypePlaceholder": "请选择核销类型",
+  "verifier": "核销员",
+  "verifierPlaceholder": "请选择核销员",
+  "createTime": "添加时间",
+  "addVerifier": "添加核销员",
+  "verifierDeleteTips": "确定要删除该核销员吗？",
+  "memberInfo": "会员信息",
+  "memberIdPlaceholder": "请选择会员",
+  "member": "会员",
+  "searchPlaceholder": "请输入会员昵称搜索"
 }
\ No newline at end of file
diff --git a/admin/src/app/lang/zh-cn/setting.agreement_edit.json b/admin/src/app/lang/zh-cn/setting.agreement_edit.json
index cea2bec8c..975730b27 100644
--- a/admin/src/app/lang/zh-cn/setting.agreement_edit.json
+++ b/admin/src/app/lang/zh-cn/setting.agreement_edit.json
@@ -3,6 +3,6 @@
       "type": "协议类型",
       "titlePlaceholder": "请输入协议标题",
       "contentPlaceholder": "请填写协议内容",
-      "contentMaxTips": "协议内容字符数应在5～100000之间",
+      "contentMaxTips": "协议内容字符数应在5～10000之间",
       "content": "内容"
 }
diff --git a/admin/src/app/lang/zh-cn/setting.system.json b/admin/src/app/lang/zh-cn/setting.system.json
index 0658ee780..455c2afd5 100644
--- a/admin/src/app/lang/zh-cn/setting.system.json
+++ b/admin/src/app/lang/zh-cn/setting.system.json
@@ -1,35 +1,39 @@
 {
-	"websiteInfo":"后台设置",
-	"contactAddress":"联系地址",
-	"siteName": "站点名称",
-	"keywords": "网站关键字",
-	"logo": "长方形Logo",
-	"desc": "网站简介",
-	"province": "省",
-	"city": "市",
-	"district": "区/县",
-	"selectAddress": "请选择地址",
-	"address": "详细地址",
-	"phone": "客服电话",
-	"businessHours": "营业时间",
-	"contactAddressPlaceholder":"联系地址",
-	"siteNamePlaceholder": "站点名称",
-	"keywordsPlaceholder": "网站关键字",
-	"descPlaceholder": "网站简介",
-	"addressPlaceholder": "详细地址",
-	"phonePlaceholder": "客服电话",
-	"businessHoursPlaceholder": "营业时间",
-	"businessHoursTips": "例：上午9:00-12:00，下午2:00-6:00",
-	"frontEndInfo": "前台设置",
-	"frontEndName": "前台名称",
-	"frontEndNamePlaceholder": "请输入前台名称",
-	"frontEndLogo": "前台Logo",
-	"icon": "正方形Logo",
-	"serviceInformation": "服务信息",
-	"wechatCode": "公众号二维码",
-	"customerServiceCode": "客服二维码",
-	"contactsTel": "联系电话",
-	"contactsTelPlaceholder": "请输入联系电话",
-	"logoPlaceholder": "建议图片尺寸：210*30像素；图片格式：jpg、png、jpeg。",
-	"iconPlaceholder": "建议图片尺寸：100*100像素；图片格式：jpg、png、jpeg。"
+  "websiteInfo": "后台设置",
+  "contactAddress": "联系地址",
+  "siteName": "站点名称",
+  "keywords": "网站关键字",
+  "logo": "长方形Logo",
+  "desc": "网站简介",
+  "province": "省",
+  "city": "市",
+  "district": "区/县",
+  "selectAddress": "请选择地址",
+  "address": "详细地址",
+  "phone": "客服电话",
+  "businessHours": "营业时间",
+  "contactAddressPlaceholder": "联系地址",
+  "siteNamePlaceholder": "站点名称",
+  "keywordsPlaceholder": "网站关键字",
+  "descPlaceholder": "网站简介",
+  "addressPlaceholder": "详细地址",
+  "phonePlaceholder": "客服电话",
+  "businessHoursPlaceholder": "营业时间",
+  "businessHoursTips": "例：上午9:00-12:00，下午2:00-6:00",
+  "frontEndInfo": "前台设置",
+  "frontEndName": "前台名称",
+  "frontEndNamePlaceholder": "请输入前台名称",
+  "frontEndLogo": "前台Logo",
+  "icon": "正方形Logo",
+  "serviceInformation": "服务信息",
+  "wechatCode": "公众号二维码",
+  "customerServiceCode": "客服二维码",
+  "contactsTel": "联系电话",
+  "contactsTelPlaceholder": "请输入联系电话",
+  "logoPlaceholder": "建议图片尺寸：210*30像素；图片格式：jpg、png、jpeg。",
+  "iconPlaceholder": "建议图片尺寸：100*100像素；图片格式：jpg、png、jpeg。",
+  "siteLoginLogo": "站点登录Logo",
+  "siteLoginLogoTips": "站点端登录Logo，建议图片尺寸：132*40像素；图片格式：jpg、png、jpeg。",
+  "siteLoginBgImg": "站点登录背景图",
+  "siteLoginBgImgTips": "站点端登录背景图，建议图片尺寸：1920*1280像素；图片格式：jpg、png、jpeg。"
 }
diff --git a/admin/src/app/lang/zh-cn/setting.transfer.json b/admin/src/app/lang/zh-cn/setting.transfer.json
index cc6bc5f59..d6c631568 100644
--- a/admin/src/app/lang/zh-cn/setting.transfer.json
+++ b/admin/src/app/lang/zh-cn/setting.transfer.json
@@ -28,6 +28,7 @@
     "alipayPublicCertPathTips": "上传alipayCertPublicKey文件",
     "alipayRootCertPathTips": "上传alipayRootCert文件",
     "operationTip": "温馨提示：打款设置用于会员提现转账，发放红包等场景",
-    "transferTips":"注意：应微信方规定,在2025年1月15日前开通商家转账到零钱服务的商户号可正常使用转账功能,之后开通的不支持使用转账到零钱服务"
-
+    "transferTips":"注意：应微信方规定,在2025年1月15日前开通商家转账到零钱服务的商户号可正常使用转账功能,之后开通的不支持使用转账到零钱服务",
+    "wechatpayPublicCert": "微信支付公钥",
+    "wechatpayPublicCertId": "微信支付公钥ID"
 }
diff --git a/admin/src/app/lang/zh-cn/tools.backup_records.json b/admin/src/app/lang/zh-cn/tools.backup_records.json
new file mode 100644
index 000000000..c17032eb0
--- /dev/null
+++ b/admin/src/app/lang/zh-cn/tools.backup_records.json
@@ -0,0 +1,28 @@
+{
+  "manualBackup": "手动备份",
+  "manualBackupTips": "即将开始手动备份您的源码和数据库，为确保备份过程中顺利进行以及数据的完整性，建议您暂停所有相关操作，避免因数据写入或修改导致备份不一致，是否确定继续？",
+  "id": "编号",
+  "content": "内容",
+  "currentVersion": "备份版本",
+  "contentPlaceholder": "请输入内容",
+  "batchDelete": "批量删除",
+  "backupDir": "备份路径",
+  "completeTime": "备份时间",
+  "restore": "恢复",
+  "restoreTips": "此操作将恢复备份的源码和数据库，并且覆盖当前数据。为避免意外损失，请确认已了解此操作的影响，并确保已备份重要信息，是否确定继续？",
+  "deleteTips": "删除记录将会同步删除其备份文件，确定要操作吗？",
+  "batchEmptySelectedTips": "请选择需要批量删除的记录",
+  "restoreTitle": "恢复备份",
+  "backupCompleteTips": "备份成功",
+  "restoreCompleteTips": "恢复成功",
+  "showDialogCloseTips": "任务尚未完成，关闭将会造成数据丢失或系统损坏的影响，是否要继续关闭？",
+  "manualBackupTitle": "手动备份",
+  "checkDirectoryPermissions": "检测目录权限",
+  "backupFiles": "备份文件",
+  "startUpgrade": "开始恢复",
+  "upgradeEnd": "恢复完成",
+  "startBackUp": "开始备份",
+  "backUpEnd": "备份完成",
+  "remark": "备注",
+  "remarkEmpty": "无"
+}
diff --git a/admin/src/app/lang/zh-cn/tools.upgrade_records.json b/admin/src/app/lang/zh-cn/tools.upgrade_records.json
new file mode 100644
index 000000000..458ff4757
--- /dev/null
+++ b/admin/src/app/lang/zh-cn/tools.upgrade_records.json
@@ -0,0 +1,8 @@
+{
+  "id": "编号",
+  "upgradeName": "内容",
+  "prevVersion": "前一版本",
+  "currentVersion": "版本",
+  "upgradeNamePlaceholder": "请输入内容",
+  "completeTime": "升级时间"
+}
diff --git a/admin/src/app/lang/zh-cn/wxoplatform.weapp_version.json b/admin/src/app/lang/zh-cn/wxoplatform.weapp_version.json
index c68218d6e..b7b3ea32a 100644
--- a/admin/src/app/lang/zh-cn/wxoplatform.weapp_version.json
+++ b/admin/src/app/lang/zh-cn/wxoplatform.weapp_version.json
@@ -1,11 +1,15 @@
 {
-	"groupName": "站点套餐",
-	"lastTime": "上次同步时间",
-	"weappVersionUpdate": "小程序同步",
-	"weappVersionUpdateRecord": "小程序同步记录",
-	"createTime": "提交时间",
-	"userVersion": "版本号",
-	"failReason": "失败原因",
-	"updateTips": "版本提交成功之后会自动给已授权的小程序进行同步更新，使用该功能必须要启动消息队列",
-	"seeUpdateRecord": "查看同步记录"
+  "groupName": "站点套餐",
+  "lastTime": "上次同步时间",
+  "weappVersionUpdate": "小程序同步",
+  "weappVersionUpdateRecord": "小程序同步记录",
+  "createTime": "提交时间",
+  "userVersion": "版本号",
+  "failReason": "失败原因",
+  "updateTips": " 1、同步小程序时系统通过已绑定的开发小程序同步至微信第三方平台的普通模板库中。\n 2、同步完成后，系统将自动为站点套餐下已授权的小程序提交代码。\n 3、一键同步功能支持按所有站点套餐进行批量同步，同时也可针对单个站点套餐单独操作。\n 4、使用此功能前，请确保已启动消息队列服务。",
+  "seeUpdateRecord": "查看同步记录",
+  "commitRecord": "同步记录",
+  "oneClickSync": "一键同步",
+  "syncTemplateError": "未能同步到模板库",
+  "templateID": "模板ID"
 }
diff --git a/admin/src/app/views/app/authorize.vue b/admin/src/app/views/app/authorize.vue
index 27b2fe9ef..37a172091 100644
--- a/admin/src/app/views/app/authorize.vue
+++ b/admin/src/app/views/app/authorize.vue
@@ -2,47 +2,31 @@
     <!--授权信息-->
     <div class="main-container">
         <el-card class="box-card !border-none" shadow="never" v-if="!loading">
-
-            <div class="flex">
-                <div class="w-[450px] mr-[20px] p-[50px] bg-[var(--el-color-info-light-9)]">
-                    <div class="flex items-center justify-between">
-                        <span class="text-page-title">版本信息</span>
-                        <div class="flex-1 w-0 flex justify-end">
-                            <el-button class="text-[#4C4C4C] w-[78px] h-[32px] !bg-transparent" @click="getFrameworkVersionListFn" v-if="!newVersion || (newVersion && newVersion.version_no == versions)">检测更新</el-button>
-                            <el-button class="text-[#4C4C4C] w-[78px] h-[32px]" type="primary" @click="handleUpgrade" v-else>一键升级</el-button>
-                            <el-button class="text-[#4C4C4C] w-[78px] h-[32px]" type="primary" @click="handleCloudBuild" :loading="cloudBuildRef?.loading">云编译</el-button>
-                        </div>
-                    </div>
-                    <div class="mt-[30px] flex items-center text-[14px] text-[#797979]">
-                        <span>当前版本</span>
-                        <span class="text-[26px] ml-[15px] mr-[10px] text-[#656668]">{{versions}}</span>
-                        <em class="text-[12px]" v-if="!newVersion || (newVersion && newVersion.version_no == versions)">(当前已是最新版本)</em>
-                        <em class="text-[12px] text-[red]" v-else>(最新版本{{ newVersion.version_no }})</em>
-                    </div>
-                </div>
-
-                <div class="flex flex-1 justify-between items-center p-[50px] bg-[var(--el-color-info-light-9)]">
+            <div>
+                <div class="text-[#333] text-[18px]">授权信息</div>
+                <div class="ml-[50px] mt-[40px]">
                     <div class="flex flex-col">
                         <div class="flex flex-wrap items-center">
-                            <p class="text-page-title mr-[20px]">授权信息</p>
-                            <span class="text-[14px] text-[#666]">{{ authinfo.company_name || '--' }}</span>
+                            <span class="mr-[6px] text-[14px] text-[#666666] w-[70px] text-right">授权公司：</span>
+                            <span class="text-[14px] text-[#333]">{{ authinfo.company_name || "--" }}</span>
                         </div>
-                        <div class="mt-[46px] ml-[40px] flex flex-wrap">
-                            <span class="text-[14px] mr-[84px]">授权域名<em class="ml-[12px] text-[12px]">{{ authinfo.site_address || '--' }}</em></span>
-                            <span class="text-[14px] flex items-center">
-                                <span>授权码</span>
-                                <em class="ml-[12px] mr-[10px] text-[12px]">{{ authinfo.auth_code ? (isCheck ? authinfo.auth_code : hideAuthCode(authinfo.auth_code)) : '--' }}</em>
-                                <el-icon v-if="!isCheck" @click="isCheck = !isCheck" class="text-[12px] cursor-pointer">
+                        <div class="flex flex-wrap items-center mt-[20px]">
+                            <span class="mr-[6px] text-[14px] text-[#666666] w-[70px] text-right">授权域名：</span>
+                            <span class="text-[14px] text-[#333]">{{ authinfo.site_address || "--" }}</span>
+                        </div>
+                        <div class="flex flex-wrap items-center mt-[20px]">
+                            <span class="mr-[6px] text-[14px] text-[#666666] w-[70px] text-right">授权码：</span>
+                            <span class="text-[14px] text-[#333]">
+                                <span class="mr-[10px]">{{ authinfo.auth_code ? (isCheck ? authinfo.auth_code : hideAuthCode(authinfo.auth_code)) : "--" }}</span>
+                                <el-icon v-if="!isCheck" @click="isCheck = !isCheck" class="text-[12px] cursor-pointer text-[#4383F9]">
                                     <View />
                                 </el-icon>
-                                <el-icon v-else @click="isCheck = !isCheck" class="text-[12px] cursor-pointer">
-                                    <Hide />
-                                </el-icon>
+                                <el-icon v-else @click="isCheck = !isCheck" class="text-[12px] cursor-pointer text-[#4383F9]"> <Hide /> </el-icon>
                             </span>
                         </div>
                     </div>
-                    <div class="flex flex-1 flex-wrap justify-end relative">
-                        <el-button class="w-[154px] !h-[48px] mt-[8px]" type="primary" @click="authCodeApproveFn">授权码认证</el-button>
+                    <div class="mt-[60px] mb-[50px]">
+                        <el-button class="w-[150px] !h-[46px] mt-[8px]" type="primary" @click="authCodeApproveFn">授权码认证</el-button>
                         <el-popover ref="getAuthCodeDialog" placement="bottom-start" :width="478" trigger="click" class="mt-[8px]">
                             <div class="px-[18px] py-[8px]">
                                 <p class="leading-[32px] text-[14px]">您在官方应用市场购买任意一款应用，即可获得授权码。输入正确授权码认证通过后，即可支持在线升级和其它相关服务</p>
@@ -52,7 +36,7 @@
                                 </div>
                             </div>
                             <template #reference>
-                                <el-button class="w-[154px] !h-[48px] mt-[8px] !text-[var(--el-color-primary)] hover:!text-[var(--el-color-primary)] !bg-transparent" plain type="primary">如何获取授权码?</el-button>
+                                <el-button class="w-[150px] !h-[46px] mt-[8px] !text-[var(--el-color-primary)] hover:!text-[var(--el-color-primary)] !bg-transparent" plain type="primary">如何获取授权码?</el-button>
                             </template>
                         </el-popover>
                     </div>
@@ -70,13 +54,13 @@
                                     </el-form-item>
                                 </div>
 
-                                <div class="text-sm mt-[10px] text-info">{{ t('authInfoTips') }}</div>
+                                <div class="text-sm mt-[10px] text-info">{{ t("authInfoTips") }}</div>
 
                                 <div class="mt-[20px]">
-                                    <el-button type="primary" class="w-full" size="large" :loading="saveLoading" @click="save(formRef)">{{ t('confirm') }}</el-button>
+                                    <el-button type="primary" class="w-full" size="large" :loading="saveLoading" @click="save(formRef)">{{ t("confirm") }}</el-button>
                                 </div>
                                 <div class="mt-[10px] text-right">
-                                    <el-button type="primary" link @click="market">{{ t('notHaveAuth') }}</el-button>
+                                    <el-button type="primary" link @click="market">{{ t("notHaveAuth") }}</el-button>
                                 </div>
                             </el-card>
                         </el-form>
@@ -84,66 +68,24 @@
                 </div>
             </div>
         </el-card>
-
-        <el-card class="box-card !border-none " shadow="never" v-if="!loading">
-            <div class="text-page-title mb-[20px]">历史版本</div>
-            <el-timeline>
-                <el-timeline-item :timestamp="item['release_time'] + ' 版本：' + item['version_no']" v-for="(item,index) in frameworkVersionList" type="primary" :hollow="true" placement="top" :key="index">
-                    <div class="mt-[10px] p-[20px] bg-overlay rounded-md timeline-log-wrap whitespace-pre-wrap" v-if="item['upgrade_log']">
-                        <div v-html="item['upgrade_log']"></div>
-                    </div>
-                </el-timeline-item>
-            </el-timeline>
-        </el-card>
-
-        <upgrade ref="upgradeRef" @cloudbuild="handleCloudBuild"/>
-        <cloud-build ref="cloudBuildRef" />
     </div>
 </template>
 
 <script lang="ts" setup>
-import { reactive, ref, computed } from 'vue'
-import { t } from '@/lang'
-import { getVersions } from '@/app/api/auth'
-import { getAuthInfo, setAuthInfo, getFrameworkVersionList } from '@/app/api/module'
-import { ElMessageBox, FormInstance, FormRules,ElMessage } from 'element-plus'
-import Upgrade from '@/app/components/upgrade/index.vue'
-import CloudBuild from '@/app/components/cloud-build/index.vue'
-import { cloneDeep } from 'lodash-es'
+import { reactive, ref } from "vue"
+import { t } from "@/lang"
+import { getVersions } from "@/app/api/auth"
+import { getAuthInfo, setAuthInfo } from "@/app/api/module"
+import { FormInstance, FormRules } from "element-plus"
+import { cloneDeep } from "lodash-es"
 
-const upgradeRef = ref<any>(null)
-const cloudBuildRef = ref<any>(null)
 const getAuthCodeDialog: Record<string, any> | null = ref(null)
-
 const authCodeApproveDialog = ref(false)
 const isCheck = ref(false)
-const frameworkVersionList = ref([])
 
-const checkVersion = ref(false)
-const getFrameworkVersionListFn = () => {
-    getFrameworkVersionList().then(({ data }) => {
-        frameworkVersionList.value = data
-        if (checkVersion.value) {
-            if (!newVersion.value || (newVersion.value && newVersion.value.version_no == versions.value)) {
-                ElMessage({
-                    message: t('versionTips'),
-                    type: 'success'
-                })
-            }
-        } else {
-            checkVersion.value = true
-        }
-    })
-}
-getFrameworkVersionListFn()
-
-const newVersion:any = computed(() => {
-    return frameworkVersionList.value.length ? frameworkVersionList.value[0] : null
-})
-
-const hideAuthCode = (res:any) => {
+const hideAuthCode = (res: any) => {
     const authCode = cloneDeep(res)
-    const data = authCode.slice(0, authCode.length / 2) + authCode.slice(authCode.length / 2, authCode.length - 1).replace(/./g, '*')
+    const data = authCode.slice(0, authCode.length / 2) + authCode.slice(authCode.length / 2, authCode.length - 1).replace(/./g, "*")
     return data
 }
 
@@ -152,15 +94,15 @@ const authCodeApproveFn = () => {
 }
 
 interface AuthInfo {
-    company_name: string,
-    site_address: string,
+    company_name: string
+    site_address: string
     auth_code: string
 }
 
 const authinfo = ref<AuthInfo>({
-    company_name: '',
-    site_address: '',
-    auth_code: ''
+    company_name: "",
+    site_address: "",
+    auth_code: ""
 })
 const loading = ref(true)
 const saveLoading = ref(false)
@@ -180,25 +122,21 @@ const checkAppMange = () => {
 checkAppMange()
 
 const formData = reactive<Record<string, string>>({
-    auth_code: '',
-    auth_secret: ''
+    auth_code: "",
+    auth_secret: ""
 })
 const formRef = ref<FormInstance>()
 
 // 表单验证规则
 const formRules = reactive<FormRules>({
-    auth_code: [
-        { required: true, message: t('authCodePlaceholder'), trigger: 'blur' }
-    ],
-    auth_secret: [
-        { required: true, message: t('authSecretPlaceholder'), trigger: 'blur' }
-    ]
+    auth_code: [{ required: true, message: t("authCodePlaceholder"), trigger: "blur" }],
+    auth_secret: [{ required: true, message: t("authSecretPlaceholder"), trigger: "blur" }]
 })
 
-const save = async (formEl: FormInstance | undefined) => {
+const save = async(formEl: FormInstance | undefined) => {
     if (saveLoading.value || !formEl) return
 
-    await formEl.validate(async (valid) => {
+    await formEl.validate(async(valid) => {
         if (valid) {
             saveLoading.value = true
 
@@ -214,47 +152,16 @@ const save = async (formEl: FormInstance | undefined) => {
 }
 
 const market = () => {
-    window.open('https://www.niucloud.com/app')
+    window.open("https://www.niucloud.com/app")
 }
 
-const versions = ref('')
+const versions = ref("")
 const getVersionsInfo = () => {
-    getVersions().then(res => {
+    getVersions().then((res) => {
         versions.value = res.data.version.version
     })
 }
 getVersionsInfo()
-
-/**
- * 升级
- */
-const handleUpgrade = () => {
-    if (!authinfo.value.auth_code) {
-        authCodeApproveFn()
-        return
-    }
-    upgradeRef.value?.open()
-}
-
-const handleCloudBuild = () => {
-    if (!authinfo.value.auth_code) {
-        authCodeApproveFn()
-        return
-    }
-    if (cloudBuildRef.value.cloudBuildTask) {
-        cloudBuildRef.value?.open()
-        return
-    }
-    ElMessageBox.confirm(t('cloudBuildTips'), t('warning'),
-        {
-            confirmButtonText: t('confirm'),
-            cancelButtonText: t('cancel'),
-            type: 'warning'
-        }
-    ).then(() => {
-        cloudBuildRef.value?.open()
-    })
-}
 </script>
 
 <style lang="scss" scoped></style>
diff --git a/admin/src/app/views/app/index.vue b/admin/src/app/views/app/index.vue
index 7dc3303dd..25ac7a434 100644
--- a/admin/src/app/views/app/index.vue
+++ b/admin/src/app/views/app/index.vue
@@ -23,7 +23,7 @@
                                 <div class="flex flex-col justify-between w-[180px]">
                                     <div class="text-[14px] flex items-center">
                                         <span class="app-text max-w-[170px]">{{ childItem.title }}</span>
-                                        <span class="iconfont iconxiaochengxu2 text-[#00b240] ml-[4px] !text-[14px]"></span>
+<!--                                        <span class="iconfont iconxiaochengxu2 text-[#00b240] ml-[4px] !text-[14px]"></span>-->
                                     </div>
                                         <!-- <el-icon color="#666">
                                             <QuestionFilled />
@@ -68,7 +68,6 @@ const getAppList = async () => {
 getAppList()
 
 const toLink = (item: any) => {
-    console.log('tol', item)
     if (item.url) {
         router.push(item.url)
     } else {
diff --git a/admin/src/app/views/app/upgrade.vue b/admin/src/app/views/app/upgrade.vue
new file mode 100644
index 000000000..4e46d3cff
--- /dev/null
+++ b/admin/src/app/views/app/upgrade.vue
@@ -0,0 +1,195 @@
+<template>
+    <!--授权信息-->
+    <div class="main-container">
+        <el-card class="box-card !border-none" shadow="never" v-if="newVersion">
+            <div>
+                <div class="mx-[20px] my-[20px]">
+                    <div class="title text-[18px]">版本信息</div>
+                    <div class="text-[18px] text-center mb-[7px] mt-[40px]">系统当前版本：v{{ version }}（{{ versionCode }}）</div>
+                    <div class="text-center text-[#666] text-[14px]" v-if="!newVersion || (newVersion && newVersion.version_no == version)">
+                        <span>当前已是最新版本，无需升级</span>
+                        <span class="text-[14px] text-primary ml-[10px] cursor-pointer" @click="openUpgrade">更新说明</span>
+                    </div>
+                    <div class="text-[#666] text-[14px] text-center" v-else>
+                        当前系统最新版本为 <span class="text-[18px] text-[#FF4D01]">v{{ newVersion.version_no }}</span>
+                        <span class="text-[14px] text-primary ml-[10px]" style="cursor: pointer" @click="openUpgrade">更新说明</span>
+                    </div>
+                    <div class="mt-[30px] flex justify-center items-center">
+                        <el-button class="text-[#4C4C4C] w-[150px] !h-[44px]" type="primary" :loading="loading" @click="handleUpgrade" v-if="!(!newVersion || (newVersion && newVersion.version_no == version))">一键升级</el-button>
+                        <el-button class="text-[#4C4C4C] w-[130px] !h-[44px]" @click="upgradeRecord">升级记录</el-button>
+                    </div>
+                </div>
+            </div>
+        </el-card>
+
+        <el-dialog v-model="authCodeApproveDialog" title="授权码认证" width="400px">
+            <el-form :model="formData" label-width="0" ref="formRef" :rules="formRules" class="page-form">
+                <el-card class="box-card !border-none" shadow="never">
+                    <el-form-item prop="auth_code">
+                        <el-input v-model.trim="formData.auth_code" :placeholder="t('authCodePlaceholder')" class="input-width" clearable size="large" />
+                    </el-form-item>
+
+                    <div class="mt-[20px]">
+                        <el-form-item prop="auth_secret">
+                            <el-input v-model.trim="formData.auth_secret" clearable :placeholder="t('authSecretPlaceholder')" class="input-width" size="large" />
+                        </el-form-item>
+                    </div>
+
+                    <div class="text-sm mt-[10px] text-info">{{ t("authInfoTips") }}</div>
+
+                    <div class="mt-[20px]">
+                        <el-button type="primary" class="w-full" size="large" :loading="saveLoading" @click="save(formRef)">{{ t("confirm") }}</el-button>
+                    </div>
+                    <div class="mt-[10px] text-right">
+                        <el-button type="primary" link @click="market">{{ t("notHaveAuth") }}</el-button>
+                    </div>
+                </el-card>
+            </el-form>
+        </el-dialog>
+
+        <upgrade ref="upgradeRef" />
+        <upgrade-log ref="upgradeLogRef" />
+    </div>
+</template>
+
+<script lang="ts" setup>
+import { ref, computed, reactive } from "vue"
+import { t } from "@/lang"
+import { getVersions } from "@/app/api/auth"
+import { getAuthInfo, getFrameworkVersionList, setAuthInfo } from "@/app/api/module"
+import { ElMessage, FormInstance, FormRules } from "element-plus"
+import { useRouter } from "vue-router"
+import Upgrade from "@/app/components/upgrade/index.vue"
+import UpgradeLog from "@/app/components/upgrade-log/index.vue"
+
+const upgradeRef = ref<any>(null)
+const upgradeLogRef = ref<any>(null)
+const authCodeApproveDialog = ref(false)
+const frameworkVersionList = ref([])
+
+const checkVersion = ref(false)
+
+const formData = reactive<Record<string, string>>({
+    auth_code: '',
+    auth_secret: ''
+})
+const formRef = ref<FormInstance>()
+
+// 表单验证规则
+const formRules = reactive<FormRules>({
+    auth_code: [{ required: true, message: t('authCodePlaceholder'), trigger: 'blur' }],
+    auth_secret: [{ required: true, message: t('authSecretPlaceholder'), trigger: 'blur' }]
+})
+
+const saveLoading = ref(false)
+
+const save = async(formEl: FormInstance | undefined) => {
+    if (saveLoading.value || !formEl) return
+
+    await formEl.validate(async (valid) => {
+        if (valid) {
+            saveLoading.value = true
+
+            setAuthInfo(formData).then(() => {
+                saveLoading.value = false
+                checkAppMange()
+            }).catch(() => {
+                saveLoading.value = false
+                authCodeApproveDialog.value = false
+            })
+        }
+    })
+}
+
+const getFrameworkVersionListFn = () => {
+    getFrameworkVersionList().then(({ data }) => {
+        frameworkVersionList.value = data
+        if (checkVersion.value) {
+            if (!newVersion.value || (newVersion.value && newVersion.value.version_no == version.value)) {
+                ElMessage({
+                    message: t('versionTips'),
+                    type: 'success'
+                })
+            }
+        } else {
+            checkVersion.value = true
+        }
+    })
+}
+getFrameworkVersionListFn()
+
+const newVersion: any = computed(() => {
+    return frameworkVersionList.value.length ? frameworkVersionList.value[0] : null
+})
+
+const authCodeApproveFn = () => {
+    authCodeApproveDialog.value = true
+}
+
+const version = ref('')
+const versionCode = ref('')
+
+const getVersionsInfo = () => {
+    getVersions().then((res) => {
+        version.value = res.data.version.version
+        versionCode.value = res.data.version.code
+    })
+}
+getVersionsInfo()
+
+interface AuthInfo {
+    company_name: string
+    site_address: string
+    auth_code: string
+}
+
+const authInfo = ref<AuthInfo>({
+    company_name: '',
+    site_address: '',
+    auth_code: ''
+})
+
+const repeat = ref(false)
+const loading = ref(false)
+
+/**
+ * 升级
+ */
+const handleUpgrade = () => {
+    if (!authInfo.value.auth_code) {
+        authCodeApproveFn()
+        return
+    }
+    if (repeat.value) return
+    repeat.value = true
+    loading.value = true
+    upgradeRef.value?.open('', () => {
+        repeat.value = false
+        loading.value = false;
+    })
+}
+
+const checkAppMange = () => {
+    getAuthInfo().then((res) => {
+        if (res.data.data && res.data.data.length != 0) {
+            authInfo.value = res.data.data
+            authCodeApproveDialog.value = false
+        }
+    }).catch(() => {
+        authCodeApproveDialog.value = false
+    })
+}
+
+checkAppMange()
+
+const router = useRouter()
+const upgradeRecord = () => {
+    router.push('/admin/tools/upgrade_records')
+}
+
+const openUpgrade = () => {
+    upgradeLogRef.value?.open()
+}
+</script>
+
+<style lang="scss" scoped></style>
diff --git a/admin/src/app/views/auth/menu.vue b/admin/src/app/views/auth/menu.vue
index bf9f9d5aa..d68810f2a 100644
--- a/admin/src/app/views/auth/menu.vue
+++ b/admin/src/app/views/auth/menu.vue
@@ -84,8 +84,8 @@ getMenuList()
 // 重置菜单
 const refreshMenu = () => {
     ElMessageBox.confirm(h('div', null, [
-        h('p', null, t('initializeMenuTipsOne')),
-        h('p', null, t('initializeMenuTipsTwo')),
+            h('p', null, t('initializeMenuTipsOne')),
+            h('p', null, t('initializeMenuTipsTwo')),
         ]), t('warning'),
         {
             confirmButtonText: t('confirm'),
@@ -97,8 +97,8 @@ const refreshMenu = () => {
             location.reload()
         }).catch(() => {
         })
-    }).catch(()=>{})
-    
+    }).catch(() => {
+    })
 }
 
 /**
diff --git a/admin/src/app/views/auth/site_menu.vue b/admin/src/app/views/auth/site_menu.vue
index b8e511e78..6c1fe5a8a 100644
--- a/admin/src/app/views/auth/site_menu.vue
+++ b/admin/src/app/views/auth/site_menu.vue
@@ -132,8 +132,8 @@ getMenuList()
 // 重置菜单
 const refreshMenu = () => {
     ElMessageBox.confirm(h('div', null, [
-        h('p', null, t('initializeMenuTipsOne')),
-        h('p', null, t('initializeMenuTipsTwo')),
+            h('p', null, t('initializeMenuTipsOne')),
+            h('p', null, t('initializeMenuTipsTwo')),
         ]), t('warning'),
         {
             confirmButtonText: t('confirm'),
@@ -143,9 +143,10 @@ const refreshMenu = () => {
     ).then(() => {
         menuRefresh({}).then(res => {
             location.reload()
-        }).catch(() => {})
-    }).catch(()=>{})
-
+        }).catch(() => {
+        })
+    }).catch(() => {
+    })
 }
 /**
  * 添加菜单
diff --git a/admin/src/app/views/channel/aliapp/access.vue b/admin/src/app/views/channel/aliapp/access.vue
index f003e4923..893bc29e5 100644
--- a/admin/src/app/views/channel/aliapp/access.vue
+++ b/admin/src/app/views/channel/aliapp/access.vue
@@ -102,7 +102,6 @@ const router = useRouter()
 const pageName = route.meta.title
 
 const activeName = ref('/channel/aliapp')
-const active = ref(2)
 const qrCode = ref<string>('')
 onMounted(async () => {
     const res = await getAliappConfig()
diff --git a/admin/src/app/views/channel/weapp/access.vue b/admin/src/app/views/channel/weapp/access.vue
index 6f46f1eec..542a22a27 100644
--- a/admin/src/app/views/channel/weapp/access.vue
+++ b/admin/src/app/views/channel/weapp/access.vue
@@ -116,7 +116,6 @@ const router = useRouter()
 const pageName = route.meta.title
 
 const activeName = ref('/channel/weapp')
-const active = ref(2)
 const qrCode = ref('')
 const weappConfig = ref({})
 const oplatformConfig = ref({})
diff --git a/admin/src/app/views/channel/weapp/components/modify-privacy-agreement.vue b/admin/src/app/views/channel/weapp/components/modify-privacy-agreement.vue
index 2378209b2..c21d84f6d 100644
--- a/admin/src/app/views/channel/weapp/components/modify-privacy-agreement.vue
+++ b/admin/src/app/views/channel/weapp/components/modify-privacy-agreement.vue
@@ -106,7 +106,6 @@
 import { computed, reactive, ref } from 'vue'
 import { t } from '@/lang'
 import type { FormInstance } from 'element-plus'
-import Test from '@/utils/test'
 import SettingList from './setting-list.vue'
 import { getWeappPrivacySetting, setWeappPrivacySetting } from '@/app/api/weapp'
 
diff --git a/admin/src/app/views/channel/weapp/config.vue b/admin/src/app/views/channel/weapp/config.vue
index f264008b6..3728c7e44 100644
--- a/admin/src/app/views/channel/weapp/config.vue
+++ b/admin/src/app/views/channel/weapp/config.vue
@@ -50,7 +50,7 @@
                 </el-form-item>
             </el-card>
 
-            <el-card class="box-card !border-none mt-[15px]" shadow="never">
+            <el-card class="box-card !border-none mt-[15px]" shadow="never" v-show="!formData.is_authorization">
                 <h3 class="panel-title !text-sm">{{ t('theServerSetting') }}</h3>
 
                 <el-form-item label="URL">
@@ -234,10 +234,10 @@ const formRules = computed(() => {
             { required: !formData.is_authorization, message: t('appSecretPlaceholder'), trigger: 'blur' }
         ],
         token: [
-            { required: true, message: t('tokenPlaceholder'), trigger: 'blur' }
+            { required: !formData.is_authorization, message: t('tokenPlaceholder'), trigger: 'blur' }
         ],
         encoding_aes_key: [
-            { required: true, message: t('encodingAesKeyPlaceholder'), trigger: 'blur' }
+            { required: !formData.is_authorization, message: t('encodingAesKeyPlaceholder'), trigger: 'blur' }
         ]
     }
 })
diff --git a/admin/src/app/views/channel/weapp/course.vue b/admin/src/app/views/channel/weapp/course.vue
index bd381e983..63eb7a745 100644
--- a/admin/src/app/views/channel/weapp/course.vue
+++ b/admin/src/app/views/channel/weapp/course.vue
@@ -1,12 +1,12 @@
 <template>
     <!--配置教程-->
-	<div class="main-container">
+    <div class="main-container">
 
-		<el-card class="card !border-none" shadow="never">
-		    <el-page-header :content="pageName" :icon="ArrowLeft" @back="back()" />
-		</el-card>
+        <el-card class="card !border-none" shadow="never">
+            <el-page-header :content="pageName" :icon="ArrowLeft" @back="back()" />
+        </el-card>
 
-		<el-card class="box-card mt-[15px] !border-none" shadow="never">
+        <el-card class="box-card mt-[15px] !border-none" shadow="never">
             <div class="flex">
                 <div class="min-w-[60px]">
                     <span class="flex justify-center items-center block w-[40px] h-[40px] border-[1px] border-primary rounded-[999px] text-primary">1</span>
@@ -51,8 +51,8 @@
                     </div>
                 </div>
             </div>
-		</el-card>
-	</div>
+        </el-card>
+    </div>
 </template>
 
 <script lang="ts" setup>
diff --git a/admin/src/app/views/channel/wechat/access.vue b/admin/src/app/views/channel/wechat/access.vue
index c1afeec48..9736a5c86 100644
--- a/admin/src/app/views/channel/wechat/access.vue
+++ b/admin/src/app/views/channel/wechat/access.vue
@@ -104,7 +104,6 @@ const router = useRouter()
 const pageName = route.meta.title
 
 const activeName = ref('/channel/wechat')
-const active = ref(2)
 const qrcode = ref('')
 const wechatConfig = ref({})
 const oplatformConfig = ref({})
diff --git a/admin/src/app/views/channel/wechat/components/reply-form.vue b/admin/src/app/views/channel/wechat/components/reply-form.vue
index 128e80a68..62f09743c 100644
--- a/admin/src/app/views/channel/wechat/components/reply-form.vue
+++ b/admin/src/app/views/channel/wechat/components/reply-form.vue
@@ -24,11 +24,7 @@
         </div>
         <div class="py-[20px] px-[30px] h-[350px]">
             <div v-if="formData.msgtype == 'text'">
-                <el-input
-                    v-model.trim="formData.text.content" :rows="5" type="textarea" placeholder="" maxlength="600" :show-word-limit="true"
-                    resize="none"
-                    input-style="box-shadow: none;height:300px"
-                />
+                <el-input v-model.trim="formData.text.content" :rows="5" type="textarea" placeholder="" maxlength="600" :show-word-limit="true" resize="none" input-style="box-shadow: none;height:300px" />
             </div>
             <div v-if="formData.msgtype == 'image'" class="flex w-full h-full justify-center items-center image-media">
                 <div class="w-full h-full" v-if="formData.image.url">
diff --git a/admin/src/app/views/channel/wechat/components/select-wechat-media.vue b/admin/src/app/views/channel/wechat/components/select-wechat-media.vue
index 343aa83e7..03a3553d8 100644
--- a/admin/src/app/views/channel/wechat/components/select-wechat-media.vue
+++ b/admin/src/app/views/channel/wechat/components/select-wechat-media.vue
@@ -14,7 +14,9 @@
                             </upload-media>
                         </div>
                         <div class="flex" v-else>
-                            <el-button type="primary" :loading="syncLoading" @click="syncWechatNews">{{ syncLoading ? '同步中' : '同步微信图文'}}</el-button>
+                            <el-button type="primary" :loading="syncLoading" @click="syncWechatNews">
+                                {{ syncLoading ? '同步中' : '同步微信图文' }}
+                            </el-button>
                         </div>
                     </el-col>
                 </el-row>
@@ -23,8 +25,10 @@
                         <!-- 素材管理 -->
                         <div v-if="attachment.data.length">
                             <div class="flex flex-wrap" v-if="prop.type != 'news'">
-                                <div class="attachment-item mr-[10px] mb-[10px] w-[120px]" v-for="(item, index) in attachment.data" :key="index" @click="selectedFile = item">
-                                    <div class="attachment-wrap w-full rounded cursor-pointer overflow-hidden relative flex items-center justify-center h-[120px]">
+                                <div class="attachment-item mr-[10px] mb-[10px] w-[120px]"
+                                     v-for="(item, index) in attachment.data" :key="index" @click="selectedFile = item">
+                                    <div
+                                        class="attachment-wrap w-full rounded cursor-pointer overflow-hidden relative flex items-center justify-center h-[120px]">
                                         <el-image :src="img(item.value)" fit="contain" v-if="type == 'image'" :preview-src-list="item.image_list" />
                                         <video :src="img(item.value)" v-else-if="type == 'video'"></video>
                                         <div class="absolute z-[1] flex items-center justify-center w-full h-full inset-0 bg-black bg-opacity-60" v-show="selectedFile.id == item.id">
@@ -34,12 +38,14 @@
                                 </div>
                             </div>
                             <div class="relative" ref="waterfallContainerRef" v-else>
-                                <div ref="waterfallItemRef" class="absolute attachment-item mr-[10px] mb-[10px] w-[280px] rounded-lg overflow-hidden border border-color" v-for="(item, index) in attachment.data"
+                                <div ref="waterfallItemRef"
+                                     class="absolute attachment-item mr-[10px] mb-[10px] w-[280px] rounded-lg overflow-hidden border border-color"
+                                     v-for="(item, index) in attachment.data"
                                      :style="{ left: listPosition[index] ? listPosition[index].left : '', top: listPosition[index] ? listPosition[index].top : '' }"
                                      :key="index" @click="selectedFile = item">
                                     <div class="relative">
                                         <div class="w-full h-[130px] relative">
-                                            <el-image :src="item.value.news_item[0].thumb_url" class="w-full h-full"/>
+                                            <el-image :src="item.value.news_item[0].thumb_url" class="w-full h-full" />
                                             <div class="absolute left-0 bottom-0 p-[10px] w-full truncate text-white leading-none" v-if="item.value.news_item.length > 1">
                                                 {{ item.value.news_item[0].title }}
                                             </div>
@@ -47,18 +53,14 @@
                                         <div v-if="item.value.news_item.length > 1">
                                             <template v-for="(newsItem, newsIndex) in item.value.news_item">
                                                 <div class="px-[15px] py-[10px] flex" :class="{'border-b border-color' : newsIndex < item.value.news_item.length - 1 }" v-if="newsIndex > 0">
-                                                    <div class="flex-1 w-0 truncate">
-                                                        {{ newsItem.title }}
-                                                    </div>
+                                                    <div class="flex-1 w-0 truncate">{{ newsItem.title }}</div>
                                                     <div class="w-[50px] h-[50px] ml-[10px]">
-                                                        <el-image :src="newsItem.thumb_url" class="w-full h-full"/>
+                                                        <el-image :src="newsItem.thumb_url" class="w-full h-full" />
                                                     </div>
                                                 </div>
                                             </template>
                                         </div>
-                                        <div class="px-[15px] py-[10px]" v-else>
-                                            {{ item.value.news_item[0].title }}
-                                        </div>
+                                        <div class="px-[15px] py-[10px]" v-else>{{ item.value.news_item[0].title }}</div>
                                         <div class="absolute z-[1] flex items-center justify-center w-full h-full inset-0 bg-black bg-opacity-60" v-show="selectedFile.id == item.id">
                                             <icon name="element Select" color="#fff" size="40px" />
                                         </div>
@@ -75,9 +77,9 @@
                     <el-col span="24">
                         <div class="flex h-full justify-end items-center">
                             <el-pagination v-model:current-page="attachment.page" :small="true"
-                                v-model:page-size="attachment.limit" :page-sizes="[10, 20, 30, 40, 60]"
-                                layout="total, sizes, prev, pager, next, jumper" :total="attachment.total"
-                                @size-change="getAttachmentList()" @current-change="getAttachmentList" />
+                                           v-model:page-size="attachment.limit" :page-sizes="[10, 20, 30, 40, 60]"
+                                           layout="total, sizes, prev, pager, next, jumper" :total="attachment.total"
+                                           @size-change="getAttachmentList()" @current-change="getAttachmentList" />
                         </div>
                     </el-col>
                 </el-row>
@@ -94,118 +96,118 @@
 </template>
 
 <script lang="ts" setup>
-    import { reactive, ref, nextTick } from 'vue'
-    import { t } from '@/lang'
-    import UploadMedia from './upload-media.vue'
-    import { img, debounce } from '@/utils/common'
-    import { getMediaList, syncNews } from '@/app/api/wechat'
+import { reactive, ref, nextTick } from 'vue'
+import { t } from '@/lang'
+import UploadMedia from './upload-media.vue'
+import { img, debounce } from '@/utils/common'
+import { getMediaList, syncNews } from '@/app/api/wechat'
 
-    const prop = defineProps({
-        type: {
-            type: String,
-            default: 'image'
-        }
-    })
+const prop = defineProps({
+    type: {
+        type: String,
+        default: 'image'
+    }
+})
 
-    const showDialog = ref(false)
+const showDialog = ref(false)
 
-    const openDialog = () => {
+const openDialog = () => {
+    prop.type == 'news' && waterfall()
+    showDialog.value = true
+}
+
+const attachment: Record<string, any> = reactive({
+    loading: true,
+    page: 1,
+    total: 0,
+    limit: 10,
+    data: []
+})
+
+/**
+ * 查询素材
+ */
+const getAttachmentList = (page: number = 1) => {
+    attachment.loading = true
+    attachment.page = page
+    getMediaList({
+        page: attachment.page,
+        limit: attachment.limit,
+        type: prop.type
+    }).then(res => {
+        attachment.data = res.data.data
+        attachment.total = res.data.total
+        attachment.loading = false
         prop.type == 'news' && waterfall()
-        showDialog.value = true
-    }
-
-    const attachment: Record<string, any> = reactive({
-        loading: true,
-        page: 1,
-        total: 0,
-        limit: 10,
-        data: []
+    }).catch(() => {
+        attachment.loading = false
     })
+}
+getAttachmentList()
 
-    /**
-     * 查询素材
-     */
-    const getAttachmentList = (page: number = 1) => {
-        attachment.loading = true
-        attachment.page = page
-        getMediaList({
-            page: attachment.page,
-            limit: attachment.limit,
-            type: prop.type
-        }).then(res => {
-            attachment.data = res.data.data
-            attachment.total = res.data.total
-            attachment.loading = false
-            prop.type == 'news' && waterfall()
-        }).catch(() => {
-            attachment.loading = false
-        })
-    }
-    getAttachmentList()
+const emits = defineEmits(['success'])
+const selectedFile: Record<string, any> = ref({})
 
-    const emits = defineEmits(['success'])
-    const selectedFile: Record<string, any> = ref({})
+const confirm = () => {
+    emits('success', selectedFile.value)
+}
 
-    const confirm = () => {
-        emits('success', selectedFile.value)
-    }
+const syncLoading = ref(false)
+const syncWechatNews = () => {
+    if (syncLoading.value) return
+    syncLoading.value = true
 
-    const syncLoading = ref(false)
-    const syncWechatNews = () => {
-        if (syncLoading.value) return
-        syncLoading.value = true
+    syncNews().then(() => {
+        syncLoading.value = false
+        getAttachmentList()
+    }).catch(() => {
+        syncLoading.value = false
+    })
+}
 
-        syncNews().then(() => {
-            syncLoading.value = false
-            getAttachmentList()
-        }).catch(() => {
-            syncLoading.value = false
-        })
-    }
+const meta = document.createElement('meta')
+meta.content = 'same-origin'
+meta.name = 'referrer'
+document.getElementsByTagName('head')[0].appendChild(meta)
 
-    const meta = document.createElement('meta')
-    meta.content = 'same-origin'
-    meta.name = 'referrer'
-    document.getElementsByTagName('head')[0].appendChild(meta)
+// 瀑布流计算
+const waterfallContainerRef = ref(null)
+const waterfallItemRef = ref([])
+const listPosition = ref([])
+const waterfall = debounce(() => {
+    nextTick(() => {
+        const containerWidth = waterfallContainerRef.value.clientWidth
+        const column = parseInt(containerWidth / 292)
+        const heights = []
+        const positions = []
 
-    // 瀑布流计算
-    const waterfallContainerRef = ref(null)
-    const waterfallItemRef = ref([])
-    const listPosition = ref([])
-    const waterfall = debounce(() => {
-        nextTick(() => {
-            const containerWidth = waterfallContainerRef.value.clientWidth
-            const column = parseInt(containerWidth / 292)
-            const heights = []
-            const positions = []
-
-            waterfallItemRef.value.forEach((item, i) => {
-                if (i < column) {
-                    const position = {}
-                    position.top = '0px'
-                    if (i % column == 0) {
-                        position.left = item.clientWidth * i + "px"
-                    } else {
-                        position.left = item.clientWidth * i + (i % column * 10) + "px"
-                    }
-                    positions[i] = position
-                    heights[i] = item.clientHeight + 10
+        waterfallItemRef.value.forEach((item, i) => {
+            if (i < column) {
+                const position = {}
+                position.top = '0px'
+                if (i % column == 0) {
+                    position.left = item.clientWidth * i + "px"
                 } else {
-                    let minHeight = Math.min(...heights) //  找到第一列的最小高度
-                    let minIndex = heights.findIndex(item => item === minHeight) // 找到最小高度的索引
-                    let position = {}
-                    position.top = minHeight + 10 + "px"
-                    position.left = positions[minIndex].left
-                    positions[i] = position
-                    heights[minIndex] += item.clientHeight + 10
+                    position.left = item.clientWidth * i + (i % column * 10) + "px"
                 }
-            })
-            listPosition.value = positions
+                positions[i] = position
+                heights[i] = item.clientHeight + 10
+            } else {
+                let minHeight = Math.min(...heights) //  找到第一列的最小高度
+                let minIndex = heights.findIndex(item => item === minHeight) // 找到最小高度的索引
+                let position = {}
+                position.top = minHeight + 10 + "px"
+                position.left = positions[minIndex].left
+                positions[i] = position
+                heights[minIndex] += item.clientHeight + 10
+            }
         })
-    }, 800)
+        listPosition.value = positions
+    })
+}, 800)
 
-    // 重新布局，以适应窗口变化
-    window.addEventListener('resize', () => waterfall())
+// 重新布局，以适应窗口变化
+window.addEventListener('resize', () => waterfall())
 </script>
 
 <style lang="scss" scoped>
diff --git a/admin/src/app/views/channel/wechat/config.vue b/admin/src/app/views/channel/wechat/config.vue
index 85853850e..b5874951c 100644
--- a/admin/src/app/views/channel/wechat/config.vue
+++ b/admin/src/app/views/channel/wechat/config.vue
@@ -83,8 +83,7 @@
                 <el-form-item :label="t('businessDomain')">
                     <el-input :model-value="wechatStatic.business_domain" placeholder="Please input" class="input-width" :readonly="true">
                         <template #append>
-                            <div class="cursor-pointer" @click="copyEvent(wechatStatic.business_domain)">{{ t('copy') }}
-                            </div>
+                            <div class="cursor-pointer" @click="copyEvent(wechatStatic.business_domain)">{{ t('copy') }}</div>
                         </template>
                     </el-input>
                 </el-form-item>
@@ -92,8 +91,7 @@
                 <el-form-item :label="t('jsSecureDomain')">
                     <el-input :model-value="wechatStatic.js_secure_domain" placeholder="Please input" class="input-width" :readonly="true">
                         <template #append>
-                            <div class="cursor-pointer" @click="copyEvent(wechatStatic.business_domain)">{{ t('copy') }}
-                            </div>
+                            <div class="cursor-pointer" @click="copyEvent(wechatStatic.business_domain)">{{ t('copy') }}</div>
                         </template>
                     </el-input>
                 </el-form-item>
@@ -101,8 +99,7 @@
                 <el-form-item :label="t('webAuthDomain')">
                     <el-input :model-value="wechatStatic.web_auth_domain" placeholder="Please input" class="input-width" :readonly="true">
                         <template #append>
-                            <div class="cursor-pointer" @click="copyEvent(wechatStatic.business_domain)">{{ t('copy') }}
-                            </div>
+                            <div class="cursor-pointer" @click="copyEvent(wechatStatic.business_domain)">{{ t('copy') }}</div>
                         </template>
                     </el-input>
                 </el-form-item>
diff --git a/admin/src/app/views/channel/wechat/course.vue b/admin/src/app/views/channel/wechat/course.vue
index f85025d04..b4f32e31f 100644
--- a/admin/src/app/views/channel/wechat/course.vue
+++ b/admin/src/app/views/channel/wechat/course.vue
@@ -12,9 +12,7 @@
                     <span class="flex justify-center items-center block w-[40px] h-[40px] border-[1px] border-primary rounded-[999px] text-primary">1</span>
                 </div>
                 <div>
-                    <p class="flex items-center text-[14px]">{{ t('writingTipsOne1') }}--<el-button link type="primary"
-                            @click="linkEvent">{{ t('writingTipsOne2') }}</el-button>, {{ t('writingTipsOne3') }}<span
-                            class="text-primary">URL / Token / EncondingAESKey</span>{{ t('writingTipsOne4') }}</p>
+                    <p class="flex items-center text-[14px]">{{ t('writingTipsOne1') }}--<el-button link type="primary" @click="linkEvent">{{ t('writingTipsOne2') }}</el-button>, {{ t('writingTipsOne3') }}<span class="text-primary">URL / Token / EncondingAESKey</span>{{ t('writingTipsOne4') }}</p>
                     <div class="w-[100%] mt-[10px]">
                         <img class="w-[100%]" src="@/app/assets/images/setting/wechat_1.png" />
                     </div>
diff --git a/admin/src/app/views/channel/wechat/keyword_reply_edit.vue b/admin/src/app/views/channel/wechat/keyword_reply_edit.vue
index 6643b3dc4..8bb48ceeb 100644
--- a/admin/src/app/views/channel/wechat/keyword_reply_edit.vue
+++ b/admin/src/app/views/channel/wechat/keyword_reply_edit.vue
@@ -83,7 +83,7 @@
 import { reactive, ref } from 'vue'
 import { t } from '@/lang'
 import { getKeywordsReplyInfo, editKeywordsReply, addKeywordsReply } from '@/app/api/wechat'
-import { ElMessage, FormInstance, FormRules } from 'element-plus'
+import { FormInstance, FormRules } from 'element-plus'
 import { ArrowLeft } from '@element-plus/icons-vue'
 import { useRoute, useRouter } from 'vue-router'
 import ReplyForm from '@/app/views/channel/wechat/components/reply-form.vue'
diff --git a/admin/src/app/views/dict/components/edit.vue b/admin/src/app/views/dict/components/edit.vue
index f755ace2b..d2ddf946a 100644
--- a/admin/src/app/views/dict/components/edit.vue
+++ b/admin/src/app/views/dict/components/edit.vue
@@ -110,60 +110,6 @@ const setFormData = async (row: any = null) => {
     loading.value = false
 }
 
-// 验证手机号格式
-const mobileVerify = (rule: any, value: any, callback: any) => {
-    if (value && !/^1[3-9]\d{9}$/.test(value)) {
-        callback(new Error(t('generateMobile')))
-    } else {
-        callback()
-    }
-}
-
-// 验证身份证号
-const idCardVerify = (rule: any, value: any, callback: any) => {
-    if (value && !/^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}([0-9]|X)$/.test(value)) {
-        callback(new Error(t('generateIdCard')))
-    } else {
-        callback()
-    }
-}
-
-// 验证邮箱号
-const emailVerify = (rule: any, value: any, callback: any) => {
-    if (value && !/\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*/.test(value)) {
-        callback(new Error(t('generateEmail')))
-    } else {
-        callback()
-    }
-}
-
-// 验证至少输入1个字符
-const minInputVerify = (rule: any, value: any, callback: any) => {
-    if (value && !/^\d{0,}$/.test(value)) {
-        callback(new Error(t('generateMin')))
-    } else {
-        callback()
-    }
-}
-
-// 验证最多输入150个字符
-const maxInputVerify = (rule: any, value: any, callback: any) => {
-    if (value && !/^\d{0,150}$/.test(value)) {
-        callback(new Error(t('generateMax')))
-    } else {
-        callback()
-    }
-}
-
-// 验证请输入整数
-const numberVerify = (rule: any, value: any, callback: any) => {
-    if (!Number.isInteger(value)) {
-        callback(new Error(t('generateNumber')))
-    } else {
-        callback()
-    }
-}
-
 defineExpose({
     showDialog,
     setFormData
diff --git a/admin/src/app/views/diy/components/add-theme.vue b/admin/src/app/views/diy/components/add-theme.vue
index 8830fa306..239a91570 100644
--- a/admin/src/app/views/diy/components/add-theme.vue
+++ b/admin/src/app/views/diy/components/add-theme.vue
@@ -27,19 +27,15 @@
 </template>
 
 <script setup lang="ts">
-import { ref, reactive, computed, watch } from 'vue'
+import { ref, reactive, computed } from 'vue'
 import { t } from '@/lang'
-import { getAreaListByPid } from '@/app/api/sys'
-import { addMemberAddress } from '@/app/api/member'
-import { filterNumber } from '@/utils/common'
 import type { FormInstance } from 'element-plus'
-import { FormRules } from 'element-plus'
 import { cloneDeep } from 'lodash-es'
 import useDiyStore from '@/stores/modules/diy'
 const diyStore = useDiyStore()
 
 const dialogThemeVisible = ref(false)
-let confirmRepeat = false
+const confirmRepeat = ref(false)
 const emit = defineEmits(['confirm'])
 /**
 * 表单数据
@@ -73,35 +69,50 @@ const open = (option:any) => {
 const formRef = ref<FormInstance>()
 
 // 表单验证规则
-const formRules = reactive<FormRules>({
-    title: [
-        { required: true, message: "请输入颜色名称", trigger: 'blur' }
-    ],
-    value: [
-        { required: true, message: "请输入颜色value值", trigger: 'blur' }
-    ],
-    label: [
-        { required: true, message: "请输入颜色key值", trigger: 'blur' },
-        {
-            validator: (rule: any, value: any, callback: any) => {
-                const regex = /^[a-zA-Z0-9-]+$/
-                if (keyArr.indexOf(value) != -1) {
-                    callback('新增颜色key值与已存在颜色key值命名重复，请修改命名')
-                } if (!regex.test(value)) {
-                    callback('颜色key值只能输入字母、数字和连字符')
-                } else{
-                    callback();
-                }
-            },
-            trigger: 'blur'
-        }
-    ]
+const formRules = computed(() => {
+    return {
+        title: [
+            { required: true, message: "请输入颜色名称", trigger: 'blur' }
+        ],
+        value: [
+            {
+                required: true,
+                validator: (rule: any, value: any, callback: any) => {
+                    if (!value) {
+                        callback('请输入颜色value值')
+                    } else{
+                        callback();
+                    }
+                },
+                trigger: ['blur', 'change']
+            }
+        ],
+        label: [
+            { required: true, message: "请输入颜色key值", trigger: 'blur' },
+            {
+                validator: (rule: any, value: any, callback: any) => {
+                    const regex = /^[a-zA-Z0-9-]+$/
+                    if (keyArr.indexOf(value) != -1) {
+                        callback('新增颜色key值与已存在颜色key值命名重复，请修改命名')
+                    } if (!regex.test(value)) {
+                        callback('颜色key值只能输入字母、数字和连字符')
+                    } else{
+                        callback();
+                    }
+                },
+                trigger: 'blur'
+            }
+        ]
+    }
 })
 
 const confirmFn = async (formEl: FormInstance | undefined) => {
-    if (confirmRepeat || !formEl) return
-    await formEl.validate(async (valid) => {
+    if (confirmRepeat.value) return
+    await formRef.value?.validate(async (valid) => {
+        if (confirmRepeat.value) return
+        confirmRepeat.value = true
         if (valid) {
+            confirmRepeat.value = false
             emit('confirm', cloneDeep(formData));
             dialogThemeVisible.value = false;
         }
diff --git a/admin/src/app/views/diy/components/edit-active-cube.vue b/admin/src/app/views/diy/components/edit-active-cube.vue
index 55ffec146..4647fc377 100644
--- a/admin/src/app/views/diy/components/edit-active-cube.vue
+++ b/admin/src/app/views/diy/components/edit-active-cube.vue
@@ -1,102 +1,109 @@
 <template>
-	<!-- 内容 -->
-	<div class="content-wrap" v-show="diyStore.editTab == 'content'">
+    <!-- 内容 -->
+    <div class="content-wrap" v-show="diyStore.editTab == 'content'">
 
-		<div class="edit-attr-item-wrap">
-			<h3 class="mb-[10px]">{{ t('titleContent') }}</h3>
-			<el-form label-width="80px" class="px-[10px]" @submit.prevent>
-				<el-form-item :label="t('selectStyle')" class="flex">
-					<span class="text-primary flex-1 cursor-pointer" @click="showTitleStyle">{{ diyStore.editComponent.titleStyle.title }}</span>
-					<el-icon>
-						<ArrowRight />
-					</el-icon>
-				</el-form-item>
-                <el-form-item :label="t('title')"  v-if="diyStore.editComponent && diyStore.editComponent.titleStyle && diyStore.editComponent.titleStyle.value != 'style-5'">
+        <div class="edit-attr-item-wrap">
+            <h3 class="mb-[10px]">{{ t('titleContent') }}</h3>
+            <el-form label-width="80px" class="px-[10px]" @submit.prevent>
+                <el-form-item :label="t('selectStyle')" class="flex">
+                    <span class="text-primary flex-1 cursor-pointer" @click="showTitleStyle">{{ diyStore.editComponent.titleStyle.title }}</span>
+                    <el-icon>
+                        <ArrowRight />
+                    </el-icon>
+                </el-form-item>
+                <el-form-item :label="t('title')" v-if="diyStore.editComponent && diyStore.editComponent.titleStyle && diyStore.editComponent.titleStyle.value != 'style-5'">
                     <el-input v-model.trim="diyStore.editComponent.text" :placeholder="t('titlePlaceholder')" clearable maxlength="10" show-word-limit />
                 </el-form-item>
                 <el-form-item :label="t('image')" v-else>
-                    <upload-image v-model="diyStore.editComponent.textImg" :limit="1"/>
+                    <upload-image v-model="diyStore.editComponent.textImg" :limit="1" />
                 </el-form-item>
                 <el-form-item :label="t('link')">
-                    <diy-link v-model="diyStore.editComponent.textLink"/>
+                    <diy-link v-model="diyStore.editComponent.textLink" />
                 </el-form-item>
                 <el-form-item :label="t('subTitle')">
                     <el-input v-model.trim="diyStore.editComponent.subTitle.text" :placeholder="t('subTitlePlaceholder')" clearable maxlength="8" show-word-limit />
                 </el-form-item>
                 <el-form-item :label="t('link')">
-                    <diy-link v-model="diyStore.editComponent.subTitle.link"/>
+                    <diy-link v-model="diyStore.editComponent.subTitle.link" />
                 </el-form-item>
-			</el-form>
+            </el-form>
 
-			<el-dialog v-model="showTitleDialog" :title="t('selectStyle')" width="460px">
+            <el-dialog v-model="showTitleDialog" :title="t('selectStyle')" width="460px">
 
-				<div class="flex flex-wrap">
-					<template v-for="(item,index) in titleStyleList" :key="index">
-						<div :class="{ 'border-primary': selectTitleStyle.value == item.value }" @click="changeTitleStyle(item)" class="flex items-center justify-center overflow-hidden w-[200px] h-[100px] mr-[12px] mb-[12px] cursor-pointer border bg-[#eee]">
-							<img :src="img(item.url)" />
-						</div>
-					</template>
-				</div>
+                <div class="flex flex-wrap">
+                    <template v-for="(item,index) in titleStyleList" :key="index">
+                        <div :class="{ 'border-primary': selectTitleStyle.value == item.value }"
+                             @click="changeTitleStyle(item)"
+                             class="flex items-center justify-center overflow-hidden w-[200px] h-[100px] mr-[12px] mb-[12px] cursor-pointer border bg-[#eee]">
+                            <img :src="img(item.url)" />
+                        </div>
+                    </template>
+                </div>
 
-				<template #footer>
-					<span class="dialog-footer">
-						<el-button @click="showTitleDialog = false">{{ t('cancel') }}</el-button>
-						<el-button type="primary" @click="confirmTitleStyle">{{ t('confirm') }}</el-button>
-					</span>
-				</template>
+                <template #footer>
+                    <span class="dialog-footer">
+                        <el-button @click="showTitleDialog = false">{{ t('cancel') }}</el-button>
+                        <el-button type="primary" @click="confirmTitleStyle">{{ t('confirm') }}</el-button>
+                    </span>
+                </template>
 
-			</el-dialog>
-		</div>
+            </el-dialog>
+        </div>
 
-		<div class="edit-attr-item-wrap">
-			<h3 class="mb-[10px]">{{ t('activeCubeBlockContent') }}</h3>
-			<el-form label-width="90px" class="px-[10px]">
+        <div class="edit-attr-item-wrap">
+            <h3 class="mb-[10px]">{{ t('activeCubeBlockContent') }}</h3>
+            <el-form label-width="90px" class="px-[10px]">
 
-				<el-form-item :label="t('selectStyle')" class="flex">
-					<span class="text-primary flex-1 cursor-pointer" @click="showBlockStyle">{{ diyStore.editComponent.blockStyle.title }}</span>
-					<el-icon>
-						<ArrowRight />
-					</el-icon>
-				</el-form-item>
+                <el-form-item :label="t('selectStyle')" class="flex">
+                    <span class="text-primary flex-1 cursor-pointer"
+                          @click="showBlockStyle">{{ diyStore.editComponent.blockStyle.title }}</span>
+                    <el-icon>
+                        <ArrowRight />
+                    </el-icon>
+                </el-form-item>
 
-				<el-dialog v-model="showListDialog" :title="t('selectStyle')" width="600px">
-					<div class="flex flex-wrap">
-						<template v-for="(item,index) in blockStyleList" :key="index">
-							<div :class="{ 'border-primary': selectBlockStyle.value == item.value }" @click="changeBlockStyle(item)" class="flex items-center justify-center overflow-hidden w-[250px] h-[150px] mr-[12px] mb-[12px] cursor-pointer border bg-[#eee]">
-								<img :src="img(item.url)" />
-							</div>
-						</template>
+                <el-dialog v-model="showListDialog" :title="t('selectStyle')" width="600px">
+                    <div class="flex flex-wrap">
+                        <template v-for="(item,index) in blockStyleList" :key="index">
+                            <div :class="{ 'border-primary': selectBlockStyle.value == item.value }"
+                                 @click="changeBlockStyle(item)"
+                                 class="flex items-center justify-center overflow-hidden w-[250px] h-[150px] mr-[12px] mb-[12px] cursor-pointer border bg-[#eee]">
+                                <img :src="img(item.url)" />
+                            </div>
+                        </template>
 
-					</div>
+                    </div>
 
-					<template #footer>
-						<span class="dialog-footer">
-							<el-button @click="showListDialog = false">{{ t('cancel') }}</el-button>
-							<el-button type="primary" @click="confirmBlockStyle">{{ t('confirm') }}</el-button>
-						</span>
-					</template>
+                    <template #footer>
+                        <span class="dialog-footer">
+                            <el-button @click="showListDialog = false">{{ t('cancel') }}</el-button>
+                            <el-button type="primary" @click="confirmBlockStyle">{{ t('confirm') }}</el-button>
+                        </span>
+                    </template>
 
-				</el-dialog>
+                </el-dialog>
 
-				<p class="text-sm text-gray-400 mb-[10px]">{{ t('dragMouseAdjustOrder') }}</p>
+                <p class="text-sm text-gray-400 mb-[10px]">{{ t('dragMouseAdjustOrder') }}</p>
 
-				<div ref="blockBoxRef">
-					<div v-for="(item,index) in diyStore.editComponent.list" :key="item.id" class="item-wrap p-[10px] pb-0 relative border border-dashed border-gray-300 mb-[16px]">
-						<el-form-item :label="t('image')">
-							<upload-image v-model="item.imageUrl" :limit="1"/>
-						</el-form-item>
+                <div ref="blockBoxRef">
+                    <div v-for="(item,index) in diyStore.editComponent.list" :key="item.id"
+                         class="item-wrap p-[10px] pb-0 relative border border-dashed border-gray-300 mb-[16px]">
+                        <el-form-item :label="t('image')">
+                            <upload-image v-model="item.imageUrl" :limit="1" />
+                        </el-form-item>
 
-						<el-form-item :label="t('activeCubeTitle')">
-							<el-input v-model.trim="item.title.text" :placeholder="t('activeCubeTitlePlaceholder')" clearable maxlength="4" show-word-limit/>
-						</el-form-item>
+                        <el-form-item :label="t('activeCubeTitle')">
+                            <el-input v-model.trim="item.title.text" :placeholder="t('activeCubeTitlePlaceholder')"
+                                      clearable maxlength="4" show-word-limit />
+                        </el-form-item>
 
                         <el-form-item :label="t('activeCubeSubTitleTextColor')" v-show="diyStore.editComponent.blockStyle.value == 'style-3'">
                             <el-color-picker v-model="item.title.textColor" show-alpha :predefine="diyStore.predefineColors" />
                         </el-form-item>
 
-						<el-form-item :label="t('activeCubeSubTitle')" v-if="diyStore.editComponent.blockStyle.value != 'style-3'">
-							<el-input v-model.trim="item.subTitle.text" :placeholder="t('activeCubeSubTitlePlaceholder')" clearable maxlength="6" show-word-limit/>
-						</el-form-item>
+                        <el-form-item :label="t('activeCubeSubTitle')" v-if="diyStore.editComponent.blockStyle.value != 'style-3'">
+                            <el-input v-model.trim="item.subTitle.text" :placeholder="t('activeCubeSubTitlePlaceholder')" clearable maxlength="6" show-word-limit />
+                        </el-form-item>
 
                         <div v-show="diyStore.editComponent.blockStyle.value == 'style-4'">
                             <el-form-item :label="t('activeCubeSubTitleTextColor')">
@@ -104,99 +111,105 @@
                             </el-form-item>
                             <el-form-item :label="t('activeCubeSubTitleBgColor')">
                                 <el-color-picker v-model="item.subTitle.startColor" show-alpha :predefine="diyStore.predefineColors" />
-                                <icon name="iconfont iconmap-connect" size="20px" class="block !text-gray-400 mx-[5px]"/>
-                                <el-color-picker v-model="item.subTitle.endColor" show-alpha :predefine="diyStore.predefineColors"/>
+                                <icon name="iconfont iconmap-connect" size="20px" class="block !text-gray-400 mx-[5px]" />
+                                <el-color-picker v-model="item.subTitle.endColor" show-alpha :predefine="diyStore.predefineColors" />
                             </el-form-item>
                         </div>
 
                         <el-form-item :label="t('activeListFrameColor')">
                             <el-color-picker v-model="item.listFrame.startColor" show-alpha :predefine="diyStore.predefineColors" />
-                            <icon name="iconfont iconmap-connect" size="20px" class="block !text-gray-400 mx-[5px]"/>
-                            <el-color-picker v-model="item.listFrame.endColor" show-alpha :predefine="diyStore.predefineColors"/>
+                            <icon name="iconfont iconmap-connect" size="20px" class="block !text-gray-400 mx-[5px]" />
+                            <el-color-picker v-model="item.listFrame.endColor" show-alpha :predefine="diyStore.predefineColors" />
                         </el-form-item>
 
-                        <div v-show="diyStore.editComponent.blockStyle.value != 'style-4' && diyStore.editComponent.blockStyle.value != 'style-3'">
+                        <div
+                            v-show="diyStore.editComponent.blockStyle.value != 'style-4' && diyStore.editComponent.blockStyle.value != 'style-3'">
                             <el-form-item :label="t('activeCubeButton')">
-                                <el-input v-model.trim="item.moreTitle.text" :placeholder="t('activeCubeButtonPlaceholder')" clearable maxlength="3" show-word-limit/>
+                                <el-input v-model.trim="item.moreTitle.text" :placeholder="t('activeCubeButtonPlaceholder')" clearable maxlength="3" show-word-limit />
                             </el-form-item>
 
                             <el-form-item :label="t('activeCubeButtonColor')">
                                 <el-color-picker v-model="item.moreTitle.startColor" show-alpha :predefine="diyStore.predefineColors" />
-                                <icon name="iconfont iconmap-connect" size="20px" class="block !text-gray-400 mx-[5px]"/>
-                                <el-color-picker v-model="item.moreTitle.endColor" show-alpha :predefine="diyStore.predefineColors"/>
+                                <icon name="iconfont iconmap-connect" size="20px" class="block !text-gray-400 mx-[5px]" />
+                                <el-color-picker v-model="item.moreTitle.endColor" show-alpha :predefine="diyStore.predefineColors" />
                             </el-form-item>
                         </div>
 
-						<el-form-item :label="t('link')">
-							<diy-link v-model="item.link"/>
-						</el-form-item>
+                        <el-form-item :label="t('link')">
+                            <diy-link v-model="item.link" />
+                        </el-form-item>
 
-						<div class="del absolute cursor-pointer z-[2] top-[-8px] right-[-8px]" v-show="diyStore.editComponent.list.length > 1" @click="diyStore.editComponent.list.splice(index,1)">
-							<icon name="element CircleCloseFilled" color="#bbb" size="20px"/>
-						</div>
-					</div>
-				</div>
+                        <div class="del absolute cursor-pointer z-[2] top-[-8px] right-[-8px]"
+                             v-show="diyStore.editComponent.list.length > 1"
+                             @click="diyStore.editComponent.list.splice(index,1)">
+                            <icon name="element CircleCloseFilled" color="#bbb" size="20px" />
+                        </div>
+                    </div>
+                </div>
 
-				<el-button v-show="diyStore.editComponent.list.length < 10" class="w-full" @click="addItem">{{ t('activeCubeAddItem') }}</el-button>
+                <el-button v-show="diyStore.editComponent.list.length < 10" class="w-full" @click="addItem">
+                    {{ t('activeCubeAddItem') }}
+                </el-button>
 
-			</el-form>
-		</div>
+            </el-form>
+        </div>
 
-	</div>
+    </div>
 
-	<!-- 样式 -->
-	<div class="style-wrap" v-show="diyStore.editTab == 'style'">
+    <!-- 样式 -->
+    <div class="style-wrap" v-show="diyStore.editTab == 'style'">
 
-		<div class="edit-attr-item-wrap" v-if="selectTitleStyle.value != 'style-5'">
-			<h3 class="mb-[10px]">{{ t('titleStyle') }}</h3>
-			<el-form label-width="90px" class="px-[10px]">
-				<el-form-item :label="t('textColor')">
-					<el-color-picker v-model="diyStore.editComponent.titleColor" show-alpha :predefine="diyStore.predefineColors"/>
-				</el-form-item>
-			</el-form>
-		</div>
+        <div class="edit-attr-item-wrap" v-if="selectTitleStyle.value != 'style-5'">
+            <h3 class="mb-[10px]">{{ t('titleStyle') }}</h3>
+            <el-form label-width="90px" class="px-[10px]">
+                <el-form-item :label="t('textColor')">
+                    <el-color-picker v-model="diyStore.editComponent.titleColor" show-alpha :predefine="diyStore.predefineColors" />
+                </el-form-item>
+            </el-form>
+        </div>
 
-		<div class="edit-attr-item-wrap">
-			<h3 class="mb-[10px]">{{ t('subTitleStyle') }}</h3>
-			<el-form label-width="90px" class="px-[10px]">
-					<el-form-item :label="t('textColor')">
-						<el-color-picker v-model="diyStore.editComponent.subTitle.textColor" show-alpha :predefine="diyStore.predefineColors"/>
-					</el-form-item>
-				<el-form-item :label="t('subTextBgColor')">
-					<el-color-picker v-model="diyStore.editComponent.subTitle.startColor" show-alpha :predefine="diyStore.predefineColors"/>
-					<icon name="iconfont iconmap-connect" size="20px" class="block !text-gray-400 mx-[5px]"/>
-					<el-color-picker v-model="diyStore.editComponent.subTitle.endColor" show-alpha :predefine="diyStore.predefineColors"/>
-				</el-form-item>
-			</el-form>
-		</div>
+        <div class="edit-attr-item-wrap">
+            <h3 class="mb-[10px]">{{ t('subTitleStyle') }}</h3>
+            <el-form label-width="90px" class="px-[10px]">
+                <el-form-item :label="t('textColor')">
+                    <el-color-picker v-model="diyStore.editComponent.subTitle.textColor" show-alpha
+                                     :predefine="diyStore.predefineColors" />
+                </el-form-item>
+                <el-form-item :label="t('subTextBgColor')">
+                    <el-color-picker v-model="diyStore.editComponent.subTitle.startColor" show-alpha :predefine="diyStore.predefineColors" />
+                    <icon name="iconfont iconmap-connect" size="20px" class="block !text-gray-400 mx-[5px]" />
+                    <el-color-picker v-model="diyStore.editComponent.subTitle.endColor" show-alpha :predefine="diyStore.predefineColors" />
+                </el-form-item>
+            </el-form>
+        </div>
 
-		<div class="edit-attr-item-wrap">
-			<h3 class="mb-[10px]">{{ t('activeCubeBlockStyle') }}</h3>
-			<el-form label-width="80px" class="px-[10px]">
-				<el-form-item :label="t('activeCubeBlockTextFontWeight')">
-					<el-radio-group v-model="diyStore.editComponent.blockStyle.fontWeight">
-						<el-radio :label="'normal'">{{t('fontWeightNormal')}}</el-radio>
-						<el-radio :label="'bold'">{{t('fontWeightBold')}}</el-radio>
-					</el-radio-group>
-				</el-form-item>
+        <div class="edit-attr-item-wrap">
+            <h3 class="mb-[10px]">{{ t('activeCubeBlockStyle') }}</h3>
+            <el-form label-width="80px" class="px-[10px]">
+                <el-form-item :label="t('activeCubeBlockTextFontWeight')">
+                    <el-radio-group v-model="diyStore.editComponent.blockStyle.fontWeight">
+                        <el-radio :label="'normal'">{{ t('fontWeightNormal') }}</el-radio>
+                        <el-radio :label="'bold'">{{ t('fontWeightBold') }}</el-radio>
+                    </el-radio-group>
+                </el-form-item>
                 <el-form-item :label="t('activeCubeBlockBtnText')" class="flex">
-					<el-radio-group v-model="diyStore.editComponent.blockStyle.btnText">
-						<el-radio :label="'normal'">{{t('btnTextNormal')}}</el-radio>
-						<el-radio :label="'italics'">{{t('btnTextItalics')}}</el-radio>
-					</el-radio-group>
-				</el-form-item>
-				<el-form-item :label="t('topRounded')">
-					<el-slider v-model="diyStore.editComponent.topElementRounded" show-input size="small" class="ml-[10px] diy-nav-slider" :max="50" />
-				</el-form-item>
-				<el-form-item :label="t('bottomRounded')">
-					<el-slider v-model="diyStore.editComponent.bottomElementRounded" show-input size="small" class="ml-[10px] diy-nav-slider" :max="50" />
-				</el-form-item>
-			</el-form>
-		</div>
+                    <el-radio-group v-model="diyStore.editComponent.blockStyle.btnText">
+                        <el-radio :label="'normal'">{{ t('btnTextNormal') }}</el-radio>
+                        <el-radio :label="'italics'">{{ t('btnTextItalics') }}</el-radio>
+                    </el-radio-group>
+                </el-form-item>
+                <el-form-item :label="t('topRounded')">
+                    <el-slider v-model="diyStore.editComponent.topElementRounded" show-input size="small" class="ml-[10px] diy-nav-slider" :max="50" />
+                </el-form-item>
+                <el-form-item :label="t('bottomRounded')">
+                    <el-slider v-model="diyStore.editComponent.bottomElementRounded" show-input size="small" class="ml-[10px] diy-nav-slider" :max="50" />
+                </el-form-item>
+            </el-form>
+        </div>
 
-		<!-- 组件样式 -->
-		<slot name="style"></slot>
-	</div>
+        <!-- 组件样式 -->
+        <slot name="style"></slot>
+    </div>
 
 </template>
 
@@ -215,7 +228,7 @@ diyStore.editComponent.ignore = [] // 忽略公共属性
 diyStore.editComponent.verify = (index: number) => {
     const res = { code: true, message: '' }
 
-    if(diyStore.value[index].text == ''){
+    if (diyStore.value[index].text == '') {
         res.code = false
         res.message = t('activeCubeTitlePlaceholder')
         return res
@@ -232,14 +245,14 @@ diyStore.editComponent.verify = (index: number) => {
             res.message = t('activeCubeTitlePlaceholder')
             return res
         }
-        if(['style-1','style-2','style-4'].indexOf(diyStore.value[index].blockStyle.value) != -1){
+        if (['style-1', 'style-2', 'style-4'].indexOf(diyStore.value[index].blockStyle.value) != -1) {
             if (item.subTitle.text === '') {
                 res.code = false
                 res.message = t('activeCubeSubTitlePlaceholder')
                 return res
             }
         }
-        if(['style-1','style-2'].indexOf(diyStore.value[index].blockStyle.value) != -1){
+        if (['style-1', 'style-2'].indexOf(diyStore.value[index].blockStyle.value) != -1) {
             if (item.moreTitle.text === '') {
                 res.code = false
                 res.message = t('activeCubeButtonPlaceholder')
@@ -258,33 +271,33 @@ diyStore.editComponent.list.forEach((item: any) => {
 const showTitleDialog = ref(false)
 
 const showTitleStyle = () => {
-	selectTitleStyle.title = diyStore.editComponent.titleStyle.title;
-	selectTitleStyle.value = diyStore.editComponent.titleStyle.value;
+    selectTitleStyle.title = diyStore.editComponent.titleStyle.title;
+    selectTitleStyle.value = diyStore.editComponent.titleStyle.value;
     showTitleDialog.value = true
 }
 
 const titleStyleList = reactive([
-	{
-        url : 'static/resource/images/diy/active_cube/title_style1.png',
-        title:'风格1',
-	    value:'style-1'
-	},{
-        url : 'static/resource/images/diy/active_cube/title_style2.png',
-        title:'风格2',
-	    value:'style-2'
-	},{
-        url : 'static/resource/images/diy/active_cube/title_style3.png',
-        title:'风格3',
-	    value:'style-3'
-	},{
-        url : 'static/resource/images/diy/active_cube/title_style5.png',
-        title:'风格4',
-	    value:'style-4'
-	},{
-        url : 'static/resource/images/diy/active_cube/title_style6.png',
-        title:'风格5',
-	    value:'style-5'
-	}
+    {
+        url: 'static/resource/images/diy/active_cube/title_style1.png',
+        title: '风格1',
+        value: 'style-1'
+    }, {
+        url: 'static/resource/images/diy/active_cube/title_style2.png',
+        title: '风格2',
+        value: 'style-2'
+    }, {
+        url: 'static/resource/images/diy/active_cube/title_style3.png',
+        title: '风格3',
+        value: 'style-3'
+    }, {
+        url: 'static/resource/images/diy/active_cube/title_style5.png',
+        title: '风格4',
+        value: 'style-4'
+    }, {
+        url: 'static/resource/images/diy/active_cube/title_style6.png',
+        title: '风格5',
+        value: 'style-5'
+    }
 ])
 
 const selectTitleStyle = reactive({
@@ -292,7 +305,7 @@ const selectTitleStyle = reactive({
     value: diyStore.editComponent.titleStyle.value
 })
 
-const changeTitleStyle = (item:any) => {
+const changeTitleStyle = (item: any) => {
     selectTitleStyle.title = item.title;
     selectTitleStyle.value = item.value;
 }
@@ -304,28 +317,28 @@ const confirmTitleStyle = () => {
     showTitleDialog.value = false
 }
 
-const initTitleStyle = (style)=>{
-    if(diyStore.editComponent.titleStyle.value == 'style-1'){
+const initTitleStyle = (style) => {
+    if (diyStore.editComponent.titleStyle.value == 'style-1') {
         diyStore.editComponent.titleColor = "#F91700";
         diyStore.editComponent.subTitle.textColor = "#FFFFFF";
         diyStore.editComponent.subTitle.startColor = "#FB792F";
         diyStore.editComponent.subTitle.endColor = "#F91700";
-    }else if(diyStore.editComponent.titleStyle.value == 'style-2'){
+    } else if (diyStore.editComponent.titleStyle.value == 'style-2') {
         diyStore.editComponent.titleColor = "#F91700";
         diyStore.editComponent.subTitle.textColor = "#FFFFFF";
         diyStore.editComponent.subTitle.startColor = "#FB792F";
         diyStore.editComponent.subTitle.endColor = "#F91700";
-    }else if(diyStore.editComponent.titleStyle.value == 'style-3'){
+    } else if (diyStore.editComponent.titleStyle.value == 'style-3') {
         diyStore.editComponent.titleColor = "#F91700";
         diyStore.editComponent.subTitle.textColor = "#FFFFFF";
         diyStore.editComponent.subTitle.startColor = "#FB792F";
         diyStore.editComponent.subTitle.endColor = "#F91700";
-    }else if(diyStore.editComponent.titleStyle.value == 'style-4'){
+    } else if (diyStore.editComponent.titleStyle.value == 'style-4') {
         diyStore.editComponent.titleColor = "#FFFFFF";
         diyStore.editComponent.subTitle.textColor = "#333333";
         diyStore.editComponent.subTitle.startColor = "#FFFFFF";
         diyStore.editComponent.subTitle.endColor = "#FFFFFF";
-    }else if(diyStore.editComponent.titleStyle.value == 'style-5'){
+    } else if (diyStore.editComponent.titleStyle.value == 'style-5') {
         diyStore.editComponent.titleColor = "";
         diyStore.editComponent.subTitle.textColor = "#999999";
         diyStore.editComponent.subTitle.startColor = "#FFFFFF";
@@ -342,24 +355,24 @@ const showBlockStyle = () => {
 
 const blockStyleList = reactive([
     {
-        url : 'static/resource/images/diy/active_cube/block_style1.png',
-        title:'风格1',
-        value:'style-1'
+        url: 'static/resource/images/diy/active_cube/block_style1.png',
+        title: '风格1',
+        value: 'style-1'
     },
     {
-        url : 'static/resource/images/diy/active_cube/block_style2.png',
-        title:'风格2',
-        value:'style-2'
+        url: 'static/resource/images/diy/active_cube/block_style2.png',
+        title: '风格2',
+        value: 'style-2'
     },
     {
-        url : 'static/resource/images/diy/active_cube/block_style3.png',
-        title:'风格3',
-        value:'style-3'
+        url: 'static/resource/images/diy/active_cube/block_style3.png',
+        title: '风格3',
+        value: 'style-3'
     },
     {
-        url : 'static/resource/images/diy/active_cube/block_style4.png',
-        title:'风格4',
-        value:'style-4'
+        url: 'static/resource/images/diy/active_cube/block_style4.png',
+        title: '风格4',
+        value: 'style-4'
     }
 ])
 
@@ -368,7 +381,7 @@ const selectBlockStyle = reactive({
     value: diyStore.editComponent.blockStyle.value
 })
 
-const changeBlockStyle = (item:any) => {
+const changeBlockStyle = (item: any) => {
     selectBlockStyle.title = item.title;
     selectBlockStyle.value = item.value;
 }
@@ -380,8 +393,8 @@ const confirmBlockStyle = () => {
     showListDialog.value = false
 }
 
-const initBlockStyle = (style: any)=>{
-    if(style == 'style-1'){
+const initBlockStyle = (style: any) => {
+    if (style == 'style-1') {
         diyStore.editComponent.blockStyle.fontWeight = "normal";
         diyStore.editComponent.blockStyle.btnText = "normal";
 
@@ -421,7 +434,7 @@ const initBlockStyle = (style: any)=>{
         diyStore.editComponent.list[3].listFrame.startColor = "#FFFAF5";
         diyStore.editComponent.list[3].listFrame.endColor = "#FFFFFF";
 
-    }else if(style == 'style-2'){
+    } else if (style == 'style-2') {
         diyStore.editComponent.blockStyle.fontWeight = "normal";
         diyStore.editComponent.blockStyle.btnText = "normal";
 
@@ -463,7 +476,7 @@ const initBlockStyle = (style: any)=>{
         diyStore.editComponent.list[3].moreTitle.endColor = "#F91700";
         diyStore.editComponent.list[3].listFrame.startColor = "#FFEAEA";
         diyStore.editComponent.list[3].listFrame.endColor = "#FFFCFB";
-    }else if(style == 'style-3'){
+    } else if (style == 'style-3') {
         diyStore.editComponent.blockStyle.fontWeight = "normal";
         diyStore.editComponent.blockStyle.btnText = "normal";
 
@@ -502,7 +515,7 @@ const initBlockStyle = (style: any)=>{
         diyStore.editComponent.list[3].moreTitle.endColor = "";
         diyStore.editComponent.list[3].listFrame.startColor = "";
         diyStore.editComponent.list[3].listFrame.endColor = "";
-    }else if(style == 'style-4'){
+    } else if (style == 'style-4') {
         diyStore.editComponent.blockStyle.fontWeight = "bold";
         diyStore.editComponent.blockStyle.btnText = "normal";
 
@@ -547,24 +560,24 @@ const initBlockStyle = (style: any)=>{
 const addItem = () => {
     diyStore.editComponent.list.push({
         id: diyStore.generateRandom(),
-        title:{
-            title:'标题',
+        title: {
+            title: '标题',
             textColor: "#000000"
         },
-        subTitle:{
-            text:'副标题',
+        subTitle: {
+            text: '副标题',
             textColor: "#999999",
-	        startColor:'',
-            endColor:''
+            startColor: '',
+            endColor: ''
         },
         listFrame: {
             startColor: "#4AC1FF",
             endColor: "#1D7CFF"
         },
-        moreTitle:{
-            text:'去看看',
-	        startColor:'#FEA715',
-            endColor:'#FE1E00'
+        moreTitle: {
+            text: '去看看',
+            startColor: '#FEA715',
+            endColor: '#FE1E00'
         },
         imageUrl: '',
         link: { name: '' }
diff --git a/admin/src/app/views/diy/components/edit-carousel-search.vue b/admin/src/app/views/diy/components/edit-carousel-search.vue
index 3813f4967..d94bba697 100644
--- a/admin/src/app/views/diy/components/edit-carousel-search.vue
+++ b/admin/src/app/views/diy/components/edit-carousel-search.vue
@@ -1,105 +1,106 @@
 <template>
-	<!-- 内容 -->
-	<div class="content-wrap" v-show="diyStore.editTab == 'content'">
+    <!-- 内容 -->
+    <div class="content-wrap" v-show="diyStore.editTab == 'content'">
 
-		<div class="edit-attr-item-wrap">
-			<h3 class="mb-[10px]">{{ t('carouselSearchShowPosition') }}</h3>
-			<el-form label-width="100px" class="px-[10px]">
-				<el-form-item :label="t('carouselSearchShowWay')">
-					<el-radio-group v-model="diyStore.editComponent.positionWay">
-						<el-radio label="static">{{ t('carouselSearchShowWayStatic') }}</el-radio>
-						<el-radio label="fixed">{{ t('carouselSearchShowWayFixed') }}</el-radio>
-					</el-radio-group>
+        <div class="edit-attr-item-wrap">
+            <h3 class="mb-[10px]">{{ t('carouselSearchShowPosition') }}</h3>
+            <el-form label-width="100px" class="px-[10px]">
+                <el-form-item :label="t('carouselSearchShowWay')">
+                    <el-radio-group v-model="diyStore.editComponent.positionWay">
+                        <el-radio label="static">{{ t('carouselSearchShowWayStatic') }}</el-radio>
+                        <el-radio label="fixed">{{ t('carouselSearchShowWayFixed') }}</el-radio>
+                    </el-radio-group>
                     <div v-if="diyStore.editComponent.positionWay == 'fixed'" class="text-sm text-gray-400 mb-[10px]">滑动页面查看效果</div>
-				</el-form-item>
-				<el-form-item :label="t('carouselSearchFixedBgColor')" v-show="diyStore.editComponent.positionWay == 'fixed'">
-					<el-color-picker v-model="diyStore.editComponent.fixedBgColor" show-alpha :predefine="diyStore.predefineColors"/>
-				</el-form-item>
+                </el-form-item>
+                <el-form-item :label="t('carouselSearchFixedBgColor')" v-show="diyStore.editComponent.positionWay == 'fixed'">
+                    <el-color-picker v-model="diyStore.editComponent.fixedBgColor" show-alpha :predefine="diyStore.predefineColors" />
+                </el-form-item>
                 <el-form-item :label="t('carouselSearchBgGradient')">
                     <el-radio-group v-model="diyStore.editComponent.bgGradient">
-						<el-radio :label="true">{{ t('carouselSearchOpen') }}</el-radio>
-						<el-radio :label="false">{{ t('carouselSearchClose') }}</el-radio>
-					</el-radio-group>
+                        <el-radio :label="true">{{ t('carouselSearchOpen') }}</el-radio>
+                        <el-radio :label="false">{{ t('carouselSearchClose') }}</el-radio>
+                    </el-radio-group>
                 </el-form-item>
-			</el-form>
-		</div>
+            </el-form>
+        </div>
 
-		<div class="edit-attr-item-wrap">
-			<h3 class="mb-[10px]">{{ t('carouselSearchSet') }}</h3>
-			<el-form label-width="100px" class="px-[10px]" @submit.prevent>
-				<el-form-item :label="t('selectStyle')" class="flex">
-					<span class="text-primary flex-1 cursor-pointer" @click="showSearchStyle">{{ diyStore.editComponent.search.styleName }}</span>
-					<el-icon>
-						<ArrowRight />
-					</el-icon>
-				</el-form-item>
+        <div class="edit-attr-item-wrap">
+            <h3 class="mb-[10px]">{{ t('carouselSearchSet') }}</h3>
+            <el-form label-width="100px" class="px-[10px]" @submit.prevent>
+                <el-form-item :label="t('selectStyle')" class="flex">
+                    <span class="text-primary flex-1 cursor-pointer" @click="showSearchStyle">{{ diyStore.editComponent.search.styleName }}</span>
+                    <el-icon>
+                        <ArrowRight />
+                    </el-icon>
+                </el-form-item>
                 <el-form-item :label="t('carouselSearchSubTitle')" v-if="diyStore.editComponent.search.style == 'style-2'">
                     <el-input v-model.trim="diyStore.editComponent.search.subTitle.text" :placeholder="t('carouselSearchSubTitlePlaceholder')" clearable maxlength="10" show-word-limit />
-				</el-form-item>
-				<el-form-item :label="t('logo')">
-					<upload-image v-model="diyStore.editComponent.search.logo" :limit="1" />
-				    <div class="text-sm text-gray-400 mb-[10px]">{{ t('carouselSearchLogoTips') }}</div>
-				</el-form-item>
-				<el-form-item :label="t('carouselSearchText')">
-					<div>
+                </el-form-item>
+                <el-form-item :label="t('logo')">
+                    <upload-image v-model="diyStore.editComponent.search.logo" :limit="1" />
+                    <div class="text-sm text-gray-400 mb-[10px]">{{ t('carouselSearchLogoTips') }}</div>
+                </el-form-item>
+                <el-form-item :label="t('carouselSearchText')">
+                    <div>
                         <el-input v-model.trim="diyStore.editComponent.search.text" :placeholder="t('carouselSearchPlaceholder')" clearable maxlength="20" show-word-limit />
-                        <p class="text-sm text-gray-400 mt-[10px] leading-[1.5]">{{t('carouselSearchTextTips')}}</p>
+                        <p class="text-sm text-gray-400 mt-[10px] leading-[1.5]">{{ t('carouselSearchTextTips') }}</p>
                     </div>
-				</el-form-item>
-				<el-form-item :label="t('link')">
-					<diy-link v-model="diyStore.editComponent.search.link"/>
-				</el-form-item>
-			</el-form>
+                </el-form-item>
+                <el-form-item :label="t('link')">
+                    <diy-link v-model="diyStore.editComponent.search.link" />
+                </el-form-item>
+            </el-form>
 
             <el-dialog v-model="showSearchDialog" :title="t('selectStyle')" width="500px">
 
-				<div class="flex flex-wrap">
-					<template v-for="(item,index) in searchStyleList" :key="index">
-						<div :class="{ 'border-primary': selectSearchStyle.value == item.value }" @click="changeSearchStyle(item)" class="flex items-center justify-center overflow-hidden w-[200px] h-[100px] m-[6px] cursor-pointer border bg-[#eee]">
-							<img :src="img(item.url)" />
-						</div>
-					</template>
-				</div>
+                <div class="flex flex-wrap">
+                    <template v-for="(item,index) in searchStyleList" :key="index">
+                        <div :class="{ 'border-primary': selectSearchStyle.value == item.value }" @click="changeSearchStyle(item)" class="flex items-center justify-center overflow-hidden w-[200px] h-[100px] m-[6px] cursor-pointer border bg-[#eee]">
+                            <img :src="img(item.url)" />
+                        </div>
+                    </template>
+                </div>
 
-				<template #footer>
-					<span class="dialog-footer">
-						<el-button @click="showSearchDialog = false">{{ t('cancel') }}</el-button>
-						<el-button type="primary" @click="confirmSearchStyle">{{ t('confirm') }}</el-button>
-					</span>
-				</template>
+                <template #footer>
+                    <span class="dialog-footer">
+                        <el-button @click="showSearchDialog = false">{{ t('cancel') }}</el-button>
+                        <el-button type="primary" @click="confirmSearchStyle">{{ t('confirm') }}</el-button>
+                    </span>
+                </template>
 
-			</el-dialog>
-		</div>
+            </el-dialog>
+        </div>
 
-		<div class="edit-attr-item-wrap mb-[20px]">
-			<h3 class="mb-[10px]">{{ t('carouselSearchHotWordSet') }}</h3>
-			<el-form label-width="100px" class="px-[10px]">
+        <div class="edit-attr-item-wrap mb-[20px]">
+            <h3 class="mb-[10px]">{{ t('carouselSearchHotWordSet') }}</h3>
+            <el-form label-width="100px" class="px-[10px]">
 
-				<el-form-item :label="t('carouselSearchHotWordInterval')">
-					<el-slider v-model="diyStore.editComponent.search.hotWord.interval" show-input size="small" class="ml-[10px] diy-nav-slider" :min="1" :max="10"/>
-				</el-form-item>
+                <el-form-item :label="t('carouselSearchHotWordInterval')">
+                    <el-slider v-model="diyStore.editComponent.search.hotWord.interval" show-input size="small" class="ml-[10px] diy-nav-slider" :min="1" :max="10" />
+                </el-form-item>
 
-				<p class="text-sm text-gray-400 mb-[10px]">{{ t('dragMouseAdjustOrder') }}</p>
+                <p class="text-sm text-gray-400 mb-[10px]">{{ t('dragMouseAdjustOrder') }}</p>
 
-				<div ref="searchHotWordTabBoxRef">
-					<div v-for="(item,index) in diyStore.editComponent.search.hotWord.list" :key="item.id" class="item-wrap p-[10px] relative border border-dashed border-gray-300 mb-[16px]">
+                <div ref="searchHotWordTabBoxRef">
+                    <div v-for="(item,index) in diyStore.editComponent.search.hotWord.list" :key="item.id"
+                         class="item-wrap p-[10px] relative border border-dashed border-gray-300 mb-[16px]">
 
-						<el-form-item :label="t('carouselSearchHotWordText')" class="!mb-0">
-							<el-input v-model.trim="item.text" :placeholder="t('carouselSearchHotWordTextPlaceholder')" clearable maxlength="4" show-word-limit/>
-						</el-form-item>
+                        <el-form-item :label="t('carouselSearchHotWordText')" class="!mb-0">
+                            <el-input v-model.trim="item.text" :placeholder="t('carouselSearchHotWordTextPlaceholder')" clearable maxlength="4" show-word-limit />
+                        </el-form-item>
 
-						<div class="del absolute cursor-pointer z-[2] top-[-8px] right-[-8px]" @click="diyStore.editComponent.search.hotWord.list.splice(index,1)">
-							<icon name="element CircleCloseFilled" color="#bbb" size="20px"/>
-						</div>
+                        <div class="del absolute cursor-pointer z-[2] top-[-8px] right-[-8px]" @click="diyStore.editComponent.search.hotWord.list.splice(index,1)">
+                            <icon name="element CircleCloseFilled" color="#bbb" size="20px" />
+                        </div>
 
-					</div>
-					<el-button v-show="diyStore.editComponent.search.hotWord.list.length < 50" class="w-full" @click="addHotWordItem">{{ t('carouselSearchAddHotWordItem') }}</el-button>
-				</div>
+                    </div>
+                    <el-button v-show="diyStore.editComponent.search.hotWord.list.length < 50" class="w-full" @click="addHotWordItem">{{ t('carouselSearchAddHotWordItem') }}</el-button>
+                </div>
 
-			</el-form>
-		</div>
+            </el-form>
+        </div>
 
-		<el-collapse v-model="activeNames" @change="handleChange" class="collapse-wrap">
+        <el-collapse v-model="activeNames" @change="handleChange" class="collapse-wrap">
             <el-collapse-item :title="t('carouselSearchTabSet')" name="tab">
                 <div class="edit-attr-item-wrap">
                     <el-form label-width="100px" class="px-[10px]" @submit.prevent>
@@ -113,7 +114,7 @@
                             <div v-for="(item,index) in diyStore.editComponent.tab.list" :key="item.id" class="item-wrap p-[10px] pb-0 relative border border-dashed border-gray-300 mb-[16px]">
 
                                 <el-form-item :label="t('carouselSearchTabCategoryText')">
-                                    <el-input v-model.trim="item.text" :placeholder="t('carouselSearchTabCategoryTextPlaceholder')" clearable maxlength="4" show-word-limit/>
+                                    <el-input v-model.trim="item.text" :placeholder="t('carouselSearchTabCategoryTextPlaceholder')" clearable maxlength="4" show-word-limit />
                                 </el-form-item>
 
                                 <el-form-item :label="t('dataSources')">
@@ -131,8 +132,10 @@
                                     </el-input>
                                 </el-form-item>
 
-                                <div class="del absolute cursor-pointer z-[2] top-[-8px] right-[-8px]" v-show="diyStore.editComponent.tab.list.length > 1" @click="diyStore.editComponent.tab.list.splice(index,1)">
-                                    <icon name="element CircleCloseFilled" color="#bbb" size="20px"/>
+                                <div class="del absolute cursor-pointer z-[2] top-[-8px] right-[-8px]"
+                                     v-show="diyStore.editComponent.tab.list.length > 1"
+                                     @click="diyStore.editComponent.tab.list.splice(index,1)">
+                                    <icon name="element CircleCloseFilled" color="#bbb" size="20px" />
                                 </div>
 
                             </div>
@@ -141,7 +144,9 @@
 
                         <!-- 选择微页面弹出框 -->
                         <el-dialog v-model="diyPageShowDialog" :title="t('selectSourcesDiyPage')" width="1000px" :close-on-press-escape="true" :destroy-on-close="true" :close-on-click-modal="false">
-                            <el-table :data="diyPageTable.data" ref="diyPageTableRef" size="large" v-loading="diyPageTable.loading" height="490px" @current-change="handleCurrentDiyPageChange" row-key="id" highlight-current-row>
+                            <el-table :data="diyPageTable.data" ref="diyPageTableRef" size="large"
+                                      v-loading="diyPageTable.loading" height="490px"
+                                      @current-change="handleCurrentDiyPageChange" row-key="id" highlight-current-row>
                                 <template #empty>
                                     <span>{{ !diyPageTable.loading ? t('emptyData') : '' }}</span>
                                 </template>
@@ -150,9 +155,11 @@
                                 <el-table-column prop="type_name" :label="t('diyPageForAddon')" min-width="80" />
                             </el-table>
                             <div class="mt-[16px] flex justify-end">
-                                <el-pagination v-model:current-page="diyPageTable.page" v-model:page-size="diyPageTable.limit"
-                                                layout="total, sizes, prev, pager, next, jumper" :total="diyPageTable.total"
-                                                @size-change="loadDiyPageList" @current-change="loadDiyPageList" />
+                                <el-pagination v-model:current-page="diyPageTable.page"
+                                               v-model:page-size="diyPageTable.limit"
+                                               layout="total, sizes, prev, pager, next, jumper"
+                                               :total="diyPageTable.total"
+                                               @size-change="loadDiyPageList" @current-change="loadDiyPageList" />
                             </div>
                             <div class="flex items-center justify-end mt-[15px]">
                                 <el-button type="primary" @click="saveDiyPageId">{{ t('confirm') }}</el-button>
@@ -169,144 +176,151 @@
                         <el-switch v-model="diyStore.editComponent.swiper.control" />
                     </el-form-item>
                     <el-form-item :label="t('carouselSearchSwiperInterval')">
-                        <el-slider v-model="diyStore.editComponent.swiper.interval" show-input size="small" class="ml-[10px] diy-nav-slider" :min="1" :max="10"/>
+                        <el-slider v-model="diyStore.editComponent.swiper.interval" show-input size="small" class="ml-[10px] diy-nav-slider" :min="1" :max="10" />
                     </el-form-item>
 
                     <div class="text-sm text-gray-400 mb-[10px]">{{ t('carouselSearchSwiperTips') }}</div>
 
                     <div ref="imageBoxRef">
-                        <div v-for="(item,index) in diyStore.editComponent.swiper.list" :key="item.id" class="item-wrap p-[10px] pb-0 relative border border-dashed border-gray-300 mb-[16px]">
+                        <div v-for="(item,index) in diyStore.editComponent.swiper.list" :key="item.id"
+                             class="item-wrap p-[10px] pb-0 relative border border-dashed border-gray-300 mb-[16px]">
                             <el-form-item :label="t('image')">
                                 <upload-image v-model="item.imageUrl" :limit="1" @change="selectImg" />
                             </el-form-item>
 
-                            <div class="del absolute cursor-pointer z-[2] top-[-8px] right-[-8px]" v-show="diyStore.editComponent.swiper.list.length > 1" @click="diyStore.editComponent.swiper.list.splice(index,1)">
-                                <icon name="element CircleCloseFilled" color="#bbb" size="20px"/>
+                            <div class="del absolute cursor-pointer z-[2] top-[-8px] right-[-8px]"
+                                 v-show="diyStore.editComponent.swiper.list.length > 1"
+                                 @click="diyStore.editComponent.swiper.list.splice(index,1)">
+                                <icon name="element CircleCloseFilled" color="#bbb" size="20px" />
                             </div>
 
                             <el-form-item :label="t('link')">
-                                <diy-link v-model="item.link"/>
+                                <diy-link v-model="item.link" />
                             </el-form-item>
                         </div>
                     </div>
 
-                    <el-button v-show="diyStore.editComponent.swiper.list.length < 10" class="w-full" @click="addImageAd">{{ t('addImageAd') }}</el-button>
+                    <el-button v-show="diyStore.editComponent.swiper.list.length < 10" class="w-full"
+                               @click="addImageAd">{{ t('addImageAd') }}
+                    </el-button>
 
                 </el-form>
             </el-collapse-item>
         </el-collapse>
 
-	</div>
+    </div>
 
-	<!-- 样式 -->
-	<div class="style-wrap" v-show="diyStore.editTab == 'style'">
+    <!-- 样式 -->
+    <div class="style-wrap" v-show="diyStore.editTab == 'style'">
         <div class="edit-attr-item-wrap" v-if="diyStore.editComponent.search.style == 'style-2'">
-			<h3 class="mb-[10px]">{{ t('carouselSearchPositionStyle') }}</h3>
-			<el-form label-width="100px" class="px-[10px]">
-				<el-form-item :label="t('carouselSearchTextColor')">
-					<el-color-picker v-model="diyStore.editComponent.search.positionColor" show-alpha :predefine="diyStore.predefineColors"/>
-				</el-form-item>
-			</el-form>
-		</div>
+            <h3 class="mb-[10px]">{{ t('carouselSearchPositionStyle') }}</h3>
+            <el-form label-width="100px" class="px-[10px]">
+                <el-form-item :label="t('carouselSearchTextColor')">
+                    <el-color-picker v-model="diyStore.editComponent.search.positionColor" show-alpha :predefine="diyStore.predefineColors" />
+                </el-form-item>
+            </el-form>
+        </div>
 
         <div class="edit-attr-item-wrap" v-if="diyStore.editComponent.search.style == 'style-2'">
-			<h3 class="mb-[10px]">{{ t('carouselSearchSubTitleStyle') }}</h3>
-			<el-form label-width="100px" class="px-[10px]">
-				<el-form-item :label="t('carouselSearchTextColor')">
-					<el-color-picker v-model="diyStore.editComponent.search.subTitle.textColor" show-alpha :predefine="diyStore.predefineColors"/>
-				</el-form-item>
-				<el-form-item :label="t('carouselSearchBgColor')">
-                    <el-color-picker v-model="diyStore.editComponent.search.subTitle.startColor" :predefine="diyStore.predefineColors" show-alpha/>
-                    <icon name="iconfont iconmap-connect" size="20px" class="block !text-gray-400 mx-[5px]"/>
-                    <el-color-picker v-model="diyStore.editComponent.search.subTitle.endColor" :predefine="diyStore.predefineColors" show-alpha/>
-				</el-form-item>
-			</el-form>
-		</div>
+            <h3 class="mb-[10px]">{{ t('carouselSearchSubTitleStyle') }}</h3>
+            <el-form label-width="100px" class="px-[10px]">
+                <el-form-item :label="t('carouselSearchTextColor')">
+                    <el-color-picker v-model="diyStore.editComponent.search.subTitle.textColor" show-alpha :predefine="diyStore.predefineColors" />
+                </el-form-item>
+                <el-form-item :label="t('carouselSearchBgColor')">
+                    <el-color-picker v-model="diyStore.editComponent.search.subTitle.startColor" :predefine="diyStore.predefineColors" show-alpha />
+                    <icon name="iconfont iconmap-connect" size="20px" class="block !text-gray-400 mx-[5px]" />
+                    <el-color-picker v-model="diyStore.editComponent.search.subTitle.endColor" :predefine="diyStore.predefineColors" show-alpha />
+                </el-form-item>
+            </el-form>
+        </div>
 
         <div class="edit-attr-item-wrap">
-			<h3 class="mb-[10px]">{{ t('carouselSearchStyle') }}</h3>
-			<el-form label-width="100px" class="px-[10px]">
-				<el-form-item :label="t('carouselSearchTextColor')">
-					<el-color-picker v-model="diyStore.editComponent.search.color" show-alpha :predefine="diyStore.predefineColors"/>
-				</el-form-item>
-				<el-form-item :label="t('carouselSearchBgColor')">
-					<el-color-picker v-model="diyStore.editComponent.search.bgColor" show-alpha :predefine="diyStore.predefineColors"/>
-				</el-form-item>
-				<el-form-item :label="t('carouselSearchBtnColor')">
-					<el-color-picker v-model="diyStore.editComponent.search.btnColor" show-alpha :predefine="diyStore.predefineColors"/>
-				</el-form-item>
-				<el-form-item :label="t('carouselSearchBtnBgColor')">
-					<el-color-picker v-model="diyStore.editComponent.search.btnBgColor" show-alpha :predefine="diyStore.predefineColors"/>
-				</el-form-item>
-			</el-form>
-		</div>
+            <h3 class="mb-[10px]">{{ t('carouselSearchStyle') }}</h3>
+            <el-form label-width="100px" class="px-[10px]">
+                <el-form-item :label="t('carouselSearchTextColor')">
+                    <el-color-picker v-model="diyStore.editComponent.search.color" show-alpha :predefine="diyStore.predefineColors" />
+                </el-form-item>
+                <el-form-item :label="t('carouselSearchBgColor')">
+                    <el-color-picker v-model="diyStore.editComponent.search.bgColor" show-alpha :predefine="diyStore.predefineColors" />
+                </el-form-item>
+                <el-form-item :label="t('carouselSearchBtnColor')">
+                    <el-color-picker v-model="diyStore.editComponent.search.btnColor" show-alpha :predefine="diyStore.predefineColors" />
+                </el-form-item>
+                <el-form-item :label="t('carouselSearchBtnBgColor')">
+                    <el-color-picker v-model="diyStore.editComponent.search.btnBgColor" show-alpha :predefine="diyStore.predefineColors" />
+                </el-form-item>
+            </el-form>
+        </div>
 
-		<div class="edit-attr-item-wrap">
-			<h3 class="mb-[10px]">{{ t('carouselSearchTabStyle') }}</h3>
-			<el-form label-width="100px" class="px-[10px]">
-				<el-form-item :label="t('noColor')">
-					<el-color-picker v-model="diyStore.editComponent.tab.noColor" show-alpha :predefine="diyStore.predefineColors"/>
-				</el-form-item>
-				<el-form-item :label="t('selectColor')">
-					<el-color-picker v-model="diyStore.editComponent.tab.selectColor" show-alpha :predefine="diyStore.predefineColors"/>
-				</el-form-item>
-				<el-form-item :label="t('fixedNoColor')">
-					<el-color-picker v-model="diyStore.editComponent.tab.fixedNoColor" show-alpha :predefine="diyStore.predefineColors"/>
-				</el-form-item>
-				<el-form-item :label="t('fixedSelectColor')">
-					<el-color-picker v-model="diyStore.editComponent.tab.fixedSelectColor" show-alpha :predefine="diyStore.predefineColors"/>
-				</el-form-item>
-			</el-form>
-		</div>
+        <div class="edit-attr-item-wrap">
+            <h3 class="mb-[10px]">{{ t('carouselSearchTabStyle') }}</h3>
+            <el-form label-width="100px" class="px-[10px]">
+                <el-form-item :label="t('noColor')">
+                    <el-color-picker v-model="diyStore.editComponent.tab.noColor" show-alpha :predefine="diyStore.predefineColors" />
+                </el-form-item>
+                <el-form-item :label="t('selectColor')">
+                    <el-color-picker v-model="diyStore.editComponent.tab.selectColor" show-alpha :predefine="diyStore.predefineColors" />
+                </el-form-item>
+                <el-form-item :label="t('fixedNoColor')">
+                    <el-color-picker v-model="diyStore.editComponent.tab.fixedNoColor" show-alpha :predefine="diyStore.predefineColors" />
+                </el-form-item>
+                <el-form-item :label="t('fixedSelectColor')">
+                    <el-color-picker v-model="diyStore.editComponent.tab.fixedSelectColor" show-alpha :predefine="diyStore.predefineColors" />
+                </el-form-item>
+            </el-form>
+        </div>
 
-		<div class="edit-attr-item-wrap">
-			<h3 class="mb-[10px]">{{ t('carouselSearchSwiperSet') }}</h3>
-			<el-form label-width="100px" class="px-[10px]">
+        <div class="edit-attr-item-wrap">
+            <h3 class="mb-[10px]">{{ t('carouselSearchSwiperSet') }}</h3>
+            <el-form label-width="100px" class="px-[10px]">
                 <el-form-item :label="t('carouselSearchSwiperStyle')" @change="changeSwiperStyle">
-					<el-radio-group v-model="diyStore.editComponent.swiper.swiperStyle">
-						<el-radio label="style-1">{{ t('carouselSearchSwiperIndicatorStyle1') }}</el-radio>
-						<el-radio label="style-2">{{ t('carouselSearchSwiperIndicatorStyle2') }}</el-radio>
-						<el-radio label="style-3">{{ t('carouselSearchSwiperIndicatorStyle3') }}</el-radio>
-					</el-radio-group>
-				</el-form-item>
-				<el-form-item :label="t('topRounded')">
-					<el-slider v-model="diyStore.editComponent.swiper.topRounded" show-input size="small" class="ml-[10px] diy-nav-slider" :max="50" />
-				</el-form-item>
-				<el-form-item :label="t('bottomRounded')">
-					<el-slider v-model="diyStore.editComponent.swiper.bottomRounded" show-input size="small" class="ml-[10px] diy-nav-slider" :max="50" />
-				</el-form-item>
-			</el-form>
-		</div>
+                    <el-radio-group v-model="diyStore.editComponent.swiper.swiperStyle">
+                        <el-radio label="style-1">{{ t('carouselSearchSwiperIndicatorStyle1') }}</el-radio>
+                        <el-radio label="style-2">{{ t('carouselSearchSwiperIndicatorStyle2') }}</el-radio>
+                        <el-radio label="style-3">{{ t('carouselSearchSwiperIndicatorStyle3') }}</el-radio>
+                    </el-radio-group>
+                </el-form-item>
+                <el-form-item :label="t('topRounded')">
+                    <el-slider v-model="diyStore.editComponent.swiper.topRounded" show-input size="small"
+                               class="ml-[10px] diy-nav-slider" :max="50" />
+                </el-form-item>
+                <el-form-item :label="t('bottomRounded')">
+                    <el-slider v-model="diyStore.editComponent.swiper.bottomRounded" show-input size="small"
+                               class="ml-[10px] diy-nav-slider" :max="50" />
+                </el-form-item>
+            </el-form>
+        </div>
 
-		<div class="edit-attr-item-wrap">
-			<h3 class="mb-[10px]">{{ t('carouselSearchSwiperIndicatorSet') }}</h3>
-			<el-form label-width="100px" class="px-[10px]">
-				<el-form-item :label="t('carouselSearchSwiperIndicatorStyle')">
-					<el-radio-group v-model="diyStore.editComponent.swiper.indicatorStyle">
-						<el-radio label="style-1">{{ t('carouselSearchSwiperIndicatorStyle1') }}</el-radio>
-						<el-radio label="style-2">{{ t('carouselSearchSwiperIndicatorStyle2') }}</el-radio>
-						<el-radio label="style-3">{{ t('carouselSearchSwiperIndicatorStyle3') }}</el-radio>
-					</el-radio-group>
-				</el-form-item>
-				<el-form-item :label="t('carouselSearchSwiperIndicatorAlign')">
-					<el-radio-group v-model="diyStore.editComponent.swiper.indicatorAlign">
-						<el-radio label="left">{{ t('alignLeft') }}</el-radio>
-						<el-radio label="center">{{ t('alignCenter') }}</el-radio>
-						<el-radio label="right">{{ t('alignRight') }}</el-radio>
-					</el-radio-group>
-				</el-form-item>
-				<el-form-item :label="t('noColor')">
-					<el-color-picker v-model="diyStore.editComponent.swiper.indicatorColor" show-alpha :predefine="diyStore.predefineColors"/>
-				</el-form-item>
-				<el-form-item :label="t('selectColor')">
-					<el-color-picker v-model="diyStore.editComponent.swiper.indicatorActiveColor" show-alpha :predefine="diyStore.predefineColors"/>
-				</el-form-item>
-			</el-form>
-		</div>
+        <div class="edit-attr-item-wrap">
+            <h3 class="mb-[10px]">{{ t('carouselSearchSwiperIndicatorSet') }}</h3>
+            <el-form label-width="100px" class="px-[10px]">
+                <el-form-item :label="t('carouselSearchSwiperIndicatorStyle')">
+                    <el-radio-group v-model="diyStore.editComponent.swiper.indicatorStyle">
+                        <el-radio label="style-1">{{ t('carouselSearchSwiperIndicatorStyle1') }}</el-radio>
+                        <el-radio label="style-2">{{ t('carouselSearchSwiperIndicatorStyle2') }}</el-radio>
+                        <el-radio label="style-3">{{ t('carouselSearchSwiperIndicatorStyle3') }}</el-radio>
+                    </el-radio-group>
+                </el-form-item>
+                <el-form-item :label="t('carouselSearchSwiperIndicatorAlign')">
+                    <el-radio-group v-model="diyStore.editComponent.swiper.indicatorAlign">
+                        <el-radio label="left">{{ t('alignLeft') }}</el-radio>
+                        <el-radio label="center">{{ t('alignCenter') }}</el-radio>
+                        <el-radio label="right">{{ t('alignRight') }}</el-radio>
+                    </el-radio-group>
+                </el-form-item>
+                <el-form-item :label="t('noColor')">
+                    <el-color-picker v-model="diyStore.editComponent.swiper.indicatorColor" show-alpha :predefine="diyStore.predefineColors" />
+                </el-form-item>
+                <el-form-item :label="t('selectColor')">
+                    <el-color-picker v-model="diyStore.editComponent.swiper.indicatorActiveColor" show-alpha :predefine="diyStore.predefineColors" />
+                </el-form-item>
+            </el-form>
+        </div>
 
-		<!-- 组件样式 -->
-		<!-- <slot name="style"></slot> -->
-	</div>
+        <!-- 组件样式 -->
+        <!-- <slot name="style"></slot> -->
+    </div>
 
 </template>
 
@@ -317,19 +331,19 @@ import useDiyStore from '@/stores/modules/diy'
 import { ref, reactive, watch, onMounted, nextTick } from 'vue'
 import { ElTable } from 'element-plus'
 import Sortable from 'sortablejs'
-import { range,cloneDeep } from 'lodash-es'
+import { range, cloneDeep } from 'lodash-es'
 
 import { getDiyPageListByCarouselSearch } from '@/app/api/diy'
 
 const diyStore = useDiyStore()
-diyStore.editComponent.ignore = ['componentBgColor','componentBgUrl','marginTop','marginBottom','topRounded','bottomRounded','pageBgColor','marginBoth'] // 忽略公共属性
+diyStore.editComponent.ignore = ['componentBgColor', 'componentBgUrl', 'marginTop', 'marginBottom', 'topRounded', 'bottomRounded', 'pageBgColor', 'marginBoth'] // 忽略公共属性
 
 // 组件验证
 diyStore.editComponent.verify = (index: number) => {
     const res = { code: true, message: '' }
 
     diyStore.value[index].search.hotWord.list.forEach((item: any) => {
-        if(item.text == ''){
+        if (item.text == '') {
             res.code = false
             res.message = t('carouselSearchHotWordTextPlaceholder')
             return res
@@ -337,7 +351,7 @@ diyStore.editComponent.verify = (index: number) => {
     });
 
     diyStore.value[index].tab.list.forEach((item: any) => {
-        if(item.text == ''){
+        if (item.text == '') {
             res.code = false
             res.message = t('carouselSearchTabCategoryTextPlaceholder')
             return res
@@ -349,9 +363,9 @@ diyStore.editComponent.verify = (index: number) => {
         // }
     });
 
-    if(diyStore.value[index].swiper.control){
+    if (diyStore.value[index].swiper.control) {
         diyStore.value[index].swiper.list.forEach((item: any) => {
-            if(item.imageUrl == ''){
+            if (item.imageUrl == '') {
                 res.code = false
                 res.message = t('imageUrlTip')
                 return res
@@ -376,7 +390,7 @@ const showSearchStyle = () => {
     selectSearchStyle.value = diyStore.editComponent.search.style;
 }
 
-const changeSearchStyle = (item:any) => {
+const changeSearchStyle = (item: any) => {
     selectSearchStyle.title = item.title;
     selectSearchStyle.value = item.value;
 }
@@ -415,7 +429,8 @@ diyStore.editComponent.swiper.list.forEach((item: any) => {
 })
 
 const activeNames = ref(['tab', 'swiper'])
-const handleChange = (val: string[]) => {}
+const handleChange = (val: string[]) => {
+}
 
 onMounted(() => {
     loadDiyPageList()
@@ -424,11 +439,11 @@ onMounted(() => {
 const addHotWordItem = () => {
     diyStore.editComponent.search.hotWord.list.push({
         id: diyStore.generateRandom(),
-        text : '关键词',
+        text: '关键词',
     })
 }
 
-const tabClear = (index:any) => {
+const tabClear = (index: any) => {
     diyStore.editComponent.tab.list[index].diy_id = 0;
     diyStore.editComponent.tab.list[index].diy_title = '';
 }
@@ -436,10 +451,10 @@ const tabClear = (index:any) => {
 const addTabItem = () => {
     diyStore.editComponent.tab.list.push({
         id: diyStore.generateRandom(),
-        text : '分类名称', // 最多4个字
-        source : 'diy_page', // 数据源类型，微页面：diy_page
-        diy_id : '',
-        diy_title : ''
+        text: '分类名称', // 最多4个字
+        source: 'diy_page', // 数据源类型，微页面：diy_page
+        diy_id: '',
+        diy_title: ''
     })
 }
 
@@ -507,8 +522,7 @@ const diyPageTable = reactive({
     total: 0,
     loading: true,
     data: [],
-    searchParam: {
-    }
+    searchParam: {}
 })
 const diyPageTableRef = ref<InstanceType<typeof ElTable>>()
 
@@ -552,7 +566,7 @@ const loadDiyPageList = (page: number = 1) => {
 }
 
 // 选择微页面
-let currDiyPage:any = {}
+let currDiyPage: any = {}
 let currTabIndexForDiyPage = 0;
 const handleCurrentDiyPageChange = (val: string | any[]) => {
     currDiyPage = val
@@ -564,7 +578,7 @@ const saveDiyPageId = () => {
     diyPageShowDialog.value = false
 }
 
-const diyPageShowDialogOpen = (index:any) => {
+const diyPageShowDialogOpen = (index: any) => {
     diyPageShowDialog.value = true
     currTabIndexForDiyPage = index;
     if (currDiyPage) {
@@ -593,28 +607,28 @@ const addImageAd = () => {
     })
 }
 
-const selectImg = (url:string) => {
+const selectImg = (url: string) => {
     handleHeight(true)
 }
 
-const changeSwiperStyle = (value:any) => {
+const changeSwiperStyle = (value: any) => {
     handleHeight(true)
 }
 
 // 处理高度
-const handleHeight = (isCalcHeight:boolean = false)=> {
+const handleHeight = (isCalcHeight: boolean = false) => {
     diyStore.editComponent.swiper.list.forEach((item: any, index: number) => {
         const image = new Image()
         image.src = img(item.imageUrl)
-        image.onload = async () => {
+        image.onload = async() => {
             item.imgWidth = image.width
             item.imgHeight = image.height
             // 计算第一张图片高度
             if (isCalcHeight && index == 0) {
                 const ratio = item.imgHeight / item.imgWidth
-                if(diyStore.editComponent.swiper.swiperStyle == 'style-1') {
+                if (diyStore.editComponent.swiper.swiperStyle == 'style-1') {
                     item.width = 375 * 0.92 // 0.92：前端缩放比例
-                }else{
+                } else {
                     item.width = 355
                 }
                 item.height = item.width * ratio
@@ -630,12 +644,13 @@ defineExpose({})
 <style lang="scss" scoped></style>
 
 <style lang="scss">
-	.select-diy-page-input .el-input__inner{
-		cursor: pointer;
-	}
-	.collapse-wrap{
-		.el-collapse-item__header{
-			font-size: 16px;
-		}
-	}
+.select-diy-page-input .el-input__inner {
+    cursor: pointer;
+}
+
+.collapse-wrap {
+    .el-collapse-item__header {
+        font-size: 16px;
+    }
+}
 </style>
diff --git a/admin/src/app/views/diy/components/edit-float-btn.vue b/admin/src/app/views/diy/components/edit-float-btn.vue
index 8c224859a..90a5d32f6 100644
--- a/admin/src/app/views/diy/components/edit-float-btn.vue
+++ b/admin/src/app/views/diy/components/edit-float-btn.vue
@@ -1,8 +1,8 @@
 <template>
-	<!-- 内容 -->
-	<div class="content-wrap float-btn" v-show="diyStore.editTab == 'content'">
+    <!-- 内容 -->
+    <div class="content-wrap float-btn" v-show="diyStore.editTab == 'content'">
 
-		<div class="edit-attr-item-wrap">
+        <div class="edit-attr-item-wrap">
             <!-- <h3 class="mb-[10px]">{{ t('selectStyle') }}</h3>
 			<el-form label-width="80px" class="px-[10px]">
 				<el-form-item :label="t('selectStyle')" class="flex">
@@ -28,63 +28,68 @@
                 </template>
 
             </el-dialog> -->
-			<h3 class="mb-[10px]">{{ t('floatBtnButton') }}</h3>
-			<el-form label-width="80px" class="px-[10px]">
-				<el-form-item :label="t('floatBtnButton')">
-					<span>{{ selectTemplate.name }}</span>
+            <h3 class="mb-[10px]">{{ t('floatBtnButton') }}</h3>
+            <el-form label-width="80px" class="px-[10px]">
+                <el-form-item :label="t('floatBtnButton')">
+                    <span>{{ selectTemplate.name }}</span>
                     <ul class="ml-[10px] flex items-center">
                         <template v-for="(item,i) in templateList" :key="i">
-                            <li v-if="diyStore.editComponent.style==='style-1'||(diyStore.editComponent.style==='style-2'&&i>1)" :class="['w-[50px] h-[32px] flex items-center justify-center border-solid  border-[1px] border-[#eee] cursor-pointer', {'border-r-transparent': templateList.length != (i+1)}, (item.className == diyStore.editComponent.bottomPosition) ?  '!border-[var(--el-color-primary)]' : '' ]" @click="changeTemplateList(item)">
+                            <li v-if="diyStore.editComponent.style==='style-1'||(diyStore.editComponent.style==='style-2'&&i>1)"
+                                :class="['w-[50px] h-[32px] flex items-center justify-center border-solid  border-[1px] border-[#eee] cursor-pointer', {'border-r-transparent': templateList.length != (i+1)}, (item.className == diyStore.editComponent.bottomPosition) ?  '!border-[var(--el-color-primary)]' : '' ]"
+                                @click="changeTemplateList(item)">
                                 <span :class="['iconfont !text-[20px]', item.src]"></span>
                             </li>
                         </template>
                     </ul>
-				</el-form-item>
+                </el-form-item>
                 <el-form-item :label="t('floatBtnOffset')">
-					<el-slider v-model="diyStore.editComponent.offset" show-input size="small" class="ml-[10px] diy-nav-slider" :max="100"/>
-				</el-form-item>
+                    <el-slider v-model="diyStore.editComponent.offset" show-input size="small" class="ml-[10px] diy-nav-slider" :max="100" />
+                </el-form-item>
                 <el-form-item :label="t('lateralBtnOffset')">
-					<el-slider v-model="diyStore.editComponent.lateralOffset" show-input size="small" class="ml-[10px] diy-nav-slider" :max="15" :min="-10"/>
-				</el-form-item>
-			</el-form>
-		</div>
-		<div class="edit-attr-item-wrap">
-			<h3 class="mb-[10px]">{{ t('floatBtnImageSet') }}</h3>
-			<el-form label-width="80px" class="px-[10px]">
+                    <el-slider v-model="diyStore.editComponent.lateralOffset" show-input size="small" class="ml-[10px] diy-nav-slider" :max="15" :min="-10" />
+                </el-form-item>
+            </el-form>
+        </div>
+        <div class="edit-attr-item-wrap">
+            <h3 class="mb-[10px]">{{ t('floatBtnImageSet') }}</h3>
+            <el-form label-width="80px" class="px-[10px]">
                 <el-form-item :label="t('floatBtnImageSize')">
-					<el-slider v-model="diyStore.editComponent.imageSize" show-input size="small" class="ml-[10px] diy-nav-slider" :min="30" :max="100"/>
-				</el-form-item>
-				<el-form-item :label="t('floatBtnAroundRadius')">
-					<el-slider v-model="diyStore.editComponent.aroundRadius" show-input size="small" class="ml-[10px] diy-nav-slider" :max="50"/>
-				</el-form-item>
+                    <el-slider v-model="diyStore.editComponent.imageSize" show-input size="small" class="ml-[10px] diy-nav-slider" :min="30" :max="100" />
+                </el-form-item>
+                <el-form-item :label="t('floatBtnAroundRadius')">
+                    <el-slider v-model="diyStore.editComponent.aroundRadius" show-input size="small" class="ml-[10px] diy-nav-slider" :max="50" />
+                </el-form-item>
 
-				<div class="text-[12px] text-[#999] mb-[15px] mt-[5px]">{{t('floatBtnImageSuggest')}}</div>
-				<div ref="imageBoxRef">
-					<div v-for="(item,index) in diyStore.editComponent.list" :key="item.id" class="item-wrap p-[10px] pb-0 relative border border-dashed border-gray-300 mb-[16px]">
-						<el-form-item :label="t('image')">
-							<upload-image v-model="item.imageUrl" :limit="1" />
-						</el-form-item>
+                <div class="text-[12px] text-[#999] mb-[15px] mt-[5px]">{{ t('floatBtnImageSuggest') }}</div>
+                <div ref="imageBoxRef">
+                    <div v-for="(item,index) in diyStore.editComponent.list" :key="item.id"
+                         class="item-wrap p-[10px] pb-0 relative border border-dashed border-gray-300 mb-[16px]">
+                        <el-form-item :label="t('image')">
+                            <upload-image v-model="item.imageUrl" :limit="1" />
+                        </el-form-item>
 
-						<div class="del absolute cursor-pointer z-[2] top-[-8px] right-[-8px]" v-show="diyStore.editComponent.list.length > 1" @click="diyStore.editComponent.list.splice(index,1)">
-							<icon name="element CircleCloseFilled" color="#bbb" size="20px"/>
-						</div>
+                        <div class="del absolute cursor-pointer z-[2] top-[-8px] right-[-8px]"
+                             v-show="diyStore.editComponent.list.length > 1"
+                             @click="diyStore.editComponent.list.splice(index,1)">
+                            <icon name="element CircleCloseFilled" color="#bbb" size="20px" />
+                        </div>
 
-						<el-form-item :label="t('link')">
-							<diy-link v-model="item.link"/>
-						</el-form-item>
-					</div>
-				</div>
-			</el-form>
+                        <el-form-item :label="t('link')">
+                            <diy-link v-model="item.link" />
+                        </el-form-item>
+                    </div>
+                </div>
+            </el-form>
 
             <el-button v-show="diyStore.editComponent.list.length < 3" class="w-full" @click="addImageAd">{{ t('addImageAd') }}</el-button>
-		</div>
-	</div>
+        </div>
+    </div>
 
-	<!-- 样式 -->
-	<div class="style-wrap" v-show="diyStore.editTab == 'style'">
-		<!-- 组件样式 -->
-		<slot name="style"></slot>
-	</div>
+    <!-- 样式 -->
+    <div class="style-wrap" v-show="diyStore.editTab == 'style'">
+        <!-- 组件样式 -->
+        <slot name="style"></slot>
+    </div>
 
 </template>
 
@@ -94,10 +99,10 @@ import { t } from '@/lang'
 import Sortable from 'sortablejs'
 import useDiyStore from '@/stores/modules/diy'
 import { img } from '@/utils/common'
-import { min, range } from 'lodash-es'
+import { range } from 'lodash-es'
 
 const diyStore = useDiyStore()
-diyStore.editComponent.ignore = ['pageBgColor','marginTop','marginBottom','marginBoth','componentBgUrl'] // 忽略公共属性
+diyStore.editComponent.ignore = ['pageBgColor', 'marginTop', 'marginBottom', 'marginBoth', 'componentBgUrl'] // 忽略公共属性
 
 // 组件验证
 diyStore.editComponent.verify = (index: number) => {
@@ -137,7 +142,7 @@ const showCouponStyle = () => {
 //     }
 // ])
 //风格点击
-const changeCouponStyle = (item:any) => {
+const changeCouponStyle = (item: any) => {
     selectCouponStyle.title = item.title;
     selectCouponStyle.value = item.value;
 }
diff --git a/admin/src/app/views/diy/components/edit-graphic-nav.vue b/admin/src/app/views/diy/components/edit-graphic-nav.vue
index b2e8b4d59..635115567 100644
--- a/admin/src/app/views/diy/components/edit-graphic-nav.vue
+++ b/admin/src/app/views/diy/components/edit-graphic-nav.vue
@@ -1,145 +1,150 @@
 <template>
-	<!-- 内容 -->
-	<div class="content-wrap" v-show="diyStore.editTab == 'content'">
-		<div class="edit-attr-item-wrap">
-			<h3 class="mb-[10px]">{{ t('graphicNavModeTitle') }}</h3>
-			<el-form label-width="90px" class="px-[10px]">
+    <!-- 内容 -->
+    <div class="content-wrap" v-show="diyStore.editTab == 'content'">
+        <div class="edit-attr-item-wrap">
+            <h3 class="mb-[10px]">{{ t('graphicNavModeTitle') }}</h3>
+            <el-form label-width="90px" class="px-[10px]">
 
-				<el-form-item :label="t('layoutMode')">
-					<el-radio-group v-model="diyStore.editComponent.layout">
-						<el-radio :label="'horizontal'">{{t('layoutModeHorizontal')}}</el-radio>
-						<el-radio :label="'vertical'">{{t('layoutModeVertical')}}</el-radio>
-					</el-radio-group>
-				</el-form-item>
+                <el-form-item :label="t('layoutMode')">
+                    <el-radio-group v-model="diyStore.editComponent.layout">
+                        <el-radio :label="'horizontal'">{{ t('layoutModeHorizontal') }}</el-radio>
+                        <el-radio :label="'vertical'">{{ t('layoutModeVertical') }}</el-radio>
+                    </el-radio-group>
+                </el-form-item>
 
-				<el-form-item :label="t('graphicNavSelectMode')">
-					<el-radio-group v-model="diyStore.editComponent.mode">
-						<el-radio :label="'graphic'">{{t('graphicNavModeGraphic')}}</el-radio>
-						<el-radio :label="'img'">{{t('graphicNavModeImg')}}</el-radio>
-						<el-radio :label="'text'">{{t('graphicNavModeText')}}</el-radio>
-					</el-radio-group>
-				</el-form-item>
+                <el-form-item :label="t('graphicNavSelectMode')">
+                    <el-radio-group v-model="diyStore.editComponent.mode">
+                        <el-radio :label="'graphic'">{{ t('graphicNavModeGraphic') }}</el-radio>
+                        <el-radio :label="'img'">{{ t('graphicNavModeImg') }}</el-radio>
+                        <el-radio :label="'text'">{{ t('graphicNavModeText') }}</el-radio>
+                    </el-radio-group>
+                </el-form-item>
 
-				<view v-show="diyStore.editComponent.layout == 'horizontal'">
+                <view v-show="diyStore.editComponent.layout == 'horizontal'">
 
-					<el-form-item :label="t('graphicNavPageCount')">
-						<el-radio-group v-model="diyStore.editComponent.pageCount" @change="changePageCount">
-							<el-radio :label="1">{{t('singleLine')}}</el-radio>
-							<el-radio :label="2">{{t('multiline')}}</el-radio>
-						</el-radio-group>
-					</el-form-item>
+                    <el-form-item :label="t('graphicNavPageCount')">
+                        <el-radio-group v-model="diyStore.editComponent.pageCount" @change="changePageCount">
+                            <el-radio :label="1">{{ t('singleLine') }}</el-radio>
+                            <el-radio :label="2">{{ t('multiline') }}</el-radio>
+                        </el-radio-group>
+                    </el-form-item>
 
-					<el-form-item :label="t('graphicNavShowStyle')">
-						<el-radio-group v-model="diyStore.editComponent.showStyle" @change="changeShowStyle">
-							<el-radio :label="'fixed'">{{t('graphicNavStyleFixed')}}</el-radio>
-							<el-radio :label="'singleSlide'">{{diyStore.editComponent.pageCount == 2 ? t('graphicNavStyleMultiLine') : t('graphicNavStyleSingleSlide')}}</el-radio>
-							<el-radio :label="'pageSlide'">{{t('graphicNavStylePageSlide')}}</el-radio>
-						</el-radio-group>
-					</el-form-item>
+                    <el-form-item :label="t('graphicNavShowStyle')">
+                        <el-radio-group v-model="diyStore.editComponent.showStyle" @change="changeShowStyle">
+                            <el-radio :label="'fixed'">{{ t('graphicNavStyleFixed') }}</el-radio>
+                            <el-radio :label="'singleSlide'">{{ diyStore.editComponent.pageCount == 2 ? t('graphicNavStyleMultiLine') : t('graphicNavStyleSingleSlide') }}</el-radio>
+                            <el-radio :label="'pageSlide'">{{ t('graphicNavStylePageSlide') }}</el-radio>
+                        </el-radio-group>
+                    </el-form-item>
 
-					<el-form-item :label="t('graphicNavRowCount')">
-						<el-radio-group v-model="diyStore.editComponent.rowCount">
-							<el-radio :label="3">3{{t('piece')}}</el-radio>
-							<el-radio :label="4">4{{t('piece')}}</el-radio>
-							<el-radio :label="5">5{{t('piece')}}</el-radio>
-						</el-radio-group>
-					</el-form-item>
-				</view>
-			</el-form>
-		</div>
-		<div class="edit-attr-item-wrap">
-			<h3 class="mb-[10px]">{{ t('graphicNavSetLabel') }}</h3>
-			<el-form label-width="90px" class="px-[10px]">
+                    <el-form-item :label="t('graphicNavRowCount')">
+                        <el-radio-group v-model="diyStore.editComponent.rowCount">
+                            <el-radio :label="3">3{{ t('piece') }}</el-radio>
+                            <el-radio :label="4">4{{ t('piece') }}</el-radio>
+                            <el-radio :label="5">5{{ t('piece') }}</el-radio>
+                        </el-radio-group>
+                    </el-form-item>
+                </view>
+            </el-form>
+        </div>
+        <div class="edit-attr-item-wrap">
+            <h3 class="mb-[10px]">{{ t('graphicNavSetLabel') }}</h3>
+            <el-form label-width="90px" class="px-[10px]">
 
-				<p class="text-sm text-gray-400 mb-[10px]">{{ t('graphicNavTips') }}</p>
+                <p class="text-sm text-gray-400 mb-[10px]">{{ t('graphicNavTips') }}</p>
 
-				<div ref="imageBoxRef">
-					<div v-for="(item,index) in diyStore.editComponent.list" :key="item.id" class="item-wrap p-[10px] pb-0 relative border border-dashed border-gray-300 mb-[16px]">
-						<el-form-item :label="t('image')" v-show="diyStore.editComponent.mode === 'graphic' || diyStore.editComponent.mode === 'img'">
-							<upload-image v-model="item.imageUrl" :limit="1"/>
-						</el-form-item>
+                <div ref="imageBoxRef">
+                    <div v-for="(item,index) in diyStore.editComponent.list" :key="item.id"
+                         class="item-wrap p-[10px] pb-0 relative border border-dashed border-gray-300 mb-[16px]">
+                        <el-form-item :label="t('image')" v-show="diyStore.editComponent.mode === 'graphic' || diyStore.editComponent.mode === 'img'">
+                            <upload-image v-model="item.imageUrl" :limit="1" />
+                        </el-form-item>
 
-						<el-form-item :label="t('graphicNavTitle')" v-show="diyStore.editComponent.mode === 'graphic' || diyStore.editComponent.mode === 'text'">
-							<el-input v-model.trim="item.title" :placeholder="t('graphicNavTitlePlaceholder')" clearable maxlength="20" show-word-limit/>
-						</el-form-item>
+                        <el-form-item :label="t('graphicNavTitle')" v-show="diyStore.editComponent.mode === 'graphic' || diyStore.editComponent.mode === 'text'">
+                            <el-input v-model.trim="item.title" :placeholder="t('graphicNavTitlePlaceholder')" clearable maxlength="20" show-word-limit />
+                        </el-form-item>
 
-						<div class="del absolute cursor-pointer z-[2] top-[-8px] right-[-8px]" v-show="diyStore.editComponent.list.length > 1" @click="diyStore.editComponent.list.splice(index,1)">
-							<icon name="element CircleCloseFilled" color="#bbb" size="20px"/>
-						</div>
+                        <div class="del absolute cursor-pointer z-[2] top-[-8px] right-[-8px]"
+                             v-show="diyStore.editComponent.list.length > 1"
+                             @click="diyStore.editComponent.list.splice(index,1)">
+                            <icon name="element CircleCloseFilled" color="#bbb" size="20px" />
+                        </div>
 
-						<el-form-item :label="t('link')">
-							<diy-link v-model="item.link"/>
-						</el-form-item>
-					</div>
-				</div>
+                        <el-form-item :label="t('link')">
+                            <diy-link v-model="item.link" />
+                        </el-form-item>
+                    </div>
+                </div>
 
-				<el-button v-show="diyStore.editComponent.list.length < 50" class="w-full" @click="addGraphicNav">{{ t('addGraphicNav') }}</el-button>
+                <el-button v-show="diyStore.editComponent.list.length < 50" class="w-full" @click="addGraphicNav">
+                    {{ t('addGraphicNav') }}
+                </el-button>
 
-			</el-form>
-		</div>
-	</div>
+            </el-form>
+        </div>
+    </div>
 
-	<!-- 样式 -->
-	<div class="style-wrap" v-show="diyStore.editTab == 'style'">
-		<div class="edit-attr-item-wrap" v-show="['graphic','img'].includes(diyStore.editComponent.mode)">
-			<h3 class="mb-[10px]">{{ t('graphicNavImageSet') }}</h3>
-			<el-form label-width="90px" class="px-[10px]">
-				<el-form-item :label="t('graphicNavImageSize')">
-					<el-slider v-model="diyStore.editComponent.imageSize" show-input size="small" class="ml-[10px] diy-nav-slider" :min="20" :max="60"/>
-				</el-form-item>
-				<el-form-item :label="t('graphicNavAroundRadius')">
-					<el-slider v-model="diyStore.editComponent.aroundRadius" show-input size="small" class="ml-[10px] diy-nav-slider" :max="50"/>
-				</el-form-item>
-			</el-form>
-		</div>
-		<div class="edit-attr-item-wrap" v-show="['graphic','text'].includes(diyStore.editComponent.mode)">
-			<h3 class="mb-[10px]">{{ t('textSet') }}</h3>
-			<el-form label-width="90px" class="px-[10px]">
-				<el-form-item :label="t('textFontSize')">
-					<el-slider v-model="diyStore.editComponent.font.size" show-input size="small" class="ml-[10px] diy-nav-slider" :min="12" :max="16"/>
-				</el-form-item>
-				<el-form-item :label="t('textFontWeight')">
-					<el-radio-group v-model="diyStore.editComponent.font.weight">
-						<el-radio :label="'normal'">{{t('fontWeightNormal')}}</el-radio>
-						<el-radio :label="'bold'">{{t('fontWeightBold')}}</el-radio>
-					</el-radio-group>
-				</el-form-item>
-				<el-form-item :label="t('textColor')">
-					<el-color-picker v-model="diyStore.editComponent.font.color" show-alpha :predefine="diyStore.predefineColors"/>
-				</el-form-item>
+    <!-- 样式 -->
+    <div class="style-wrap" v-show="diyStore.editTab == 'style'">
+        <div class="edit-attr-item-wrap" v-show="['graphic','img'].includes(diyStore.editComponent.mode)">
+            <h3 class="mb-[10px]">{{ t('graphicNavImageSet') }}</h3>
+            <el-form label-width="90px" class="px-[10px]">
+                <el-form-item :label="t('graphicNavImageSize')">
+                    <el-slider v-model="diyStore.editComponent.imageSize" show-input size="small" class="ml-[10px] diy-nav-slider" :min="20" :max="60" />
+                </el-form-item>
+                <el-form-item :label="t('graphicNavAroundRadius')">
+                    <el-slider v-model="diyStore.editComponent.aroundRadius" show-input size="small" class="ml-[10px] diy-nav-slider" :max="50" />
+                </el-form-item>
+            </el-form>
+        </div>
+        <div class="edit-attr-item-wrap" v-show="['graphic','text'].includes(diyStore.editComponent.mode)">
+            <h3 class="mb-[10px]">{{ t('textSet') }}</h3>
+            <el-form label-width="90px" class="px-[10px]">
+                <el-form-item :label="t('textFontSize')">
+                    <el-slider v-model="diyStore.editComponent.font.size" show-input size="small" class="ml-[10px] diy-nav-slider" :min="12" :max="16" />
+                </el-form-item>
+                <el-form-item :label="t('textFontWeight')">
+                    <el-radio-group v-model="diyStore.editComponent.font.weight">
+                        <el-radio :label="'normal'">{{ t('fontWeightNormal') }}</el-radio>
+                        <el-radio :label="'bold'">{{ t('fontWeightBold') }}</el-radio>
+                    </el-radio-group>
+                </el-form-item>
+                <el-form-item :label="t('textColor')">
+                    <el-color-picker v-model="diyStore.editComponent.font.color" show-alpha :predefine="diyStore.predefineColors" />
+                </el-form-item>
 
-			</el-form>
-		</div>
-		<div class="edit-attr-item-wrap" v-show="diyStore.editComponent.showStyle == 'pageSlide' && diyStore.editComponent.layout == 'horizontal'">
-			<h3 class="mb-[10px]">{{ t('carouselSearchSwiperIndicatorSet') }}</h3>
-			<el-form label-width="100px" class="px-[10px]">
-				<el-form-item :label="t('carouselSearchSwiperIndicatorStyle')"> 
-					<el-radio-group v-model="diyStore.editComponent.swiper.indicatorStyle">
-						<el-radio label="style-1">{{ t('carouselSearchSwiperIndicatorStyle1') }}</el-radio>
-						<el-radio label="style-2">{{ t('carouselSearchSwiperIndicatorStyle2') }}</el-radio>
-						<el-radio label="style-3">{{ t('carouselSearchSwiperIndicatorStyle3') }}</el-radio>
-					</el-radio-group>
-				</el-form-item>
-				<el-form-item :label="t('carouselSearchSwiperIndicatorAlign')">
-					<el-radio-group v-model="diyStore.editComponent.swiper.indicatorAlign">
-						<el-radio label="left">{{ t('alignLeft') }}</el-radio>
-						<el-radio label="center">{{ t('alignCenter') }}</el-radio>
-						<el-radio label="right">{{ t('alignRight') }}</el-radio>
-					</el-radio-group>
-				</el-form-item>
-				<el-form-item :label="t('noColor')">
-					<el-color-picker v-model="diyStore.editComponent.swiper.indicatorColor" show-alpha :predefine="diyStore.predefineColors"/>
-				</el-form-item>
-				<el-form-item :label="t('selectColor')">
-					<el-color-picker v-model="diyStore.editComponent.swiper.indicatorActiveColor" show-alpha :predefine="diyStore.predefineColors"/>
-				</el-form-item>
-			</el-form>
-		</div>
+            </el-form>
+        </div>
+        <div class="edit-attr-item-wrap" v-show="diyStore.editComponent.showStyle == 'pageSlide' && diyStore.editComponent.layout == 'horizontal'">
+            <h3 class="mb-[10px]">{{ t('carouselSearchSwiperIndicatorSet') }}</h3>
+            <el-form label-width="100px" class="px-[10px]">
+                <el-form-item :label="t('carouselSearchSwiperIndicatorStyle')">
+                    <el-radio-group v-model="diyStore.editComponent.swiper.indicatorStyle">
+                        <el-radio label="style-1">{{ t('carouselSearchSwiperIndicatorStyle1') }}</el-radio>
+                        <el-radio label="style-2">{{ t('carouselSearchSwiperIndicatorStyle2') }}</el-radio>
+                        <el-radio label="style-3">{{ t('carouselSearchSwiperIndicatorStyle3') }}</el-radio>
+                    </el-radio-group>
+                </el-form-item>
+                <el-form-item :label="t('carouselSearchSwiperIndicatorAlign')">
+                    <el-radio-group v-model="diyStore.editComponent.swiper.indicatorAlign">
+                        <el-radio label="left">{{ t('alignLeft') }}</el-radio>
+                        <el-radio label="center">{{ t('alignCenter') }}</el-radio>
+                        <el-radio label="right">{{ t('alignRight') }}</el-radio>
+                    </el-radio-group>
+                </el-form-item>
+                <el-form-item :label="t('noColor')">
+                    <el-color-picker v-model="diyStore.editComponent.swiper.indicatorColor" show-alpha :predefine="diyStore.predefineColors" />
+                </el-form-item>
+                <el-form-item :label="t('selectColor')">
+                    <el-color-picker v-model="diyStore.editComponent.swiper.indicatorActiveColor" show-alpha :predefine="diyStore.predefineColors" />
+                </el-form-item>
+            </el-form>
+        </div>
 
-		<!-- 组件样式 -->
-		<slot name="style"></slot>
+        <!-- 组件样式 -->
+        <slot name="style"></slot>
 
-	</div>
+    </div>
 
 </template>
 
@@ -184,7 +189,7 @@ watch(
         diyStore.editComponent.list.forEach((item: any) => {
             const image = new Image()
             image.src = img(item.imageUrl)
-            image.onload = async () => {
+            image.onload = async() => {
                 item.imgWidth = image.width
                 item.imgHeight = image.height
             }
@@ -232,31 +237,31 @@ onMounted(() => {
     })
 })
 
-const changePageCount = (value:any)=>{
-    if(value == '1'){
+const changePageCount = (value: any) => {
+    if (value == '1') {
         diyStore.editComponent.showStyle = 'singleSlide';
-    }else if(value == '2'){
+    } else if (value == '2') {
         diyStore.editComponent.showStyle = 'fixed';
     }
-}	
+}
 
 defineExpose({})
 
 </script>
 
 <style lang="scss" scoped>
-	.edit-graphic-nav {
+.edit-graphic-nav {
 
-		.item-wrap {
-			.del {
-				display: none;
-			}
+    .item-wrap {
+        .del {
+            display: none;
+        }
 
-			&:hover {
-				.del {
-					display: block;
-				}
-			}
-		}
-	}
+        &:hover {
+            .del {
+                display: block;
+            }
+        }
+    }
+}
 </style>
diff --git a/admin/src/app/views/diy/components/edit-horz-blank.vue b/admin/src/app/views/diy/components/edit-horz-blank.vue
index 4175b4483..4d0b631f2 100644
--- a/admin/src/app/views/diy/components/edit-horz-blank.vue
+++ b/admin/src/app/views/diy/components/edit-horz-blank.vue
@@ -1,22 +1,22 @@
 <template>
-	<!-- 内容 -->
-	<div class="content-wrap" v-show="diyStore.editTab == 'content'">
-		<div class="edit-attr-item-wrap">
-			<h3 class="mb-[10px]">{{ t('blankHeightSet') }}</h3>
-			<el-form label-width="80px" class="px-[10px]">
-				<el-form-item :label="t('blankHeight')">
-					<el-slider v-model="diyStore.editComponent.height" show-input size="small" max="200" class="ml-[10px] diy-nav-slider"/>
-				</el-form-item>
-			</el-form>
-		</div>
-	</div>
+    <!-- 内容 -->
+    <div class="content-wrap" v-show="diyStore.editTab == 'content'">
+        <div class="edit-attr-item-wrap">
+            <h3 class="mb-[10px]">{{ t('blankHeightSet') }}</h3>
+            <el-form label-width="80px" class="px-[10px]">
+                <el-form-item :label="t('blankHeight')">
+                    <el-slider v-model="diyStore.editComponent.height" show-input size="small" max="200" class="ml-[10px] diy-nav-slider" />
+                </el-form-item>
+            </el-form>
+        </div>
+    </div>
 
-	<!-- 样式 -->
-	<div class="style-wrap" v-show="diyStore.editTab == 'style'">
+    <!-- 样式 -->
+    <div class="style-wrap" v-show="diyStore.editTab == 'style'">
 
-		<!-- 组件样式 -->
-		<slot name="style"></slot>
-	</div>
+        <!-- 组件样式 -->
+        <slot name="style"></slot>
+    </div>
 
 </template>
 
diff --git a/admin/src/app/views/diy/components/edit-horz-line.vue b/admin/src/app/views/diy/components/edit-horz-line.vue
index 232d4ee31..78175d67f 100644
--- a/admin/src/app/views/diy/components/edit-horz-line.vue
+++ b/admin/src/app/views/diy/components/edit-horz-line.vue
@@ -1,31 +1,32 @@
 <template>
-	<!-- 内容 -->
-	<div class="content-wrap" v-show="diyStore.editTab == 'content'">
-		<div class="edit-attr-item-wrap">
-			<h3 class="mb-[10px]">{{ t('horzLineStyle') }}</h3>
-			<el-form label-width="80px" class="px-[10px]">
-				<el-form-item :label="t('styleLabel')">
-					<el-radio-group v-model="diyStore.editComponent.borderStyle">
-						<el-radio label="solid">{{ t('horzLineStyleSolid') }}</el-radio>
-						<el-radio label="dashed">{{ t('horzLineStyleDashed') }}</el-radio>
-					</el-radio-group>
-				</el-form-item>
-				<el-form-item :label="t('horzLineBorderColor')">
-					<el-color-picker v-model="diyStore.editComponent.borderColor" show-alpha :predefine="diyStore.predefineColors"/>
-				</el-form-item>
-				<el-form-item :label="t('horzLineBorderWidth')">
-					<el-slider v-model="diyStore.editComponent.borderWidth" show-input size="small" class="ml-[10px] diy-nav-slider" :min="1" :max="10"/>
-				</el-form-item>
-			</el-form>
-		</div>
-	</div>
+    <!-- 内容 -->
+    <div class="content-wrap" v-show="diyStore.editTab == 'content'">
+        <div class="edit-attr-item-wrap">
+            <h3 class="mb-[10px]">{{ t('horzLineStyle') }}</h3>
+            <el-form label-width="80px" class="px-[10px]">
+                <el-form-item :label="t('styleLabel')">
+                    <el-radio-group v-model="diyStore.editComponent.borderStyle">
+                        <el-radio label="solid">{{ t('horzLineStyleSolid') }}</el-radio>
+                        <el-radio label="dashed">{{ t('horzLineStyleDashed') }}</el-radio>
+                    </el-radio-group>
+                </el-form-item>
+                <el-form-item :label="t('horzLineBorderColor')">
+                    <el-color-picker v-model="diyStore.editComponent.borderColor" show-alpha :predefine="diyStore.predefineColors" />
+                </el-form-item>
+                <el-form-item :label="t('horzLineBorderWidth')">
+                    <el-slider v-model="diyStore.editComponent.borderWidth" show-input size="small"
+                               class="ml-[10px] diy-nav-slider" :min="1" :max="10" />
+                </el-form-item>
+            </el-form>
+        </div>
+    </div>
 
-	<!-- 样式 -->
-	<div class="style-wrap" v-show="diyStore.editTab == 'style'">
+    <!-- 样式 -->
+    <div class="style-wrap" v-show="diyStore.editTab == 'style'">
 
-		<!-- 组件样式 -->
-		<slot name="style"></slot>
-	</div>
+        <!-- 组件样式 -->
+        <slot name="style"></slot>
+    </div>
 
 </template>
 
@@ -34,7 +35,7 @@ import { t } from '@/lang'
 import useDiyStore from '@/stores/modules/diy'
 
 const diyStore = useDiyStore()
-diyStore.editComponent.ignore = ['pageBgColor','componentBgColor', 'componentBgUrl', 'topRounded', 'bottomRounded'] // 忽略公共属性
+diyStore.editComponent.ignore = ['pageBgColor', 'componentBgColor', 'componentBgUrl', 'topRounded', 'bottomRounded'] // 忽略公共属性
 
 defineExpose({})
 
diff --git a/admin/src/app/views/diy/components/edit-hot-area.vue b/admin/src/app/views/diy/components/edit-hot-area.vue
index dddb56388..2a509e8a2 100644
--- a/admin/src/app/views/diy/components/edit-hot-area.vue
+++ b/admin/src/app/views/diy/components/edit-hot-area.vue
@@ -1,34 +1,34 @@
 <template>
-	<!-- 内容 -->
-	<div class="content-wrap" v-show="diyStore.editTab == 'content'">
+    <!-- 内容 -->
+    <div class="content-wrap" v-show="diyStore.editTab == 'content'">
 
-		<div class="edit-attr-item-wrap">
-			<h3 class="mb-[10px]">{{ t('hotAreaSet') }}</h3>
-			<el-form label-width="80px" class="px-[10px]">
+        <div class="edit-attr-item-wrap">
+            <h3 class="mb-[10px]">{{ t('hotAreaSet') }}</h3>
+            <el-form label-width="80px" class="px-[10px]">
 
-				<div ref="imageBoxRef">
-					<div class="item-wrap p-[10px] pb-0 relative border border-dashed border-gray-300 mb-[16px]">
-						<el-form-item :label="t('hotAreaBackground')">
-							<upload-image v-model="diyStore.editComponent.imageUrl" :limit="1" @change="selectImg"/>
-						</el-form-item>
+                <div ref="imageBoxRef">
+                    <div class="item-wrap p-[10px] pb-0 relative border border-dashed border-gray-300 mb-[16px]">
+                        <el-form-item :label="t('hotAreaBackground')">
+                            <upload-image v-model="diyStore.editComponent.imageUrl" :limit="1" @change="selectImg" />
+                        </el-form-item>
 
-						<el-form-item :label="t('hotAreaSet')">
-							<heat-map v-model="diyStore.editComponent"/>
-						</el-form-item>
-					</div>
-				</div>
+                        <el-form-item :label="t('hotAreaSet')">
+                            <heat-map v-model="diyStore.editComponent" />
+                        </el-form-item>
+                    </div>
+                </div>
 
-			</el-form>
-		</div>
+            </el-form>
+        </div>
 
-	</div>
+    </div>
 
-	<!-- 样式 -->
-	<div class="style-wrap" v-show="diyStore.editTab == 'style'">
+    <!-- 样式 -->
+    <div class="style-wrap" v-show="diyStore.editTab == 'style'">
 
-		<!-- 组件样式 -->
-		<slot name="style"></slot>
-	</div>
+        <!-- 组件样式 -->
+        <slot name="style"></slot>
+    </div>
 
 </template>
 
@@ -59,7 +59,7 @@ const selectImg = (url: string) => {
 const handleHeight = () => {
     const image = new Image()
     image.src = img(diyStore.editComponent.imageUrl)
-    image.onload = async () => {
+    image.onload = async() => {
         diyStore.editComponent.imgWidth = image.width
         diyStore.editComponent.imgHeight = image.height
     }
diff --git a/admin/src/app/views/diy/components/edit-image-ads.vue b/admin/src/app/views/diy/components/edit-image-ads.vue
index d7272e98e..7fd5a878c 100644
--- a/admin/src/app/views/diy/components/edit-image-ads.vue
+++ b/admin/src/app/views/diy/components/edit-image-ads.vue
@@ -1,50 +1,54 @@
 <template>
-	<!-- 内容 -->
-	<div class="content-wrap" v-show="diyStore.editTab == 'content'">
-		<div class="edit-attr-item-wrap">
-			<h3 class="mb-[10px]">{{ t('imageSet') }}</h3>
-			<el-form label-width="80px" class="px-[10px]">
-                
-				<el-form-item :label="t('sameScreen')" v-if="diyStore.currentIndex == 0">
+    <!-- 内容 -->
+    <div class="content-wrap" v-show="diyStore.editTab == 'content'">
+        <div class="edit-attr-item-wrap">
+            <h3 class="mb-[10px]">{{ t('imageSet') }}</h3>
+            <el-form label-width="80px" class="px-[10px]">
+
+                <el-form-item :label="t('sameScreen')" v-if="diyStore.currentIndex == 0">
                     <el-switch v-model="diyStore.editComponent.isSameScreen" />
                     <div class="text-sm text-gray-400 leading-[1.4]">{{ t('imageAdsSameScreenTips') }}</div>
-				</el-form-item>
+                </el-form-item>
 
-				<el-form-item :label="t('imageHeight')" class="display-block">
-					<el-input v-model.trim="diyStore.editComponent.imageHeight" :placeholder="t('imageHeightPlaceholder')" clearable maxlength="10" @blur="blurImageHeight">
-						<template #append>px</template>
-					</el-input>
-					<div class="text-sm text-gray-400 mb-[10px]">{{ t('imageAdsTips') }}</div>
-				</el-form-item>
+                <el-form-item :label="t('imageHeight')" class="display-block">
+                    <el-input v-model.trim="diyStore.editComponent.imageHeight" :placeholder="t('imageHeightPlaceholder')" clearable maxlength="10" @blur="blurImageHeight">
+                        <template #append>px</template>
+                    </el-input>
+                    <div class="text-sm text-gray-400 mb-[10px]">{{ t('imageAdsTips') }}</div>
+                </el-form-item>
 
-				<div ref="imageBoxRef">
-					<div v-for="(item,index) in diyStore.editComponent.list" :key="item.id" class="item-wrap p-[10px] pb-0 relative border border-dashed border-gray-300 mb-[16px]">
-						<el-form-item :label="t('image')">
-							<upload-image v-model="item.imageUrl" :limit="1" @change="selectImg" />
-						</el-form-item>
+                <div ref="imageBoxRef">
+                    <div v-for="(item,index) in diyStore.editComponent.list" :key="item.id" class="item-wrap p-[10px] pb-0 relative border border-dashed border-gray-300 mb-[16px]">
+                        <el-form-item :label="t('image')">
+                            <upload-image v-model="item.imageUrl" :limit="1" @change="selectImg" />
+                        </el-form-item>
 
-						<div class="del absolute cursor-pointer z-[2] top-[-8px] right-[-8px]" v-show="diyStore.editComponent.list.length > 1" @click="diyStore.editComponent.list.splice(index,1)">
-							<icon name="element CircleCloseFilled" color="#bbb" size="20px"/>
-						</div>
+                        <div class="del absolute cursor-pointer z-[2] top-[-8px] right-[-8px]"
+                             v-show="diyStore.editComponent.list.length > 1"
+                             @click="diyStore.editComponent.list.splice(index,1)">
+                            <icon name="element CircleCloseFilled" color="#bbb" size="20px" />
+                        </div>
 
-						<el-form-item :label="t('link')">
-							<diy-link v-model="item.link"/>
-						</el-form-item>
-					</div>
-				</div>
+                        <el-form-item :label="t('link')">
+                            <diy-link v-model="item.link" />
+                        </el-form-item>
+                    </div>
+                </div>
 
-				<el-button v-show="diyStore.editComponent.list.length < 10" class="w-full" @click="addImageAd">{{ t('addImageAd') }}</el-button>
+                <el-button v-show="diyStore.editComponent.list.length < 10" class="w-full" @click="addImageAd">
+                    {{ t('addImageAd') }}
+                </el-button>
 
-			</el-form>
-		</div>
-	</div>
+            </el-form>
+        </div>
+    </div>
 
-	<!-- 样式 -->
-	<div class="style-wrap" v-show="diyStore.editTab == 'style'">
+    <!-- 样式 -->
+    <div class="style-wrap" v-show="diyStore.editTab == 'style'">
 
-		<!-- 组件样式 -->
-		<slot name="style"></slot>
-	</div>
+        <!-- 组件样式 -->
+        <slot name="style"></slot>
+    </div>
 
 </template>
 
@@ -105,22 +109,22 @@ const addImageAd = () => {
     })
 }
 
-const selectImg = (url:string) => {
+const selectImg = (url: string) => {
     handleHeight(true)
 }
 
 // 处理高度
-const handleHeight = (isCalcHeight:boolean = false)=> {
+const handleHeight = (isCalcHeight: boolean = false) => {
     diyStore.editComponent.list.forEach((item: any, index: number) => {
         const image = new Image()
         image.src = img(item.imageUrl)
-        image.onload = async () => {
+        image.onload = async() => {
             item.imgWidth = image.width
             item.imgHeight = image.height
             // 计算第一张图片高度
             if (isCalcHeight && index == 0) {
                 const ratio = item.imgHeight / item.imgWidth
-                item.width = 375 - (diyStore.editComponent.margin.both*2)
+                item.width = 375 - (diyStore.editComponent.margin.both * 2)
                 item.height = item.width * ratio
                 diyStore.editComponent.imageHeight = parseInt(item.height)
             }
@@ -158,18 +162,18 @@ defineExpose({})
 </script>
 
 <style lang="scss" scoped>
-	.edit-image-ads {
+.edit-image-ads {
 
-		.item-wrap {
-			.del {
-				display: none;
-			}
+    .item-wrap {
+        .del {
+            display: none;
+        }
 
-			&:hover {
-				.del {
-					display: block;
-				}
-			}
-		}
-	}
+        &:hover {
+            .del {
+                display: block;
+            }
+        }
+    }
+}
 </style>
diff --git a/admin/src/app/views/diy/components/edit-member-info.vue b/admin/src/app/views/diy/components/edit-member-info.vue
index 8bff4235b..f1e0dda96 100644
--- a/admin/src/app/views/diy/components/edit-member-info.vue
+++ b/admin/src/app/views/diy/components/edit-member-info.vue
@@ -1,30 +1,30 @@
 <template>
-	<!-- 内容 -->
-	<div class="content-wrap" v-show="diyStore.editTab == 'content'">
-		<div class="edit-attr-item-wrap">
-			<h3 class="mb-[10px]">{{ t('memberStyle') }}</h3>
-			<el-form label-width="80px" class="px-[10px]">
-				<el-form-item :label="t('bgUrl')">
-					<upload-image v-model="diyStore.editComponent.bgUrl" :limit="1"/>
-				</el-form-item>
-			</el-form>
-		</div>
-	</div>
+    <!-- 内容 -->
+    <div class="content-wrap" v-show="diyStore.editTab == 'content'">
+        <div class="edit-attr-item-wrap">
+            <h3 class="mb-[10px]">{{ t('memberStyle') }}</h3>
+            <el-form label-width="80px" class="px-[10px]">
+                <el-form-item :label="t('bgUrl')">
+                    <upload-image v-model="diyStore.editComponent.bgUrl" :limit="1" />
+                </el-form-item>
+            </el-form>
+        </div>
+    </div>
 
-	<!-- 样式 -->
-	<div class="style-wrap" v-show="diyStore.editTab == 'style'">
-		<div class="edit-attr-item-wrap">
-			<h3 class="mb-[10px]">{{ t('memberStyle') }}</h3>
-			<el-form label-width="80px" class="px-[10px]">
-				<el-form-item :label="t('textColor')">
-					<el-color-picker v-model="diyStore.editComponent.textColor"/>
-				</el-form-item>
-			</el-form>
-		</div>
+    <!-- 样式 -->
+    <div class="style-wrap" v-show="diyStore.editTab == 'style'">
+        <div class="edit-attr-item-wrap">
+            <h3 class="mb-[10px]">{{ t('memberStyle') }}</h3>
+            <el-form label-width="80px" class="px-[10px]">
+                <el-form-item :label="t('textColor')">
+                    <el-color-picker v-model="diyStore.editComponent.textColor" />
+                </el-form-item>
+            </el-form>
+        </div>
 
-		<!-- 组件样式 -->
-		<slot name="style"></slot>
-	</div>
+        <!-- 组件样式 -->
+        <slot name="style"></slot>
+    </div>
 </template>
 
 <script lang="ts" setup>
diff --git a/admin/src/app/views/diy/components/edit-member-level.vue b/admin/src/app/views/diy/components/edit-member-level.vue
index 7346de754..0b758ca43 100644
--- a/admin/src/app/views/diy/components/edit-member-level.vue
+++ b/admin/src/app/views/diy/components/edit-member-level.vue
@@ -1,46 +1,49 @@
-
 <template>
-	<!-- 内容 -->
-	<div class="content-wrap" v-show="diyStore.editTab == 'content'">
-		<div class="edit-attr-item-wrap">
-			<h3 class="mb-[10px]">{{ t('selectStyle') }}</h3>
-			<el-form label-width="80px" class="px-[10px]">
-				<el-form-item :label="t('selectStyle')" class="flex">
-					<span class="text-primary flex-1 cursor-pointer" @click="showStyle">{{ diyStore.editComponent.styleName }}</span>
-					<el-icon>
-						<ArrowRight />
-					</el-icon>
-				</el-form-item>
-			</el-form>
+    <!-- 内容 -->
+    <div class="content-wrap" v-show="diyStore.editTab == 'content'">
+        <div class="edit-attr-item-wrap">
+            <h3 class="mb-[10px]">{{ t('selectStyle') }}</h3>
+            <el-form label-width="80px" class="px-[10px]">
+                <el-form-item :label="t('selectStyle')" class="flex">
+                    <span class="text-primary flex-1 cursor-pointer"
+                          @click="showStyle">{{ diyStore.editComponent.styleName }}</span>
+                    <el-icon>
+                        <ArrowRight />
+                    </el-icon>
+                </el-form-item>
+            </el-form>
 
-			<el-dialog v-model="showDialog" :title="t('selectStyle')" width="660px">
+            <el-dialog v-model="showDialog" :title="t('selectStyle')" width="660px">
 
-				<div class="flex flex-wrap">
-					<template v-for="(item,index) in styleList" :key="index">
-						<div :class="{ 'border-primary': selectStyle.value == item.value, '!mr-[0]': [(index+1)%3] == 0 }" @click="changeStyle(item)" class="flex my-[5px] items-center justify-center overflow-hidden w-[200px] h-[100px] mr-[12px] cursor-pointer border bg-gray-50">
-							<img :src="img(item.url)" />
-						</div>
-					</template>
-				</div>
+                <div class="flex flex-wrap">
+                    <template v-for="(item,index) in styleList" :key="index">
+                        <div
+                            :class="{ 'border-primary': selectStyle.value == item.value, '!mr-[0]': [(index+1)%3] == 0 }"
+                            @click="changeStyle(item)"
+                            class="flex my-[5px] items-center justify-center overflow-hidden w-[200px] h-[100px] mr-[12px] cursor-pointer border bg-gray-50">
+                            <img :src="img(item.url)" />
+                        </div>
+                    </template>
+                </div>
 
-				<template #footer>
-					<span class="dialog-footer">
-						<el-button @click="showDialog = false">{{ t('cancel') }}</el-button>
-						<el-button type="primary" @click="confirmStyle">{{ t('confirm') }}</el-button>
-					</span>
-				</template>
+                <template #footer>
+                    <span class="dialog-footer">
+                        <el-button @click="showDialog = false">{{ t('cancel') }}</el-button>
+                        <el-button type="primary" @click="confirmStyle">{{ t('confirm') }}</el-button>
+                    </span>
+                </template>
 
-			</el-dialog>
-		</div>
-	</div>
+            </el-dialog>
+        </div>
+    </div>
 
-	<!-- 样式 -->
-	<div class="style-wrap" v-show="diyStore.editTab == 'style'">
+    <!-- 样式 -->
+    <div class="style-wrap" v-show="diyStore.editTab == 'style'">
 
-		<!-- 组件样式 -->
-		<slot name="style"></slot>
+        <!-- 组件样式 -->
+        <slot name="style"></slot>
 
-	</div>
+    </div>
 </template>
 
 <script lang="ts" setup>
@@ -50,7 +53,7 @@ import { img } from '@/utils/common'
 import { ref, reactive } from 'vue'
 
 const diyStore = useDiyStore()
-diyStore.editComponent.ignore = ['componentBgColor','componentBgUrl'] // 忽略公共属性
+diyStore.editComponent.ignore = ['componentBgColor', 'componentBgUrl'] // 忽略公共属性
 
 const selectStyle = reactive({
     title: diyStore.editComponent.styleName,
@@ -94,7 +97,7 @@ const styleList = reactive([
     }
 ])
 
-const changeStyle = (item:any) => {
+const changeStyle = (item: any) => {
     selectStyle.title = item.title;
     selectStyle.value = item.value;
 }
@@ -108,22 +111,22 @@ const confirmStyle = () => {
 
 
 const initStyle = (style: any) => {
-	if (style == 'style-1') {
-		diyStore.editComponent.bottomRounded = 0;
-		diyStore.editComponent.topRounded = 12;
-	} else if (style == 'style-2') {
-		diyStore.editComponent.bottomRounded = 0;
-		diyStore.editComponent.topRounded = 12;
-	} else if (style == 'style-3') {
-		diyStore.editComponent.bottomRounded = 12;
-		diyStore.editComponent.topRounded = 12;
-	} else if (style == 'style-4') {
-		diyStore.editComponent.bottomRounded = 12;
-		diyStore.editComponent.topRounded = 12;
-	} else if (style == 'style-5') {
-		diyStore.editComponent.bottomRounded = 12;
-		diyStore.editComponent.topRounded = 12;
-	}
+    if (style == 'style-1') {
+        diyStore.editComponent.bottomRounded = 0;
+        diyStore.editComponent.topRounded = 12;
+    } else if (style == 'style-2') {
+        diyStore.editComponent.bottomRounded = 0;
+        diyStore.editComponent.topRounded = 12;
+    } else if (style == 'style-3') {
+        diyStore.editComponent.bottomRounded = 12;
+        diyStore.editComponent.topRounded = 12;
+    } else if (style == 'style-4') {
+        diyStore.editComponent.bottomRounded = 12;
+        diyStore.editComponent.topRounded = 12;
+    } else if (style == 'style-5') {
+        diyStore.editComponent.bottomRounded = 12;
+        diyStore.editComponent.topRounded = 12;
+    }
 
 }
 
diff --git a/admin/src/app/views/diy/components/edit-notice.vue b/admin/src/app/views/diy/components/edit-notice.vue
index b6fe0b5b6..491234982 100644
--- a/admin/src/app/views/diy/components/edit-notice.vue
+++ b/admin/src/app/views/diy/components/edit-notice.vue
@@ -1,101 +1,104 @@
 <template>
-	<!-- 内容 -->
-	<div class="content-wrap notice-content-wrap" v-show="diyStore.editTab == 'content'">
-		<div class="edit-attr-item-wrap">
-			<h3 class="mb-[10px]">{{ t('noticeStyle') }}</h3>
-			<el-form label-width="90px" class="px-[10px]">
-				<el-form-item :label="t('noticeType')">
-					<el-radio-group v-model="diyStore.editComponent.noticeType">
-						<el-radio label="img">{{ t('noticeTypeImg') }}</el-radio>
-						<el-radio label="text">{{ t('noticeTypeText') }}</el-radio>
-					</el-radio-group>
-				</el-form-item>
-				<div class="flex items-center flex-wrap py-[8px] px-[10px] bg-[#f4f3f7] rounded mb-[18px] mx-[18px]" v-show="diyStore.editComponent.noticeType == 'img'">
-					<div :class="['mr-[10px] rounded cursor-pointer border-[1px] border-solid', {'border-[var(--el-color-primary)]': diyStore.editComponent.systemUrl == 'style_1' && diyStore.editComponent.imgType == 'system'}]">
-						<img src="@/app/assets/images/diy/notice/style_1.png" :class="['h-[28px] px-[10px] py-[5px]']" @click="changeStyle('style_1')"/>
-					</div>
+    <!-- 内容 -->
+    <div class="content-wrap notice-content-wrap" v-show="diyStore.editTab == 'content'">
+        <div class="edit-attr-item-wrap">
+            <h3 class="mb-[10px]">{{ t('noticeStyle') }}</h3>
+            <el-form label-width="90px" class="px-[10px]">
+                <el-form-item :label="t('noticeType')">
+                    <el-radio-group v-model="diyStore.editComponent.noticeType">
+                        <el-radio label="img">{{ t('noticeTypeImg') }}</el-radio>
+                        <el-radio label="text">{{ t('noticeTypeText') }}</el-radio>
+                    </el-radio-group>
+                </el-form-item>
+                <div class="flex items-center flex-wrap py-[8px] px-[10px] bg-[#f4f3f7] rounded mb-[18px] mx-[18px]" v-show="diyStore.editComponent.noticeType == 'img'">
+                    <div :class="['mr-[10px] rounded cursor-pointer border-[1px] border-solid', {'border-[var(--el-color-primary)]': diyStore.editComponent.systemUrl == 'style_1' && diyStore.editComponent.imgType == 'system'}]">
+                        <img src="@/app/assets/images/diy/notice/style_1.png" :class="['h-[28px] px-[10px] py-[5px]']" @click="changeStyle('style_1')" />
+                    </div>
 
-					<div :class="['mr-[10px] rounded cursor-pointer w-[100px] border-[1px] border-solid', {'border-[var(--el-color-primary)]': diyStore.editComponent.systemUrl == 'style_2' && diyStore.editComponent.imgType == 'system'}]">
-						<img src="@/app/assets/images/diy/notice/style_2.png" class="px-[10px] py-[5px]" @click="changeStyle('style_2')"/>
-					</div>
-					<div @click.stop="diyStore.editComponent.imgType = 'diy'" :class="['mr-[10px] rounded cursor-pointer diy-upload-img border-[1px] border-solid', {'border-[var(--el-color-primary)]': (diyStore.editComponent.imageUrl && diyStore.editComponent.imgType == 'diy') }]">
-						<upload-image v-model="diyStore.editComponent.imageUrl" :limit="1"/>
-					</div>
-				</div>
+                    <div :class="['mr-[10px] rounded cursor-pointer w-[100px] border-[1px] border-solid', {'border-[var(--el-color-primary)]': diyStore.editComponent.systemUrl == 'style_2' && diyStore.editComponent.imgType == 'system'}]">
+                        <img src="@/app/assets/images/diy/notice/style_2.png" class="px-[10px] py-[5px]" @click="changeStyle('style_2')" />
+                    </div>
+                    <div @click.stop="diyStore.editComponent.imgType = 'diy'"
+                         :class="['mr-[10px] rounded cursor-pointer diy-upload-img border-[1px] border-solid', {'border-[var(--el-color-primary)]': (diyStore.editComponent.imageUrl && diyStore.editComponent.imgType == 'diy') }]">
+                        <upload-image v-model="diyStore.editComponent.imageUrl" :limit="1" />
+                    </div>
+                </div>
 
-				<el-form-item :label="t('noticeTitle')" v-show="diyStore.editComponent.noticeType == 'text'">
-					<el-input v-model.trim="diyStore.editComponent.noticeTitle" :placeholder="t('titlePlaceholder')" clearable maxlength="20" show-word-limit/>
-				</el-form-item>
+                <el-form-item :label="t('noticeTitle')" v-show="diyStore.editComponent.noticeType == 'text'">
+                    <el-input v-model.trim="diyStore.editComponent.noticeTitle" :placeholder="t('titlePlaceholder')" clearable maxlength="20" show-word-limit />
+                </el-form-item>
 
-			</el-form>
+            </el-form>
 
-		</div>
+        </div>
 
-		<div class="edit-attr-item-wrap">
-			<h3 class="mb-[10px]">{{ t('noticeText') }}</h3>
-			<el-form label-width="90px" class="px-[10px]">
+        <div class="edit-attr-item-wrap">
+            <h3 class="mb-[10px]">{{ t('noticeText') }}</h3>
+            <el-form label-width="90px" class="px-[10px]">
 
-				<el-form-item :label="t('noticeScrollWay')">
-					<el-radio-group v-model="diyStore.editComponent.scrollWay">
-						<el-radio label="upDown">{{ t('noticeUpDown') }}</el-radio>
-						<el-radio label="horizontal">{{ t('noticeHorizontal') }}</el-radio>
-					</el-radio-group>
-				</el-form-item>
-				<el-form-item :label="t('noticeShowType')">
-					<el-radio-group v-model="diyStore.editComponent.showType">
-						<el-radio label="popup">{{ t('noticeShowPopUp') }}</el-radio>
-						<el-radio label="link">{{ t('noticeShowLink') }}</el-radio>
-					</el-radio-group>
-				</el-form-item>
+                <el-form-item :label="t('noticeScrollWay')">
+                    <el-radio-group v-model="diyStore.editComponent.scrollWay">
+                        <el-radio label="upDown">{{ t('noticeUpDown') }}</el-radio>
+                        <el-radio label="horizontal">{{ t('noticeHorizontal') }}</el-radio>
+                    </el-radio-group>
+                </el-form-item>
+                <el-form-item :label="t('noticeShowType')">
+                    <el-radio-group v-model="diyStore.editComponent.showType">
+                        <el-radio label="popup">{{ t('noticeShowPopUp') }}</el-radio>
+                        <el-radio label="link">{{ t('noticeShowLink') }}</el-radio>
+                    </el-radio-group>
+                </el-form-item>
 
-				<p class="text-sm text-gray-400 mb-[10px]">{{ t('dragMouseAdjustOrder') }}</p>
+                <p class="text-sm text-gray-400 mb-[10px]">{{ t('dragMouseAdjustOrder') }}</p>
 
-				<div ref="noticeBoxRef">
-					<div v-for="(item,index) in diyStore.editComponent.list" :key="item.id" class="item-wrap p-[10px] pb-0 relative border border-dashed border-gray-300 mb-[16px]">
+                <div ref="noticeBoxRef">
+                    <div v-for="(item,index) in diyStore.editComponent.list" :key="item.id" class="item-wrap p-[10px] pb-0 relative border border-dashed border-gray-300 mb-[16px]">
 
-						<el-form-item :label="t('noticeText')">
-							<el-input v-model.trim="item.text" :placeholder="t('noticePlaceholderText')" clearable maxlength="40" show-word-limit/>
-						</el-form-item>
+                        <el-form-item :label="t('noticeText')">
+                            <el-input v-model.trim="item.text" :placeholder="t('noticePlaceholderText')" clearable maxlength="40" show-word-limit />
+                        </el-form-item>
 
-						<div class="del absolute cursor-pointer z-[2] top-[-8px] right-[-8px]" v-show="diyStore.editComponent.list.length > 1" @click="diyStore.editComponent.list.splice(index,1)">
-							<icon name="element CircleCloseFilled" color="#bbb" size="20px"/>
-						</div>
+                        <div class="del absolute cursor-pointer z-[2] top-[-8px] right-[-8px]"
+                             v-show="diyStore.editComponent.list.length > 1"
+                             @click="diyStore.editComponent.list.splice(index,1)">
+                            <icon name="element CircleCloseFilled" color="#bbb" size="20px" />
+                        </div>
 
-						<el-form-item :label="t('link')" v-if="diyStore.editComponent.showType == 'link'">
-							<diy-link v-model="item.link"/>
-						</el-form-item>
-					</div>
-				</div>
+                        <el-form-item :label="t('link')" v-if="diyStore.editComponent.showType == 'link'">
+                            <diy-link v-model="item.link" />
+                        </el-form-item>
+                    </div>
+                </div>
 
-				<el-button class="w-full" @click="addNotice">{{ t('addNotice') }}</el-button>
+                <el-button class="w-full" @click="addNotice">{{ t('addNotice') }}</el-button>
 
-			</el-form>
-		</div>
+            </el-form>
+        </div>
 
-	</div>
+    </div>
 
-	<!-- 样式 -->
-	<div class="style-wrap" v-show="diyStore.editTab == 'style'">
-		<div class="edit-attr-item-wrap">
-			<h3 class="mb-[10px]">{{ t('textSet') }}</h3>
-			<el-form label-width="80px" class="px-[10px]">
-				<el-form-item :label="t('textFontSize')">
-					<el-slider v-model="diyStore.editComponent.fontSize" show-input size="small" class="ml-[10px] diy-nav-slider" :min="12" :max="20"/>
-				</el-form-item>
-				<el-form-item :label="t('textFontWeight')">
-					<el-radio-group v-model="diyStore.editComponent.fontWeight">
-						<el-radio :label="'normal'">{{t('fontWeightNormal')}}</el-radio>
-						<el-radio :label="'bold'">{{t('fontWeightBold')}}</el-radio>
-					</el-radio-group>
-				</el-form-item>
-				<el-form-item :label="t('textColor')">
-					<el-color-picker v-model="diyStore.editComponent.textColor"/>
-				</el-form-item>
-			</el-form>
-		</div>
-		<!-- 组件样式 -->
-		<slot name="style"></slot>
-	</div>
+    <!-- 样式 -->
+    <div class="style-wrap" v-show="diyStore.editTab == 'style'">
+        <div class="edit-attr-item-wrap">
+            <h3 class="mb-[10px]">{{ t('textSet') }}</h3>
+            <el-form label-width="80px" class="px-[10px]">
+                <el-form-item :label="t('textFontSize')">
+                    <el-slider v-model="diyStore.editComponent.fontSize" show-input size="small" class="ml-[10px] diy-nav-slider" :min="12" :max="20" />
+                </el-form-item>
+                <el-form-item :label="t('textFontWeight')">
+                    <el-radio-group v-model="diyStore.editComponent.fontWeight">
+                        <el-radio :label="'normal'">{{ t('fontWeightNormal') }}</el-radio>
+                        <el-radio :label="'bold'">{{ t('fontWeightBold') }}</el-radio>
+                    </el-radio-group>
+                </el-form-item>
+                <el-form-item :label="t('textColor')">
+                    <el-color-picker v-model="diyStore.editComponent.textColor" />
+                </el-form-item>
+            </el-form>
+        </div>
+        <!-- 组件样式 -->
+        <slot name="style"></slot>
+    </div>
 
 </template>
 
@@ -105,6 +108,7 @@ import useDiyStore from '@/stores/modules/diy'
 import { ref, watch, onMounted, nextTick } from 'vue'
 import { range } from 'lodash-es'
 import Sortable from 'sortablejs'
+
 const diyStore = useDiyStore()
 diyStore.editComponent.ignore = [] // 忽略公共属性
 
@@ -112,8 +116,8 @@ diyStore.editComponent.ignore = [] // 忽略公共属性
 diyStore.editComponent.verify = (index: number) => {
     const res = { code: true, message: '' }
 
-    if(diyStore.value[index].noticeType == 'text'){
-        if(diyStore.value[index].noticeTitle == ''){
+    if (diyStore.value[index].noticeType == 'text') {
+        if (diyStore.value[index].noticeTitle == '') {
             res.code = false
             res.message = t('noticeTypeTextPlaceholder')
             return res
@@ -134,9 +138,7 @@ diyStore.editComponent.list.forEach((item: any) => {
     if (!item.id) item.id = diyStore.generateRandom()
 })
 
-const selectStyle = ref(diyStore.editComponent.style)
-
-const changeStyle = (value :any) => {
+const changeStyle = (value: any) => {
     diyStore.editComponent.systemUrl = value;
     diyStore.editComponent.imgType = 'system';
 }
@@ -144,11 +146,11 @@ const changeStyle = (value :any) => {
 watch(
     () => diyStore.editComponent.imageUrl,
     (newValue, oldValue) => {
-	    if(newValue){
+        if (newValue) {
             diyStore.editComponent.imgType = 'diy';
-	    }else{
-			changeStyle('style_1');
-	    }
+        } else {
+            changeStyle('style_1');
+        }
     }
 )
 
@@ -185,26 +187,26 @@ defineExpose({})
 </script>
 
 <style lang="scss">
-	.notice-content-wrap {
-		.add-notice-width {
-			width: calc(100% - 20px);
-		}
+.notice-content-wrap {
+    .add-notice-width {
+        width: calc(100% - 20px);
+    }
 
-		.diy-upload-img {
-			.image-wrap {
-				width: 50px !important;
-				height: 50px !important;
-				margin-right: 0 !important;
-				background: #fff;
-			}
+    .diy-upload-img {
+        .image-wrap {
+            width: 50px !important;
+            height: 50px !important;
+            margin-right: 0 !important;
+            background: #fff;
+        }
 
-			.content-wrap {
-				div {
-					display: none;
-				}
-			}
-			
-		}
-	}
+        .content-wrap {
+            div {
+                display: none;
+            }
+        }
+
+    }
+}
 </style>
 <style lang="scss" scoped></style>
diff --git a/admin/src/app/views/diy/components/edit-page.vue b/admin/src/app/views/diy/components/edit-page.vue
index 205cdf83b..971ca7328 100644
--- a/admin/src/app/views/diy/components/edit-page.vue
+++ b/admin/src/app/views/diy/components/edit-page.vue
@@ -1,35 +1,36 @@
 <template>
-	<!-- 内容 -->
-	<div class="content-wrap" v-show="diyStore.editTab == 'content'">
-
-		<div class="edit-attr-item-wrap">
-			<h3 class="mb-[10px]">{{ t('pageContent') }}</h3>
-			<el-form label-width="80px" class="px-[10px]" @submit.prevent>
-				<el-form-item :label="t('diyPageTitle')">
-					<el-input v-model.trim="diyStore.pageTitle" :placeholder="t('diyPageTitlePlaceholder')" clearable maxlength="16" show-word-limit/>
-					<div class="text-sm text-gray-400">{{ t('pageTitleTips') }}</div>
-				</el-form-item>
-			</el-form>
-		</div>
-
-		<!-- 表单布局 页面设置 -->
-		<slot name="content"></slot>
+    <!-- 内容 -->
+    <div class="content-wrap" v-show="diyStore.editTab == 'content'">
 
         <div class="edit-attr-item-wrap">
-			<h3 class="mb-[10px]">{{ t('statusBarContent') }}</h3>
+            <h3 class="mb-[10px]">{{ t('pageContent') }}</h3>
+            <el-form label-width="80px" class="px-[10px]" @submit.prevent>
+                <el-form-item :label="t('diyPageTitle')">
+                    <el-input v-model.trim="diyStore.pageTitle" :placeholder="t('diyPageTitlePlaceholder')" clearable
+                              maxlength="16" show-word-limit />
+                    <div class="text-sm text-gray-400">{{ t('pageTitleTips') }}</div>
+                </el-form-item>
+            </el-form>
+        </div>
+
+        <!-- 表单布局 页面设置 -->
+        <slot name="content"></slot>
+
+        <div class="edit-attr-item-wrap">
+            <h3 class="mb-[10px]">{{ t('statusBarContent') }}</h3>
             <el-form label-width="80px" class="px-[10px]" @submit.prevent>
                 <el-form-item :label="t('topStatusBarNav')" class="display-block">
-					<el-switch v-model="diyStore.global.topStatusBar.isShow"/>
-					<div class="text-sm text-gray-400">{{ t('statusBarSwitchTips') }}</div>
-				</el-form-item>
+                    <el-switch v-model="diyStore.global.topStatusBar.isShow" />
+                    <div class="text-sm text-gray-400">{{ t('statusBarSwitchTips') }}</div>
+                </el-form-item>
                 <template v-if="diyStore.global.topStatusBar.isShow">
                     <el-form-item :label="t('diyTitle')">
-                        <el-input v-model.trim="diyStore.global.title" :placeholder="t('diyTitlePlaceholder')" clearable maxlength="12" show-word-limit/>
+                        <el-input v-model.trim="diyStore.global.title" :placeholder="t('diyTitlePlaceholder')" clearable maxlength="12" show-word-limit />
                         <div class="text-sm text-gray-400">{{ t('titleTips') }}</div>
                     </el-form-item>
                     <el-form-item :label="t('selectStyle')" class="display-block">
                         <div class="flex">
-                            <span class="text-primary flex-1 cursor-pointer" @click="showStyle">{{diyStore.global.topStatusBar.styleName}}</span>
+                            <span class="text-primary flex-1 cursor-pointer" @click="showStyle">{{ diyStore.global.topStatusBar.styleName }}</span>
                             <el-icon>
                                 <ArrowRight />
                             </el-icon>
@@ -41,7 +42,7 @@
                         <div class="text-sm text-gray-400 mt-[10px]">{{ t('topStatusBarImgTips') }}</div>
                     </el-form-item>
                     <el-form-item :label="t('topStatusBarSearchName')" v-if="'style-3' == diyStore.global.topStatusBar.style">
-                        <el-input v-model.trim="diyStore.global.topStatusBar.inputPlaceholder" :placeholder="t('topStatusBarSearchNamePlaceholder')" clearable maxlength="12" show-word-limit/>
+                        <el-input v-model.trim="diyStore.global.topStatusBar.inputPlaceholder" :placeholder="t('topStatusBarSearchNamePlaceholder')" clearable maxlength="12" show-word-limit />
                     </el-form-item>
                     <el-form-item :label="t('textAlign')" v-show="diyStore.global.topStatusBar.style == 'style-1'">
                         <el-radio-group v-model="diyStore.global.topStatusBar.textAlign">
@@ -53,31 +54,35 @@
                         <diy-link v-model="diyStore.global.topStatusBar.link" />
                     </el-form-item>
                 </template>
-			</el-form>
-		</div>
+            </el-form>
+        </div>
         <div class="edit-attr-item-wrap">
-			<h3 class="mb-[10px]">{{ t('bottomNavContent') }}</h3>
+            <h3 class="mb-[10px]">{{ t('bottomNavContent') }}</h3>
             <el-form label-width="80px" class="px-[10px]">
-				<el-form-item :label="t('tabbar')" class="display-block">
-					<el-switch v-model="diyStore.global.bottomTabBarSwitch"/>
-					<div class="text-sm text-gray-400">{{ t('tabbarSwitchTips') }}</div>
-				</el-form-item>
-			</el-form>
-		</div>
+                <el-form-item :label="t('tabbar')" class="display-block">
+                    <el-switch v-model="diyStore.global.bottomTabBarSwitch" />
+                    <div class="text-sm text-gray-400">{{ t('tabbarSwitchTips') }}</div>
+                </el-form-item>
+            </el-form>
+        </div>
 
-         <el-dialog v-model="showDialog" :title="t('selectStyle')" width="800px">
+        <el-dialog v-model="showDialog" :title="t('selectStyle')" width="800px">
 
             <div class="flex flex-wrap">
-                <div class="flex items-center justify-center overflow-hidden w-[32%] h-[100px] mr-[2%] mb-[15px] cursor-pointer border bg-gray-50" :class="{ 'border-primary': selectStyle == 'style-1' }" @click="selectStyle = 'style-1'">
+                <div class="flex items-center justify-center overflow-hidden w-[32%] h-[100px] mr-[2%] mb-[15px] cursor-pointer border bg-gray-50"
+                    :class="{ 'border-primary': selectStyle == 'style-1' }" @click="selectStyle = 'style-1'">
                     <img class="max-w-[100%] max-h-[100%]" src="@/app/assets/images/diy/head/nav_style1.jpg" />
                 </div>
-                <div class="flex items-center justify-center overflow-hidden w-[32%] h-[100px] mr-[2%] mb-[15px] cursor-pointer border bg-gray-50" :class="{ 'border-primary': selectStyle == 'style-2' }" @click="selectStyle = 'style-2'">
+                <div class="flex items-center justify-center overflow-hidden w-[32%] h-[100px] mr-[2%] mb-[15px] cursor-pointer border bg-gray-50"
+                    :class="{ 'border-primary': selectStyle == 'style-2' }" @click="selectStyle = 'style-2'">
                     <img class="max-w-[100%] max-h-[100%]" src="@/app/assets/images/diy/head/nav_style2.jpg" />
                 </div>
-                <div class="flex items-center justify-center overflow-hidden w-[32%] h-[100px] mb-[15px] cursor-pointer border bg-gray-50" :class="{ 'border-primary': selectStyle == 'style-3' }" @click="selectStyle = 'style-3'">
+                <div class="flex items-center justify-center overflow-hidden w-[32%] h-[100px] mb-[15px] cursor-pointer border bg-gray-50"
+                    :class="{ 'border-primary': selectStyle == 'style-3' }" @click="selectStyle = 'style-3'">
                     <img class="max-w-[100%] max-h-[100%]" src="@/app/assets/images/diy/head/nav_style3.jpg" />
                 </div>
-                <div class="flex items-center justify-center overflow-hidden w-[32%] h-[100px]  mr-[2%] cursor-pointer border bg-gray-50" :class="{ 'border-primary': selectStyle == 'style-4' }" @click="selectStyle = 'style-4'">
+                <div class="flex items-center justify-center overflow-hidden w-[32%] h-[100px]  mr-[2%] cursor-pointer border bg-gray-50"
+                    :class="{ 'border-primary': selectStyle == 'style-4' }" @click="selectStyle = 'style-4'">
                     <img class="max-w-[100%] max-h-[100%]" src="@/app/assets/images/diy/head/nav_style4.jpg" />
                 </div>
             </div>
@@ -90,59 +95,59 @@
             </template>
 
         </el-dialog>
-	</div>
+    </div>
 
-	<!-- 样式 -->
-	<div class="style-wrap" v-show="diyStore.editTab == 'style'">
-		<div class="edit-attr-item-wrap">
-			<h3 class="mb-[10px]">{{ t('pageStyle') }}</h3>
-			<el-form label-width="115px" class="px-[10px]">
-				<el-form-item :label="t('pageBgColor')">
-					<el-color-picker v-model="diyStore.editComponent.pageStartBgColor" show-alpha :predefine="diyStore.predefineColors" />
-					<icon name="iconfont iconmap-connect" size="20px" class="block !text-gray-400 mx-[5px]"/>
-					<el-color-picker v-model="diyStore.editComponent.pageEndBgColor" show-alpha :predefine="diyStore.predefineColors" />
-				</el-form-item>
-				<el-form-item :label="t('bgGradientAngle')">
-					<el-radio-group v-model="diyStore.editComponent.pageGradientAngle">
-						<el-radio label="to bottom">{{ t('topToBottom') }}</el-radio>
-						<el-radio label="to right">{{ t('leftToRight') }}</el-radio>
-					</el-radio-group>
-				</el-form-item>
-				<el-form-item :label="t('bgHeightScale')">
-					<el-slider v-model="diyStore.global.bgHeightScale" show-input size="small" class="ml-[10px] diy-nav-slider"/>
-				</el-form-item>
-				<div class="text-sm text-gray-400 ml-[80px] mb-[10px]">{{ t('bgHeightScaleTip') }}</div>
-				<el-form-item :label="t('bgUrl')">
-					<upload-image v-model="diyStore.global.bgUrl" :limit="1"/>
-				</el-form-item>
-			</el-form>
-		</div>
+    <!-- 样式 -->
+    <div class="style-wrap" v-show="diyStore.editTab == 'style'">
         <div class="edit-attr-item-wrap">
-			<h3 class="mb-[10px]">{{ t('statusBarStyle') }}</h3>
-			<el-form label-width="115px" class="px-[10px]">
+            <h3 class="mb-[10px]">{{ t('pageStyle') }}</h3>
+            <el-form label-width="115px" class="px-[10px]">
+                <el-form-item :label="t('pageBgColor')">
+                    <el-color-picker v-model="diyStore.editComponent.pageStartBgColor" show-alpha :predefine="diyStore.predefineColors" />
+                    <icon name="iconfont iconmap-connect" size="20px" class="block !text-gray-400 mx-[5px]" />
+                    <el-color-picker v-model="diyStore.editComponent.pageEndBgColor" show-alpha :predefine="diyStore.predefineColors" />
+                </el-form-item>
+                <el-form-item :label="t('bgGradientAngle')">
+                    <el-radio-group v-model="diyStore.editComponent.pageGradientAngle">
+                        <el-radio label="to bottom">{{ t('topToBottom') }}</el-radio>
+                        <el-radio label="to right">{{ t('leftToRight') }}</el-radio>
+                    </el-radio-group>
+                </el-form-item>
+                <el-form-item :label="t('bgHeightScale')">
+                    <el-slider v-model="diyStore.global.bgHeightScale" show-input size="small" class="ml-[10px] diy-nav-slider" />
+                </el-form-item>
+                <div class="text-sm text-gray-400 ml-[80px] mb-[10px]">{{ t('bgHeightScaleTip') }}</div>
+                <el-form-item :label="t('bgUrl')">
+                    <upload-image v-model="diyStore.global.bgUrl" :limit="1" />
+                </el-form-item>
+            </el-form>
+        </div>
+        <div class="edit-attr-item-wrap">
+            <h3 class="mb-[10px]">{{ t('statusBarStyle') }}</h3>
+            <el-form label-width="115px" class="px-[10px]">
                 <el-form-item :label="t('topStatusBarBgColor')" class="display-block">
-					<el-color-picker v-model="diyStore.global.topStatusBar.bgColor" show-alpha />
-				</el-form-item>
-				<el-form-item :label="t('rollTopStatusBarBgColor')" class="display-block">
-					<el-color-picker v-model="diyStore.global.topStatusBar.rollBgColor" show-alpha />
-				</el-form-item>
-				<el-form-item :label="t('topStatusBarTextColor')" class="display-block">
-					<el-color-picker v-model="diyStore.global.topStatusBar.textColor" show-alpha />
-				</el-form-item>
-				<el-form-item :label="t('rollTopStatusBarTextColor')" class="display-block">
-					<el-color-picker v-model="diyStore.global.topStatusBar.rollTextColor" show-alpha />
-				</el-form-item>
-			</el-form>
-		</div>
-		<div class="edit-attr-item-wrap">
-			<h3 class="mb-[10px]">{{ t('marginSet') }}</h3>
-			<el-form label-width="115px" class="px-[10px]">
-				<el-form-item :label="t('marginBoth')">
-					<el-slider v-model="diyStore.global.template.margin.both" show-input size="small" @input="inputBoth" class="ml-[10px] diy-nav-slider"/>
-				</el-form-item>
-			</el-form>
-		</div>
-	</div>
+                    <el-color-picker v-model="diyStore.global.topStatusBar.bgColor" show-alpha />
+                </el-form-item>
+                <el-form-item :label="t('rollTopStatusBarBgColor')" class="display-block">
+                    <el-color-picker v-model="diyStore.global.topStatusBar.rollBgColor" show-alpha />
+                </el-form-item>
+                <el-form-item :label="t('topStatusBarTextColor')" class="display-block">
+                    <el-color-picker v-model="diyStore.global.topStatusBar.textColor" show-alpha />
+                </el-form-item>
+                <el-form-item :label="t('rollTopStatusBarTextColor')" class="display-block">
+                    <el-color-picker v-model="diyStore.global.topStatusBar.rollTextColor" show-alpha />
+                </el-form-item>
+            </el-form>
+        </div>
+        <div class="edit-attr-item-wrap">
+            <h3 class="mb-[10px]">{{ t('marginSet') }}</h3>
+            <el-form label-width="115px" class="px-[10px]">
+                <el-form-item :label="t('marginBoth')">
+                    <el-slider v-model="diyStore.global.template.margin.both" show-input size="small" @input="inputBoth" class="ml-[10px] diy-nav-slider" />
+                </el-form-item>
+            </el-form>
+        </div>
+    </div>
 </template>
 
 <script lang="ts" setup>
@@ -159,11 +164,11 @@ watch(
         // 设置图片宽高
         const image = new Image()
         image.src = img(diyStore.global.bgUrl)
-        image.onload = async () => {
+        image.onload = async() => {
             diyStore.global.imgWidth = image.width
             diyStore.global.imgHeight = image.height
         }
-        if(!diyStore.global.bgUrl){
+        if (!diyStore.global.bgUrl) {
             diyStore.global.imgWidth = ''
             diyStore.global.imgHeight = ''
         }
@@ -171,8 +176,8 @@ watch(
 )
 
 // 改变页面的左右边距时，更新所有组件的数值
-const inputBoth = (value:any)=>{
-    diyStore.value.forEach((item,index)=>{
+const inputBoth = (value: any) => {
+    diyStore.value.forEach((item, index) => {
         item.margin.both = value;
     })
 
@@ -192,7 +197,7 @@ const showStyle = () => {
 
 const selectStyle = ref("style-1")
 const changeStyle = () => {
-     switch (selectStyle.value) {
+    switch (selectStyle.value) {
         case 'style-1':
             diyStore.global.topStatusBar.styleName = '风格1'
             break
diff --git a/admin/src/app/views/diy/components/edit-picture-show.vue b/admin/src/app/views/diy/components/edit-picture-show.vue
index ed1589423..4eae991d3 100644
--- a/admin/src/app/views/diy/components/edit-picture-show.vue
+++ b/admin/src/app/views/diy/components/edit-picture-show.vue
@@ -1,127 +1,129 @@
 <template>
-	<!-- 内容 -->
-	<div class="content-wrap" v-show="diyStore.editTab == 'content'">
+    <!-- 内容 -->
+    <div class="content-wrap" v-show="diyStore.editTab == 'content'">
 
-		<div class="edit-attr-item-wrap">
-			<h3 class="mb-[10px]">{{ t('pictureShowBlockOne') }}</h3>
-			<el-form label-width="80px" class="px-[10px]">
-				 <el-form-item :label="t('image')">
-                    <upload-image v-model="diyStore.editComponent.moduleOne.head.textImg" :limit="1"/>
+        <div class="edit-attr-item-wrap">
+            <h3 class="mb-[10px]">{{ t('pictureShowBlockOne') }}</h3>
+            <el-form label-width="80px" class="px-[10px]">
+                <el-form-item :label="t('image')">
+                    <upload-image v-model="diyStore.editComponent.moduleOne.head.textImg" :limit="1" />
                 </el-form-item>
 
                 <el-form-item :label="t('subTitle')">
-                    <el-input v-model.trim="diyStore.editComponent.moduleOne.head.subText" :placeholder="t('subTitlePlaceholder')" clearable maxlength="8" show-word-limit />
+                    <el-input v-model.trim="diyStore.editComponent.moduleOne.head.subText"
+                              :placeholder="t('subTitlePlaceholder')" clearable maxlength="8" show-word-limit />
                 </el-form-item>
 
                 <el-form-item :label="t('subTitleTextColor')">
-                    <el-color-picker v-model="diyStore.editComponent.moduleOne.head.subTextColor" show-alpha  />
+                    <el-color-picker v-model="diyStore.editComponent.moduleOne.head.subTextColor" show-alpha />
                 </el-form-item>
 
                 <el-form-item :label="t('pictureShowBgColor')">
-                    <el-color-picker v-model="diyStore.editComponent.moduleOne.listFrame.startColor" show-alpha  />
-                    <icon name="iconfont iconmap-connect" size="20px" class="block !text-gray-400 mx-[5px]"/>
+                    <el-color-picker v-model="diyStore.editComponent.moduleOne.listFrame.startColor" show-alpha />
+                    <icon name="iconfont iconmap-connect" size="20px" class="block !text-gray-400 mx-[5px]" />
                     <el-color-picker v-model="diyStore.editComponent.moduleOne.listFrame.endColor" show-alpha />
                 </el-form-item>
 
-                <div  v-for="(item,index) in diyStore.editComponent.moduleOne.list" :key="item.id" class="item-wrap p-[10px] pb-0 relative border border-dashed border-gray-300 mb-[16px]">
+                <div v-for="(item,index) in diyStore.editComponent.moduleOne.list" :key="item.id"
+                     class="item-wrap p-[10px] pb-0 relative border border-dashed border-gray-300 mb-[16px]">
                     <el-form-item :label="t('image')">
-                        <upload-image v-model="item.imageUrl" :limit="1"/>
+                        <upload-image v-model="item.imageUrl" :limit="1" />
                     </el-form-item>
 
                     <el-form-item :label="t('pictureShowBtnText')">
-                        <el-input v-model.trim="item.btnTitle.text" :placeholder="t('activeCubeTitlePlaceholder')" clearable maxlength="4" show-word-limit/>
+                        <el-input v-model.trim="item.btnTitle.text" :placeholder="t('activeCubeTitlePlaceholder')" clearable maxlength="4" show-word-limit />
                     </el-form-item>
 
                     <el-form-item :label="t('pictureShowBtnColor')">
-                        <el-color-picker v-model="item.btnTitle.color" show-alpha  />
+                        <el-color-picker v-model="item.btnTitle.color" show-alpha />
                     </el-form-item>
 
                     <el-form-item :label="t('pictureShowBtnBgColor')">
-                        <el-color-picker v-model="item.btnTitle.startColor" show-alpha  />
-                        <icon name="iconfont iconmap-connect" size="20px" class="block !text-gray-400 mx-[5px]"/>
+                        <el-color-picker v-model="item.btnTitle.startColor" show-alpha />
+                        <icon name="iconfont iconmap-connect" size="20px" class="block !text-gray-400 mx-[5px]" />
                         <el-color-picker v-model="item.btnTitle.endColor" show-alpha />
                     </el-form-item>
 
                     <el-form-item :label="t('link')">
-                        <diy-link v-model="item.link"/>
+                        <diy-link v-model="item.link" />
                     </el-form-item>
                 </div>
-			</el-form>
-		</div>
+            </el-form>
+        </div>
 
-		<div class="edit-attr-item-wrap">
-			<h3 class="mb-[10px]">{{ t('pictureShowBlockTwo') }}</h3>
-			<el-form label-width="90px" class="px-[10px]">
+        <div class="edit-attr-item-wrap">
+            <h3 class="mb-[10px]">{{ t('pictureShowBlockTwo') }}</h3>
+            <el-form label-width="90px" class="px-[10px]">
                 <el-form-item :label="t('image')">
-                    <upload-image v-model="diyStore.editComponent.moduleTwo.head.textImg" :limit="1"/>
+                    <upload-image v-model="diyStore.editComponent.moduleTwo.head.textImg" :limit="1" />
                 </el-form-item>
                 <el-form-item :label="t('subTitle')">
                     <el-input v-model.trim="diyStore.editComponent.moduleTwo.head.subText" :placeholder="t('subTitlePlaceholder')" clearable maxlength="8" show-word-limit />
                 </el-form-item>
 
                 <el-form-item :label="t('subTitleTextColor')">
-                    <el-color-picker v-model="diyStore.editComponent.moduleTwo.head.subTextColor" show-alpha  />
+                    <el-color-picker v-model="diyStore.editComponent.moduleTwo.head.subTextColor" show-alpha />
                 </el-form-item>
 
                 <el-form-item :label="t('pictureShowBgColor')">
-                    <el-color-picker v-model="diyStore.editComponent.moduleTwo.listFrame.startColor" show-alpha  />
-                    <icon name="iconfont iconmap-connect" size="20px" class="block !text-gray-400 mx-[5px]"/>
+                    <el-color-picker v-model="diyStore.editComponent.moduleTwo.listFrame.startColor" show-alpha />
+                    <icon name="iconfont iconmap-connect" size="20px" class="block !text-gray-400 mx-[5px]" />
                     <el-color-picker v-model="diyStore.editComponent.moduleTwo.listFrame.endColor" show-alpha />
                 </el-form-item>
 
-                <div  v-for="(item,index) in diyStore.editComponent.moduleTwo.list" :key="item.id" class="item-wrap p-[10px] pb-0 relative border border-dashed border-gray-300 mb-[16px]">
+                <div v-for="(item,index) in diyStore.editComponent.moduleTwo.list" :key="item.id"
+                     class="item-wrap p-[10px] pb-0 relative border border-dashed border-gray-300 mb-[16px]">
                     <el-form-item :label="t('image')">
-                        <upload-image v-model="item.imageUrl" :limit="1"/>
+                        <upload-image v-model="item.imageUrl" :limit="1" />
                     </el-form-item>
 
                     <el-form-item :label="t('pictureShowBtnText')">
-                        <el-input v-model.trim="item.btnTitle.text" :placeholder="t('activeCubeTitlePlaceholder')" clearable maxlength="4" show-word-limit/>
+                        <el-input v-model.trim="item.btnTitle.text" :placeholder="t('activeCubeTitlePlaceholder')" clearable maxlength="4" show-word-limit />
                     </el-form-item>
 
                     <el-form-item :label="t('pictureShowBtnColor')">
-                        <el-color-picker v-model="item.btnTitle.color" show-alpha  />
+                        <el-color-picker v-model="item.btnTitle.color" show-alpha />
                     </el-form-item>
 
                     <el-form-item :label="t('pictureShowBtnBgColor')">
-                        <el-color-picker v-model="item.btnTitle.startColor" show-alpha  />
-                        <icon name="iconfont iconmap-connect" size="20px" class="block !text-gray-400 mx-[5px]"/>
+                        <el-color-picker v-model="item.btnTitle.startColor" show-alpha />
+                        <icon name="iconfont iconmap-connect" size="20px" class="block !text-gray-400 mx-[5px]" />
                         <el-color-picker v-model="item.btnTitle.endColor" show-alpha />
                     </el-form-item>
 
                     <el-form-item :label="t('link')">
-                        <diy-link v-model="item.link"/>
+                        <diy-link v-model="item.link" />
                     </el-form-item>
                 </div>
 
-			</el-form>
-		</div>
+            </el-form>
+        </div>
 
-	</div>
+    </div>
 
-	<!-- 样式 -->
-	<div class="style-wrap" v-show="diyStore.editTab == 'style'">
+    <!-- 样式 -->
+    <div class="style-wrap" v-show="diyStore.editTab == 'style'">
         <div class="edit-attr-item-wrap">
-			<h3 class="mb-[10px]">{{ t('pictureShowBlockStyle') }}</h3>
-			<el-form label-width="90px" class="px-[10px]">
-				<el-form-item :label="t('topRounded')">
-                    <el-slider v-model="diyStore.editComponent.moduleRounded.topRounded" show-input size="small" class="ml-[10px] diy-nav-slider" :max="100"/>
+            <h3 class="mb-[10px]">{{ t('pictureShowBlockStyle') }}</h3>
+            <el-form label-width="90px" class="px-[10px]">
+                <el-form-item :label="t('topRounded')">
+                    <el-slider v-model="diyStore.editComponent.moduleRounded.topRounded" show-input size="small" class="ml-[10px] diy-nav-slider" :max="100" />
                 </el-form-item>
                 <el-form-item :label="t('bottomRounded')">
-                    <el-slider v-model="diyStore.editComponent.moduleRounded.bottomRounded" show-input size="small" class="ml-[10px] diy-nav-slider" :max="100"/>
+                    <el-slider v-model="diyStore.editComponent.moduleRounded.bottomRounded" show-input size="small" class="ml-[10px] diy-nav-slider" :max="100" />
                 </el-form-item>
-			</el-form>
-		</div>
+            </el-form>
+        </div>
 
-		<!-- 组件样式 -->
-		<slot name="style"></slot>
-	</div>
+        <!-- 组件样式 -->
+        <slot name="style"></slot>
+    </div>
 
 </template>
 
 <script lang="ts" setup>
 import { t } from '@/lang'
 import useDiyStore from '@/stores/modules/diy'
-import { img } from '@/utils/common'
 import { ref, reactive } from 'vue'
 
 const diyStore = useDiyStore()
diff --git a/admin/src/app/views/diy/components/edit-rich-text.vue b/admin/src/app/views/diy/components/edit-rich-text.vue
index 4bb86bef9..22969f2be 100644
--- a/admin/src/app/views/diy/components/edit-rich-text.vue
+++ b/admin/src/app/views/diy/components/edit-rich-text.vue
@@ -1,18 +1,18 @@
 <template>
-	<!-- 内容 -->
-	<div class="content-wrap" v-show="diyStore.editTab == 'content'">
-		<div class="edit-attr-item-wrap">
-			<h3 class="mb-[10px]">{{ t('richTextContentSet') }}</h3>
-			<editor v-model="diyStore.editComponent.html" :height="600" class="editor-width" />
-		</div>
-	</div>
+    <!-- 内容 -->
+    <div class="content-wrap" v-show="diyStore.editTab == 'content'">
+        <div class="edit-attr-item-wrap">
+            <h3 class="mb-[10px]">{{ t('richTextContentSet') }}</h3>
+            <editor v-model="diyStore.editComponent.html" :height="600" class="editor-width" />
+        </div>
+    </div>
 
-	<!-- 样式 -->
-	<div class="style-wrap" v-show="diyStore.editTab == 'style'">
+    <!-- 样式 -->
+    <div class="style-wrap" v-show="diyStore.editTab == 'style'">
 
-		<!-- 组件样式 -->
-		<slot name="style"></slot>
-	</div>
+        <!-- 组件样式 -->
+        <slot name="style"></slot>
+    </div>
 
 </template>
 
@@ -27,7 +27,7 @@ diyStore.editComponent.ignore = [] // 忽略公共属性
 diyStore.editComponent.verify = (index: number) => {
     const res = { code: true, message: '' }
 
-    if(diyStore.value[index].html == '<p><br></p>'){
+    if (diyStore.value[index].html == '<p><br></p>') {
         res.code = false
         res.message = t('richTextPlaceholder')
         return res
diff --git a/admin/src/app/views/diy/components/edit-rubik-cube.vue b/admin/src/app/views/diy/components/edit-rubik-cube.vue
index b59a86fe9..c1c570f3c 100644
--- a/admin/src/app/views/diy/components/edit-rubik-cube.vue
+++ b/admin/src/app/views/diy/components/edit-rubik-cube.vue
@@ -1,73 +1,75 @@
 <template>
-	<!-- 内容 -->
-	<div class="content-wrap rubik-cube" v-show="diyStore.editTab == 'content'">
+    <!-- 内容 -->
+    <div class="content-wrap rubik-cube" v-show="diyStore.editTab == 'content'">
 
-		<div class="edit-attr-item-wrap">
-			<h3 class="mb-[10px]">{{ t('selectStyle') }}</h3>
-			<el-form label-width="80px" class="px-[10px]">
-				<el-form-item :label="t('template')">
-					<span>{{ selectTemplate.name }}</span>
-				</el-form-item>
-				<ul class="selected-template-list">
-					<li v-for="(item,i) in templateList" :key="i" :class="[(item.className == diyStore.editComponent.mode) ?  'selected' : '' ]" @click="changeTemplateList(i)">
-						<icon :name="'iconfont ' + item.src" size="16px"/>
-					</li>
-				</ul>
-			</el-form>
-		</div>
-		<div class="edit-attr-item-wrap">
-			<h3 class="mb-[10px]">{{ t('rubikCubeLayout') }}</h3>
-			<el-form label-width="80px" class="px-[10px]">
+        <div class="edit-attr-item-wrap">
+            <h3 class="mb-[10px]">{{ t('selectStyle') }}</h3>
+            <el-form label-width="80px" class="px-[10px]">
+                <el-form-item :label="t('template')">
+                    <span>{{ selectTemplate.name }}</span>
+                </el-form-item>
+                <ul class="selected-template-list">
+                    <li v-for="(item,i) in templateList" :key="i"
+                        :class="[(item.className == diyStore.editComponent.mode) ?  'selected' : '' ]"
+                        @click="changeTemplateList(i)">
+                        <icon :name="'iconfont ' + item.src" size="16px" />
+                    </li>
+                </ul>
+            </el-form>
+        </div>
+        <div class="edit-attr-item-wrap">
+            <h3 class="mb-[10px]">{{ t('rubikCubeLayout') }}</h3>
+            <el-form label-width="80px" class="px-[10px]">
 
-				<ul class="layout">
-					<li v-for="(li,i) in selectTemplate.dimensionScale" :key="i" :class="[selectTemplate.className]">
-						<div class="have-preview-image" v-show="diyStore.editComponent.list[i].imageUrl && diyStore.editComponent.list[i].imageUrl != 'static/resource/images/diy/figure.png'">
-							<img :src="img(diyStore.editComponent.list[i].imageUrl)"/>
-						</div>
-						<div class="empty" :class="[selectTemplate.className]" v-show="!diyStore.editComponent.list[i].imageUrl || diyStore.editComponent.list[i].imageUrl == 'static/resource/images/diy/figure.png'">
-							<p>{{li.name}}</p>
-							<p>{{li.desc}}</p>
-						</div>
-					</li>
-				</ul>
+                <ul class="layout">
+                    <li v-for="(li,i) in selectTemplate.dimensionScale" :key="i" :class="[selectTemplate.className]">
+                        <div class="have-preview-image" v-show="diyStore.editComponent.list[i].imageUrl && diyStore.editComponent.list[i].imageUrl != 'static/resource/images/diy/figure.png'">
+                            <img :src="img(diyStore.editComponent.list[i].imageUrl)" />
+                        </div>
+                        <div class="empty" :class="[selectTemplate.className]" v-show="!diyStore.editComponent.list[i].imageUrl || diyStore.editComponent.list[i].imageUrl == 'static/resource/images/diy/figure.png'">
+                            <p>{{ li.name }}</p>
+                            <p>{{ li.desc }}</p>
+                        </div>
+                    </li>
+                </ul>
 
-				<div v-for="(item) in diyStore.editComponent.list" :key="item.id" class="item-wrap p-[10px] pb-0 relative border border-dashed border-gray-300 mb-[16px]">
-					<el-form-item :label="t('image')">
-						<upload-image v-model="item.imageUrl" :limit="1" @change="selectImg"/>
-					</el-form-item>
+                <div v-for="(item) in diyStore.editComponent.list" :key="item.id" class="item-wrap p-[10px] pb-0 relative border border-dashed border-gray-300 mb-[16px]">
+                    <el-form-item :label="t('image')">
+                        <upload-image v-model="item.imageUrl" :limit="1" @change="selectImg" />
+                    </el-form-item>
 
-					<el-form-item :label="t('link')">
-						<diy-link v-model="item.link"/>
-					</el-form-item>
-				</div>
+                    <el-form-item :label="t('link')">
+                        <diy-link v-model="item.link" />
+                    </el-form-item>
+                </div>
 
-			</el-form>
+            </el-form>
 
-		</div>
+        </div>
 
-	</div>
+    </div>
 
-	<!-- 样式 -->
-	<div class="style-wrap" v-show="diyStore.editTab == 'style'">
+    <!-- 样式 -->
+    <div class="style-wrap" v-show="diyStore.editTab == 'style'">
 
-		<div class="edit-attr-item-wrap">
-			<h3 class="mb-[10px]">{{ t('rubikCubeStyle') }}</h3>
-			<el-form label-width="80px" class="px-[10px]">
-				<el-form-item :label="t('imageGap')">
-					<el-slider v-model="diyStore.editComponent.imageGap" show-input size="small" class="ml-[10px] diy-nav-slider" :max="30"/>
-				</el-form-item>
-				<el-form-item :label="t('topRounded')">
-					<el-slider v-model="diyStore.editComponent.topElementRounded" show-input size="small" class="ml-[10px] diy-nav-slider" :max="50"/>
-				</el-form-item>
-				<el-form-item :label="t('bottomRounded')">
-					<el-slider v-model="diyStore.editComponent.bottomElementRounded" show-input size="small" class="ml-[10px] diy-nav-slider" :max="50"/>
-				</el-form-item>
-			</el-form>
-		</div>
+        <div class="edit-attr-item-wrap">
+            <h3 class="mb-[10px]">{{ t('rubikCubeStyle') }}</h3>
+            <el-form label-width="80px" class="px-[10px]">
+                <el-form-item :label="t('imageGap')">
+                    <el-slider v-model="diyStore.editComponent.imageGap" show-input size="small" class="ml-[10px] diy-nav-slider" :max="30" />
+                </el-form-item>
+                <el-form-item :label="t('topRounded')">
+                    <el-slider v-model="diyStore.editComponent.topElementRounded" show-input size="small" class="ml-[10px] diy-nav-slider" :max="50" />
+                </el-form-item>
+                <el-form-item :label="t('bottomRounded')">
+                    <el-slider v-model="diyStore.editComponent.bottomElementRounded" show-input size="small" class="ml-[10px] diy-nav-slider" :max="50" />
+                </el-form-item>
+            </el-form>
+        </div>
 
-		<!-- 组件样式 -->
-		<slot name="style"></slot>
-	</div>
+        <!-- 组件样式 -->
+        <slot name="style"></slot>
+    </div>
 
 </template>
 
@@ -312,16 +314,16 @@ const changeTemplateList = (v: number) => {
     }
 }
 
-const selectImg = (url:string) => {
+const selectImg = (url: string) => {
     handleHeight(true)
 }
 
 // 处理高度
-const handleHeight = (isCalcHeight:boolean = false) => {
+const handleHeight = (isCalcHeight: boolean = false) => {
     diyStore.editComponent.list.forEach((item: any, index: number) => {
         const image = new Image()
         image.src = img(item.imageUrl)
-        image.onload = async () => {
+        image.onload = async() => {
             item.imgWidth = image.width
             item.imgHeight = image.height
         }
@@ -332,307 +334,307 @@ defineExpose({})
 </script>
 
 <style lang="scss" scoped>
-	.rubik-cube .selected-template-list {
-		/*padding-left: 15px;*/
-		margin-bottom: 20px;
-		overflow: hidden;
-		display: flex;
-		flex-wrap: wrap;
+.rubik-cube .selected-template-list {
+    /*padding-left: 15px;*/
+    margin-bottom: 20px;
+    overflow: hidden;
+    display: flex;
+    flex-wrap: wrap;
 
-		li {
-			color: #909399;
-			width: 46px;
-			height: 32px;
-			text-align: center;
-			line-height: 29px;
-			border: 1px solid #e5e5e5;
-			cursor: pointer;
-			background: #ffffff;
-			box-sizing: border-box;
-			border-right: 1px transparent solid;
+    li {
+        color: #909399;
+        width: 46px;
+        height: 32px;
+        text-align: center;
+        line-height: 29px;
+        border: 1px solid #e5e5e5;
+        cursor: pointer;
+        background: #ffffff;
+        box-sizing: border-box;
+        border-right: 1px transparent solid;
 
-			&:last-child {
-				border-right: 1px solid #e5e5e5;
-			}
+        &:last-child {
+            border-right: 1px solid #e5e5e5;
+        }
 
-			&.selected {
-				color: var(--el-color-primary);
-				border-color: var(--el-color-primary);
-			}
+        &.selected {
+            color: var(--el-color-primary);
+            border-color: var(--el-color-primary);
+        }
 
-			img {
-				display: inline-block;
-			}
+        img {
+            display: inline-block;
+        }
 
-			div {
-				font-size: 12px;
-			}
-		}
-	}
+        div {
+            font-size: 12px;
+        }
+    }
+}
 
-	.layout {
-		overflow: hidden;
-		position: relative;
-		margin-bottom: 15px;
+.layout {
+    overflow: hidden;
+    position: relative;
+    margin-bottom: 15px;
 
-		li {
-			float: left;
-			color: #909399;
-			border: 1px solid #e5e5e5;
-			cursor: pointer;
-			font-size: 12px;
-			position: relative;
+    li {
+        float: left;
+        color: #909399;
+        border: 1px solid #e5e5e5;
+        cursor: pointer;
+        font-size: 12px;
+        position: relative;
 
-			div.empty {
-				left: 0;
-				text-align: center;
-				width: 100%;
-				position: absolute;
-				top: 50%;
-				margin-top: -26px;
+        div.empty {
+            left: 0;
+            text-align: center;
+            width: 100%;
+            position: absolute;
+            top: 50%;
+            margin-top: -26px;
 
-				p {
-					margin: 0;
-					line-height: 26px;
-				}
-			}
+            p {
+                margin: 0;
+                line-height: 26px;
+            }
+        }
 
-			div.have-preview-image {
-				box-sizing: border-box;
+        div.have-preview-image {
+            box-sizing: border-box;
 
-				img {
-					display: inline-block;
-					width: auto;
-					height: auto;
-					max-width: 100%;
-					max-height: 100%;
-				}
-			}
+            img {
+                display: inline-block;
+                width: auto;
+                height: auto;
+                max-width: 100%;
+                max-height: 100%;
+            }
+        }
 
-			// 1行2个
-			&.row1-of2 {
-				width: 49.2%;
-				height: 160px;
-				border-right: 1px transparent solid;
+        // 1行2个
+        &.row1-of2 {
+            width: 49.2%;
+            height: 160px;
+            border-right: 1px transparent solid;
 
-				&:last-child {
-					border-right: 1px solid #e5e5e5;
-				}
+            &:last-child {
+                border-right: 1px solid #e5e5e5;
+            }
 
-				div.empty {
-				}
+            div.empty {
+            }
 
-				div.have-preview-image {
-					text-align: center;
-					height: 100%;
-					line-height: 160px;
-					background: #ffffff;
-				}
+            div.have-preview-image {
+                text-align: center;
+                height: 100%;
+                line-height: 160px;
+                background: #ffffff;
+            }
 
-			}
+        }
 
-			// 1行3个
-			&.row1-of3 {
-				width: 32.5%;
-				height: 100px;
-				border-right: 1px transparent solid;
+        // 1行3个
+        &.row1-of3 {
+            width: 32.5%;
+            height: 100px;
+            border-right: 1px transparent solid;
 
-				&:last-child {
-					border-right: 1px solid #bdf;
-				}
+            &:last-child {
+                border-right: 1px solid #bdf;
+            }
 
-				div.empty {
-				}
+            div.empty {
+            }
 
-				div.have-preview-image {
-					text-align: center;
-					height: 100%;
-					line-height: 100px;
-					background: #ffffff;
-				}
-			}
+            div.have-preview-image {
+                text-align: center;
+                height: 100%;
+                line-height: 100px;
+                background: #ffffff;
+            }
+        }
 
-			// 1行4个
-			&.row1-of4 {
-				width: 24.2%;
-				height: 80px;
-				border-right: 1px transparent solid;
+        // 1行4个
+        &.row1-of4 {
+            width: 24.2%;
+            height: 80px;
+            border-right: 1px transparent solid;
 
-				&:last-child {
-					border-right: 1px solid #bdf;
-				}
+            &:last-child {
+                border-right: 1px solid #bdf;
+            }
 
-				div.empty {
-				}
+            div.empty {
+            }
 
-				div.have-preview-image {
-					text-align: center;
-					height: 100%;
-					line-height: 80px;
-					background: #ffffff;
-				}
-			}
+            div.have-preview-image {
+                text-align: center;
+                height: 100%;
+                line-height: 80px;
+                background: #ffffff;
+            }
+        }
 
-			// 2左2右
-			&.row2-lt-of2-rt {
-				width: 49.2%;
-				height: 160px;
+        // 2左2右
+        &.row2-lt-of2-rt {
+            width: 49.2%;
+            height: 160px;
 
-				&:nth-child(1) {
-					border-right: 1px transparent solid;
-					border-bottom: 1px transparent solid;
-				}
+            &:nth-child(1) {
+                border-right: 1px transparent solid;
+                border-bottom: 1px transparent solid;
+            }
 
-				&:nth-child(2) {
-					border-bottom: 1px transparent solid;
-				}
+            &:nth-child(2) {
+                border-bottom: 1px transparent solid;
+            }
 
-				&:nth-child(3) {
-					border-right: 1px transparent solid;
-					clear: both;
-				}
+            &:nth-child(3) {
+                border-right: 1px transparent solid;
+                clear: both;
+            }
 
-				div.empty {
-				}
+            div.empty {
+            }
 
-				div.have-preview-image {
-					text-align: center;
-					height: 100%;
-					line-height: 160px;
-					background: #ffffff;
-				}
-			}
+            div.have-preview-image {
+                text-align: center;
+                height: 100%;
+                line-height: 160px;
+                background: #ffffff;
+            }
+        }
 
-			// 1左2右
-			&.row1-lt-of2-rt {
-				width: 49.2%;
-				font-size: 12px;
+        // 1左2右
+        &.row1-lt-of2-rt {
+            width: 49.2%;
+            font-size: 12px;
 
-				&:nth-child(1) {
-					height: 322px;
-					border-right: 1px transparent solid;
+            &:nth-child(1) {
+                height: 322px;
+                border-right: 1px transparent solid;
 
-					div.have-preview-image {
-						text-align: center;
-						height: 100%;
-						line-height: 322px;
-						background: #ffffff;
-					}
-				}
+                div.have-preview-image {
+                    text-align: center;
+                    height: 100%;
+                    line-height: 322px;
+                    background: #ffffff;
+                }
+            }
 
-				&:nth-child(2) {
-					height: 160px;
-					border-bottom: 1px transparent solid;
+            &:nth-child(2) {
+                height: 160px;
+                border-bottom: 1px transparent solid;
 
-					div.have-preview-image {
-						text-align: center;
-						height: 100%;
-						line-height: 160px;
-						background: #ffffff;
-					}
-				}
+                div.have-preview-image {
+                    text-align: center;
+                    height: 100%;
+                    line-height: 160px;
+                    background: #ffffff;
+                }
+            }
 
-				&:nth-child(3) {
-					height: 160px;
+            &:nth-child(3) {
+                height: 160px;
 
-					div.have-preview-image {
-						text-align: center;
-						height: 100%;
-						line-height: 160px;
-						background: #ffffff;
-					}
-				}
+                div.have-preview-image {
+                    text-align: center;
+                    height: 100%;
+                    line-height: 160px;
+                    background: #ffffff;
+                }
+            }
 
-				div.empty {
-				}
-			}
+            div.empty {
+            }
+        }
 
-			// 1上2下
-			&.row1-tp-of2-bm {
-				height: 160px;
+        // 1上2下
+        &.row1-tp-of2-bm {
+            height: 160px;
 
-				&:nth-child(1) {
-					width: 99.4%;
-					border-bottom: 1px transparent solid;
-				}
+            &:nth-child(1) {
+                width: 99.4%;
+                border-bottom: 1px transparent solid;
+            }
 
-				&:nth-child(2) {
-					width: 49.2%;
-					border-right: 1px transparent solid;
-				}
+            &:nth-child(2) {
+                width: 49.2%;
+                border-right: 1px transparent solid;
+            }
 
-				&:nth-child(3) {
-					width: 49.2%;
-				}
+            &:nth-child(3) {
+                width: 49.2%;
+            }
 
-				div.empty {
-				}
+            div.empty {
+            }
 
-				div.have-preview-image {
-					text-align: center;
-					height: 100%;
-					line-height: 160px;
-					background: #ffffff;
-				}
-			}
+            div.have-preview-image {
+                text-align: center;
+                height: 100%;
+                line-height: 160px;
+                background: #ffffff;
+            }
+        }
 
-			// 1左3右
-			&.row1-lt-of1-tp-of2-bm {
-				&:nth-child(1) {
-					height: 320px;
-					width: 49.2%;
-					border-right: 1px transparent solid;
+        // 1左3右
+        &.row1-lt-of1-tp-of2-bm {
+            &:nth-child(1) {
+                height: 320px;
+                width: 49.2%;
+                border-right: 1px transparent solid;
 
-					div.have-preview-image {
-						text-align: center;
-						height: 100%;
-						line-height: 320px;
-						background: #ffffff;
-					}
-				}
+                div.have-preview-image {
+                    text-align: center;
+                    height: 100%;
+                    line-height: 320px;
+                    background: #ffffff;
+                }
+            }
 
-				&:nth-child(2) {
-					height: 160px;
-					width: 49.2%;
-					border-bottom: 1px transparent solid;
+            &:nth-child(2) {
+                height: 160px;
+                width: 49.2%;
+                border-bottom: 1px transparent solid;
 
-					div.have-preview-image {
-						text-align: center;
-						height: 100%;
-						line-height: 160px;
-						background: #ffffff;
-					}
-				}
+                div.have-preview-image {
+                    text-align: center;
+                    height: 100%;
+                    line-height: 160px;
+                    background: #ffffff;
+                }
+            }
 
-				&:nth-child(3) {
-					height: 160px;
-					width: 24.2%;
-					border-right: 1px transparent solid;
+            &:nth-child(3) {
+                height: 160px;
+                width: 24.2%;
+                border-right: 1px transparent solid;
 
-					div.have-preview-image {
-						text-align: center;
-						height: 100%;
-						line-height: 160px;
-						background: #ffffff;
-					}
-				}
+                div.have-preview-image {
+                    text-align: center;
+                    height: 100%;
+                    line-height: 160px;
+                    background: #ffffff;
+                }
+            }
 
-				&:nth-child(4) {
-					height: 160px;
-					width: 24.2%;
+            &:nth-child(4) {
+                height: 160px;
+                width: 24.2%;
 
-					div.have-preview-image {
-						text-align: center;
-						height: 100%;
-						line-height: 160px;
-						background: #ffffff;
-					}
-				}
+                div.have-preview-image {
+                    text-align: center;
+                    height: 100%;
+                    line-height: 160px;
+                    background: #ffffff;
+                }
+            }
 
-				div.empty {
-				}
-			}
+            div.empty {
+            }
+        }
 
-		}
-	}
-</style>
\ No newline at end of file
+    }
+}
+</style>
diff --git a/admin/src/app/views/diy/components/edit-text.vue b/admin/src/app/views/diy/components/edit-text.vue
index 5cdb33d55..225ce11d4 100644
--- a/admin/src/app/views/diy/components/edit-text.vue
+++ b/admin/src/app/views/diy/components/edit-text.vue
@@ -1,114 +1,119 @@
 <template>
-	<!-- 内容 -->
-	<div class="content-wrap" v-show="diyStore.editTab == 'content'">
-		<div class="edit-attr-item-wrap">
-			<h3 class="mb-[10px]">{{ t('styleSet') }}</h3>
-			<el-form label-width="80px" class="px-[10px]">
-				<el-form-item :label="t('selectStyle')" class="flex">
-					<span class="text-primary flex-1 cursor-pointer" @click="showStyle">{{ diyStore.editComponent.styleName }}</span>
-					<el-icon>
-						<ArrowRight />
-					</el-icon>
-				</el-form-item>
-			</el-form>
-		</div>
-		<div class="edit-attr-item-wrap">
-			<h3 class="mb-[10px]">{{ t('titleContent') }}</h3>
-			<el-form label-width="80px" class="px-[10px]">
-				<el-form-item :label="t('title')">
-					<el-input v-model.trim="diyStore.editComponent.text" :placeholder="t('titlePlaceholder')" clearable maxlength="15" show-word-limit />
-				</el-form-item>
-				<el-form-item :label="t('link')">
-					<diy-link v-model="diyStore.editComponent.link" />
-				</el-form-item>
-				<el-form-item :label="t('textAlign')" v-show="diyStore.editComponent.style == 'style-1'">
-					<el-radio-group v-model="diyStore.editComponent.textAlign">
-						<el-radio :label="'left'">{{ t('textAlignLeft') }}</el-radio>
-						<el-radio :label="'center'">{{ t('textAlignCenter') }}</el-radio>
-					</el-radio-group>
-				</el-form-item>
-			</el-form>
-		</div>
+    <!-- 内容 -->
+    <div class="content-wrap" v-show="diyStore.editTab == 'content'">
+        <div class="edit-attr-item-wrap">
+            <h3 class="mb-[10px]">{{ t('styleSet') }}</h3>
+            <el-form label-width="80px" class="px-[10px]">
+                <el-form-item :label="t('selectStyle')" class="flex">
+                    <span class="text-primary flex-1 cursor-pointer"
+                          @click="showStyle">{{ diyStore.editComponent.styleName }}</span>
+                    <el-icon>
+                        <ArrowRight />
+                    </el-icon>
+                </el-form-item>
+            </el-form>
+        </div>
+        <div class="edit-attr-item-wrap">
+            <h3 class="mb-[10px]">{{ t('titleContent') }}</h3>
+            <el-form label-width="80px" class="px-[10px]">
+                <el-form-item :label="t('title')">
+                    <el-input v-model.trim="diyStore.editComponent.text" :placeholder="t('titlePlaceholder')" clearable maxlength="15" show-word-limit />
+                </el-form-item>
+                <el-form-item :label="t('link')">
+                    <diy-link v-model="diyStore.editComponent.link" />
+                </el-form-item>
+                <el-form-item :label="t('textAlign')" v-show="diyStore.editComponent.style == 'style-1'">
+                    <el-radio-group v-model="diyStore.editComponent.textAlign">
+                        <el-radio :label="'left'">{{ t('textAlignLeft') }}</el-radio>
+                        <el-radio :label="'center'">{{ t('textAlignCenter') }}</el-radio>
+                    </el-radio-group>
+                </el-form-item>
+            </el-form>
+        </div>
 
-		<div class="edit-attr-item-wrap" v-show="diyStore.editComponent.subTitle.control">
-			<h3 class="mb-[10px]">{{ t('subTitleContent') }}</h3>
-			<el-form label-width="80px" class="px-[10px]">
-				<el-form-item :label="t('subTitle')">
-					<el-input v-model.trim="diyStore.editComponent.subTitle.text" :placeholder="t('subTitlePlaceholder')" clearable maxlength="30" show-word-limit />
-				</el-form-item>
-				<el-form-item :label="t('textFontSize')">
-					<el-slider v-model="diyStore.editComponent.subTitle.fontSize" show-input size="small" class="ml-[10px] diy-nav-slider" :min="12" :max="16" />
-				</el-form-item>
-				<el-form-item :label="t('textColor')">
-					<el-color-picker v-model="diyStore.editComponent.subTitle.color" />
-				</el-form-item>
-			</el-form>
-		</div>
+        <div class="edit-attr-item-wrap" v-show="diyStore.editComponent.subTitle.control">
+            <h3 class="mb-[10px]">{{ t('subTitleContent') }}</h3>
+            <el-form label-width="80px" class="px-[10px]">
+                <el-form-item :label="t('subTitle')">
+                    <el-input v-model.trim="diyStore.editComponent.subTitle.text" :placeholder="t('subTitlePlaceholder')" clearable maxlength="30" show-word-limit />
+                </el-form-item>
+                <el-form-item :label="t('textFontSize')">
+                    <el-slider v-model="diyStore.editComponent.subTitle.fontSize" show-input size="small" class="ml-[10px] diy-nav-slider" :min="12" :max="16" />
+                </el-form-item>
+                <el-form-item :label="t('textColor')">
+                    <el-color-picker v-model="diyStore.editComponent.subTitle.color" />
+                </el-form-item>
+            </el-form>
+        </div>
 
-		<div class="edit-attr-item-wrap" v-show="diyStore.editComponent.more.control">
-			<h3 class="mb-[10px]">{{ t('moreContent') }}</h3>
-			<el-form label-width="80px" class="px-[10px]">
-				<el-form-item :label="t('more')">
-					<el-input v-model.trim="diyStore.editComponent.more.text" :placeholder="t('morePlaceholder')" clearable maxlength="8" show-word-limit />
-				</el-form-item>
-				<el-form-item :label="t('link')">
-					<diy-link v-model="diyStore.editComponent.more.link" />
-				</el-form-item>
-				<el-form-item :label="t('moreIsShow')">
-					<el-switch v-model="diyStore.editComponent.more.isShow" />
-				</el-form-item>
-				<el-form-item :label="t('textColor')">
-					<el-color-picker v-model="diyStore.editComponent.more.color" />
-				</el-form-item>
-			</el-form>
-		</div>
+        <div class="edit-attr-item-wrap" v-show="diyStore.editComponent.more.control">
+            <h3 class="mb-[10px]">{{ t('moreContent') }}</h3>
+            <el-form label-width="80px" class="px-[10px]">
+                <el-form-item :label="t('more')">
+                    <el-input v-model.trim="diyStore.editComponent.more.text" :placeholder="t('morePlaceholder')" clearable maxlength="8" show-word-limit />
+                </el-form-item>
+                <el-form-item :label="t('link')">
+                    <diy-link v-model="diyStore.editComponent.more.link" />
+                </el-form-item>
+                <el-form-item :label="t('moreIsShow')">
+                    <el-switch v-model="diyStore.editComponent.more.isShow" />
+                </el-form-item>
+                <el-form-item :label="t('textColor')">
+                    <el-color-picker v-model="diyStore.editComponent.more.color" />
+                </el-form-item>
+            </el-form>
+        </div>
 
-		<el-dialog v-model="showDialog" :title="t('selectStyle')" width="620px">
+        <el-dialog v-model="showDialog" :title="t('selectStyle')" width="620px">
 
-			<div class="flex flex-wrap">
-				<div class="flex items-center justify-center overflow-hidden w-[280px] h-[100px] mr-[12px] cursor-pointer border bg-gray-50" :class="{ 'border-primary': selectStyle == 'style-1' }" @click="selectStyle = 'style-1'">
-					<img class="max-w-[280px] max-h-[220px]" src="@/app/assets/images/diy/text/style1.png" />
-				</div>
-				<div class="flex items-center justify-center overflow-hidden w-[280px] h-[100px] cursor-pointer border bg-gray-50" :class="{ 'border-primary': selectStyle == 'style-2' }" @click="selectStyle = 'style-2'">
-					<img class="max-w-[280px] max-h-[220px]" src="@/app/assets/images/diy/text/style2.png" />
-				</div>
-			</div>
+            <div class="flex flex-wrap">
+                <div
+                    class="flex items-center justify-center overflow-hidden w-[280px] h-[100px] mr-[12px] cursor-pointer border bg-gray-50"
+                    :class="{ 'border-primary': selectStyle == 'style-1' }" @click="selectStyle = 'style-1'">
+                    <img class="max-w-[280px] max-h-[220px]" src="@/app/assets/images/diy/text/style1.png" />
+                </div>
+                <div
+                    class="flex items-center justify-center overflow-hidden w-[280px] h-[100px] cursor-pointer border bg-gray-50"
+                    :class="{ 'border-primary': selectStyle == 'style-2' }" @click="selectStyle = 'style-2'">
+                    <img class="max-w-[280px] max-h-[220px]" src="@/app/assets/images/diy/text/style2.png" />
+                </div>
+            </div>
 
-			<template #footer>
-				<span class="dialog-footer">
-					<el-button @click="showDialog = false">{{ t('cancel') }}</el-button>
-					<el-button type="primary" @click="changeStyle">{{ t('confirm') }}</el-button>
-				</span>
-			</template>
+            <template #footer>
+                <span class="dialog-footer">
+                    <el-button @click="showDialog = false">{{ t('cancel') }}</el-button>
+                    <el-button type="primary" @click="changeStyle">{{ t('confirm') }}</el-button>
+                </span>
+            </template>
 
-		</el-dialog>
-	</div>
+        </el-dialog>
+    </div>
 
-	<!-- 样式 -->
-	<div class="style-wrap" v-show="diyStore.editTab == 'style'">
+    <!-- 样式 -->
+    <div class="style-wrap" v-show="diyStore.editTab == 'style'">
 
-		<div class="edit-attr-item-wrap">
-			<h3 class="mb-[10px]">{{ t('titleStyle') }}</h3>
-			<el-form label-width="80px" class="px-[10px]">
-				<el-form-item :label="t('textFontSize')">
-					<el-slider v-model="diyStore.editComponent.fontSize" show-input size="small" class="ml-[10px] diy-nav-slider" :min="12" :max="30" />
-				</el-form-item>
-				<el-form-item :label="t('textFontWeight')">
-					<el-radio-group v-model="diyStore.editComponent.fontWeight">
-						<el-radio :label="'normal'">{{ t('fontWeightNormal') }}</el-radio>
-						<el-radio :label="'bold'">{{ t('fontWeightBold') }}</el-radio>
-					</el-radio-group>
-				</el-form-item>
-				<el-form-item :label="t('textColor')">
-					<el-color-picker v-model="diyStore.editComponent.textColor" />
-				</el-form-item>
-			</el-form>
-		</div>
+        <div class="edit-attr-item-wrap">
+            <h3 class="mb-[10px]">{{ t('titleStyle') }}</h3>
+            <el-form label-width="80px" class="px-[10px]">
+                <el-form-item :label="t('textFontSize')">
+                    <el-slider v-model="diyStore.editComponent.fontSize" show-input size="small" class="ml-[10px] diy-nav-slider" :min="12" :max="30" />
+                </el-form-item>
+                <el-form-item :label="t('textFontWeight')">
+                    <el-radio-group v-model="diyStore.editComponent.fontWeight">
+                        <el-radio :label="'normal'">{{ t('fontWeightNormal') }}</el-radio>
+                        <el-radio :label="'bold'">{{ t('fontWeightBold') }}</el-radio>
+                    </el-radio-group>
+                </el-form-item>
+                <el-form-item :label="t('textColor')">
+                    <el-color-picker v-model="diyStore.editComponent.textColor" />
+                </el-form-item>
+            </el-form>
+        </div>
 
-		<!-- 组件样式 -->
-		<slot name="style"></slot>
+        <!-- 组件样式 -->
+        <slot name="style"></slot>
 
-	</div>
+    </div>
 </template>
 
 <script lang="ts" setup>
diff --git a/admin/src/app/views/diy/components/edit-theme.vue b/admin/src/app/views/diy/components/edit-theme.vue
index 3fe94a9d7..e0a2b19c8 100644
--- a/admin/src/app/views/diy/components/edit-theme.vue
+++ b/admin/src/app/views/diy/components/edit-theme.vue
@@ -2,8 +2,7 @@
     <el-dialog v-model="dialogThemeVisible" title="编辑色调" width="850px" align-center destroy-on-close="true">
         <el-form :model="openData" label-width="150px" :rules="formRules">
             <el-form-item label="色调名称" prop="title">
-                <el-input v-model="openData.title" placeholder="请输入色调名称" maxlength="15" class="!w-[250px]"
-                    :disabled="openData.id != ''" />
+                <el-input v-model="openData.title" placeholder="请输入色调名称" maxlength="15" class="!w-[250px]" :disabled="openData.id != ''" @keydown.enter.native.prevent />
             </el-form-item>
         </el-form>
 
@@ -19,8 +18,7 @@
                 <div class="flex items-center">
                     <el-color-picker v-model="item.value" show-alpha :predefine="diyStore.predefineColors" />
                     <span class="text-primary cursor-pointer text-[14px] ml-[20px]" @click="editThemeFn(item)">编辑</span>
-                    <span class="text-primary cursor-pointer text-[14px] ml-[8px]"
-                        @click="deleteThemeFn(item)">删除</span>
+                    <span class="text-primary cursor-pointer text-[14px] ml-[8px]" @click="deleteThemeFn(item)">删除</span>
                 </div>
                 <div class="form-tip">{{ item.tip }}</div>
             </el-form-item>
@@ -45,15 +43,15 @@
 </template>
 
 <script setup lang="ts">
-import { ref, reactive, computed, watch } from 'vue'
+import { ref, reactive, computed } from 'vue'
 import { t } from '@/lang'
-import { deepClone, filterNumber } from '@/utils/common'
 import { ElMessage } from 'element-plus'
 import { cloneDeep } from 'lodash-es'
 import addThemeComponent from './add-theme.vue'
 import useDiyStore from '@/stores/modules/diy'
-import { deleteTheme, addTheme, editTheme } from '@/app/api/diy'
+import { addTheme, editTheme } from '@/app/api/diy'
 import type { FormInstance } from 'element-plus'
+
 const diyStore = useDiyStore()
 
 const dialogThemeVisible = ref(false)
diff --git a/admin/src/app/views/diy/components/theme-list.vue b/admin/src/app/views/diy/components/theme-list.vue
index 5178e2741..99de0ae67 100644
--- a/admin/src/app/views/diy/components/theme-list.vue
+++ b/admin/src/app/views/diy/components/theme-list.vue
@@ -1,11 +1,11 @@
 <template>
     <el-dialog v-model="dialogThemeVisible" :title="dialogTitle" width="535px" align-center class="custom-theme-dialog" @close="cancelFn">
         <div class="flex flex-col items-baseline">
-            <div class="flex items-center flex-wrap max-h-[365px] overflow-auto [&>:nth-child(3n)]:mr-0" >
+            <div class="flex items-center flex-wrap max-h-[365px] overflow-auto [&>:nth-child(3n)]:mr-0">
                 <div :key="tempIndex" v-for="(tempItem, tempIndex) in themeTemp"
-                    class="flex flex-col border-[1px] border-solid border-[#dcdee2] rounded-[4px] px-[10px] pt-[10px] pb-[15px] mr-[10px] cursor-pointer my-[5px]"
-                    :class="{ '!border-[var(--el-color-primary)]': currTheme.id == tempItem.id }"
-                    @click="themeTempChange(tempItem)">
+                     class="flex flex-col border-[1px] border-solid border-[#dcdee2] rounded-[4px] px-[10px] pt-[10px] pb-[15px] mr-[10px] cursor-pointer my-[5px]"
+                     :class="{ '!border-[var(--el-color-primary)]': currTheme.id == tempItem.id }"
+                     @click="themeTempChange(tempItem)">
                     <div class="flex justify-between pb-[5px]">
                         <div class="text-[14px] text-[#666] max-w-[85px] whitespace-nowrap overflow-hidden text-ellipsis" :class="{ '!text-[#333]': currTheme.id == tempItem.id }">{{ tempItem.title }}</div>
                         <div>
@@ -14,7 +14,8 @@
                         </div>
                     </div>
                     <div class="flex">
-                        <div class="w-[70px] h-[54px] pl-[7px] pt-[9px] flex flex-col mr-[4px] rounded-[4px] text-[10px] leading-[1] text-[#fff]" :style="{ backgroundColor: tempItem.theme['--primary-color'] }">
+                        <div class="w-[70px] h-[54px] pl-[7px] pt-[9px] flex flex-col mr-[4px] rounded-[4px] text-[10px] leading-[1] text-[#fff]"
+                            :style="{ backgroundColor: tempItem.theme['--primary-color'] }">
                             <span>主色调</span>
                         </div>
                         <div class="flex flex-col">
@@ -43,14 +44,11 @@
 </template>
 
 <script setup lang="ts">
-import { ref, reactive, computed, watch } from 'vue'
+import { ref, reactive, computed } from 'vue'
 import { t } from '@/lang'
 import { setDiyTheme, getDefaultTheme, deleteTheme } from '@/app/api/diy'
 import { cloneDeep } from 'lodash-es'
 import editTheme from './edit-theme.vue'
-import useDiyStore from '@/stores/modules/diy'
-import { time } from 'echarts'
-const diyStore = useDiyStore()
 
 const editThemeRef = ref()
 const dialogThemeVisible = ref(false)
@@ -90,7 +88,7 @@ const open = (res: any) => {
 }
 
 const dialogTitle = computed(() => {
-    const name = `选择${currTheme.addon_title}配色`
+    const name = `选择${ currTheme.addon_title }配色`
     return name
 })
 
@@ -190,7 +188,7 @@ defineExpose({
 </script>
 
 <style lang="scss" scoped>
-    .secod-color-item {
-        @apply w-[60px] h-[25px] flex flex-col rounded-[4px] text-[10px] text-[#fff] leading-[1] items-end pt-[8px] pr-[7px];
-    }
+.secod-color-item {
+    @apply w-[60px] h-[25px] flex flex-col rounded-[4px] text-[10px] text-[#fff] leading-[1] items-end pt-[8px] pr-[7px];
+}
 </style>
diff --git a/admin/src/app/views/diy/edit.vue b/admin/src/app/views/diy/edit.vue
index eec0cc05b..900a8510e 100644
--- a/admin/src/app/views/diy/edit.vue
+++ b/admin/src/app/views/diy/edit.vue
@@ -238,8 +238,8 @@ route.query.title = route.query.title || ''
 route.query.back = route.query.back || '/site/diy/list'
 
 const backPath = route.query.back
-const template = ref('');
-const oldTemplate = ref('');
+const template = ref('')
+const oldTemplate = ref('')
 const wapUrl = ref('')
 const wapDomain = ref('')
 const wapPreview = ref('')
@@ -273,7 +273,7 @@ const originData = reactive({
 const isChange = ref(true) // 数据是否发生变化，true：没变化，false：变化了
 const goBack = () => {
     if (isChange.value) {
-        location.href = `${location.origin}${backPath}`;
+        location.href = `${location.origin}${backPath}`
         router.push(backPath)
     } else {
         // 数据发生变化，弹框提示：确定离开此页面
@@ -287,7 +287,7 @@ const goBack = () => {
                 autofocus: false
             }
         ).then(() => {
-            location.href = `${location.origin}${backPath}`;
+            location.href = `${location.origin}${backPath}`
         }).catch(() => {
         })
     }
@@ -328,7 +328,7 @@ watch(
 )
 
 // 切换模板页面
-const changeTemplatePage = (value:any)=> {
+const changeTemplatePage = (value: any) => {
     // 存在数据则弹框提示确认
     if (diyStore.value.length) {
         ElMessageBox.confirm(t('changeTemplatePageTips'), t('warning'), {
@@ -337,7 +337,7 @@ const changeTemplatePage = (value:any)=> {
             type: 'warning'
         }).then(() => {
             diyStore.changeCurrentIndex(-99)
-            diyStore.init(); // 清空
+            diyStore.init() // 清空
             if (value) {
                 let data = cloneDeep(templatePages[value].data);
                 diyStore.global = data.global;
@@ -349,13 +349,13 @@ const changeTemplatePage = (value:any)=> {
             }
         }).catch(() => {
             // 还原
-            template.value = oldTemplate.value;
+            template.value = oldTemplate.value
         });
     } else {
-        diyStore.init(); // 清空
+        diyStore.init() // 清空
         if (value) {
-            let data = cloneDeep(templatePages[value].data);
-            diyStore.global = data.global;
+            let data = cloneDeep(templatePages[value].data)
+            diyStore.global = data.global
             if (data.value.length) {
                 diyStore.value = data.value
             }
@@ -444,7 +444,7 @@ initPage({
         }
     }
 
-    loadDiyTemplatePages(data.type);
+    loadDiyTemplatePages(data.type)
 
     // 加载预览
     wapDomain.value = data.domain_url.wap_domain
diff --git a/admin/src/app/views/diy/theme_style.vue b/admin/src/app/views/diy/theme_style.vue
index 73b8b0a28..a0b4837e7 100644
--- a/admin/src/app/views/diy/theme_style.vue
+++ b/admin/src/app/views/diy/theme_style.vue
@@ -57,14 +57,10 @@
 import { reactive, ref, watch, computed } from 'vue'
 import { t } from '@/lang'
 import { img } from '@/utils/common'
-import { setDiyTheme, getDiyTheme, getDefaultTheme } from '@/app/api/diy'
-import { useClipboard } from '@vueuse/core'
-import { ElMessage, FormInstance } from 'element-plus'
-import { ArrowLeft } from '@element-plus/icons-vue'
+import { getDiyTheme } from '@/app/api/diy'
 import { useRoute } from 'vue-router'
 import themeList from './components/theme-list.vue'
 import { cloneDeep } from 'lodash-es'
-import { tr } from 'element-plus/es/locale'
 
 const route = useRoute()
 const pageName = route.meta.title
@@ -74,7 +70,7 @@ const data = ref([])
 
 const initData = () => {
     loading.value = true;
-    getDiyTheme().then((res) => {
+    getDiyTheme({}).then((res) => {
         let obj = cloneDeep(res.data);
         for(let key in obj){
             obj[key].key = key;
diff --git a/admin/src/app/views/diy_form/components/edit-form-address.vue b/admin/src/app/views/diy_form/components/edit-form-address.vue
index 7b9364e98..6d45408e7 100644
--- a/admin/src/app/views/diy_form/components/edit-form-address.vue
+++ b/admin/src/app/views/diy_form/components/edit-form-address.vue
@@ -1,61 +1,61 @@
 <template>
-	<!-- 内容 -->
-	<div class="content-wrap" v-show="diyStore.editTab == 'content'">
+    <!-- 内容 -->
+    <div class="content-wrap" v-show="diyStore.editTab == 'content'">
 
-		<!-- 表单组件 字段内容设置 -->
-		<slot name="field"></slot>
-		<el-form label-width="100px" class="px-[10px]">
-			<el-form-item :label="t('地址格式')">
-				<el-radio-group v-model="diyStore.editComponent.addressFormat" class="!block">
-					<el-radio class="!block" label="province/city/district/address">{{ t('省/市/区/街道/详细地址') }}</el-radio>
-					<el-radio class="!block" label="province/city/district/street">{{ t('省/市/区/街道(镇)') }}</el-radio>
-					<el-radio class="!block" label="province/city/district">{{ t('省/市/区(县)') }}</el-radio>
-					<el-radio class="!block" label="province/city">{{ t('省/市') }}</el-radio>
-					<el-radio class="!block" label="province">{{ t('省') }}</el-radio>
-				</el-radio-group>
-			</el-form-item>
-		</el-form>
+        <!-- 表单组件 字段内容设置 -->
+        <slot name="field"></slot>
+        <el-form label-width="100px" class="px-[10px]">
+            <el-form-item :label="t('地址格式')">
+                <el-radio-group v-model="diyStore.editComponent.addressFormat" class="!block">
+                    <el-radio class="!block" label="province/city/district/address">{{ t('省/市/区/街道/详细地址') }}</el-radio>
+                    <el-radio class="!block" label="province/city/district/street">{{ t('省/市/区/街道(镇)') }}</el-radio>
+                    <el-radio class="!block" label="province/city/district">{{ t('省/市/区(县)') }}</el-radio>
+                    <el-radio class="!block" label="province/city">{{ t('省/市') }}</el-radio>
+                    <el-radio class="!block" label="province">{{ t('省') }}</el-radio>
+                </el-radio-group>
+            </el-form-item>
+        </el-form>
 
-		<!-- 表单组件 其他设置 -->
-		<slot name="other"></slot>
-		<el-form label-width="100px" class="px-[10px]">
-			<el-form-item class="display-block">
-				<template #label>
-					<div class="flex items-center">
-						<span class="mr-[3px]">{{ t('隐私保护') }}</span>
-						<el-tooltip effect="light" placement="top">
-							<template #content>
-								<p>会自动将提交的个人信息做加密展示。</p>
-								<p>适用于公开展示收集的数据且不暴露用户隐私。</p>
-							</template>
-							<el-icon>
-								<QuestionFilled color="#999999" />
-							</el-icon>
-						</el-tooltip>
-					</div>
-				</template>
-				<el-switch v-model="diyStore.editComponent.field.privacyProtection" />
-				<div class="text-sm text-gray-400">{{ t('提交后自动隐藏地址，仅管理员可查看') }}</div>
-			</el-form-item>
-		</el-form>
+        <!-- 表单组件 其他设置 -->
+        <slot name="other"></slot>
+        <el-form label-width="100px" class="px-[10px]">
+            <el-form-item class="display-block">
+                <template #label>
+                    <div class="flex items-center">
+                        <span class="mr-[3px]">{{ t('隐私保护') }}</span>
+                        <el-tooltip effect="light" placement="top">
+                            <template #content>
+                                <p>会自动将提交的个人信息做加密展示。</p>
+                                <p>适用于公开展示收集的数据且不暴露用户隐私。</p>
+                            </template>
+                            <el-icon>
+                                <QuestionFilled color="#999999" />
+                            </el-icon>
+                        </el-tooltip>
+                    </div>
+                </template>
+                <el-switch v-model="diyStore.editComponent.field.privacyProtection" :disabled ="diyStore.editComponent.addressFormat != 'province/city/district/address'" />
+                <div class="text-sm text-gray-400">{{ t('提交后自动隐藏地址，仅管理员可查看') }}</div>
+            </el-form-item>
+        </el-form>
 
-	</div>
+    </div>
 
-	<!-- 样式 -->
-	<div class="style-wrap" v-show="diyStore.editTab == 'style'">
+    <!-- 样式 -->
+    <div class="style-wrap" v-show="diyStore.editTab == 'style'">
 
-		<!-- 表单组件 字段样式 -->
-		<slot name="style-field"></slot>
+        <!-- 表单组件 字段样式 -->
+        <slot name="style-field"></slot>
 
-		<!-- 组件样式 -->
-		<slot name="style"></slot>
+        <!-- 组件样式 -->
+        <slot name="style"></slot>
 
-	</div>
+    </div>
 </template>
 
 <script lang="ts" setup>
 import { t } from '@/lang'
-import { ref } from 'vue'
+import { ref,watch } from 'vue'
 import useDiyStore from '@/stores/modules/diy'
 
 const diyStore = useDiyStore()
@@ -63,9 +63,18 @@ diyStore.editComponent.ignore = ['componentBgUrl'] // 忽略公共属性
 
 // 组件验证
 diyStore.editComponent.verify = (index: number) => {
-	const res = { code: true, message: '' }
-	return res
+    const res = { code: true, message: '' }
+    return res
 }
+watch(
+  () => diyStore.editComponent.addressFormat,
+  (newVal) => {
+    if (newVal !== 'province/city/district/address') {
+      diyStore.editComponent.field.privacyProtection = false
+    }
+  },
+  { immediate: true }
+)
 
 defineExpose({})
 
diff --git a/admin/src/app/views/diy_form/components/edit-form-checkbox.vue b/admin/src/app/views/diy_form/components/edit-form-checkbox.vue
index c098f4f0c..eb4d0d0b9 100644
--- a/admin/src/app/views/diy_form/components/edit-form-checkbox.vue
+++ b/admin/src/app/views/diy_form/components/edit-form-checkbox.vue
@@ -1,81 +1,81 @@
 <template>
-	<!-- 内容 -->
-	<div class="content-wrap" v-show="diyStore.editTab == 'content'">
+    <!-- 内容 -->
+    <div class="content-wrap" v-show="diyStore.editTab == 'content'">
 
-		<!-- 表单组件 字段内容设置 -->
-		<slot name="field"></slot>
-		<el-form label-width="100px" class="px-[10px]">
-			<el-form-item :label="t('style')">
-				<el-radio-group v-model="diyStore.editComponent.style">
-					<el-radio label="style-1">{{ t('defaultSources') }}</el-radio>
-					<el-radio label="style-2">{{ t('listStyle') }}</el-radio>
-					<el-radio label="style-3">{{ t('dropDownStyle') }}</el-radio>
-				</el-radio-group>
-			</el-form-item>
-			<el-form-item :label="t('option')">
+        <!-- 表单组件 字段内容设置 -->
+        <slot name="field"></slot>
+        <el-form label-width="100px" class="px-[10px]">
+            <el-form-item :label="t('style')">
+                <el-radio-group v-model="diyStore.editComponent.style">
+                    <el-radio label="style-1">{{ t('defaultSources') }}</el-radio>
+                    <el-radio label="style-2">{{ t('listStyle') }}</el-radio>
+                    <el-radio label="style-3">{{ t('dropDownStyle') }}</el-radio>
+                </el-radio-group>
+            </el-form-item>
+            <el-form-item :label="t('option')">
                 <div ref="formCheckboxRef">
                     <div v-for="(option, index) in diyStore.editComponent.options" :key="option.id" class="option-item flex items-center mb-[15px]">
                         <el-input v-model="diyStore.editComponent.options[index].text" class="!w-[215px]" :placeholder="t('optionPlaceholder')" maxlength="30" clearable />
                         <span v-if="diyStore.editComponent.options.length > 1" @click="removeOption(index)" class="cursor-pointer ml-[5px] nc-iconfont nc-icon-shanchu-yuangaizhiV6xx"></span>
                     </div>
                 </div>
-				<span class="text-primary cursor-pointer mr-[10px]" @click="addOption">{{ t('addSingleOption') }}</span>
-				<el-popover :visible="visible" placement="bottom" :width="300">
-					<p class="mb-[5px]">{{ t('addMultipleOption') }}</p>
-					<p class="text-[#888] text-[12px] mb-[5px]">{{ t('addOptionTips') }}</p>
-					<el-input v-model.trim="optionsValue" type="textarea" clearable maxlength="200" show-word-limit />
-					<div class="mt-[10px] text-right">
-						<el-button size="small" text @click="visible = false">{{ t('cancel') }}</el-button>
-						<el-button size="small" type="primary" @click="batchAddOptions">{{ t('confirm') }}</el-button>
-					</div>
-					<template #reference>
-						<span class="text-primary cursor-pointer" @click="visible = true">{{ t('addMultipleOption') }}</span>
-					</template>
-				</el-popover>
-			</el-form-item>
-		</el-form>
+                <span class="text-primary cursor-pointer mr-[10px]" @click="addOption">{{ t('addSingleOption') }}</span>
+                <el-popover :visible="visible" placement="bottom" :width="300">
+                    <p class="mb-[5px]">{{ t('addMultipleOption') }}</p>
+                    <p class="text-[#888] text-[12px] mb-[5px]">{{ t('addOptionTips') }}</p>
+                    <el-input v-model.trim="optionsValue" type="textarea" clearable maxlength="200" show-word-limit />
+                    <div class="mt-[10px] text-right">
+                        <el-button size="small" text @click="visible = false">{{ t('cancel') }}</el-button>
+                        <el-button size="small" type="primary" @click="batchAddOptions">{{ t('confirm') }}</el-button>
+                    </div>
+                    <template #reference>
+                        <span class="text-primary cursor-pointer" @click="visible = true">{{ t('addMultipleOption') }}</span>
+                    </template>
+                </el-popover>
+            </el-form-item>
+        </el-form>
 
-		<!-- 表单组件 其他设置 -->
-		<slot name="other"></slot>
-<!--		<el-form label-width="100px" class="px-[10px]">-->
-<!--			<el-form-item class="display-block">-->
-<!--				<template #label>-->
-<!--					<div class="flex items-center">-->
-<!--						<span class="mr-[3px]">{{ t('隐私保护') }}</span>-->
-<!--						<el-tooltip effect="light" placement="top">-->
-<!--							<template #content>-->
-<!--								<p>会自动将提交的个人信息做加密展示。</p>-->
-<!--								<p>适用于公开展示收集的数据且不暴露用户隐私。</p>-->
-<!--							</template>-->
-<!--							<el-icon>-->
-<!--								<QuestionFilled color="#999999" />-->
-<!--							</el-icon>-->
-<!--						</el-tooltip>-->
-<!--					</div>-->
-<!--				</template>-->
-<!--				<el-switch v-model="diyStore.editComponent.field.privacyProtection" />-->
-<!--				<div class="text-sm text-gray-400">{{ t('提交后自动隐藏内容，仅管理员可查看') }}</div>-->
-<!--			</el-form-item>-->
+        <!-- 表单组件 其他设置 -->
+        <slot name="other"></slot>
+        <!--		<el-form label-width="100px" class="px-[10px]">-->
+        <!--			<el-form-item class="display-block">-->
+        <!--				<template #label>-->
+        <!--					<div class="flex items-center">-->
+        <!--						<span class="mr-[3px]">{{ t('隐私保护') }}</span>-->
+        <!--						<el-tooltip effect="light" placement="top">-->
+        <!--							<template #content>-->
+        <!--								<p>会自动将提交的个人信息做加密展示。</p>-->
+        <!--								<p>适用于公开展示收集的数据且不暴露用户隐私。</p>-->
+        <!--							</template>-->
+        <!--							<el-icon>-->
+        <!--								<QuestionFilled color="#999999" />-->
+        <!--							</el-icon>-->
+        <!--						</el-tooltip>-->
+        <!--					</div>-->
+        <!--				</template>-->
+        <!--				<el-switch v-model="diyStore.editComponent.field.privacyProtection" />-->
+        <!--				<div class="text-sm text-gray-400">{{ t('提交后自动隐藏内容，仅管理员可查看') }}</div>-->
+        <!--			</el-form-item>-->
 
-<!--		</el-form>-->
+        <!--		</el-form>-->
 
-	</div>
+    </div>
 
-	<!-- 样式 -->
-	<div class="style-wrap" v-show="diyStore.editTab == 'style'">
+    <!-- 样式 -->
+    <div class="style-wrap" v-show="diyStore.editTab == 'style'">
 
-		<!-- 表单组件 字段样式 -->
-		<slot name="style-field"></slot>
+        <!-- 表单组件 字段样式 -->
+        <slot name="style-field"></slot>
 
-		<!-- 组件样式 -->
-		<slot name="style"></slot>
+        <!-- 组件样式 -->
+        <slot name="style"></slot>
 
-	</div>
+    </div>
 </template>
 
 <script lang="ts" setup>
 import { t } from '@/lang'
-import { ref, onMounted, nextTick} from 'vue'
+import { ref, onMounted, nextTick } from 'vue'
 import useDiyStore from '@/stores/modules/diy'
 import Sortable from 'sortablejs'
 import { range } from 'lodash-es'
@@ -86,84 +86,84 @@ diyStore.editComponent.ignore = ['componentBgUrl'] // 忽略公共属性
 
 // 组件验证
 diyStore.editComponent.verify = (index: number) => {
-	const res = { code: true, message: '' }
-	let pass = true;
-	for (let i = 0; i < diyStore.value[index].options.length; i++) {
-		if (!diyStore.value[index].options[i].text) {
-			res.code = false;
-			res.message = t('optionPlaceholder');
-			pass = false;
-			break;
-		}
-	}
+    const res = { code: true, message: '' }
+    let pass = true;
+    for (let i = 0; i < diyStore.value[index].options.length; i++) {
+        if (!diyStore.value[index].options[i].text) {
+            res.code = false;
+            res.message = t('optionPlaceholder');
+            pass = false;
+            break;
+        }
+    }
 
-	if (!pass) return res;
+    if (!pass) return res;
 
-	let uniqueOptions = uniqueByKey(diyStore.value[index].options, 'text')
-	if (uniqueOptions.length != diyStore.value[index].options.length) {
-		res.code = false;
-		res.message = t('errorTipsOne')
-	}
-	return res
+    let uniqueOptions = uniqueByKey(diyStore.value[index].options, 'text')
+    if (uniqueOptions.length != diyStore.value[index].options.length) {
+        res.code = false;
+        res.message = t('errorTipsOne')
+    }
+    return res
 }
 
 diyStore.editComponent.options.forEach((item: any) => {
-	if (!item.id) item.id = diyStore.generateRandom()
+    if (!item.id) item.id = diyStore.generateRandom()
 })
 
 const visible = ref(false)
 const optionsValue = ref()
 const addOption = () => {
-	diyStore.editComponent.options.push({
-		id: diyStore.generateRandom(),
-		text: '选项' + (diyStore.editComponent.options.length + 1)
-	});
+    diyStore.editComponent.options.push({
+        id: diyStore.generateRandom(),
+        text: '选项' + (diyStore.editComponent.options.length + 1)
+    });
 };
 
-const removeOption = (index:any) => {
+const removeOption = (index: any) => {
     diyStore.editComponent.options.splice(index, 1);
 }
 
 // 批量添加选项
 const batchAddOptions = () => {
-	if (optionsValue.value.trim()) {
-		const newOptions = optionsValue.value.split(',').map((option: any) => {
-			return {
-				id: diyStore.generateRandom(),
-				text: option.trim()
-			};
-		}).filter((option: any) => option.text !== '');
+    if (optionsValue.value.trim()) {
+        const newOptions = optionsValue.value.split(',').map((option: any) => {
+            return {
+                id: diyStore.generateRandom(),
+                text: option.trim()
+            };
+        }).filter((option: any) => option.text !== '');
 
-		// 去除重复的选项
-		const uniqueNewOptions = uniqueByKey(newOptions, 'text');
+        // 去除重复的选项
+        const uniqueNewOptions = uniqueByKey(newOptions, 'text');
 
-		// 过滤掉已存在的选项
-		const filteredNewOptions = uniqueNewOptions.filter((newOption: any) =>
-				!diyStore.editComponent.options.some((existingOption: any) => existingOption.text === newOption.text)
-		);
+        // 过滤掉已存在的选项
+        const filteredNewOptions = uniqueNewOptions.filter((newOption: any) =>
+            !diyStore.editComponent.options.some((existingOption: any) => existingOption.text === newOption.text)
+        );
 
-		// 如果有新的选项，添加到选项列表中
-		if (filteredNewOptions.length > 0) {
-			diyStore.editComponent.options.push(...filteredNewOptions);
-		} else {
-			ElMessage({
-				message: t('errorTipsTwo'),
-				type: "error",
-			});
-		}
+        // 如果有新的选项，添加到选项列表中
+        if (filteredNewOptions.length > 0) {
+            diyStore.editComponent.options.push(...filteredNewOptions);
+        } else {
+            ElMessage({
+                message: t('errorTipsTwo'),
+                type: "error",
+            });
+        }
 
-		optionsValue.value = '';
-		visible.value = false;
-	}
+        optionsValue.value = '';
+        visible.value = false;
+    }
 };
 
 // 数组去重
 const uniqueByKey = (arr: any, key: any) => {
-	const seen = new Set();
-	return arr.filter((item: any) => {
-		const serializedKey = JSON.stringify(item[key]);
-		return seen.has(serializedKey) ? false : seen.add(serializedKey);
-	});
+    const seen = new Set();
+    return arr.filter((item: any) => {
+        const serializedKey = JSON.stringify(item[key]);
+        return seen.has(serializedKey) ? false : seen.add(serializedKey);
+    });
 }
 
 const formCheckboxRef = ref()
diff --git a/admin/src/app/views/diy_form/components/edit-form-date-scope.vue b/admin/src/app/views/diy_form/components/edit-form-date-scope.vue
index ee0462d1c..c9644f881 100644
--- a/admin/src/app/views/diy_form/components/edit-form-date-scope.vue
+++ b/admin/src/app/views/diy_form/components/edit-form-date-scope.vue
@@ -1,93 +1,98 @@
 <template>
-	<!-- 内容 -->
-	<div class="content-wrap" v-show="diyStore.editTab == 'content'">
+    <!-- 内容 -->
+    <div class="content-wrap" v-show="diyStore.editTab == 'content'">
 
-		<!-- 表单组件 字段内容设置 -->
-		<slot name="field"></slot>
-		<el-form label-width="100px" class="px-[10px]">
-			<el-form-item :label="t('dataFormat')">
-				<el-radio-group v-model="diyStore.editComponent.dateFormat">
-					<div class="flex flex-col">
+        <!-- 表单组件 字段内容设置 -->
+        <slot name="field"></slot>
+        <el-form label-width="100px" class="px-[10px]">
+            <el-form-item :label="t('dataFormat')">
+                <el-radio-group v-model="diyStore.editComponent.dateFormat">
+                    <div class="flex flex-col">
                         <el-radio label="YYYY年M月D日">{{ dateFormat.format1 }}</el-radio>
                         <el-radio label="YYYY-MM-DD">{{ dateFormat.format2 }}</el-radio>
                         <el-radio label="YYYY/MM/DD">{{ dateFormat.format3 }}</el-radio>
                     </div>
-				</el-radio-group>
-			</el-form-item>
-		</el-form>
+                </el-radio-group>
+            </el-form-item>
+        </el-form>
 
-		<div class="edit-attr-item-wrap">
-			<h3 class="mb-[10px]">{{ t('startDate') }}</h3>
-			<el-form label-width="100px" class="px-[10px]" @submit.prevent>
-				<el-form-item :label="t('formPlaceholder')">
-					<el-input v-model.trim="diyStore.editComponent.start.placeholder" :placeholder="t('formPlaceholderTips')" clearable maxlength="15" show-word-limit />
-				</el-form-item>
-				<el-form-item :label="t('defaultValue')">
-					<el-switch v-model="diyStore.editComponent.start.defaultControl" />
-				</el-form-item>
-				<el-form-item v-if="diyStore.editComponent.start.defaultControl">
-					<el-radio-group v-model="diyStore.editComponent.start.dateWay">
-						<el-radio label="current">{{ t('currentDate') }}</el-radio>
-						<el-radio label="diy">{{ t('diyDate') }}</el-radio>
-					</el-radio-group>
-				</el-form-item>
-				<el-form-item v-if="diyStore.editComponent.start.defaultControl && diyStore.editComponent.start.dateWay == 'diy'">
-					<el-date-picker v-model="diyStore.editComponent.field.default.start.date" format="YYYY/MM/DD" value-format="YYYY-MM-DD" type="date" :placeholder="t('startDataPlaceholder')" @change="startDateChange" />
-				</el-form-item>
-			</el-form>
-		</div>
+        <div class="edit-attr-item-wrap">
+            <h3 class="mb-[10px]">{{ t('startDate') }}</h3>
+            <el-form label-width="100px" class="px-[10px]" @submit.prevent>
+                <el-form-item :label="t('formPlaceholder')">
+                    <el-input v-model.trim="diyStore.editComponent.start.placeholder" :placeholder="t('formPlaceholderTips')" clearable maxlength="15" show-word-limit />
+                </el-form-item>
+                <el-form-item :label="t('defaultValue')">
+                    <el-switch v-model="diyStore.editComponent.start.defaultControl" />
+                </el-form-item>
+                <el-form-item v-if="diyStore.editComponent.start.defaultControl">
+                    <el-radio-group v-model="diyStore.editComponent.start.dateWay">
+                        <el-radio label="current">{{ t('currentDate') }}</el-radio>
+                        <el-radio label="diy">{{ t('diyDate') }}</el-radio>
+                    </el-radio-group>
+                </el-form-item>
+                <el-form-item
+                    v-if="diyStore.editComponent.start.defaultControl && diyStore.editComponent.start.dateWay == 'diy'">
+                    <el-date-picker v-model="diyStore.editComponent.field.default.start.date" format="YYYY/MM/DD" value-format="YYYY-MM-DD" type="date" :placeholder="t('startDataPlaceholder')" @change="startDateChange" />
+                </el-form-item>
+            </el-form>
+        </div>
 
-		<div class="edit-attr-item-wrap">
-			<h3 class="mb-[10px]">{{ t('endDate') }}</h3>
-			<el-form label-width="100px" class="px-[10px]" @submit.prevent>
-				<el-form-item :label="t('formPlaceholder')">
-					<el-input v-model.trim="diyStore.editComponent.end.placeholder" :placeholder="t('formPlaceholderTips')" clearable maxlength="15" show-word-limit />
-				</el-form-item>
-				<el-form-item :label="t('defaultValue')">
-					<el-switch v-model="diyStore.editComponent.end.defaultControl" />
-				</el-form-item>
-				<el-form-item v-if="diyStore.editComponent.end.defaultControl">
-					<el-radio-group v-model="diyStore.editComponent.end.dateWay">
-						<el-radio label="current">{{ t('currentDate') }}</el-radio>
-						<el-radio label="diy">{{ t('diyDate') }}</el-radio>
-					</el-radio-group>
-				</el-form-item>
-				<el-form-item v-if="diyStore.editComponent.end.defaultControl && diyStore.editComponent.end.dateWay == 'diy'">
-					<el-date-picker :disabled-date="disabledEndDate" v-model="diyStore.editComponent.field.default.end.date" format="YYYY/MM/DD" value-format="YYYY-MM-DD" type="date" :placeholder="t('endDataPlaceholder')" @change="endDateChange" />
-				</el-form-item>
-			</el-form>
-		</div>
+        <div class="edit-attr-item-wrap">
+            <h3 class="mb-[10px]">{{ t('endDate') }}</h3>
+            <el-form label-width="100px" class="px-[10px]" @submit.prevent>
+                <el-form-item :label="t('formPlaceholder')">
+                    <el-input v-model.trim="diyStore.editComponent.end.placeholder" :placeholder="t('formPlaceholderTips')" clearable maxlength="15" show-word-limit />
+                </el-form-item>
+                <el-form-item :label="t('defaultValue')">
+                    <el-switch v-model="diyStore.editComponent.end.defaultControl" />
+                </el-form-item>
+                <el-form-item v-if="diyStore.editComponent.end.defaultControl">
+                    <el-radio-group v-model="diyStore.editComponent.end.dateWay">
+                        <el-radio label="current">{{ t('currentDate') }}</el-radio>
+                        <el-radio label="diy">{{ t('diyDate') }}</el-radio>
+                    </el-radio-group>
+                </el-form-item>
+                <el-form-item
+                    v-if="diyStore.editComponent.end.defaultControl && diyStore.editComponent.end.dateWay == 'diy'">
+                    <el-date-picker :disabled-date="disabledEndDate"
+                                    v-model="diyStore.editComponent.field.default.end.date" format="YYYY/MM/DD"
+                                    value-format="YYYY-MM-DD" type="date" :placeholder="t('endDataPlaceholder')"
+                                    @change="endDateChange" />
+                </el-form-item>
+            </el-form>
+        </div>
 
-		<!-- 表单组件 其他设置 -->
-		<slot name="other"></slot>
+        <!-- 表单组件 其他设置 -->
+        <slot name="other"></slot>
 
-	</div>
+    </div>
 
-	<!-- 样式 -->
-	<div class="style-wrap" v-show="diyStore.editTab == 'style'">
+    <!-- 样式 -->
+    <div class="style-wrap" v-show="diyStore.editTab == 'style'">
 
-		<div class="edit-attr-item-wrap">
-			<h3 class="mb-[10px]">{{ t('textStyle') }}</h3>
-			<el-form label-width="80px" class="px-[10px]">
-				<el-form-item :label="t('textFontSize')">
-					<el-slider v-model="diyStore.editComponent.fontSize" show-input size="small" class="ml-[10px] diy-nav-slider" :min="12" :max="18" />
-				</el-form-item>
-				<el-form-item :label="t('textFontWeight')">
-					<el-radio-group v-model="diyStore.editComponent.fontWeight">
-						<el-radio :label="'normal'">{{ t('fontWeightNormal') }}</el-radio>
-						<el-radio :label="'bold'">{{ t('fontWeightBold') }}</el-radio>
-					</el-radio-group>
-				</el-form-item>
-				<el-form-item :label="t('textColor')">
-					<el-color-picker v-model="diyStore.editComponent.textColor" />
-				</el-form-item>
-			</el-form>
-		</div>
+        <div class="edit-attr-item-wrap">
+            <h3 class="mb-[10px]">{{ t('textStyle') }}</h3>
+            <el-form label-width="80px" class="px-[10px]">
+                <el-form-item :label="t('textFontSize')">
+                    <el-slider v-model="diyStore.editComponent.fontSize" show-input size="small" class="ml-[10px] diy-nav-slider" :min="12" :max="18" />
+                </el-form-item>
+                <el-form-item :label="t('textFontWeight')">
+                    <el-radio-group v-model="diyStore.editComponent.fontWeight">
+                        <el-radio :label="'normal'">{{ t('fontWeightNormal') }}</el-radio>
+                        <el-radio :label="'bold'">{{ t('fontWeightBold') }}</el-radio>
+                    </el-radio-group>
+                </el-form-item>
+                <el-form-item :label="t('textColor')">
+                    <el-color-picker v-model="diyStore.editComponent.textColor" />
+                </el-form-item>
+            </el-form>
+        </div>
 
-		<!-- 组件样式 -->
-		<slot name="style"></slot>
+        <!-- 组件样式 -->
+        <slot name="style"></slot>
 
-	</div>
+    </div>
 </template>
 
 <script lang="ts" setup>
@@ -142,7 +147,7 @@ const dateFormat: any = reactive({
 })
 
 // 结束日期-禁止的日期
-const disabledEndDate = (time:Date)=>{
+const disabledEndDate = (time: Date) => {
     let cutoffDate = null
     let bool = false
     if (diyStore.editComponent.start && diyStore.editComponent.start.defaultControl) {
@@ -177,10 +182,10 @@ onMounted(() => {
 
     const hours = String(today.getHours()).padStart(2, '0')
     const minutes = String(today.getMinutes()).padStart(2, '0')
-    dateFormat.format1 = `${year}年${month}月${day}日`
-    dateFormat.format2 = `${year}-${month}-${day}`
-    dateFormat.format3 = `${year}/${month}/${day}`
-    dateFormat.format4 = `${year}-${month}-${day} ${hours}:${minutes}`
+    dateFormat.format1 = `${ year }年${ month }月${ day }日`
+    dateFormat.format2 = `${ year }-${ month }-${ day }`
+    dateFormat.format3 = `${ year }/${ month }/${ day }`
+    dateFormat.format4 = `${ year }-${ month }-${ day } ${ hours }:${ minutes }`
 })
 
 // 开始日期选择器
diff --git a/admin/src/app/views/diy_form/components/edit-form-date.vue b/admin/src/app/views/diy_form/components/edit-form-date.vue
index c65d3ee12..6e636424e 100644
--- a/admin/src/app/views/diy_form/components/edit-form-date.vue
+++ b/admin/src/app/views/diy_form/components/edit-form-date.vue
@@ -1,56 +1,56 @@
 <template>
-	<!-- 内容 -->
-	<div class="content-wrap" v-show="diyStore.editTab == 'content'">
+    <!-- 内容 -->
+    <div class="content-wrap" v-show="diyStore.editTab == 'content'">
 
-		<!-- 表单组件 字段内容设置 -->
-		<slot name="field"></slot>
-		<el-form label-width="100px" class="px-[10px]" @submit.prevent>
-			<el-form-item :label="t('dataFormat')">
-				<el-radio-group v-model="diyStore.editComponent.dateFormat" class="!block">
-					<el-radio class="!block" label="YYYY年M月D日">{{ dateFormat.format1 }}</el-radio>
-					<el-radio class="!block" label="YYYY-MM-DD">{{ dateFormat.format2 }}</el-radio>
-					<el-radio class="!block" label="YYYY/MM/DD">{{ dateFormat.format3 }}</el-radio>
-					<el-radio class="!block" label="YYYY-MM-DD HH:mm">{{ dateFormat.format4 }}</el-radio>
-				</el-radio-group>
-			</el-form-item>
-			<el-form-item :label="t('formPlaceholder')">
-				<el-input v-model.trim="diyStore.editComponent.placeholder" :placeholder="t('formPlaceholderTips')" clearable maxlength="15" show-word-limit />
-			</el-form-item>
-			<el-form-item :label="t('defaultValue')">
-				<el-switch v-model="diyStore.editComponent.defaultControl"/>
-			</el-form-item>
-			<el-form-item v-if="diyStore.editComponent.defaultControl">
-				<el-radio-group v-model="diyStore.editComponent.dateWay">
-					<el-radio label="current">{{ t('currentDate') }}</el-radio>
-					<el-radio label="diy">{{ t('diyDate') }}</el-radio>
-				</el-radio-group>
-			</el-form-item>
-			<el-form-item v-if="diyStore.editComponent.defaultControl && diyStore.editComponent.dateWay == 'diy'">
-				<el-date-picker v-if="diyStore.editComponent.dateFormat != 'YYYY-MM-DD HH:mm'" v-model="diyStore.editComponent.field.default.date" format="YYYY/MM/DD" value-format="YYYY-MM-DD" type="date" :placeholder="t('dataPlaceholder')" @change="dateChange"/>
-                <el-date-picker v-else v-model="diyStore.editComponent.field.default.date" format="YYYY/MM/DD HH:mm" value-format="YYYY-MM-DD HH:mm" type="datetime" :placeholder="t('dataPlaceholder')" @change="dateChange"/>
-			</el-form-item>
-		</el-form>
+        <!-- 表单组件 字段内容设置 -->
+        <slot name="field"></slot>
+        <el-form label-width="100px" class="px-[10px]" @submit.prevent>
+            <el-form-item :label="t('dataFormat')">
+                <el-radio-group v-model="diyStore.editComponent.dateFormat" class="!block">
+                    <el-radio class="!block" label="YYYY年M月D日">{{ dateFormat.format1 }}</el-radio>
+                    <el-radio class="!block" label="YYYY-MM-DD">{{ dateFormat.format2 }}</el-radio>
+                    <el-radio class="!block" label="YYYY/MM/DD">{{ dateFormat.format3 }}</el-radio>
+                    <el-radio class="!block" label="YYYY-MM-DD HH:mm">{{ dateFormat.format4 }}</el-radio>
+                </el-radio-group>
+            </el-form-item>
+            <el-form-item :label="t('formPlaceholder')">
+                <el-input v-model.trim="diyStore.editComponent.placeholder" :placeholder="t('formPlaceholderTips')" clearable maxlength="15" show-word-limit />
+            </el-form-item>
+            <el-form-item :label="t('defaultValue')">
+                <el-switch v-model="diyStore.editComponent.defaultControl" />
+            </el-form-item>
+            <el-form-item v-if="diyStore.editComponent.defaultControl">
+                <el-radio-group v-model="diyStore.editComponent.dateWay">
+                    <el-radio label="current">{{ t('currentDate') }}</el-radio>
+                    <el-radio label="diy">{{ t('diyDate') }}</el-radio>
+                </el-radio-group>
+            </el-form-item>
+            <el-form-item v-if="diyStore.editComponent.defaultControl && diyStore.editComponent.dateWay == 'diy'">
+                <el-date-picker v-if="diyStore.editComponent.dateFormat != 'YYYY-MM-DD HH:mm'" v-model="diyStore.editComponent.field.default.date" format="YYYY/MM/DD" value-format="YYYY-MM-DD" type="date" :placeholder="t('dataPlaceholder')" @change="dateChange" />
+                <el-date-picker v-else v-model="diyStore.editComponent.field.default.date" format="YYYY/MM/DD HH:mm" value-format="YYYY-MM-DD HH:mm" type="datetime" :placeholder="t('dataPlaceholder')" @change="dateChange" />
+            </el-form-item>
+        </el-form>
 
-		<!-- 表单组件 其他设置 -->
-		<slot name="other"></slot>
+        <!-- 表单组件 其他设置 -->
+        <slot name="other"></slot>
 
-	</div>
+    </div>
 
-	<!-- 样式 -->
-	<div class="style-wrap" v-show="diyStore.editTab == 'style'">
+    <!-- 样式 -->
+    <div class="style-wrap" v-show="diyStore.editTab == 'style'">
 
-		<!-- 表单组件 字段样式 -->
-		<slot name="style-field"></slot>
+        <!-- 表单组件 字段样式 -->
+        <slot name="style-field"></slot>
 
-		<!-- 组件样式 -->
-		<slot name="style"></slot>
+        <!-- 组件样式 -->
+        <slot name="style"></slot>
 
-	</div>
+    </div>
 </template>
 
 <script lang="ts" setup>
 import { t } from '@/lang'
-import { ref,reactive,watch,onMounted } from 'vue'
+import { ref, reactive, onMounted } from 'vue'
 import { timeTurnTimeStamp } from '@/utils/common'
 import useDiyStore from '@/stores/modules/diy'
 
@@ -64,16 +64,16 @@ diyStore.editComponent.verify = (index: number) => {
 }
 
 const dateFormat: any = reactive({
-	format1: '',
-	format2: '',
-	format3: '',
-	format4: ''
+    format1: '',
+    format2: '',
+    format3: '',
+    format4: ''
 });
 
 onMounted(() => {
     // 初始赋值当天日期
     const today = new Date();
-	if (!diyStore.editComponent.field.default.date) {
+    if (!diyStore.editComponent.field.default.date) {
         diyStore.editComponent.field.default.date = today.toISOString().split('T')[0];
         diyStore.editComponent.field.default.timestamp = today.getTime() / 1000;
     }
@@ -83,13 +83,13 @@ onMounted(() => {
 
     const hours = String(today.getHours()).padStart(2, '0');
     const minutes = String(today.getMinutes()).padStart(2, '0');
-    dateFormat.format1 = `${year}年${month}月${day}日`;
-    dateFormat.format2 = `${year}-${month}-${day}`;
-    dateFormat.format3 = `${year}/${month}/${day}`;
-    dateFormat.format4 = `${year}-${month}-${day} ${hours}:${minutes}`;
+    dateFormat.format1 = `${ year }年${ month }月${ day }日`;
+    dateFormat.format2 = `${ year }-${ month }-${ day }`;
+    dateFormat.format3 = `${ year }/${ month }/${ day }`;
+    dateFormat.format4 = `${ year }-${ month }-${ day } ${ hours }:${ minutes }`;
 });
 
-const dateChange = (date: any)=>{
+const dateChange = (date: any) => {
     diyStore.editComponent.field.default.date = date;
     diyStore.editComponent.field.default.timestamp = timeTurnTimeStamp(date);
 }
diff --git a/admin/src/app/views/diy_form/components/edit-form-email.vue b/admin/src/app/views/diy_form/components/edit-form-email.vue
index ac42c732f..ef68eebfd 100644
--- a/admin/src/app/views/diy_form/components/edit-form-email.vue
+++ b/admin/src/app/views/diy_form/components/edit-form-email.vue
@@ -1,30 +1,30 @@
 <template>
-	<!-- 内容 -->
-	<div class="content-wrap" v-show="diyStore.editTab == 'content'">
+    <!-- 内容 -->
+    <div class="content-wrap" v-show="diyStore.editTab == 'content'">
 
-		<!-- 表单组件 字段内容设置 -->
-		<slot name="field"></slot>
-		<el-form label-width="100px" class="px-[10px]" @submit.prevent>
-			<el-form-item :label="t('formPlaceholder')">
-				<el-input v-model.trim="diyStore.editComponent.placeholder" :placeholder="t('formPlaceholderTips')" clearable maxlength="15" show-word-limit />
-			</el-form-item>
-		</el-form>
+        <!-- 表单组件 字段内容设置 -->
+        <slot name="field"></slot>
+        <el-form label-width="100px" class="px-[10px]" @submit.prevent>
+            <el-form-item :label="t('formPlaceholder')">
+                <el-input v-model.trim="diyStore.editComponent.placeholder" :placeholder="t('formPlaceholderTips')" clearable maxlength="15" show-word-limit />
+            </el-form-item>
+        </el-form>
 
-		<!-- 表单组件 其他设置 -->
-		<slot name="other"></slot>
+        <!-- 表单组件 其他设置 -->
+        <slot name="other"></slot>
 
-	</div>
+    </div>
 
-	<!-- 样式 -->
-	<div class="style-wrap" v-show="diyStore.editTab == 'style'">
+    <!-- 样式 -->
+    <div class="style-wrap" v-show="diyStore.editTab == 'style'">
 
-		<!-- 表单组件 字段样式 -->
-		<slot name="style-field"></slot>
+        <!-- 表单组件 字段样式 -->
+        <slot name="style-field"></slot>
 
-		<!-- 组件样式 -->
-		<slot name="style"></slot>
+        <!-- 组件样式 -->
+        <slot name="style"></slot>
 
-	</div>
+    </div>
 </template>
 
 <script lang="ts" setup>
@@ -38,7 +38,7 @@ diyStore.editComponent.ignore = ['componentBgUrl'] // 忽略公共属性
 // 组件验证
 diyStore.editComponent.verify = (index: number) => {
     const res = { code: true, message: '' }
-	// todo 只需要考虑该组件自身的验证
+    // todo 只需要考虑该组件自身的验证
     return res
 }
 defineExpose({})
diff --git a/admin/src/app/views/diy_form/components/edit-form-file.vue b/admin/src/app/views/diy_form/components/edit-form-file.vue
index 31f1c83d0..138d375e2 100644
--- a/admin/src/app/views/diy_form/components/edit-form-file.vue
+++ b/admin/src/app/views/diy_form/components/edit-form-file.vue
@@ -1,31 +1,31 @@
 <template>
-	<!-- 内容 -->
-	<div class="content-wrap" v-show="diyStore.editTab == 'content'">
+    <!-- 内容 -->
+    <div class="content-wrap" v-show="diyStore.editTab == 'content'">
 
-		<!-- 表单组件 字段内容设置 -->
-		<slot name="field"></slot>
-		<el-form label-width="100px" class="px-[10px]" @submit.prevent>
-			<el-form-item :label="t('限制上传大小')">
-				<el-input v-model.trim="diyStore.editComponent.limitUploadSize" clearable maxlength="15" />
-				/单位MB，目前是Bit，要转换，*1024
-			</el-form-item>
-		</el-form>
+        <!-- 表单组件 字段内容设置 -->
+        <slot name="field"></slot>
+        <el-form label-width="100px" class="px-[10px]" @submit.prevent>
+            <el-form-item :label="t('限制上传大小')">
+                <el-input v-model.trim="diyStore.editComponent.limitUploadSize" clearable maxlength="15" />
+                /单位MB，目前是Bit，要转换，*1024
+            </el-form-item>
+        </el-form>
 
-		<!-- 表单组件 其他设置 -->
-		<slot name="other"></slot>
+        <!-- 表单组件 其他设置 -->
+        <slot name="other"></slot>
 
-	</div>
+    </div>
 
-	<!-- 样式 -->
-	<div class="style-wrap" v-show="diyStore.editTab == 'style'">
+    <!-- 样式 -->
+    <div class="style-wrap" v-show="diyStore.editTab == 'style'">
 
-		<!-- 表单组件 字段样式 -->
-		<slot name="style-field"></slot>
+        <!-- 表单组件 字段样式 -->
+        <slot name="style-field"></slot>
 
-		<!-- 组件样式 -->
-		<slot name="style"></slot>
+        <!-- 组件样式 -->
+        <slot name="style"></slot>
 
-	</div>
+    </div>
 </template>
 
 <script lang="ts" setup>
diff --git a/admin/src/app/views/diy_form/components/edit-form-identity.vue b/admin/src/app/views/diy_form/components/edit-form-identity.vue
index d752bcb02..4ac9920d0 100644
--- a/admin/src/app/views/diy_form/components/edit-form-identity.vue
+++ b/admin/src/app/views/diy_form/components/edit-form-identity.vue
@@ -1,67 +1,67 @@
 <template>
-	<!-- 内容 -->
-	<div class="content-wrap" v-show="diyStore.editTab == 'content'">
+    <!-- 内容 -->
+    <div class="content-wrap" v-show="diyStore.editTab == 'content'">
 
-		<!-- 表单组件 字段内容设置 -->
-		<slot name="field"></slot>
-		<el-form label-width="100px" class="px-[10px]" @submit.prevent>
-			<el-form-item :label="t('formPlaceholder')">
-				<el-input v-model.trim="diyStore.editComponent.placeholder" :placeholder="t('formPlaceholderTips')" clearable maxlength="15" show-word-limit />
-			</el-form-item>
-		</el-form>
+        <!-- 表单组件 字段内容设置 -->
+        <slot name="field"></slot>
+        <el-form label-width="100px" class="px-[10px]" @submit.prevent>
+            <el-form-item :label="t('formPlaceholder')">
+                <el-input v-model.trim="diyStore.editComponent.placeholder" :placeholder="t('formPlaceholderTips')" clearable maxlength="15" show-word-limit />
+            </el-form-item>
+        </el-form>
 
-		<!-- 表单组件 其他设置 -->
-		<slot name="other"></slot>
-		<el-form label-width="100px" class="px-[10px]">
-			<el-form-item>
-				<template #label>
-					<div class="flex items-center">
-						<span class="mr-[3px]">{{ t('preventDuplication') }}</span>
-						<el-tooltip effect="light" placement="top">
-							<template #content>
-								<p>{{ t('preventDuplicationTipsOne') }}</p>
-								<p>{{ t('preventDuplicationTipsTwo') }}</p>
-							</template>
-							<el-icon>
-								<QuestionFilled color="#999999" />
-							</el-icon>
-						</el-tooltip>
-					</div>
-				</template>
-				<el-switch v-model="diyStore.editComponent.field.unique" />
-			</el-form-item>
-			<el-form-item class="display-block">
-				<template #label>
-					<div class="flex items-center">
-						<span class="mr-[3px]">{{ t('privacyProtection') }}</span>
-						<el-tooltip effect="light" placement="top">
-							<template #content>
-								<p>{{ t('privacyProtectionTipsOne') }}</p>
-								<p>{{ t('privacyProtectionTipsTwo') }}</p>
-							</template>
-							<el-icon>
-								<QuestionFilled color="#999999" />
-							</el-icon>
-						</el-tooltip>
-					</div>
-				</template>
-				<el-switch v-model="diyStore.editComponent.field.privacyProtection" />
-				<div class="text-sm text-gray-400">{{ t('privacyProtectionTipsThree') }}</div>
-			</el-form-item>
-		</el-form>
+        <!-- 表单组件 其他设置 -->
+        <slot name="other"></slot>
+        <el-form label-width="100px" class="px-[10px]">
+            <el-form-item>
+                <template #label>
+                    <div class="flex items-center">
+                        <span class="mr-[3px]">{{ t('preventDuplication') }}</span>
+                        <el-tooltip effect="light" placement="top">
+                            <template #content>
+                                <p>{{ t('preventDuplicationTipsOne') }}</p>
+                                <p>{{ t('preventDuplicationTipsTwo') }}</p>
+                            </template>
+                            <el-icon>
+                                <QuestionFilled color="#999999" />
+                            </el-icon>
+                        </el-tooltip>
+                    </div>
+                </template>
+                <el-switch v-model="diyStore.editComponent.field.unique" />
+            </el-form-item>
+            <el-form-item class="display-block">
+                <template #label>
+                    <div class="flex items-center">
+                        <span class="mr-[3px]">{{ t('privacyProtection') }}</span>
+                        <el-tooltip effect="light" placement="top">
+                            <template #content>
+                                <p>{{ t('privacyProtectionTipsOne') }}</p>
+                                <p>{{ t('privacyProtectionTipsTwo') }}</p>
+                            </template>
+                            <el-icon>
+                                <QuestionFilled color="#999999" />
+                            </el-icon>
+                        </el-tooltip>
+                    </div>
+                </template>
+                <el-switch v-model="diyStore.editComponent.field.privacyProtection" />
+                <div class="text-sm text-gray-400">{{ t('privacyProtectionTipsThree') }}</div>
+            </el-form-item>
+        </el-form>
 
-	</div>
+    </div>
 
-	<!-- 样式 -->
-	<div class="style-wrap" v-show="diyStore.editTab == 'style'">
+    <!-- 样式 -->
+    <div class="style-wrap" v-show="diyStore.editTab == 'style'">
 
-		<!-- 表单组件 字段样式 -->
-		<slot name="style-field"></slot>
+        <!-- 表单组件 字段样式 -->
+        <slot name="style-field"></slot>
 
-		<!-- 组件样式 -->
-		<slot name="style"></slot>
+        <!-- 组件样式 -->
+        <slot name="style"></slot>
 
-	</div>
+    </div>
 </template>
 
 <script lang="ts" setup>
@@ -75,7 +75,7 @@ diyStore.editComponent.ignore = ['componentBgUrl'] // 忽略公共属性
 // 组件验证
 diyStore.editComponent.verify = (index: number) => {
     const res = { code: true, message: '' }
-	// todo 只需要考虑该组件自身的验证
+    // todo 只需要考虑该组件自身的验证
     return res
 }
 defineExpose({})
diff --git a/admin/src/app/views/diy_form/components/edit-form-image.vue b/admin/src/app/views/diy_form/components/edit-form-image.vue
index 5cbc1ee16..2a0718881 100644
--- a/admin/src/app/views/diy_form/components/edit-form-image.vue
+++ b/admin/src/app/views/diy_form/components/edit-form-image.vue
@@ -1,13 +1,13 @@
 <template>
-	<!-- 内容 -->
-	<div class="content-wrap" v-show="diyStore.editTab == 'content'">
+    <!-- 内容 -->
+    <div class="content-wrap" v-show="diyStore.editTab == 'content'">
 
-		<!-- 表单组件 字段内容设置 -->
-		<slot name="field"></slot>
-		<el-form label-width="100px" class="px-[10px]" @submit.prevent>
-			<el-form-item :label="t('imageLimit')">
-				<el-input v-model.trim="diyStore.editComponent.limit" :placeholder="t('imageLimitPlaceholder')" clearable maxlength="2" />
-			</el-form-item>
+        <!-- 表单组件 字段内容设置 -->
+        <slot name="field"></slot>
+        <el-form label-width="100px" class="px-[10px]" @submit.prevent>
+            <el-form-item :label="t('imageLimit')">
+                <el-input v-model.trim="diyStore.editComponent.limit" :placeholder="t('imageLimitPlaceholder')" clearable maxlength="2" />
+            </el-form-item>
 
             <el-form-item :label="t('上传方式')">
                 <el-checkbox-group v-model="diyStore.editComponent.uploadMode" :min="1">
@@ -15,23 +15,23 @@
                     <el-checkbox label="从相册选择" value="select_from_album" />
                 </el-checkbox-group>
             </el-form-item>
-		</el-form>
+        </el-form>
 
-		<!-- 表单组件 其他设置 -->
-		<slot name="other"></slot>
+        <!-- 表单组件 其他设置 -->
+        <slot name="other"></slot>
 
-	</div>
+    </div>
 
-	<!-- 样式 -->
-	<div class="style-wrap" v-show="diyStore.editTab == 'style'">
+    <!-- 样式 -->
+    <div class="style-wrap" v-show="diyStore.editTab == 'style'">
 
-		<!-- 表单组件 字段样式 -->
-		<slot name="style-field"></slot>
+        <!-- 表单组件 字段样式 -->
+        <slot name="style-field"></slot>
 
-		<!-- 组件样式 -->
-		<slot name="style"></slot>
+        <!-- 组件样式 -->
+        <slot name="style"></slot>
 
-	</div>
+    </div>
 </template>
 
 <script lang="ts" setup>
diff --git a/admin/src/app/views/diy_form/components/edit-form-input.vue b/admin/src/app/views/diy_form/components/edit-form-input.vue
index 237dadc26..11c67b3f1 100644
--- a/admin/src/app/views/diy_form/components/edit-form-input.vue
+++ b/admin/src/app/views/diy_form/components/edit-form-input.vue
@@ -1,80 +1,80 @@
 <template>
-	<!-- 内容 -->
-	<div class="content-wrap" v-show="diyStore.editTab == 'content'">
+    <!-- 内容 -->
+    <div class="content-wrap" v-show="diyStore.editTab == 'content'">
 
-		<!-- 表单组件 字段内容设置 -->
-		<slot name="field"></slot>
-		<el-form label-width="100px" class="px-[10px]" @submit.prevent>
-			<el-form-item :label="t('formPlaceholder')">
-				<el-input v-model.trim="diyStore.editComponent.placeholder" :placeholder="t('formPlaceholderTips')" clearable maxlength="15" show-word-limit />
-			</el-form-item>
-			<el-form-item>
-				<template #label>
-					<div class="flex items-center">
-						<span class="mr-[3px]">{{ t('defaultValue') }}</span>
-						<el-tooltip effect="light" :content="t('defaultValueTips')" placement="top">
-							<el-icon>
-								<QuestionFilled color="#999999" />
-							</el-icon>
-						</el-tooltip>
-					</div>
-				</template>
-				<el-input v-model.trim="diyStore.editComponent.field.default" :placeholder="t('defaultValuePlaceholder')" clearable maxlength="18" show-word-limit />
-			</el-form-item>
-		</el-form>
+        <!-- 表单组件 字段内容设置 -->
+        <slot name="field"></slot>
+        <el-form label-width="100px" class="px-[10px]" @submit.prevent>
+            <el-form-item :label="t('formPlaceholder')">
+                <el-input v-model.trim="diyStore.editComponent.placeholder" :placeholder="t('formPlaceholderTips')" clearable maxlength="15" show-word-limit />
+            </el-form-item>
+            <el-form-item>
+                <template #label>
+                    <div class="flex items-center">
+                        <span class="mr-[3px]">{{ t('defaultValue') }}</span>
+                        <el-tooltip effect="light" :content="t('defaultValueTips')" placement="top">
+                            <el-icon>
+                                <QuestionFilled color="#999999" />
+                            </el-icon>
+                        </el-tooltip>
+                    </div>
+                </template>
+                <el-input v-model.trim="diyStore.editComponent.field.default" :placeholder="t('defaultValuePlaceholder')" clearable maxlength="18" show-word-limit />
+            </el-form-item>
+        </el-form>
 
-		<!-- 表单组件 其他设置 -->
-		<slot name="other"></slot>
-		<el-form label-width="100px" class="px-[10px]">
-			<el-form-item>
-				<template #label>
-					<div class="flex items-center">
-						<span class="mr-[3px]">{{ t('preventDuplication') }}</span>
-						<el-tooltip effect="light" placement="top">
-							<template #content>
-								<p>{{ t('preventDuplicationTipsOne') }}</p>
-								<p>{{ t('preventDuplicationTipsTwo') }}</p>
-							</template>
-							<el-icon>
-								<QuestionFilled color="#999999" />
-							</el-icon>
-						</el-tooltip>
-					</div>
-				</template>
-				<el-switch v-model="diyStore.editComponent.field.unique" />
-			</el-form-item>
-<!--			<el-form-item class="display-block">-->
-<!--				<template #label>-->
-<!--					<div class="flex items-center">-->
-<!--						<span class="mr-[3px]">{{ t('隐私保护') }}</span>-->
-<!--						<el-tooltip effect="light" placement="top">-->
-<!--							<template #content>-->
-<!--								<p>会自动将提交的个人信息做加密展示。</p>-->
-<!--								<p>适用于公开展示收集的数据且不暴露用户隐私。</p>-->
-<!--							</template>-->
-<!--							<el-icon>-->
-<!--								<QuestionFilled color="#999999" />-->
-<!--							</el-icon>-->
-<!--						</el-tooltip>-->
-<!--					</div>-->
-<!--				</template>-->
-<!--				<el-switch v-model="diyStore.editComponent.field.privacyProtection" />-->
-<!--				<div class="text-sm text-gray-400">{{ t('提交后自动隐藏文本，仅管理员可查看') }}</div>-->
-<!--			</el-form-item>-->
-		</el-form>
+        <!-- 表单组件 其他设置 -->
+        <slot name="other"></slot>
+        <el-form label-width="100px" class="px-[10px]">
+            <el-form-item>
+                <template #label>
+                    <div class="flex items-center">
+                        <span class="mr-[3px]">{{ t('preventDuplication') }}</span>
+                        <el-tooltip effect="light" placement="top">
+                            <template #content>
+                                <p>{{ t('preventDuplicationTipsOne') }}</p>
+                                <p>{{ t('preventDuplicationTipsTwo') }}</p>
+                            </template>
+                            <el-icon>
+                                <QuestionFilled color="#999999" />
+                            </el-icon>
+                        </el-tooltip>
+                    </div>
+                </template>
+                <el-switch v-model="diyStore.editComponent.field.unique" />
+            </el-form-item>
+            <!--			<el-form-item class="display-block">-->
+            <!--				<template #label>-->
+            <!--					<div class="flex items-center">-->
+            <!--						<span class="mr-[3px]">{{ t('隐私保护') }}</span>-->
+            <!--						<el-tooltip effect="light" placement="top">-->
+            <!--							<template #content>-->
+            <!--								<p>会自动将提交的个人信息做加密展示。</p>-->
+            <!--								<p>适用于公开展示收集的数据且不暴露用户隐私。</p>-->
+            <!--							</template>-->
+            <!--							<el-icon>-->
+            <!--								<QuestionFilled color="#999999" />-->
+            <!--							</el-icon>-->
+            <!--						</el-tooltip>-->
+            <!--					</div>-->
+            <!--				</template>-->
+            <!--				<el-switch v-model="diyStore.editComponent.field.privacyProtection" />-->
+            <!--				<div class="text-sm text-gray-400">{{ t('提交后自动隐藏文本，仅管理员可查看') }}</div>-->
+            <!--			</el-form-item>-->
+        </el-form>
 
-	</div>
+    </div>
 
-	<!-- 样式 -->
-	<div class="style-wrap" v-show="diyStore.editTab == 'style'">
+    <!-- 样式 -->
+    <div class="style-wrap" v-show="diyStore.editTab == 'style'">
 
-		<!-- 表单组件 字段样式 -->
-		<slot name="style-field"></slot>
+        <!-- 表单组件 字段样式 -->
+        <slot name="style-field"></slot>
 
-		<!-- 组件样式 -->
-		<slot name="style"></slot>
+        <!-- 组件样式 -->
+        <slot name="style"></slot>
 
-	</div>
+    </div>
 </template>
 
 <script lang="ts" setup>
@@ -87,9 +87,9 @@ diyStore.editComponent.ignore = ['componentBgUrl'] // 忽略公共属性
 
 // 组件验证
 diyStore.editComponent.verify = (index: number) => {
-	const res = { code: true, message: '' }
-	// todo 只需要考虑该组件自身的验证
-	return res
+    const res = { code: true, message: '' }
+    // todo 只需要考虑该组件自身的验证
+    return res
 }
 
 defineExpose({})
diff --git a/admin/src/app/views/diy_form/components/edit-form-location.vue b/admin/src/app/views/diy_form/components/edit-form-location.vue
index c80432f80..467972105 100644
--- a/admin/src/app/views/diy_form/components/edit-form-location.vue
+++ b/admin/src/app/views/diy_form/components/edit-form-location.vue
@@ -1,53 +1,53 @@
 <template>
-	<!-- 内容 -->
-	<div class="content-wrap" v-show="diyStore.editTab == 'content'">
+    <!-- 内容 -->
+    <div class="content-wrap" v-show="diyStore.editTab == 'content'">
 
-		<!-- 表单组件 字段内容设置 -->
-		<slot name="field"></slot>
-		<el-form label-width="100px" class="px-[10px]">
-			<el-form-item :label="t('access')">
-				<el-radio-group v-model="diyStore.editComponent.mode">
-					<el-radio class="!mr-[20px]" label="authorized_wechat_location">{{ t('authorizeWeChatLocation') }}</el-radio>
-					<el-radio label="open_choose_location">{{ t('manuallySelectPositioning') }}</el-radio>
-				</el-radio-group>
-			</el-form-item>
-		</el-form>
+        <!-- 表单组件 字段内容设置 -->
+        <slot name="field"></slot>
+        <el-form label-width="100px" class="px-[10px]">
+            <el-form-item :label="t('access')">
+                <el-radio-group v-model="diyStore.editComponent.mode">
+                    <el-radio class="!mr-[20px]" label="authorized_wechat_location">{{ t('authorizeWeChatLocation') }}</el-radio>
+                    <el-radio label="open_choose_location">{{ t('manuallySelectPositioning') }}</el-radio>
+                </el-radio-group>
+            </el-form-item>
+        </el-form>
 
-		<!-- 表单组件 其他设置 -->
-		<slot name="other"></slot>
-		<el-form label-width="100px" class="px-[10px]">
-			<el-form-item class="display-block">
-				<template #label>
-					<div class="flex items-center">
-						<span class="mr-[3px]">{{ t('privacyProtection') }}</span>
-						<el-tooltip effect="light" placement="top">
-							<template #content>
-								<p>{{ t('privacyProtectionTipsOne') }}</p>
-								<p>{{ t('privacyProtectionTipsTwo') }}</p>
-							</template>
-							<el-icon>
-								<QuestionFilled color="#999999" />
-							</el-icon>
-						</el-tooltip>
-					</div>
-				</template>
-				<el-switch v-model="diyStore.editComponent.field.privacyProtection" />
-				<div class="text-sm text-gray-400">{{ t('privacyProtectionTipsFour') }}</div>
-			</el-form-item>
-		</el-form>
+        <!-- 表单组件 其他设置 -->
+        <slot name="other"></slot>
+        <el-form label-width="100px" class="px-[10px]">
+            <el-form-item class="display-block">
+                <template #label>
+                    <div class="flex items-center">
+                        <span class="mr-[3px]">{{ t('privacyProtection') }}</span>
+                        <el-tooltip effect="light" placement="top">
+                            <template #content>
+                                <p>{{ t('privacyProtectionTipsOne') }}</p>
+                                <p>{{ t('privacyProtectionTipsTwo') }}</p>
+                            </template>
+                            <el-icon>
+                                <QuestionFilled color="#999999" />
+                            </el-icon>
+                        </el-tooltip>
+                    </div>
+                </template>
+                <el-switch v-model="diyStore.editComponent.field.privacyProtection" />
+                <div class="text-sm text-gray-400">{{ t('privacyProtectionTipsFour') }}</div>
+            </el-form-item>
+        </el-form>
 
-	</div>
+    </div>
 
-	<!-- 样式 -->
-	<div class="style-wrap" v-show="diyStore.editTab == 'style'">
+    <!-- 样式 -->
+    <div class="style-wrap" v-show="diyStore.editTab == 'style'">
 
-		<!-- 表单组件 字段样式 -->
-		<slot name="style-field"></slot>
+        <!-- 表单组件 字段样式 -->
+        <slot name="style-field"></slot>
 
-		<!-- 组件样式 -->
-		<slot name="style"></slot>
+        <!-- 组件样式 -->
+        <slot name="style"></slot>
 
-	</div>
+    </div>
 </template>
 
 <script lang="ts" setup>
@@ -61,7 +61,7 @@ diyStore.editComponent.ignore = ['componentBgUrl'] // 忽略公共属性
 // 组件验证
 diyStore.editComponent.verify = (index: number) => {
     const res = { code: true, message: '' }
-	// todo 只需要考虑该组件自身的验证
+    // todo 只需要考虑该组件自身的验证
     return res
 }
 defineExpose({})
diff --git a/admin/src/app/views/diy_form/components/edit-form-mobile.vue b/admin/src/app/views/diy_form/components/edit-form-mobile.vue
index 852873dd5..fbc9ec027 100644
--- a/admin/src/app/views/diy_form/components/edit-form-mobile.vue
+++ b/admin/src/app/views/diy_form/components/edit-form-mobile.vue
@@ -1,67 +1,67 @@
 <template>
-	<!-- 内容 -->
-	<div class="content-wrap" v-show="diyStore.editTab == 'content'">
+    <!-- 内容 -->
+    <div class="content-wrap" v-show="diyStore.editTab == 'content'">
 
-		<!-- 表单组件 字段内容设置 -->
-		<slot name="field"></slot>
-		<el-form label-width="100px" class="px-[10px]" @submit.prevent>
-			<el-form-item :label="t('formPlaceholder')">
-				<el-input v-model.trim="diyStore.editComponent.placeholder" :placeholder="t('formPlaceholderTips')" clearable maxlength="15" show-word-limit />
-			</el-form-item>
-		</el-form>
+        <!-- 表单组件 字段内容设置 -->
+        <slot name="field"></slot>
+        <el-form label-width="100px" class="px-[10px]" @submit.prevent>
+            <el-form-item :label="t('formPlaceholder')">
+                <el-input v-model.trim="diyStore.editComponent.placeholder" :placeholder="t('formPlaceholderTips')" clearable maxlength="15" show-word-limit />
+            </el-form-item>
+        </el-form>
 
-		<!-- 表单组件 其他设置 -->
-		<slot name="other"></slot>
-		<el-form label-width="100px" class="px-[10px]">
-			<el-form-item>
-				<template #label>
-					<div class="flex items-center">
-						<span class="mr-[3px]">{{ t('preventDuplication') }}</span>
-						<el-tooltip effect="light" placement="top">
-							<template #content>
-								<p>{{ t('preventDuplicationTipsOne') }}</p>
-								<p>{{ t('preventDuplicationTipsTwo') }}</p>
-							</template>
-							<el-icon>
-								<QuestionFilled color="#999999" />
-							</el-icon>
-						</el-tooltip>
-					</div>
-				</template>
-				<el-switch v-model="diyStore.editComponent.field.unique" />
-			</el-form-item>
-			<el-form-item class="display-block">
-				<template #label>
-					<div class="flex items-center">
-						<span class="mr-[3px]">{{ t('privacyProtection') }}</span>
-						<el-tooltip effect="light" placement="top">
-							<template #content>
-								<p>{{ t('privacyProtectionTipsOne') }}</p>
-								<p>{{ t('privacyProtectionTipsTwo') }}</p>
-							</template>
-							<el-icon>
-								<QuestionFilled color="#999999" />
-							</el-icon>
-						</el-tooltip>
-					</div>
-				</template>
-				<el-switch v-model="diyStore.editComponent.field.privacyProtection" />
-				<div class="text-sm text-gray-400">{{ t('privacyProtectionTipsFive') }}</div>
-			</el-form-item>
-		</el-form>
+        <!-- 表单组件 其他设置 -->
+        <slot name="other"></slot>
+        <el-form label-width="100px" class="px-[10px]">
+            <el-form-item>
+                <template #label>
+                    <div class="flex items-center">
+                        <span class="mr-[3px]">{{ t('preventDuplication') }}</span>
+                        <el-tooltip effect="light" placement="top">
+                            <template #content>
+                                <p>{{ t('preventDuplicationTipsOne') }}</p>
+                                <p>{{ t('preventDuplicationTipsTwo') }}</p>
+                            </template>
+                            <el-icon>
+                                <QuestionFilled color="#999999" />
+                            </el-icon>
+                        </el-tooltip>
+                    </div>
+                </template>
+                <el-switch v-model="diyStore.editComponent.field.unique" />
+            </el-form-item>
+            <el-form-item class="display-block">
+                <template #label>
+                    <div class="flex items-center">
+                        <span class="mr-[3px]">{{ t('privacyProtection') }}</span>
+                        <el-tooltip effect="light" placement="top">
+                            <template #content>
+                                <p>{{ t('privacyProtectionTipsOne') }}</p>
+                                <p>{{ t('privacyProtectionTipsTwo') }}</p>
+                            </template>
+                            <el-icon>
+                                <QuestionFilled color="#999999" />
+                            </el-icon>
+                        </el-tooltip>
+                    </div>
+                </template>
+                <el-switch v-model="diyStore.editComponent.field.privacyProtection" />
+                <div class="text-sm text-gray-400">{{ t('privacyProtectionTipsFive') }}</div>
+            </el-form-item>
+        </el-form>
 
-	</div>
+    </div>
 
-	<!-- 样式 -->
-	<div class="style-wrap" v-show="diyStore.editTab == 'style'">
+    <!-- 样式 -->
+    <div class="style-wrap" v-show="diyStore.editTab == 'style'">
 
-		<!-- 表单组件 字段样式 -->
-		<slot name="style-field"></slot>
+        <!-- 表单组件 字段样式 -->
+        <slot name="style-field"></slot>
 
-		<!-- 组件样式 -->
-		<slot name="style"></slot>
+        <!-- 组件样式 -->
+        <slot name="style"></slot>
 
-	</div>
+    </div>
 </template>
 
 <script lang="ts" setup>
@@ -75,7 +75,7 @@ diyStore.editComponent.ignore = ['componentBgUrl'] // 忽略公共属性
 // 组件验证
 diyStore.editComponent.verify = (index: number) => {
     const res = { code: true, message: '' }
-	// todo 只需要考虑该组件自身的验证
+    // todo 只需要考虑该组件自身的验证
     return res
 }
 defineExpose({})
diff --git a/admin/src/app/views/diy_form/components/edit-form-number.vue b/admin/src/app/views/diy_form/components/edit-form-number.vue
index 012d45fd8..ffecc7983 100644
--- a/admin/src/app/views/diy_form/components/edit-form-number.vue
+++ b/admin/src/app/views/diy_form/components/edit-form-number.vue
@@ -1,83 +1,83 @@
 <template>
-	<!-- 内容 -->
-	<div class="content-wrap" v-show="diyStore.editTab == 'content'">
+    <!-- 内容 -->
+    <div class="content-wrap" v-show="diyStore.editTab == 'content'">
 
-		<!-- 表单组件 字段内容设置 -->
-		<slot name="field"></slot>
-		<el-form label-width="100px" class="px-[10px]" @submit.prevent>
-			<el-form-item :label="t('formPlaceholder')">
-				<el-input v-model.trim="diyStore.editComponent.placeholder" :placeholder="t('formPlaceholderTips')" clearable maxlength="15" show-word-limit />
-			</el-form-item>
+        <!-- 表单组件 字段内容设置 -->
+        <slot name="field"></slot>
+        <el-form label-width="100px" class="px-[10px]" @submit.prevent>
+            <el-form-item :label="t('formPlaceholder')">
+                <el-input v-model.trim="diyStore.editComponent.placeholder" :placeholder="t('formPlaceholderTips')" clearable maxlength="15" show-word-limit />
+            </el-form-item>
             <el-form-item :label="t('unit')">
-				<el-input v-model.trim="diyStore.editComponent.unit" :placeholder="t('unitPlaceholder')" clearable maxlength="5" show-word-limit />
-			</el-form-item>
-			<el-form-item>
-				<template #label>
-					<div class="flex items-center">
-						<span class="mr-[3px]">{{ t('defaultValue') }}</span>
-						<el-tooltip effect="light" :content="t('defaultValueTips')" placement="top">
-							<el-icon>
-								<QuestionFilled color="#999999" />
-							</el-icon>
-						</el-tooltip>
-					</div>
-				</template>
-				<el-input v-model.trim="diyStore.editComponent.field.default" :placeholder="t('defaultValuePlaceholder')" @keyup="filterDigit($event)" clearable maxlength="18" show-word-limit />
-			</el-form-item>
-		</el-form>
+                <el-input v-model.trim="diyStore.editComponent.unit" :placeholder="t('unitPlaceholder')" clearable maxlength="5" show-word-limit />
+            </el-form-item>
+            <el-form-item>
+                <template #label>
+                    <div class="flex items-center">
+                        <span class="mr-[3px]">{{ t('defaultValue') }}</span>
+                        <el-tooltip effect="light" :content="t('defaultValueTips')" placement="top">
+                            <el-icon>
+                                <QuestionFilled color="#999999" />
+                            </el-icon>
+                        </el-tooltip>
+                    </div>
+                </template>
+                <el-input v-model.trim="diyStore.editComponent.field.default" :placeholder="t('defaultValuePlaceholder')" @keyup="filterDigit($event)" clearable maxlength="18" show-word-limit />
+            </el-form-item>
+        </el-form>
 
-		<!-- 表单组件 其他设置 -->
-		<slot name="other"></slot>
-		<el-form label-width="100px" class="px-[10px]">
-<!--			<el-form-item>-->
-<!--				<template #label>-->
-<!--					<div class="flex items-center">-->
-<!--						<span class="mr-[3px]">{{ t('内容防重复') }}</span>-->
-<!--						<el-tooltip effect="light" placement="top">-->
-<!--							<template #content>-->
-<!--								<p>该组件填写的内容不能与已提交的数据重复。</p>-->
-<!--								<p>极端情况下可能存在延时导致限制失效。</p>-->
-<!--							</template>-->
-<!--							<el-icon>-->
-<!--								<QuestionFilled color="#999999" />-->
-<!--							</el-icon>-->
-<!--						</el-tooltip>-->
-<!--					</div>-->
-<!--				</template>-->
-<!--				<el-switch v-model="diyStore.editComponent.field.unique" />-->
-<!--			</el-form-item>-->
-<!--			<el-form-item class="display-block">-->
-<!--				<template #label>-->
-<!--					<div class="flex items-center">-->
-<!--						<span class="mr-[3px]">{{ t('隐私保护') }}</span>-->
-<!--						<el-tooltip effect="light" placement="top">-->
-<!--							<template #content>-->
-<!--								<p>会自动将提交的个人信息做加密展示。</p>-->
-<!--								<p>适用于公开展示收集的数据且不暴露用户隐私。</p>-->
-<!--							</template>-->
-<!--							<el-icon>-->
-<!--								<QuestionFilled color="#999999" />-->
-<!--							</el-icon>-->
-<!--						</el-tooltip>-->
-<!--					</div>-->
-<!--				</template>-->
-<!--				<el-switch v-model="diyStore.editComponent.field.privacyProtection" />-->
-<!--				<div class="text-sm text-gray-400">{{ t('提交后自动隐藏数字，仅管理员可查看') }}</div>-->
-<!--			</el-form-item>-->
-		</el-form>
+        <!-- 表单组件 其他设置 -->
+        <slot name="other"></slot>
+        <el-form label-width="100px" class="px-[10px]">
+            <!--			<el-form-item>-->
+            <!--				<template #label>-->
+            <!--					<div class="flex items-center">-->
+            <!--						<span class="mr-[3px]">{{ t('内容防重复') }}</span>-->
+            <!--						<el-tooltip effect="light" placement="top">-->
+            <!--							<template #content>-->
+            <!--								<p>该组件填写的内容不能与已提交的数据重复。</p>-->
+            <!--								<p>极端情况下可能存在延时导致限制失效。</p>-->
+            <!--							</template>-->
+            <!--							<el-icon>-->
+            <!--								<QuestionFilled color="#999999" />-->
+            <!--							</el-icon>-->
+            <!--						</el-tooltip>-->
+            <!--					</div>-->
+            <!--				</template>-->
+            <!--				<el-switch v-model="diyStore.editComponent.field.unique" />-->
+            <!--			</el-form-item>-->
+            <!--			<el-form-item class="display-block">-->
+            <!--				<template #label>-->
+            <!--					<div class="flex items-center">-->
+            <!--						<span class="mr-[3px]">{{ t('隐私保护') }}</span>-->
+            <!--						<el-tooltip effect="light" placement="top">-->
+            <!--							<template #content>-->
+            <!--								<p>会自动将提交的个人信息做加密展示。</p>-->
+            <!--								<p>适用于公开展示收集的数据且不暴露用户隐私。</p>-->
+            <!--							</template>-->
+            <!--							<el-icon>-->
+            <!--								<QuestionFilled color="#999999" />-->
+            <!--							</el-icon>-->
+            <!--						</el-tooltip>-->
+            <!--					</div>-->
+            <!--				</template>-->
+            <!--				<el-switch v-model="diyStore.editComponent.field.privacyProtection" />-->
+            <!--				<div class="text-sm text-gray-400">{{ t('提交后自动隐藏数字，仅管理员可查看') }}</div>-->
+            <!--			</el-form-item>-->
+        </el-form>
 
-	</div>
+    </div>
 
-	<!-- 样式 -->
-	<div class="style-wrap" v-show="diyStore.editTab == 'style'">
+    <!-- 样式 -->
+    <div class="style-wrap" v-show="diyStore.editTab == 'style'">
 
-		<!-- 表单组件 字段样式 -->
-		<slot name="style-field"></slot>
+        <!-- 表单组件 字段样式 -->
+        <slot name="style-field"></slot>
 
-		<!-- 组件样式 -->
-		<slot name="style"></slot>
+        <!-- 组件样式 -->
+        <slot name="style"></slot>
 
-	</div>
+    </div>
 </template>
 
 <script lang="ts" setup>
@@ -92,24 +92,24 @@ diyStore.editComponent.ignore = ['componentBgUrl'] // 忽略公共属性
 // 组件验证
 diyStore.editComponent.verify = (index: number) => {
     const res = { code: true, message: '' }
-	if(diyStore.value[index].field.default){
-		if (isNaN(diyStore.value[index].field.default) || !regExp.digit.test(diyStore.value[index].field.default)) {
-			res.code = false;
-			res.message = t('defaultErrorTips');
-		} else if (diyStore.value[index].field.default < 0) {
-			res.code = false;
-			res.message = t('defaultMustZeroTips')
-		}
-	}
-	return res
+    if (diyStore.value[index].field.default) {
+        if (isNaN(diyStore.value[index].field.default) || !regExp.digit.test(diyStore.value[index].field.default)) {
+            res.code = false;
+            res.message = t('defaultErrorTips');
+        } else if (diyStore.value[index].field.default < 0) {
+            res.code = false;
+            res.message = t('defaultMustZeroTips')
+        }
+    }
+    return res
 }
 
 // 正则表达式
 const regExp: any = {
-	required: /[\S]+/,
-	number: /^\d{0,10}$/,
-	digit: /^\d{0,10}(.?\d{0,2})$/,
-	special: /^\d{0,10}(.?\d{0,3})$/
+    required: /[\S]+/,
+    number: /^\d{0,10}$/,
+    digit: /^\d{0,10}(.?\d{0,2})$/,
+    special: /^\d{0,10}(.?\d{0,3})$/
 }
 
 defineExpose({})
diff --git a/admin/src/app/views/diy_form/components/edit-form-radio.vue b/admin/src/app/views/diy_form/components/edit-form-radio.vue
index 98a17364e..1593cf2be 100644
--- a/admin/src/app/views/diy_form/components/edit-form-radio.vue
+++ b/admin/src/app/views/diy_form/components/edit-form-radio.vue
@@ -1,189 +1,189 @@
 <template>
-	<!-- 内容 -->
-	<div class="content-wrap" v-show="diyStore.editTab == 'content'">
+    <!-- 内容 -->
+    <div class="content-wrap" v-show="diyStore.editTab == 'content'">
 
-		<!-- 表单组件 字段内容设置 -->
-		<slot name="field"></slot>
-		<el-form label-width="100px" class="px-[10px]">
-			<el-form-item :label="t('style')">
-				<el-radio-group v-model="diyStore.editComponent.style">
-					<el-radio label="style-1">{{ t('defaultSources') }}</el-radio>
-					<el-radio label="style-2">{{ t('listStyle') }}</el-radio>
-					<el-radio label="style-3">{{ t('dropDownStyle') }}</el-radio>
-				</el-radio-group>
-			</el-form-item>
-			<el-form-item :label="t('option')">
+        <!-- 表单组件 字段内容设置 -->
+        <slot name="field"></slot>
+        <el-form label-width="100px" class="px-[10px]">
+            <el-form-item :label="t('style')">
+                <el-radio-group v-model="diyStore.editComponent.style">
+                    <el-radio label="style-1">{{ t('defaultSources') }}</el-radio>
+                    <el-radio label="style-2">{{ t('listStyle') }}</el-radio>
+                    <el-radio label="style-3">{{ t('dropDownStyle') }}</el-radio>
+                </el-radio-group>
+            </el-form-item>
+            <el-form-item :label="t('option')">
                 <div ref="formRadioRef">
                     <div v-for="(option, index) in diyStore.editComponent.options" :key="option.id" class="option-item flex items-center mb-[15px]">
                         <el-input v-model="diyStore.editComponent.options[index].text" class="!w-[215px]" :placeholder="t('optionPlaceholder')" clearable maxlength="30" />
                         <span v-if="diyStore.editComponent.options.length > 1" @click="removeOption(index)" class="cursor-pointer ml-[5px] nc-iconfont nc-icon-shanchu-yuangaizhiV6xx"></span>
                     </div>
                 </div>
-				<span class="text-primary cursor-pointer mr-[10px]" @click="addOption">{{ t('addSingleOption') }}</span>
-				<el-popover :visible="visible" placement="bottom" :width="300">
-					<p class="mb-[5px]">{{ t('addMultipleOption') }}</p>
-					<p class="text-[#888] text-[12px] mb-[5px]">{{ t('addOptionTips') }}</p>
-					<el-input v-model.trim="optionsValue" type="textarea"  clearable maxlength="200" show-word-limit />
-					<div class="mt-[10px] text-right">
-						<el-button size="small" text @click="visible = false">{{ t('cancel') }}</el-button>
-						<el-button size="small" type="primary" @click="batchAddOptions">{{ t('confirm') }}</el-button>
-					</div>
-					<template #reference>
-						<span class="text-primary cursor-pointer" @click="visible = true">{{ t('addMultipleOption') }}</span>
-					</template>
-				</el-popover>
-			</el-form-item>
-			<!-- <el-form-item class="display-block">
-				<template #label>
-					<div class="flex items-center">
-						<span class="mr-[3px]">{{ t('逻辑规则') }}</span>
-						<el-tooltip effect="light" placement="top">
-							<template #content>
-								<p>支持选择某个选项后，显示特定的组件。</p>
-							</template>
-							<el-icon>
-								<QuestionFilled color="#999999" />
-							</el-icon>
-						</el-tooltip>
-					</div>
-				</template>
-				<div>
-					<el-button plain>{{ t('添加字段显示规则') }}</el-button>
-					<span class="mr-[3px]">1条字段显示规则</span>
-					<span class="text-primary cursor-pointer" @click="">设置</span>
-				</div>
-			</el-form-item> -->
-		</el-form>
+                <span class="text-primary cursor-pointer mr-[10px]" @click="addOption">{{ t('addSingleOption') }}</span>
+                <el-popover :visible="visible" placement="bottom" :width="300">
+                    <p class="mb-[5px]">{{ t('addMultipleOption') }}</p>
+                    <p class="text-[#888] text-[12px] mb-[5px]">{{ t('addOptionTips') }}</p>
+                    <el-input v-model.trim="optionsValue" type="textarea" clearable maxlength="200" show-word-limit />
+                    <div class="mt-[10px] text-right">
+                        <el-button size="small" text @click="visible = false">{{ t('cancel') }}</el-button>
+                        <el-button size="small" type="primary" @click="batchAddOptions">{{ t('confirm') }}</el-button>
+                    </div>
+                    <template #reference>
+                        <span class="text-primary cursor-pointer" @click="visible = true">{{ t('addMultipleOption') }}</span>
+                    </template>
+                </el-popover>
+            </el-form-item>
+            <!-- <el-form-item class="display-block">
+              <template #label>
+                <div class="flex items-center">
+                  <span class="mr-[3px]">{{ t('逻辑规则') }}</span>
+                  <el-tooltip effect="light" placement="top">
+                    <template #content>
+                      <p>支持选择某个选项后，显示特定的组件。</p>
+                    </template>
+                    <el-icon>
+                      <QuestionFilled color="#999999" />
+                    </el-icon>
+                  </el-tooltip>
+                </div>
+              </template>
+              <div>
+                <el-button plain>{{ t('添加字段显示规则') }}</el-button>
+                <span class="mr-[3px]">1条字段显示规则</span>
+                <span class="text-primary cursor-pointer" @click="">设置</span>
+              </div>
+            </el-form-item> -->
+        </el-form>
 
-		<!-- 表单组件 其他设置 -->
-		<slot name="other"></slot>
-<!--		<el-form label-width="100px" class="px-[10px]">-->
-<!--			<el-form-item class="display-block">-->
-<!--				<template #label>-->
-<!--					<div class="flex items-center">-->
-<!--						<span class="mr-[3px]">{{ t('隐私保护') }}</span>-->
-<!--						<el-tooltip effect="light" placement="top">-->
-<!--							<template #content>-->
-<!--								<p>会自动将提交的个人信息做加密展示。</p>-->
-<!--								<p>适用于公开展示收集的数据且不暴露用户隐私。</p>-->
-<!--							</template>-->
-<!--							<el-icon>-->
-<!--								<QuestionFilled color="#999999" />-->
-<!--							</el-icon>-->
-<!--						</el-tooltip>-->
-<!--					</div>-->
-<!--				</template>-->
-<!--				<el-switch v-model="diyStore.editComponent.field.privacyProtection" />-->
-<!--				<div class="text-sm text-gray-400">{{ t('提交后自动隐藏内容，仅管理员可查看') }}</div>-->
-<!--			</el-form-item>-->
+        <!-- 表单组件 其他设置 -->
+        <slot name="other"></slot>
+        <!--		<el-form label-width="100px" class="px-[10px]">-->
+        <!--			<el-form-item class="display-block">-->
+        <!--				<template #label>-->
+        <!--					<div class="flex items-center">-->
+        <!--						<span class="mr-[3px]">{{ t('隐私保护') }}</span>-->
+        <!--						<el-tooltip effect="light" placement="top">-->
+        <!--							<template #content>-->
+        <!--								<p>会自动将提交的个人信息做加密展示。</p>-->
+        <!--								<p>适用于公开展示收集的数据且不暴露用户隐私。</p>-->
+        <!--							</template>-->
+        <!--							<el-icon>-->
+        <!--								<QuestionFilled color="#999999" />-->
+        <!--							</el-icon>-->
+        <!--						</el-tooltip>-->
+        <!--					</div>-->
+        <!--				</template>-->
+        <!--				<el-switch v-model="diyStore.editComponent.field.privacyProtection" />-->
+        <!--				<div class="text-sm text-gray-400">{{ t('提交后自动隐藏内容，仅管理员可查看') }}</div>-->
+        <!--			</el-form-item>-->
 
-<!--		</el-form>-->
+        <!--		</el-form>-->
 
-	</div>
+    </div>
 
-	<!-- 样式 -->
-	<div class="style-wrap" v-show="diyStore.editTab == 'style'">
+    <!-- 样式 -->
+    <div class="style-wrap" v-show="diyStore.editTab == 'style'">
 
-		<!-- 表单组件 字段样式 -->
-		<slot name="style-field"></slot>
+        <!-- 表单组件 字段样式 -->
+        <slot name="style-field"></slot>
 
-		<!-- 组件样式 -->
-		<slot name="style"></slot>
+        <!-- 组件样式 -->
+        <slot name="style"></slot>
 
-	</div>
+    </div>
 </template>
 
 <script lang="ts" setup>
 import { t } from '@/lang'
-import { ref, onMounted, nextTick} from 'vue'
+import { ref, onMounted, nextTick } from 'vue'
 import useDiyStore from '@/stores/modules/diy'
 import Sortable from 'sortablejs'
 import { range } from 'lodash-es'
-import { FormInstance, ElMessage } from "element-plus";
+import { ElMessage } from "element-plus";
 
 const diyStore = useDiyStore()
 diyStore.editComponent.ignore = ['componentBgUrl'] // 忽略公共属性
 
 // 组件验证
 diyStore.editComponent.verify = (index: number) => {
-	const res = { code: true, message: '' }
-	let pass = true;
-	for (let i = 0; i < diyStore.value[index].options.length; i++) {
-		if (!diyStore.value[index].options[i].text) {
-			res.code = false;
-			res.message = t('optionPlaceholder');
-			pass = false;
-			break;
-		}
-	}
+    const res = { code: true, message: '' }
+    let pass = true;
+    for (let i = 0; i < diyStore.value[index].options.length; i++) {
+        if (!diyStore.value[index].options[i].text) {
+            res.code = false;
+            res.message = t('optionPlaceholder');
+            pass = false;
+            break;
+        }
+    }
 
-	if (!pass) return res;
+    if (!pass) return res;
 
-	let uniqueOptions = uniqueByKey(diyStore.value[index].options, 'text')
+    let uniqueOptions = uniqueByKey(diyStore.value[index].options, 'text')
 
-	if (uniqueOptions.length != diyStore.value[index].options.length) {
-		res.code = false;
-		res.message = t('errorTipsOne')
-	}
-	return res
+    if (uniqueOptions.length != diyStore.value[index].options.length) {
+        res.code = false;
+        res.message = t('errorTipsOne')
+    }
+    return res
 }
 
 diyStore.editComponent.options.forEach((item: any) => {
-	if (!item.id) item.id = diyStore.generateRandom()
+    if (!item.id) item.id = diyStore.generateRandom()
 })
 
 const visible = ref(false)
 const optionsValue = ref()
 const addOption = () => {
-	diyStore.editComponent.options.push({
-		id: diyStore.generateRandom(),
-		text: '选项' + (diyStore.editComponent.options.length + 1)
-	});
+    diyStore.editComponent.options.push({
+        id: diyStore.generateRandom(),
+        text: '选项' + (diyStore.editComponent.options.length + 1)
+    });
 };
 
-const removeOption = (index:any) => {
+const removeOption = (index: any) => {
     diyStore.editComponent.options.splice(index, 1);
 }
 
 const batchAddOptions = () => {
-	if (optionsValue.value.trim()) {
-		const newOptions = optionsValue.value.split(',').map((option: any) => {
-			return {
-				id: diyStore.generateRandom(),
-				text: option.trim()
-			};
-		}).filter((option: any) => option.text !== '');
+    if (optionsValue.value.trim()) {
+        const newOptions = optionsValue.value.split(',').map((option: any) => {
+            return {
+                id: diyStore.generateRandom(),
+                text: option.trim()
+            };
+        }).filter((option: any) => option.text !== '');
 
-		// 去除重复的选项
-		const uniqueNewOptions = uniqueByKey(newOptions, 'text');
+        // 去除重复的选项
+        const uniqueNewOptions = uniqueByKey(newOptions, 'text');
 
-		// 过滤掉已存在的选项
-		const filteredNewOptions = uniqueNewOptions.filter(newOption =>
-				!diyStore.editComponent.options.some(existingOption => existingOption.text === newOption.text)
-		);
+        // 过滤掉已存在的选项
+        const filteredNewOptions = uniqueNewOptions.filter(newOption =>
+            !diyStore.editComponent.options.some(existingOption => existingOption.text === newOption.text)
+        );
 
-		// 如果有新的选项，添加到选项列表中
-		if (filteredNewOptions.length > 0) {
-			diyStore.editComponent.options.push(...filteredNewOptions);
-		} else {
-			ElMessage({
-				message: t('errorTipsTwo'),
-				type: "warning",
-			});
-		}
+        // 如果有新的选项，添加到选项列表中
+        if (filteredNewOptions.length > 0) {
+            diyStore.editComponent.options.push(...filteredNewOptions);
+        } else {
+            ElMessage({
+                message: t('errorTipsTwo'),
+                type: "warning",
+            });
+        }
 
-		optionsValue.value = '';
-		visible.value = false;
-	}
+        optionsValue.value = '';
+        visible.value = false;
+    }
 };
 
 // 数组去重
 const uniqueByKey = (arr: any, key: any) => {
-	const seen = new Set();
-	return arr.filter((item: any) => {
-		const serializedKey = JSON.stringify(item[key]);
-		return seen.has(serializedKey) ? false : seen.add(serializedKey);
-	});
+    const seen = new Set();
+    return arr.filter((item: any) => {
+        const serializedKey = JSON.stringify(item[key]);
+        return seen.has(serializedKey) ? false : seen.add(serializedKey);
+    });
 }
 
 const formRadioRef = ref()
diff --git a/admin/src/app/views/diy_form/components/edit-form-submit.vue b/admin/src/app/views/diy_form/components/edit-form-submit.vue
index 28f6416c7..ff510a3a1 100644
--- a/admin/src/app/views/diy_form/components/edit-form-submit.vue
+++ b/admin/src/app/views/diy_form/components/edit-form-submit.vue
@@ -1,75 +1,79 @@
 <template>
-	<!-- 内容 -->
-	<div class="content-wrap" v-show="diyStore.editTab == 'content'">
-		<div class="edit-attr-item-wrap">
+    <!-- 内容 -->
+    <div class="content-wrap" v-show="diyStore.editTab == 'content'">
+        <div class="edit-attr-item-wrap">
             <el-form label-width="80px" class="px-[10px]">
-	            <el-form-item :label="t('floatBtnButton')" class="display-block">
-		            <el-radio-group v-model="diyStore.editComponent.btnPosition" @change="btnPositionChangeFn">
-			            <el-radio label="follow_content">{{ t('followContent') }}</el-radio>
-			            <el-radio label="hover_screen_bottom">{{ t('hoverScreenBottom') }}</el-radio>
-		            </el-radio-group>
-		            <div class="text-sm text-gray-400 mb-[5px] leading-[1.4]" v-show="diyStore.editComponent.btnPosition == 'follow_content'">{{ t('btnTips') }}</div>
-		            <div class="text-sm text-gray-400 mb-[5px]" v-show="diyStore.editComponent.btnPosition == 'hover_screen_bottom'">{{ t('btnTipsTwo') }}</div>
+                <el-form-item :label="t('floatBtnButton')" class="display-block">
+                    <el-radio-group v-model="diyStore.editComponent.btnPosition" @change="btnPositionChangeFn">
+                        <el-radio label="follow_content">{{ t('followContent') }}</el-radio>
+                        <el-radio label="hover_screen_bottom">{{ t('hoverScreenBottom') }}</el-radio>
+                    </el-radio-group>
+                    <div class="text-sm text-gray-400 mb-[5px] leading-[1.4]"
+                         v-show="diyStore.editComponent.btnPosition == 'follow_content'">{{ t('btnTips') }}
+                    </div>
+                    <div class="text-sm text-gray-400 mb-[5px]"
+                         v-show="diyStore.editComponent.btnPosition == 'hover_screen_bottom'">{{ t('btnTipsTwo') }}
+                    </div>
                     <div class="text-sm text-gray-400 mb-[10px] leading-[1.4]">{{ t('btnTipsThree') }}</div>
-	            </el-form-item>
-			</el-form>
+                </el-form-item>
+            </el-form>
 
-		</div>
+        </div>
 
-		<div class="edit-attr-item-wrap">
-			<h3 class="mb-[10px]">{{ t('submitBtn') }}</h3>
-			<el-form label-width="80px" class="px-[10px]" @submit.prevent>
-				<el-form-item :label="t('submitBtnName')">
-					<el-input v-model.trim="diyStore.editComponent.submitBtn.text" :placeholder="t('btnNamePlaceholder')" clearable maxlength="10" show-word-limit />
-				</el-form-item>
-				<el-form-item :label="t('textColor')">
-					<el-color-picker v-model="diyStore.editComponent.submitBtn.color" />
-				</el-form-item>
-				<el-form-item :label="t('subTextBgColor')">
-					<el-color-picker v-model="diyStore.editComponent.submitBtn.bgColor" />
-				</el-form-item>
-			</el-form>
-		</div>
+        <div class="edit-attr-item-wrap">
+            <h3 class="mb-[10px]">{{ t('submitBtn') }}</h3>
+            <el-form label-width="80px" class="px-[10px]" @submit.prevent>
+                <el-form-item :label="t('submitBtnName')">
+                    <el-input v-model.trim="diyStore.editComponent.submitBtn.text" :placeholder="t('btnNamePlaceholder')" clearable maxlength="10" show-word-limit />
+                </el-form-item>
+                <el-form-item :label="t('textColor')">
+                    <el-color-picker v-model="diyStore.editComponent.submitBtn.color" />
+                </el-form-item>
+                <el-form-item :label="t('subTextBgColor')">
+                    <el-color-picker v-model="diyStore.editComponent.submitBtn.bgColor" />
+                </el-form-item>
+            </el-form>
+        </div>
 
-		<div class="edit-attr-item-wrap">
-			<h3 class="mb-[10px]">{{ t('resetBtn') }}</h3>
-			<el-form label-width="80px" class="px-[10px]" @submit.prevent>
-				<el-form-item :label="t('carouselSearchTabControl')">
-					<el-switch v-model="diyStore.editComponent.resetBtn.control" />
-				</el-form-item>
-				<el-form-item :label="t('submitBtnName')">
-					<el-input v-model.trim="diyStore.editComponent.resetBtn.text" :placeholder="t('btnNamePlaceholder')" clearable maxlength="10" show-word-limit />
-				</el-form-item>
-				<el-form-item :label="t('textColor')">
-					<el-color-picker v-model="diyStore.editComponent.resetBtn.color" />
-				</el-form-item>
-				<el-form-item :label="t('subTextBgColor')">
-					<el-color-picker v-model="diyStore.editComponent.resetBtn.bgColor" />
-				</el-form-item>
-			</el-form>
-		</div>
+        <div class="edit-attr-item-wrap">
+            <h3 class="mb-[10px]">{{ t('resetBtn') }}</h3>
+            <el-form label-width="80px" class="px-[10px]" @submit.prevent>
+                <el-form-item :label="t('carouselSearchTabControl')">
+                    <el-switch v-model="diyStore.editComponent.resetBtn.control" />
+                </el-form-item>
+                <el-form-item :label="t('submitBtnName')">
+                    <el-input v-model.trim="diyStore.editComponent.resetBtn.text" :placeholder="t('btnNamePlaceholder')" clearable maxlength="10" show-word-limit />
+                </el-form-item>
+                <el-form-item :label="t('textColor')">
+                    <el-color-picker v-model="diyStore.editComponent.resetBtn.color" />
+                </el-form-item>
+                <el-form-item :label="t('subTextBgColor')">
+                    <el-color-picker v-model="diyStore.editComponent.resetBtn.bgColor" />
+                </el-form-item>
+            </el-form>
+        </div>
 
-	</div>
+    </div>
 
-	<!-- 样式 -->
-	<div class="style-wrap" v-show="diyStore.editTab == 'style'">
+    <!-- 样式 -->
+    <div class="style-wrap" v-show="diyStore.editTab == 'style'">
 
-		<div class="edit-attr-item-wrap">
-			<h3 class="mb-[10px]">{{ t('btnStyle') }}</h3>
-				<el-form label-width="100px" class="px-[10px]">
-				<el-form-item :label="t('topRounded')">
-					<el-slider v-model="diyStore.editComponent.topElementRounded" show-input size="small" class="ml-[10px] diy-nav-slider" :max="50" />
-				</el-form-item>
-				<el-form-item :label="t('bottomRounded')">
-					<el-slider v-model="diyStore.editComponent.bottomElementRounded" show-input size="small" class="ml-[10px] diy-nav-slider" :max="50" />
-				</el-form-item>
-			</el-form>
-		</div>
+        <div class="edit-attr-item-wrap">
+            <h3 class="mb-[10px]">{{ t('btnStyle') }}</h3>
+            <el-form label-width="100px" class="px-[10px]">
+                <el-form-item :label="t('topRounded')">
+                    <el-slider v-model="diyStore.editComponent.topElementRounded" show-input size="small" class="ml-[10px] diy-nav-slider" :max="50" />
+                </el-form-item>
+                <el-form-item :label="t('bottomRounded')">
+                    <el-slider v-model="diyStore.editComponent.bottomElementRounded" show-input size="small" class="ml-[10px] diy-nav-slider" :max="50" />
+                </el-form-item>
+            </el-form>
+        </div>
 
-		<!-- 组件样式 -->
-		<slot name="style"></slot>
+        <!-- 组件样式 -->
+        <slot name="style"></slot>
 
-	</div>
+    </div>
 </template>
 
 <script lang="ts" setup>
@@ -81,8 +85,8 @@ const diyStore = useDiyStore()
 diyStore.editComponent.ignore = ['componentBgUrl'] // 忽略公共属性
 
 // 单选
-const btnPositionChangeFn = (e)=>{
-    if(e == 'hover_screen_bottom'){
+const btnPositionChangeFn = (e) => {
+    if (e == 'hover_screen_bottom') {
         diyStore.editComponent.margin.bottom = 0;
         diyStore.editComponent.margin.both = 0;
         diyStore.editComponent.margin.top = 0;
@@ -91,19 +95,19 @@ const btnPositionChangeFn = (e)=>{
 
 // 组件验证
 diyStore.editComponent.verify = (index: number) => {
-	const res = { code: true, message: '' }
-	if (diyStore.value[index].submitBtn.text == '') {
-		res.code = false;
-		res.message = t('submitBtnNamePlaceholder');
-		return res;
-	}
-	if (diyStore.value[index].resetBtn.text == '') {
-		res.code = false;
-		res.message = t('resetBtnNamePlaceholder');
-		return res;
-	}
+    const res = { code: true, message: '' }
+    if (diyStore.value[index].submitBtn.text == '') {
+        res.code = false;
+        res.message = t('submitBtnNamePlaceholder');
+        return res;
+    }
+    if (diyStore.value[index].resetBtn.text == '') {
+        res.code = false;
+        res.message = t('resetBtnNamePlaceholder');
+        return res;
+    }
 
-	return res
+    return res
 }
 
 defineExpose({})
diff --git a/admin/src/app/views/diy_form/components/edit-form-table.vue b/admin/src/app/views/diy_form/components/edit-form-table.vue
index 94c0bc2c0..d83c2d172 100644
--- a/admin/src/app/views/diy_form/components/edit-form-table.vue
+++ b/admin/src/app/views/diy_form/components/edit-form-table.vue
@@ -1,44 +1,412 @@
 <template>
-	<!-- 内容 -->
-	<div class="content-wrap" v-show="diyStore.editTab == 'content'">
+    <!-- 内容 -->
+    <div class="content-wrap" v-show="diyStore.editTab == 'content'">
 
-		<!-- 表单组件 字段内容设置 -->
-		<slot name="field"></slot>
-		todo 此处编写表格组件的属性
+        <!-- 表单组件 字段内容设置 -->
+        <slot name="field"></slot>
+        <el-form label-width="100px" class="px-[10px]" @submit.prevent>
+            <el-form-item :label="t('列设置')">
+                <div ref="imageBoxRef">
+                    <div v-for="(item, index) in diyStore.editComponent.columnList" :key="item.id"
+                        class="border-b-[1px] border-[#e0e0e0] py-1">
+                        <div class="flex items-center justify-between">
+                            <div class="flex">
+                                <span :class="['iconfont', 'ml-[5px]', 'cursor-pointer', getIconClass(item.type)]"></span>
+                                <el-input v-model="item.name" class="input-style" :input-style="{ boxShadow: 'none' }"
+                                    :placeholder="t('请输入列名')" />
+                            </div>
+                            <div class="flex">
+                                <span v-if="diyStore.editComponent.columnList.length > 1" @click="removeOption(index)"
+                                    class="cursor-pointer ml-[5px] nc-iconfont nc-icon-shanchu-yuangaizhiV6xx"></span>
+                                <span class="cursor-pointer ml-[5px] nc-iconfont nc-icon-xiaV6xx"></span>
+                            </div>
+                        </div>
+                        <div v-if="item.type == 'radio'" class="flex">
+                            <div class="text-[#999] mr-3" >{{ item.options?.length || 0 }}个选项</div>
+                            <span class="text-primary cursor-pointer mr-[10px]" @click="openRadioDialog(item, index)">{{ t('编辑') }}</span>
+                        </div>
+                        <div v-if="item.type == 'date'" class="flex">
+                            <span class="text-primary cursor-pointer mr-[10px]" @click="openRadioDialog(item, index)">{{ t('设置日期格式') }}</span>
+                        </div>
+                        <div v-if="item.type == 'address'" class="flex">
+                            <div class="text-[#999] mr-3">精确到详细地址</div>
+                            <span class="text-primary cursor-pointer mr-[10px]" @click="openRadioDialog(item, index)">{{ t('设置') }}</span>
+                        </div>
+                    </div>
+                </div>
+                <el-popover placement="bottom" :width="50" trigger="hover">
+                    <template #reference>
+                        <span class="text-primary cursor-pointer mr-[10px]">{{ t('添加') }}</span>
+                    </template>
+                    <div v-for="(item, index) in columnTypeOptions" :key="index" @click="addOption(item)"
+                        class="cursor-pointer hover:bg-[#d1e1ff] rounded text-center">
+                        <div class="py-1 text-[var(--el-text-color-primary]">{{ item.label }}</div>
+                    </div>
+                </el-popover>
 
-		<!-- 表单组件 其他设置 -->
-		<slot name="other"></slot>
+            </el-form-item>
+            <el-form-item :label="t('是否自增')">
+                <el-switch v-model="diyStore.editComponent.autoIncrementControl" />
+            </el-form-item>
+            <el-form-item :label="t('填写限制')" v-if="diyStore.editComponent.autoIncrementControl">
+                <div class="flex items-center">
+                    <span>默认显示</span>
+                    <el-input v-model="diyStore.editComponent.writeLimit.default" class="input-short"  :placeholder="t('')" />
+                    <span>项</span>
+                </div>
+                <div class="flex items-center my-1">
+                    <span>最少填写</span>
+                    <el-input v-model="diyStore.editComponent.writeLimit.min" class="input-short"  :placeholder="t('')" />
+                    <span>项</span>
+                </div>
+                <div class="flex items-center">
+                    <span>最多填写</span>
+                    <el-input v-model="diyStore.editComponent.writeLimit.max" class="input-short"  :placeholder="t('')" />
+                    <span>项</span>
+                </div>
+            </el-form-item>
+            <el-form-item :label="t('按钮名称')" v-if="diyStore.editComponent.autoIncrementControl">
+                <el-input v-model="diyStore.editComponent.btnText" :placeholder="t('请输入按钮名称')" />
+            </el-form-item>
+        </el-form>
+        <!-- 单选项 -->
+        <!-- <el-dialog v-model="radioDialogVisible" :title="t('设置单选项')" width="500">
+            <div v-if="activeColumnTemp.type == 'radio'">
+                <el-form label-width="80px" class="px-[10px]">
+                    <el-form-item :label="t('选项名称')">
+                        <el-input v-model="activeColumnTemp.name" :input-style="{ boxShadow: 'none' }" />
+                    </el-form-item>
+                    <el-form-item :label="t('设置选项')">
+                        <div ref="radioBoxRef">
+                            <div v-for="(opt, idx) in activeColumnTemp.options" :key="opt.id">
+                                <div class="flex items-center justify-between mb-2">
+                                    <div class="flex-1">
+                                        <el-input v-model="opt.label" :input-style="{ boxShadow: 'none' }"
+                                            :placeholder="t('请输入')" />
+                                    </div>
+                                    <span v-if="activeColumnTemp.options.length > 1" @click="removeOptionItem(idx)"
+                                        class="cursor-pointer ml-[5px] nc-iconfont nc-icon-shanchu-yuangaizhiV6xx"></span>
+                                    <span class="cursor-pointer ml-[5px] nc-iconfont nc-icon-iconpaixu1"></span>
+                                </div>
+                            </div>
+                            <span class="text-primary cursor-pointer mr-[10px]" @click="addOptionItem">{{ t('添加选项') }}</span>
+                            <span class="text-primary cursor-pointer mr-[10px]" @click="addOtherOption">{{ t('添加其它项') }}</span>
+                            <el-popover :visible="visible" placement="bottom" :width="300">
+                                <p class="mb-[5px]">{{ t('addMultipleOption') }}</p>
+                                <p class="text-[#888] text-[12px] mb-[5px]">{{ t('addOptionTips') }}</p>
+                                <el-input v-model.trim="optionsValue" type="textarea" clearable maxlength="200"
+                                    show-word-limit />
+                                <div class="mt-[10px] text-right">
+                                    <el-button size="small" text @click="visible = false">{{ t('cancel') }}</el-button>
+                                    <el-button size="small" type="primary" @click="batchAddOptions">{{t('confirm')}}</el-button>
+                                </div>
+                                <template #reference>
+                                    <span class="text-primary cursor-pointer"
+                                        @click="visible = true">{{ t('addMultipleOption') }}</span>
+                                </template>
+                            </el-popover>
+                        </div>
+                    </el-form-item>
+                </el-form>
+            </div>
+            <div v-else-if="activeColumnTemp.type == 'date'">
+                <el-form>
+                    <el-form-item :label="t('dataFormat')">
+                        <el-radio-group v-model="activeColumnTemp.dateFormat" class="!block">
+                            <el-radio class="!block" label="YYYY年M月D日">{{ dateFormat.format1 }}</el-radio>
+                            <el-radio class="!block" label="YYYY-MM-DD">{{ dateFormat.format2 }}</el-radio>
+                            <el-radio class="!block" label="YYYY/MM/DD">{{ dateFormat.format3 }}</el-radio>
+                            <el-radio class="!block" label="YYYY-MM-DD HH:mm">{{ dateFormat.format4 }}</el-radio>
+                        </el-radio-group>
+                    </el-form-item>
+                </el-form>
+            </div>
+            <div v-else-if="activeColumnTemp.type == 'address'">
+                <el-form>
+                    <el-form-item :label="t('地址格式')">
+                        <el-radio-group v-model="activeColumnTemp.addressFormat" class="!block">
+                            <el-radio class="!block" label="province/city/district/address">{{ t('省/市/区/街道/详细地址') }}</el-radio>
+                            <el-radio class="!block" label="province/city/district/street">{{ t('省/市/区/街道(镇)') }}</el-radio>
+                            <el-radio class="!block" label="province/city/district">{{ t('省/市/区(县)') }}</el-radio>
+                            <el-radio class="!block" label="province/city">{{ t('省/市') }}</el-radio>
+                            <el-radio class="!block" label="province">{{ t('省') }}</el-radio>
+                        </el-radio-group>
+                    </el-form-item>
+                </el-form>
+            </div>
+            <template #footer>
+                <div class="dialog-footer">
+                    <el-button @click="radioDialogVisible = false">取消</el-button>
+                    <el-button type="primary" @click="handleDialogConfirm">确定</el-button>
+                </div>
+            </template>
+        </el-dialog> -->
 
-	</div>
+        <div>
 
-	<!-- 样式 -->
-	<div class="style-wrap" v-show="diyStore.editTab == 'style'">
+        </div>
 
-		<!-- 表单组件 字段样式 -->
-		<slot name="style-field"></slot>
+        <!-- 表单组件 其他设置 -->
+        <slot name="other"></slot>
 
-		<!-- 组件样式 -->
-		<slot name="style"></slot>
+    </div>
 
-	</div>
+    <!-- 样式 -->
+    <div class="style-wrap" v-show="diyStore.editTab == 'style'">
+
+        <!-- 表单组件 字段样式 -->
+        <slot name="style-field"></slot>
+
+        <!-- 组件样式 -->
+        <slot name="style"></slot>
+
+    </div>
 </template>
 
 <script lang="ts" setup>
 import { t } from '@/lang'
-import { ref } from 'vue'
+import Sortable from 'sortablejs'
+import { ref, watch, onMounted, nextTick ,reactive, computed} from 'vue'
 import useDiyStore from '@/stores/modules/diy'
-
+import { range } from 'lodash-es'
 const diyStore = useDiyStore()
 diyStore.editComponent.ignore = ['componentBgUrl'] // 忽略公共属性
-
 // 组件验证
 diyStore.editComponent.verify = (index: number) => {
     const res = { code: true, message: '' }
-	// todo 只需要考虑该组件自身的验证
+    // todo 只需要考虑该组件自身的验证
     return res
 }
+
+// 类型选项数组
+const columnTypeOptions = ref([
+    { label: '单选项', value: 'radio' },
+    { label: '文本', value: 'text' },
+    { label: '数字', value: 'number' },
+    { label: '手机号', value: 'mobile' },
+    { label: '地址', value: 'address' },
+    { label: '身份证', value: 'idcard' },
+    { label: '性别', value: 'gender' },
+    { label: '日期', value: 'date' }
+])
+
+const getIconClass = (type:any) => {
+    switch (type) {
+        case 'radio':
+            return 'icona-duihaopc30'
+        case 'text':
+            return 'icona-danhangwenben-1pc30'
+        case 'number':
+            return 'icona-shuzipc30-1'
+        case 'mobile':
+            return 'icona-shoujipc30'
+        case 'address':
+            return 'iconbiaotipc'
+        case 'idcard':
+            return 'icona-shenfenzhengpc30'
+        case 'gender':
+            return 'el-icon-s-opportunity'
+        case 'date':
+            return 'icona-riqipc30'
+        default:
+            return ''
+    }
+}
+
+const imageBoxRef = ref()
+const generateId = () => Date.now().toString(36) + Math.random().toString(36).substr(2, 5)
+// 添加列方法
+const addOption = (item) => {
+    const newColumn: any = {
+        id: generateId(),
+        name: item.label,
+        type: item.value, // 列类型
+        value: ''         // 默认值（可选）
+    }
+
+    // 如果是单选项，初始化 options
+    if (item.value === 'radio') {
+        newColumn.options = [
+            { id: generateId(), label: '选项1' },
+            { id: generateId(), label: '选项2' }
+        ]
+    }
+    // 如果是日期，初始化 dateFormat
+    if (item.value === 'date') {
+        newColumn.dateFormat  = 'YYYY年M月D日' // 默认日期格式
+    }
+    // 如果是地址，初始化 addressFormat
+    if (item.value === 'address') {
+        newColumn.addressFormat  = 'province/city/district/address' // 默认日期格式
+    }
+
+    diyStore.editComponent.columnList.push(newColumn)
+}
+
+const removeOption = (index: number) => {
+    diyStore.editComponent.columnList.splice(index, 1)
+}
+
+
+onMounted(() => {
+    // nextTick(() => {
+    //     if (diyStore.editComponent.columnList.length < 2) return;
+    //     const sortable = Sortable.create(imageBoxRef.value, {
+    //         group: 'item-wrap',
+    //         animation: 200,
+    //         onEnd: event => {
+    //             const temp = diyStore.editComponent.columnList[event.oldIndex!]
+    //             diyStore.editComponent.columnList.splice(event.oldIndex!, 1)
+    //             diyStore.editComponent.columnList.splice(event.newIndex!, 0, temp)
+    //             sortable.sort(
+    //                 range(diyStore.editComponent.columnList.length).map(value => {
+    //                     return value.toString()
+    //                 })
+    //             )
+    //         }
+    //     })
+    // })
+    console.log(diyStore.editComponent.columnList);
+
+})
+
+const activeColumn = ref<any>({}) // 真正数据（原始数据，不动它）
+const activeColumnTemp = ref<any>({}) // 弹窗编辑临时副本
+const activeRadioIndex = ref(0) // 当前编辑列的下标
+
+const radioDialogVisible = ref(false)
+const radioBoxRef = ref()
+
+const optionsValue = ref('')
+const visible = ref(false)
+const dateFormat: any = reactive({
+    format1: '',
+    format2: '',
+    format3: '',
+    format4: ''
+});
+
+const openRadioDialog = (item, index) => {
+    activeRadioIndex.value = index // 记录当前列的下标，方便确定时更新
+    activeColumn.value = item
+    activeColumnTemp.value = JSON.parse(JSON.stringify(item)) // 深拷贝，避免联动
+    if(item.type == 'radio'){
+        if (!activeColumnTemp.value.options) activeColumnTemp.value.options = []
+        radioDialogVisible.value = true
+        // nextTick(() => initRadioSortable()) // 拖拽初始化
+    }else if(item.type == 'date'){
+        // 初始赋值当天日期
+    const today = new Date();
+    let year = today.getFullYear();
+    let month = String(today.getMonth() + 1).padStart(2, '0');
+    let day = String(today.getDate()).padStart(2, '0');
+
+    const hours = String(today.getHours()).padStart(2, '0');
+    const minutes = String(today.getMinutes()).padStart(2, '0');
+    dateFormat.format1 = `${ year }年${ month }月${ day }日`;
+    dateFormat.format2 = `${ year }-${ month }-${ day }`;
+    dateFormat.format3 = `${ year }/${ month }/${ day }`;
+    dateFormat.format4 = `${ year }-${ month }-${ day } ${ hours }:${ minutes }`;
+    radioDialogVisible.value = true
+    } else if(item.type == 'address'){
+        radioDialogVisible.value = true
+    }
+}
+
+// 初始化拖拽
+// const initRadioSortable = () => {
+//     Sortable.create(radioBoxRef.value, {
+//         group: 'radio-option-wrap',
+//         animation: 200,
+//         draggable: '.drag-radio-item',
+//         onEnd: event => {
+//             const options = activeColumnTemp.value.options // 注意！这里用 temp 的
+//             const temp = options[event.oldIndex!]
+//             options.splice(event.oldIndex!, 1)
+//             options.splice(event.newIndex!, 0, temp)
+//         }
+//     })
+// }
+
+const handleDialogConfirm = () => {
+    console.log(activeColumnTemp.value);
+
+    diyStore.editComponent.columnList[activeRadioIndex.value] = JSON.parse(JSON.stringify(activeColumnTemp.value)) // 同步副本到原数据
+    radioDialogVisible.value = false // 关闭弹窗
+}
+
+const addOptionItem = () => {
+    const newOption = { id: generateId(), label: '选项' + (activeColumnTemp.value.options.length + 1) }
+    activeColumnTemp.value.options.push(newOption)
+}
+
+const addOtherOption = () => {
+    const newOption = { id: generateId(), label: '其他' }
+    activeColumnTemp.value.options.push(newOption)
+}
+
+const removeOptionItem = (index: number) => {
+    activeColumnTemp.value.options.splice(index, 1)
+}
+
+// 数组去重
+const uniqueByKey = (arr: any, key: any) => {
+    const seen = new Set();
+    return arr.filter((item: any) => {
+        const serializedKey = JSON.stringify(item[key]);
+        return seen.has(serializedKey) ? false : seen.add(serializedKey);
+    });
+}
+// 批量添加
+const batchAddOptions = () => {
+    if (optionsValue.value.trim()) {
+        const newOptions = optionsValue.value.split(',').map((option: any) => {
+            return {
+                id: diyStore.generateRandom(),
+                label: option.trim()
+            };
+        }).filter((option: any) => option.label !== '');
+
+        // 去除重复的选项
+        const uniqueNewOptions = uniqueByKey(newOptions, 'label');
+
+        // 过滤掉已存在的选项
+        const filteredNewOptions = uniqueNewOptions.filter(newOption =>
+            !activeColumnTemp.value.options.some(existingOption => existingOption.label === newOption.label)
+        );
+
+        // 如果有新的选项，添加到选项列表中
+        if (filteredNewOptions.length > 0) {
+            activeColumnTemp.value.options.push(...filteredNewOptions);
+        } else {
+            ElMessage({
+                message: t('errorTipsTwo'),
+                type: "warning",
+            });
+        }
+
+        optionsValue.value = '';
+        visible.value = false;
+    }
+};
+
+
+
+
+
+
 defineExpose({})
 
 </script>
 
-<style lang="scss" scoped></style>
+<style lang="scss" scoped>
+:deep(.input-style .el-input__wrapper) {
+    box-shadow: none !important;
+}
+
+.input-short{
+    width: 80px;
+    margin: 0 10px;
+}
+
+</style>
diff --git a/admin/src/app/views/diy_form/components/edit-form-textarea.vue b/admin/src/app/views/diy_form/components/edit-form-textarea.vue
index 4ba95202e..e3aa7c379 100644
--- a/admin/src/app/views/diy_form/components/edit-form-textarea.vue
+++ b/admin/src/app/views/diy_form/components/edit-form-textarea.vue
@@ -1,66 +1,67 @@
 <template>
-	<!-- 内容 -->
-	<div class="content-wrap" v-show="diyStore.editTab == 'content'">
+    <!-- 内容 -->
+    <div class="content-wrap" v-show="diyStore.editTab == 'content'">
 
-		<!-- 表单组件 字段内容设置 -->
-		<slot name="field"></slot>
-		<el-form label-width="100px" class="px-[10px]" @submit.prevent>
-			<el-form-item :label="t('formPlaceholder')">
-				<el-input v-model.trim="diyStore.editComponent.placeholder" :placeholder="t('formPlaceholderTips')" clearable maxlength="15" show-word-limit />
-			</el-form-item>
-			<el-form-item>
-				<template #label>
-					<div class="flex items-center">
-						<span class="mr-[3px]">{{ t('defaultValue') }}</span>
-						<el-tooltip effect="light" :content="t('defaultValueTips')" placement="top">
-							<el-icon>
-								<QuestionFilled color="#999999" />
-							</el-icon>
-						</el-tooltip>
-					</div>
-				</template>
-				<el-input v-model.trim="diyStore.editComponent.field.default" :placeholder="t('defaultValuePlaceholder')" clearable maxlength="18" show-word-limit />
-			</el-form-item>
-			<el-form-item :label="t('rowCount')">
-				<el-input v-model.trim="diyStore.editComponent.rowCount" :placeholder="t('rowCountPlaceholder')" clearable maxlength="2" show-word-limit />
-			</el-form-item>
-		</el-form>
+        <!-- 表单组件 字段内容设置 -->
+        <slot name="field"></slot>
+        <el-form label-width="100px" class="px-[10px]" @submit.prevent>
+            <el-form-item :label="t('formPlaceholder')">
+                <el-input v-model.trim="diyStore.editComponent.placeholder" :placeholder="t('formPlaceholderTips')" clearable maxlength="15" show-word-limit />
+            </el-form-item>
+            <el-form-item>
+                <template #label>
+                    <div class="flex items-center">
+                        <span class="mr-[3px]">{{ t('defaultValue') }}</span>
+                        <el-tooltip effect="light" :content="t('defaultValueTips')" placement="top">
+                            <el-icon>
+                                <QuestionFilled color="#999999" />
+                            </el-icon>
+                        </el-tooltip>
+                    </div>
+                </template>
+                <el-input v-model.trim="diyStore.editComponent.field.default"
+                          :placeholder="t('defaultValuePlaceholder')" clearable maxlength="18" show-word-limit />
+            </el-form-item>
+            <el-form-item :label="t('rowCount')">
+                <el-input v-model.trim="diyStore.editComponent.rowCount" :placeholder="t('rowCountPlaceholder')" clearable maxlength="2" show-word-limit />
+            </el-form-item>
+        </el-form>
 
-		<!-- 表单组件 其他设置 -->
-		<slot name="other"></slot>
-		<!--<el-form label-width="100px" class="px-[10px]">
-			<el-form-item class="display-block">
-				<template #label>
-					<div class="flex items-center">
-						<span class="mr-[3px]">{{ t('隐私保护') }}</span>
-						<el-tooltip effect="light" placement="top">
-							<template #content>
-								<p>会自动将提交的个人信息做加密展示。</p>
-								<p>适用于公开展示收集的数据且不暴露用户隐私。</p>
-							</template>
-							<el-icon>
-								<QuestionFilled color="#999999" />
-							</el-icon>
-						</el-tooltip>
-					</div>
-				</template>
-				<el-switch v-model="diyStore.editComponent.field.privacyProtection" />
-				<div class="text-sm text-gray-400">{{ t('提交后自动隐藏文本，仅管理员可查看') }}</div>
-			</el-form-item>
-		</el-form>-->
+        <!-- 表单组件 其他设置 -->
+        <slot name="other"></slot>
+        <!--<el-form label-width="100px" class="px-[10px]">
+          <el-form-item class="display-block">
+            <template #label>
+              <div class="flex items-center">
+                <span class="mr-[3px]">{{ t('隐私保护') }}</span>
+                <el-tooltip effect="light" placement="top">
+                  <template #content>
+                    <p>会自动将提交的个人信息做加密展示。</p>
+                    <p>适用于公开展示收集的数据且不暴露用户隐私。</p>
+                  </template>
+                  <el-icon>
+                    <QuestionFilled color="#999999" />
+                  </el-icon>
+                </el-tooltip>
+              </div>
+            </template>
+            <el-switch v-model="diyStore.editComponent.field.privacyProtection" />
+            <div class="text-sm text-gray-400">{{ t('提交后自动隐藏文本，仅管理员可查看') }}</div>
+          </el-form-item>
+        </el-form>-->
 
-	</div>
+    </div>
 
-	<!-- 样式 -->
-	<div class="style-wrap" v-show="diyStore.editTab == 'style'">
+    <!-- 样式 -->
+    <div class="style-wrap" v-show="diyStore.editTab == 'style'">
 
-		<!-- 表单组件 字段样式 -->
-		<slot name="style-field"></slot>
+        <!-- 表单组件 字段样式 -->
+        <slot name="style-field"></slot>
 
-		<!-- 组件样式 -->
-		<slot name="style"></slot>
+        <!-- 组件样式 -->
+        <slot name="style"></slot>
 
-	</div>
+    </div>
 </template>
 
 <script lang="ts" setup>
@@ -74,7 +75,7 @@ diyStore.editComponent.ignore = ['componentBgUrl'] // 忽略公共属性
 // 组件验证
 diyStore.editComponent.verify = (index: number) => {
     const res = { code: true, message: '' }
-	// todo 只需要考虑该组件自身的验证
+    // todo 只需要考虑该组件自身的验证
     return res
 }
 defineExpose({})
diff --git a/admin/src/app/views/diy_form/components/edit-form-time-scope.vue b/admin/src/app/views/diy_form/components/edit-form-time-scope.vue
index a188b4aac..1ec45865a 100644
--- a/admin/src/app/views/diy_form/components/edit-form-time-scope.vue
+++ b/admin/src/app/views/diy_form/components/edit-form-time-scope.vue
@@ -1,86 +1,88 @@
 <template>
-	<!-- 内容 -->
-	<div class="content-wrap" v-show="diyStore.editTab == 'content'">
+    <!-- 内容 -->
+    <div class="content-wrap" v-show="diyStore.editTab == 'content'">
 
-		<!-- 表单组件 字段内容设置 -->
-		<slot name="field"></slot>
+        <!-- 表单组件 字段内容设置 -->
+        <slot name="field"></slot>
 
-		<div class="edit-attr-item-wrap">
-			<h3 class="mb-[10px]">{{ t('startTime') }}</h3>
-			<el-form label-width="100px" class="px-[10px]" @submit.prevent>
-				<el-form-item :label="t('formPlaceholder')">
-					<el-input v-model.trim="diyStore.editComponent.start.placeholder" :placeholder="t('formPlaceholderTips')" clearable maxlength="15" show-word-limit />
-				</el-form-item>
-				<el-form-item :label="t('defaultValue')">
-					<el-switch v-model="diyStore.editComponent.start.defaultControl"/>
-				</el-form-item>
-				<el-form-item v-if="diyStore.editComponent.start.defaultControl">
-					<el-radio-group v-model="diyStore.editComponent.start.timeWay">
-						<el-radio label="current">{{ t('currentTime') }}</el-radio>
-						<el-radio label="diy">{{ t('diyTime') }}</el-radio>
-					</el-radio-group>
-				</el-form-item>
-				<el-form-item v-if="diyStore.editComponent.start.defaultControl && diyStore.editComponent.start.timeWay == 'diy'">
+        <div class="edit-attr-item-wrap">
+            <h3 class="mb-[10px]">{{ t('startTime') }}</h3>
+            <el-form label-width="100px" class="px-[10px]" @submit.prevent>
+                <el-form-item :label="t('formPlaceholder')">
+                    <el-input v-model.trim="diyStore.editComponent.start.placeholder" :placeholder="t('formPlaceholderTips')" clearable maxlength="15" show-word-limit />
+                </el-form-item>
+                <el-form-item :label="t('defaultValue')">
+                    <el-switch v-model="diyStore.editComponent.start.defaultControl" />
+                </el-form-item>
+                <el-form-item v-if="diyStore.editComponent.start.defaultControl">
+                    <el-radio-group v-model="diyStore.editComponent.start.timeWay">
+                        <el-radio label="current">{{ t('currentTime') }}</el-radio>
+                        <el-radio label="diy">{{ t('diyTime') }}</el-radio>
+                    </el-radio-group>
+                </el-form-item>
+                <el-form-item
+                    v-if="diyStore.editComponent.start.defaultControl && diyStore.editComponent.start.timeWay == 'diy'">
                     <el-time-picker v-model="diyStore.editComponent.field.default.start.date" :placeholder="t('startTimePlaceholder')" format="HH:mm" value-format="HH:mm" @change="startTimePickerChange" />
-				</el-form-item>
-			</el-form>
-		</div>
+                </el-form-item>
+            </el-form>
+        </div>
 
-		<div class="edit-attr-item-wrap">
-			<h3 class="mb-[10px]">{{ t('endTime') }}</h3>
-			<el-form label-width="100px" class="px-[10px]" @submit.prevent>
-				<el-form-item :label="t('formPlaceholder')">
-					<el-input v-model.trim="diyStore.editComponent.end.placeholder" :placeholder="t('formPlaceholderTips')" clearable maxlength="15" show-word-limit />
-				</el-form-item>
-				<el-form-item :label="t('defaultValue')">
-					<el-switch v-model="diyStore.editComponent.end.defaultControl"  />
-				</el-form-item>
-				<el-form-item v-if="diyStore.editComponent.end.defaultControl">
-					<el-radio-group v-model="diyStore.editComponent.end.timeWay">
-						<el-radio label="current">{{ t('currentTime') }}</el-radio>
-						<el-radio label="diy">{{ t('diyTime') }}</el-radio>
-					</el-radio-group>
-				</el-form-item>
-				<el-form-item v-if="diyStore.editComponent.end.defaultControl && diyStore.editComponent.end.timeWay == 'diy'">
-                    <el-time-picker  :disabled-hours="disabledHours" :disabled-minutes="disabledMinutes" v-model="diyStore.editComponent.field.default.end.date" :placeholder="t('endTimePlaceholder')" format="HH:mm" value-format="HH:mm" />
-				</el-form-item>
-			</el-form>
-		</div>
+        <div class="edit-attr-item-wrap">
+            <h3 class="mb-[10px]">{{ t('endTime') }}</h3>
+            <el-form label-width="100px" class="px-[10px]" @submit.prevent>
+                <el-form-item :label="t('formPlaceholder')">
+                    <el-input v-model.trim="diyStore.editComponent.end.placeholder" :placeholder="t('formPlaceholderTips')" clearable maxlength="15" show-word-limit />
+                </el-form-item>
+                <el-form-item :label="t('defaultValue')">
+                    <el-switch v-model="diyStore.editComponent.end.defaultControl" />
+                </el-form-item>
+                <el-form-item v-if="diyStore.editComponent.end.defaultControl">
+                    <el-radio-group v-model="diyStore.editComponent.end.timeWay">
+                        <el-radio label="current">{{ t('currentTime') }}</el-radio>
+                        <el-radio label="diy">{{ t('diyTime') }}</el-radio>
+                    </el-radio-group>
+                </el-form-item>
+                <el-form-item
+                    v-if="diyStore.editComponent.end.defaultControl && diyStore.editComponent.end.timeWay == 'diy'">
+                    <el-time-picker :disabled-hours="disabledHours" :disabled-minutes="disabledMinutes" v-model="diyStore.editComponent.field.default.end.date" :placeholder="t('endTimePlaceholder')" format="HH:mm" value-format="HH:mm" />
+                </el-form-item>
+            </el-form>
+        </div>
 
-		<!-- 表单组件 其他设置 -->
-		<slot name="other"></slot>
-	</div>
+        <!-- 表单组件 其他设置 -->
+        <slot name="other"></slot>
+    </div>
 
-	<!-- 样式 -->
-	<div class="style-wrap" v-show="diyStore.editTab == 'style'">
+    <!-- 样式 -->
+    <div class="style-wrap" v-show="diyStore.editTab == 'style'">
 
-		<div class="edit-attr-item-wrap">
-			<h3 class="mb-[10px]">{{ t('textStyle') }}</h3>
-			<el-form label-width="80px" class="px-[10px]">
-				<el-form-item :label="t('textFontSize')">
-					<el-slider v-model="diyStore.editComponent.fontSize" show-input size="small" class="ml-[10px] diy-nav-slider" :min="12" :max="18" />
-				</el-form-item>
-				<el-form-item :label="t('textFontWeight')">
-					<el-radio-group v-model="diyStore.editComponent.fontWeight">
-						<el-radio :label="'normal'">{{ t('fontWeightNormal') }}</el-radio>
-						<el-radio :label="'bold'">{{ t('fontWeightBold') }}</el-radio>
-					</el-radio-group>
-				</el-form-item>
-				<el-form-item :label="t('textColor')">
-					<el-color-picker v-model="diyStore.editComponent.textColor" />
-				</el-form-item>
-			</el-form>
-		</div>
+        <div class="edit-attr-item-wrap">
+            <h3 class="mb-[10px]">{{ t('textStyle') }}</h3>
+            <el-form label-width="80px" class="px-[10px]">
+                <el-form-item :label="t('textFontSize')">
+                    <el-slider v-model="diyStore.editComponent.fontSize" show-input size="small" class="ml-[10px] diy-nav-slider" :min="12" :max="18" />
+                </el-form-item>
+                <el-form-item :label="t('textFontWeight')">
+                    <el-radio-group v-model="diyStore.editComponent.fontWeight">
+                        <el-radio :label="'normal'">{{ t('fontWeightNormal') }}</el-radio>
+                        <el-radio :label="'bold'">{{ t('fontWeightBold') }}</el-radio>
+                    </el-radio-group>
+                </el-form-item>
+                <el-form-item :label="t('textColor')">
+                    <el-color-picker v-model="diyStore.editComponent.textColor" />
+                </el-form-item>
+            </el-form>
+        </div>
 
-		<!-- 组件样式 -->
-		<slot name="style"></slot>
+        <!-- 组件样式 -->
+        <slot name="style"></slot>
 
-	</div>
+    </div>
 </template>
 
 <script lang="ts" setup>
 import { t } from '@/lang'
-import { ref,onMounted } from 'vue'
+import { ref, onMounted } from 'vue'
 import useDiyStore from '@/stores/modules/diy'
 
 const diyStore = useDiyStore()
@@ -96,25 +98,25 @@ diyStore.editComponent.verify = (index: number) => {
     const hours = String(today.getHours()).padStart(2, '0');
     const minutes = String(today.getMinutes()).padStart(2, '0');
 
-    if(diyStore.editComponent.start.timeWay == 'current'){
-        starTime = `${hours}:${minutes}`;
+    if (diyStore.editComponent.start.timeWay == 'current') {
+        starTime = `${ hours }:${ minutes }`;
     }
-    if(diyStore.editComponent.end.timeWay == 'current'){
-        endTime = `${hours}:${minutes}`;
+    if (diyStore.editComponent.end.timeWay == 'current') {
+        endTime = `${ hours }:${ minutes }`;
     }
 
-    if(diyStore.editComponent.start.defaultControl && starTime == ''){
+    if (diyStore.editComponent.start.defaultControl && starTime == '') {
         res.code = false
         res.message = t('startTimeTips')
         return res
     }
-    if(diyStore.editComponent.end.defaultControl && endTime == ''){
+    if (diyStore.editComponent.end.defaultControl && endTime == '') {
         res.code = false
         res.message = t('endTimeTips')
         return res
     }
 
-    if(diyStore.editComponent.start.defaultControl && diyStore.editComponent.end.defaultControl && timeInvertSecond(starTime)  > timeInvertSecond(endTime)){
+    if (diyStore.editComponent.start.defaultControl && diyStore.editComponent.end.defaultControl && timeInvertSecond(starTime) > timeInvertSecond(endTime)) {
         res.code = false
         res.message = t('startEndTimeTips')
         return res
@@ -122,28 +124,26 @@ diyStore.editComponent.verify = (index: number) => {
     return res
 }
 
-
 onMounted(() => {
     const today = new Date();
     const hours = String(today.getHours()).padStart(2, '0');
     const minutes = String(today.getMinutes()).padStart(2, '0');
 
-    if(!diyStore.editComponent.field.default.start.date){
-        diyStore.editComponent.field.default.start.date = `${hours}:${minutes}`;
-        diyStore.editComponent.field.default.start.timestamp = timeInvertSecond(`${hours}:${minutes}`);
+    if (!diyStore.editComponent.field.default.start.date) {
+        diyStore.editComponent.field.default.start.date = `${ hours }:${ minutes }`;
+        diyStore.editComponent.field.default.start.timestamp = timeInvertSecond(`${ hours }:${ minutes }`);
     }
-    if(!diyStore.editComponent.field.default.end.date){
+    if (!diyStore.editComponent.field.default.end.date) {
         let endDate = new Date();
         endDate.setHours(today.getHours(), today.getMinutes() + 10, 0, 0); // 在当前时间基础上加 10 分钟
         const endHours = String(endDate.getHours()).padStart(2, '0');
         const endMinutes = String(endDate.getMinutes()).padStart(2, '0');
 
-        diyStore.editComponent.field.default.end.date = `${endHours}:${endMinutes}`;
-        diyStore.editComponent.field.default.end.timestamp = timeInvertSecond(`${endHours}:${endMinutes}`);
+        diyStore.editComponent.field.default.end.date = `${ endHours }:${ endMinutes }`;
+        diyStore.editComponent.field.default.end.timestamp = timeInvertSecond(`${ endHours }:${ endMinutes }`);
     }
 });
 
-
 // 开始时间选择器
 const startTimePickerChange = (e) => {
     diyStore.editComponent.field.default.start.timestamp = timeInvertSecond(e);
@@ -152,24 +152,24 @@ const startTimePickerChange = (e) => {
     const date = new Date();
     date.setHours(parseInt(startTimeArr[0]), parseInt(startTimeArr[1]), 0, 0);
     date.setMinutes(date.getMinutes() + 10);
-    const updatedEndTime = `${String(date.getHours()).padStart(2, '0')}:${String(date.getMinutes()).padStart(2, '0')}`;
+    const updatedEndTime = `${ String(date.getHours()).padStart(2, '0') }:${ String(date.getMinutes()).padStart(2, '0') }`;
     diyStore.editComponent.field.default.end.date = updatedEndTime;
     diyStore.editComponent.field.default.end.timestamp = timeInvertSecond(updatedEndTime);
 }
 
 // 结束时间选择器
-const endTimePickerChange = (e)=>{
+const endTimePickerChange = (e) => {
     diyStore.editComponent.field.default.end.timestamp = timeInvertSecond(e);
 }
 
 const disabledHours = () => {
     let timeArr = diyStore.editComponent.field.default.start.date.split(":")
-    return makeRange(0,timeArr[0]);
+    return makeRange(0, timeArr[0]);
 }
 
 const disabledMinutes = (hour: number) => {
     let timeArr = diyStore.editComponent.field.default.start.date.split(":")
-    return makeRange(0,timeArr[1]);
+    return makeRange(0, timeArr[1]);
 }
 
 const makeRange = (start: number, end: number) => {
@@ -180,16 +180,16 @@ const makeRange = (start: number, end: number) => {
     return result
 }
 
-const timeInvertSecond = (time:any)=>{
+const timeInvertSecond = (time: any) => {
     let arr = time.split(":");
     let num = 0;
-    if(arr[0]){
+    if (arr[0]) {
         num += arr[0] * 60 * 60;
     }
-    if(arr[1]){
+    if (arr[1]) {
         num += arr[1] * 60;
     }
-    if(arr[2]){
+    if (arr[2]) {
         num += arr[2];
     }
     return num;
diff --git a/admin/src/app/views/diy_form/components/edit-form-time.vue b/admin/src/app/views/diy_form/components/edit-form-time.vue
index a8e46c824..753180ae9 100644
--- a/admin/src/app/views/diy_form/components/edit-form-time.vue
+++ b/admin/src/app/views/diy_form/components/edit-form-time.vue
@@ -1,47 +1,47 @@
 <template>
-	<!-- 内容 -->
-	<div class="content-wrap" v-show="diyStore.editTab == 'content'">
+    <!-- 内容 -->
+    <div class="content-wrap" v-show="diyStore.editTab == 'content'">
 
-		<!-- 表单组件 字段内容设置 -->
-		<slot name="field"></slot>
-		<el-form label-width="100px" class="px-[10px]" @submit.prevent>
-			<el-form-item :label="t('formPlaceholder')">
-				<el-input v-model.trim="diyStore.editComponent.placeholder" :placeholder="t('formPlaceholderTips')" clearable maxlength="15" show-word-limit />
-			</el-form-item>
-			<el-form-item :label="t('defaultValue')">
-				<el-switch v-model="diyStore.editComponent.defaultControl" @change="changeDateDefaultControl" />
-			</el-form-item>
-			<el-form-item v-if="diyStore.editComponent.defaultControl">
-				<el-radio-group v-model="diyStore.editComponent.timeWay">
-					<el-radio label="current">{{ t('currentTime') }}</el-radio>
-					<el-radio label="diy">{{ t('diyTime') }}</el-radio>
-				</el-radio-group>
-			</el-form-item>
-			<el-form-item v-if="diyStore.editComponent.defaultControl && diyStore.editComponent.timeWay == 'diy'">
+        <!-- 表单组件 字段内容设置 -->
+        <slot name="field"></slot>
+        <el-form label-width="100px" class="px-[10px]" @submit.prevent>
+            <el-form-item :label="t('formPlaceholder')">
+                <el-input v-model.trim="diyStore.editComponent.placeholder" :placeholder="t('formPlaceholderTips')" clearable maxlength="15" show-word-limit />
+            </el-form-item>
+            <el-form-item :label="t('defaultValue')">
+                <el-switch v-model="diyStore.editComponent.defaultControl" @change="changeDateDefaultControl" />
+            </el-form-item>
+            <el-form-item v-if="diyStore.editComponent.defaultControl">
+                <el-radio-group v-model="diyStore.editComponent.timeWay">
+                    <el-radio label="current">{{ t('currentTime') }}</el-radio>
+                    <el-radio label="diy">{{ t('diyTime') }}</el-radio>
+                </el-radio-group>
+            </el-form-item>
+            <el-form-item v-if="diyStore.editComponent.defaultControl && diyStore.editComponent.timeWay == 'diy'">
                 <el-time-picker v-model="diyStore.editComponent.field.default" :placeholder="t('timePlaceholder')" format="HH:mm" value-format="HH:mm" />
-			</el-form-item>
-		</el-form>
+            </el-form-item>
+        </el-form>
 
-		<!-- 表单组件 其他设置 -->
-		<slot name="other"></slot>
+        <!-- 表单组件 其他设置 -->
+        <slot name="other"></slot>
 
-	</div>
+    </div>
 
-	<!-- 样式 -->
-	<div class="style-wrap" v-show="diyStore.editTab == 'style'">
+    <!-- 样式 -->
+    <div class="style-wrap" v-show="diyStore.editTab == 'style'">
 
-		<!-- 表单组件 字段样式 -->
-		<slot name="style-field"></slot>
+        <!-- 表单组件 字段样式 -->
+        <slot name="style-field"></slot>
 
-		<!-- 组件样式 -->
-		<slot name="style"></slot>
+        <!-- 组件样式 -->
+        <slot name="style"></slot>
 
-	</div>
+    </div>
 </template>
 
 <script lang="ts" setup>
 import { t } from '@/lang'
-import { ref,watch,onMounted } from 'vue'
+import { ref, watch, onMounted } from 'vue'
 import useDiyStore from '@/stores/modules/diy'
 
 const diyStore = useDiyStore()
@@ -54,32 +54,32 @@ diyStore.editComponent.verify = (index: number) => {
 }
 
 onMounted(() => {
-	// 初始赋值当天时间
-	if (!diyStore.editComponent.field.default) {
-        const today = new Date();
-		const hours = String(today.getHours()).padStart(2, '0');
-		const minutes = String(today.getMinutes()).padStart(2, '0');
-        diyStore.editComponent.field.default = `${hours}:${minutes}`;
-	}
-});
-
-const changeDateDefaultControl = (val: any) => {
-	if (val) {
-        const today = new Date();
-		const hours = String(today.getHours()).padStart(2, '0');
-		const minutes = String(today.getMinutes()).padStart(2, '0');
-        diyStore.editComponent.field.default = `${hours}:${minutes}`;
-	}
-}
-
-watch(
-	() => diyStore.editComponent.timeWay,
-	(newVal) => {
+    // 初始赋值当天时间
+    if (!diyStore.editComponent.field.default) {
         const today = new Date();
         const hours = String(today.getHours()).padStart(2, '0');
         const minutes = String(today.getMinutes()).padStart(2, '0');
-        diyStore.editComponent.field.default = `${hours}:${minutes}`;
-	}
+        diyStore.editComponent.field.default = `${ hours }:${ minutes }`;
+    }
+});
+
+const changeDateDefaultControl = (val: any) => {
+    if (val) {
+        const today = new Date();
+        const hours = String(today.getHours()).padStart(2, '0');
+        const minutes = String(today.getMinutes()).padStart(2, '0');
+        diyStore.editComponent.field.default = `${ hours }:${ minutes }`;
+    }
+}
+
+watch(
+    () => diyStore.editComponent.timeWay,
+    (newVal) => {
+        const today = new Date();
+        const hours = String(today.getHours()).padStart(2, '0');
+        const minutes = String(today.getMinutes()).padStart(2, '0');
+        diyStore.editComponent.field.default = `${ hours }:${ minutes }`;
+    }
 );
 
 defineExpose({})
diff --git a/admin/src/app/views/diy_form/components/edit-form-video.vue b/admin/src/app/views/diy_form/components/edit-form-video.vue
index c33bc2004..2d49df76f 100644
--- a/admin/src/app/views/diy_form/components/edit-form-video.vue
+++ b/admin/src/app/views/diy_form/components/edit-form-video.vue
@@ -1,30 +1,42 @@
 <template>
-	<!-- 内容 -->
-	<div class="content-wrap" v-show="diyStore.editTab == 'content'">
+    <!-- 内容 -->
+    <div class="content-wrap" v-show="diyStore.editTab == 'content'">
 
-		<!-- 表单组件 字段内容设置 -->
-		<slot name="field"></slot>
-		<el-form label-width="100px" class="px-[10px]">
-			<el-form-item :label="t('上传方式')">
-				<el-radio-group v-model="diyStore.editComponent.uploadMode">
-					<el-radio label="shoot_and_album">{{ t('拍摄和相册') }}</el-radio>
-					<el-radio label="shoot_only">{{ t('只允许拍摄') }}</el-radio>
-				</el-radio-group>
-			</el-form-item>
-		</el-form>
+        <!-- 表单组件 字段内容设置 -->
+        <slot name="field"></slot>
+        <el-form label-width="100px" class="px-[10px]">
+            <el-form-item>
+                <template #label>
+                    <div class="flex items-center">
+                        <span class="mr-[3px]">{{ t('上传方式') }}</span>
+                        <el-tooltip effect="light" :content="t('拍摄时长限制1分钟，从相册上传不限制时长。')" placement="top">
+                            <el-icon>
+                                <QuestionFilled color="#999999" />
+                            </el-icon>
+                        </el-tooltip>
+                    </div>
+                </template>
+                <el-radio-group v-model="diyStore.editComponent.uploadMode">
+                    <el-radio label="shoot_and_album">{{ t('拍摄和相册') }}</el-radio>
+                    <el-radio label="shoot_only">{{ t('只允许拍摄') }}</el-radio>
+                </el-radio-group>
+            </el-form-item>
+        </el-form>
+        <!-- 表单组件 其他设置 -->
+        <slot name="other"></slot>
 
-	</div>
+    </div>
 
-	<!-- 样式 -->
-	<div class="style-wrap" v-show="diyStore.editTab == 'style'">
+    <!-- 样式 -->
+    <div class="style-wrap" v-show="diyStore.editTab == 'style'">
 
-		<!-- 表单组件 字段样式 -->
-		<slot name="style-field"></slot>
+        <!-- 表单组件 字段样式 -->
+        <slot name="style-field"></slot>
 
-		<!-- 组件样式 -->
-		<slot name="style"></slot>
+        <!-- 组件样式 -->
+        <slot name="style"></slot>
 
-	</div>
+    </div>
 </template>
 
 <script lang="ts" setup>
diff --git a/admin/src/app/views/diy_form/components/edit-form-wechat-name.vue b/admin/src/app/views/diy_form/components/edit-form-wechat-name.vue
index ac42c732f..ef68eebfd 100644
--- a/admin/src/app/views/diy_form/components/edit-form-wechat-name.vue
+++ b/admin/src/app/views/diy_form/components/edit-form-wechat-name.vue
@@ -1,30 +1,30 @@
 <template>
-	<!-- 内容 -->
-	<div class="content-wrap" v-show="diyStore.editTab == 'content'">
+    <!-- 内容 -->
+    <div class="content-wrap" v-show="diyStore.editTab == 'content'">
 
-		<!-- 表单组件 字段内容设置 -->
-		<slot name="field"></slot>
-		<el-form label-width="100px" class="px-[10px]" @submit.prevent>
-			<el-form-item :label="t('formPlaceholder')">
-				<el-input v-model.trim="diyStore.editComponent.placeholder" :placeholder="t('formPlaceholderTips')" clearable maxlength="15" show-word-limit />
-			</el-form-item>
-		</el-form>
+        <!-- 表单组件 字段内容设置 -->
+        <slot name="field"></slot>
+        <el-form label-width="100px" class="px-[10px]" @submit.prevent>
+            <el-form-item :label="t('formPlaceholder')">
+                <el-input v-model.trim="diyStore.editComponent.placeholder" :placeholder="t('formPlaceholderTips')" clearable maxlength="15" show-word-limit />
+            </el-form-item>
+        </el-form>
 
-		<!-- 表单组件 其他设置 -->
-		<slot name="other"></slot>
+        <!-- 表单组件 其他设置 -->
+        <slot name="other"></slot>
 
-	</div>
+    </div>
 
-	<!-- 样式 -->
-	<div class="style-wrap" v-show="diyStore.editTab == 'style'">
+    <!-- 样式 -->
+    <div class="style-wrap" v-show="diyStore.editTab == 'style'">
 
-		<!-- 表单组件 字段样式 -->
-		<slot name="style-field"></slot>
+        <!-- 表单组件 字段样式 -->
+        <slot name="style-field"></slot>
 
-		<!-- 组件样式 -->
-		<slot name="style"></slot>
+        <!-- 组件样式 -->
+        <slot name="style"></slot>
 
-	</div>
+    </div>
 </template>
 
 <script lang="ts" setup>
@@ -38,7 +38,7 @@ diyStore.editComponent.ignore = ['componentBgUrl'] // 忽略公共属性
 // 组件验证
 diyStore.editComponent.verify = (index: number) => {
     const res = { code: true, message: '' }
-	// todo 只需要考虑该组件自身的验证
+    // todo 只需要考虑该组件自身的验证
     return res
 }
 defineExpose({})
diff --git a/admin/src/app/views/diy_form/components/form-spread-popup.vue b/admin/src/app/views/diy_form/components/form-spread-popup.vue
deleted file mode 100644
index cf60e34dc..000000000
--- a/admin/src/app/views/diy_form/components/form-spread-popup.vue
+++ /dev/null
@@ -1,144 +0,0 @@
-<template>
-    <div>
-        <el-dialog v-model="showDialog" :title="t('formPromotion')" width="500px" :destroy-on-close="true">
-
-            <el-tabs v-model="channel" class="mb-[10px]">
-                <el-tab-pane label="H5" name="h5"></el-tab-pane>
-                <el-tab-pane label="微信小程序" name="weapp"></el-tab-pane>
-            </el-tabs>
-
-            <div class="promote-flex flex" v-if="channel == 'h5'">
-                <div class="promote-img flex justify-center items-center bg-[#f8f8f8] w-[150px] h-[150px]">
-                    <el-image :src="wapImage" />
-                </div>
-
-                <div class="px-[20px] flex-1">
-                    <div class="mb-[10px]">{{ t('promoteUrl') }}</div>
-                    <el-input class="mb-[10px]" readonly :value="wapPreview">
-                        <template #append>
-                            <el-button @click="copyEvent(wapPreview)">{{ t('copy') }}</el-button>
-                        </template>
-                    </el-input>
-                    <a class="text-primary" :href="wapImage" download>{{ t('downLoadQRCode') }}</a>
-                </div>
-
-            </div>
-
-            <div class="promote-flex flex" v-if="channel == 'weapp'">
-                <div class="promote-img flex justify-center items-center bg-[#f8f8f8] w-[150px] h-[150px]">
-                    <el-image :src="img(weappData.path)" v-if="weappData.path" class="w-[150px] h-[150px]">
-                        <template #error>
-                            <div class="w-[150px] h-[150px] text-[14px] text-center leading-[150px]">{{ t('configureFailed') }}</div>
-                        </template>
-                    </el-image>
-                    <div v-else class="w-[150px] h-[150px] text-[14px] text-center leading-[150px]">{{ t('configureFailed') }}</div>
-                </div>
-
-                <div class="px-[20px] flex-1">
-                    <a class="text-primary" :href="img(weappData.path)" target="_blank" download>{{ t('downLoadQRCode') }}</a>
-                </div>
-
-            </div>
-
-        </el-dialog>
-    </div>
-</template>
-
-<script lang="ts" setup>
-import { t } from '@/lang'
-import { ref, reactive, watch } from 'vue'
-import { ElMessage } from 'element-plus'
-import QRCode from 'qrcode'
-import storage from '@/utils/storage'
-import { useClipboard } from '@vueuse/core'
-import { getUrl } from '@/app/api/sys'
-import { getDiyFormQrcode } from '@/app/api/diy_form'
-import { img } from '@/utils/common'
-
-const form: any = reactive({})
-const showDialog = ref(false)
-const channel = ref('h5')
-const wapUrl = ref('')
-const wapDomain = ref('')
-const wapImage = ref('')
-const wapPreview = ref('')
-const page = ref('')
-const weappData = reactive({
-    path: ''
-})
-
-getUrl().then((res: any) => {
-    wapUrl.value = res.data.wap_url
-
-    // 生产模式禁止
-    if (import.meta.env.MODE == 'production') return
-
-    wapDomain.value = res.data.wap_domain
-
-    // env文件配置过wap域名
-    if (wapDomain.value) {
-        wapUrl.value = wapDomain.value + '/wap'
-    }
-
-    const wapDomainStorage = storage.get('wap_domain')
-    if (wapDomainStorage) {
-        wapUrl.value = wapDomainStorage
-    }
-})
-
-const loadQrcode = () => {
-    wapPreview.value = `${wapUrl.value}${page.value}`
-    // errorCorrectionLevel：密度容错率L（低）H(高)
-    QRCode.toDataURL(wapPreview.value, { errorCorrectionLevel: 'L', margin: 0, width: 120 }).then(url => {
-        wapImage.value = url
-    })
-}
-
-const show = (data: any) => {
-    channel.value = 'h5';
-    Object.assign(form, data)
-    page.value = `/app/pages/index/diy_form?form_id=${form.form_id}`
-
-    loadQrcode()
-    getDiyFormQrcodeFn();
-    showDialog.value = true
-}
-
-const getDiyFormQrcodeFn = ()=>{
-    getDiyFormQrcode({
-        form_id:form.form_id
-    }).then((res:any)=>{
-        if(res.data) {
-            weappData.path = res.data.path;
-        }
-    })
-}
-
-// 复制
-const { copy, isSupported, copied } = useClipboard()
-const copyEvent = (text: string) => {
-    if (!isSupported.value) {
-        ElMessage({
-            message: t('notSupportCopy'),
-            type: 'warning'
-        })
-    }
-    copy(text)
-}
-
-watch(copied, () => {
-    if (copied.value) {
-        ElMessage({
-            message: t('copySuccess'),
-            type: 'success'
-        })
-    }
-})
-
-defineExpose({
-    showDialog,
-    show
-})
-</script>
-
-<style lang="scss" scoped></style>
diff --git a/admin/src/app/views/diy_form/list.vue b/admin/src/app/views/diy_form/list.vue
index 4ba57d6b5..7cb7215e0 100644
--- a/admin/src/app/views/diy_form/list.vue
+++ b/admin/src/app/views/diy_form/list.vue
@@ -50,7 +50,7 @@
                 </el-table-column>
                 <el-table-column prop="update_time" :label="t('updateTime')" min-width="120" />
 
-                <el-table-column :label="t('operation')" fixed="right" align="right" min-width="100">
+                <el-table-column :label="t('operation')" fixed="right" align="right" min-width="130">
                     <template #default="{ row }">
                         <div class="flex items-center justify-end">
                             <el-button type="primary" v-if="row.status == 1 && row.type=='DIY_FORM'" link @click="spreadEvent(row)">{{ t('promotion') }}</el-button>
@@ -156,7 +156,7 @@
         </el-dialog>
 
         <!-- 推广弹出框 -->
-        <form-spread-popup ref="formSpreadPopupRef" />
+        <spread-popup ref="spreadPopupRef" />
 
         <!-- 表单提交成功页弹出框 -->
         <form-submit-popup ref="formSubmitPopupRef" @complete="loadDiyFormList" />
@@ -181,9 +181,9 @@ import { useRoute, useRouter } from 'vue-router'
 import { setTablePageStorage,getTablePageStorage } from "@/utils/common";
 import { img } from '@/utils/common'
 import recordsDetail from '@/app/views/diy_form/records.vue'
-import formSpreadPopup from '@/app/views/diy_form/components/form-spread-popup.vue'
 import formSubmitPopup from '@/app/views/diy_form/components/form-submit-popup.vue'
 import formWritePopup from '@/app/views/diy_form/components/form-write-popup.vue'
+import spreadPopup from '@/components/spread-popup/index.vue'
 
 const route = useRoute()
 const router = useRouter()
@@ -506,12 +506,19 @@ const shareEvent = async (formEl: FormInstance | undefined) => {
 }
 
 // 表单推广
-const formSpreadPopupRef: any = ref(null)
+const spreadPopupRef = ref(null)
 
 const spreadEvent = (data: any) => {
-    formSpreadPopupRef.value.show(data)
+    const pagePath = "/app/pages/index/diy_form"
+    const columnName = "form_id"
+    const columnValue = data.form_id
+    const title = "表单推广"
+    const folder = "diy_form"
+
+    spreadPopupRef.value?.show(pagePath, columnName, columnValue, title,folder)
 }
 
+
 // 表单提交成功页弹出框
 const formSubmitPopupRef: any = ref(null)
 
diff --git a/admin/src/app/views/diy_form/records.vue b/admin/src/app/views/diy_form/records.vue
index c509828d9..62c0a820d 100644
--- a/admin/src/app/views/diy_form/records.vue
+++ b/admin/src/app/views/diy_form/records.vue
@@ -106,7 +106,7 @@
                     </el-table-column>
                     <!-- <el-table-column fixed prop="create_time" :label="t('填表时间')" min-width="120" /> -->
                     <el-table-column fixed prop="create_time" :label="t('fillInFormTotal')" min-width="500">
-                        <template #default="{ row }" @click="">
+                        <template #default="{ row }">
                             {{ row.write_count }}
                         </template>
                      </el-table-column>
@@ -155,9 +155,11 @@
                 <div class="flex mb-[10px]"  v-for="(item, index) in formDetail"  :key="index">
                     <div class="flex justify-end w-[100px]">{{ item.label }}：</div>
                     <div class="flex ml-[20px]">
-                        <div v-if="Array.isArray(item.text)" class="mr-[10px]" v-for="(textItem, i) in item.text" :key="i">
-                            {{ textItem }}
-                        </div>
+                        <template v-if="Array.isArray(item.text)">
+                            <div class="mr-[10px]" v-for="(textItem, i) in item.text" :key="i">
+                                {{ textItem }}
+                            </div>
+                        </template>
                         <div v-else>{{ item.text }}</div>
                     </div>
                 </div>
@@ -180,11 +182,10 @@
 import { reactive, ref, defineAsyncComponent } from 'vue'
 import { t } from '@/lang'
 import { getDiyFormFieldsList, getDiyFormFieldStat, getFormRecords,getFormRecordsInfo,deleteFormRecords,getFormRecordsMember} from '@/app/api/diy_form'
-import { useRouter, useRoute } from 'vue-router'
+import { useRouter } from 'vue-router'
 import { img } from '@/utils/common'
 import { ElMessageBox, FormInstance } from 'element-plus'
 
-const route = useRoute()
 const router = useRouter()
 const showDialog = ref(false)
 const activeName = ref('detail_data')
@@ -197,7 +198,7 @@ const handleClose = (done: () => void) => {
     showDialog.value = false;
 }
 
-const formData =  reactive({
+const formData = reactive({
     page: 1,
     limit: 6,
     total: 0,
@@ -213,22 +214,22 @@ const formData =  reactive({
 const formFieldsList = ref([])
 
 // 获取万能表单字段列表
-const getDiyFormFieldsListFn = (form_id:any)=>{
+const getDiyFormFieldsListFn = (form_id: any) => {
     getDiyFormFieldsList({
         form_id,
         order: 'field_id',
         sort: 'asc'
-    }).then((res:any)=>{
+    }).then((res: any) => {
         formFieldsList.value = res.data;
     })
 }
 
 // 获取字段统计列表
 const formFieldsStat = ref([])
-const getDiyFormFieldStatFn = (form_id:any)=>{
+const getDiyFormFieldStatFn = (form_id: any) => {
     getDiyFormFieldStat({
         form_id
-    }).then((res:any)=>{
+    }).then((res: any) => {
         formFieldsStat.value = res.data;
     })
 }
@@ -257,7 +258,6 @@ const deleteEvent = (row: any) => {
             form_id: row.form_id
         }).then(() => {
             initData();
-        }).catch(() => {
         })
     })
 }
@@ -273,18 +273,18 @@ const resetFormMember = (formEl: FormInstance | undefined) => {
     getFormRecordsMemberFn()
 }
 
-const loadFormRecordsListFn= (page: number = 1)=>{
+const loadFormRecordsListFn= (page: number = 1)=> {
     formData.loading = true
     formData.page = page
     getFormRecords({
         page: formData.page,
         limit: formData.limit,
         ...formData.searchParam
-    }).then((res:any)=>{
+    }).then((res: any) => {
         formData.loading = false
         formData.data = res.data.data
-        formData.data.forEach((item:any)=>{
-            for (let key:any in item.recordsFieldList){
+        formData.data.forEach((item: any) => {
+            for (let key: any in item.recordsFieldList) {
                 if (modules[item.recordsFieldList[key].detailComponent]) {
                     item.recordsFieldList[key].detailComponent && (item.recordsFieldList[key].detailComponent = defineAsyncComponent(modules[item.recordsFieldList[key].detailComponent]))
                 }
@@ -295,7 +295,7 @@ const loadFormRecordsListFn= (page: number = 1)=>{
         formData.loading = false
     })
 }
-const formMemberList =  reactive({
+const formMemberList = reactive({
     page: 1,
     limit: 10,
     total: 0,
@@ -303,7 +303,7 @@ const formMemberList =  reactive({
     data: [],
     searchParam: {
         keyword: '',
-        form_id: 0,
+        form_id: 0
     }
 })
 
@@ -320,12 +320,12 @@ const getFormRecordsMemberFn = (page: number = 1) => {
         formMemberList.loading = false;
     }).catch((error) => {
         formMemberList.loading = false;
-    });
+    })
 }
 
 //查看会员详情
-const detailEvent = (member_id:number)=> {
-    let routeData = router.resolve(`/member/detail?id=${member_id}`)
+const detailEvent = (member_id:number) => {
+    let routeData = router.resolve(`/member/detail?id=${ member_id }`)
     window.open(routeData.href, ' blank');
 }
 
@@ -338,7 +338,7 @@ const setFormData = async (row: any = null) => {
     initData();
 }
 
-const initData = () =>{
+const initData = () => {
     getFormRecordsMemberFn();
     getDiyFormFieldStatFn(formId.value);
     loadFormRecordsListFn()
@@ -387,5 +387,4 @@ defineExpose({
         margin-right: 10px;
     }
 }
-
 </style>
diff --git a/admin/src/app/views/finance/cash_out.vue b/admin/src/app/views/finance/cash_out.vue
index bbb51aaa5..fb155e146 100644
--- a/admin/src/app/views/finance/cash_out.vue
+++ b/admin/src/app/views/finance/cash_out.vue
@@ -81,18 +81,18 @@
 
             <div class="mt-[10px]">
                 <el-table :data="orderTableData.data" size="large" class="table-top">
-					<el-table-column :label="t('memberInfo')" min-width="180" />
-					<el-table-column :label="t('cashOutMethod')" align="center" min-width="100" />
-					<el-table-column :label="t('cashOutInfo')" min-width="180" />
-					<el-table-column :label="t('applicationForWithdrawalAmount')" align="center" min-width="120" />
-					<el-table-column :label="t('actualTransferAmount')" align="center" min-width="120" />
-					<el-table-column :label="t('cashOutCommission')" align="center" min-width="110" />
-					<el-table-column :label="t('cashOutStatus')" align="center" min-width="150" />
+                    <el-table-column :label="t('memberInfo')" min-width="180" />
+                    <el-table-column :label="t('cashOutMethod')" align="center" min-width="100" />
+                    <el-table-column :label="t('cashOutInfo')" min-width="180" />
+                    <el-table-column :label="t('applicationForWithdrawalAmount')" align="center" min-width="120" />
+                    <el-table-column :label="t('actualTransferAmount')" align="center" min-width="120" />
+                    <el-table-column :label="t('cashOutCommission')" align="center" min-width="110" />
+                    <el-table-column :label="t('cashOutStatus')" align="center" min-width="150" />
                     <el-table-column :label="t('applyTime')" align="center" min-width="160" />
                     <el-table-column :label="t('auditTime')" align="center" min-width="160" />
                     <el-table-column :label="t('transferTime')" align="center" min-width="160" />
-					<el-table-column :label="t('operation')" fixed="right" align="right" min-width="120" />
-				</el-table>
+                    <el-table-column :label="t('operation')" fixed="right" align="right" min-width="120" />
+                </el-table>
                 <div class="table-body min-h-[150px]" v-loading="orderTableData.loading">
                     <div v-if="!orderTableData.loading">
                         <template v-if="orderTableData.data.length">
@@ -126,7 +126,7 @@
                                                     <span class="w-[70px] flex-shrink-0 text-right">{{t('account') }}：</span>
                                                     <span>{{ row.transfer_account }}</span>
                                                 </div>
-                                                <div class="flex items-center" v-if="row.transfer_payment_code">
+                                                <div class="flex items-start" v-if="row.transfer_payment_code">
                                                     <span class="w-[70px] flex-shrink-0 text-right">{{ t('transferCode') }}：</span>
                                                     <el-image   :src="img(row.transfer_payment_code)" :preview-src-list="[img(row.transfer_payment_code)]" :hide-on-click-modal="true" class="w-[50px] h-[50px]"></el-image>
                                                 </div>
@@ -189,9 +189,9 @@
                                     </el-table-column>
                                 </el-table>
                                 <div v-if="item.remark" class="text-[14px] min-h-[30px] leading-[30px] px-3 bg-[#fff0e5] text-[#ff7f5b] mb-[10px] relative remark">
-									<span class="mr-[5px]">{{ t('notes') }}：</span>
-									<span>{{ item.remark }}</span>
-								</div>
+                                    <span class="mr-[5px]">{{ t('notes') }}：</span>
+                                    <span>{{ item.remark }}</span>
+                                </div>
                             </div>
                         </template>
                         <el-empty v-else :image-size="1" :description="t('emptyData')" />
diff --git a/admin/src/app/views/finance/components/refund-detail.vue b/admin/src/app/views/finance/components/refund-detail.vue
index 18860d511..79ebb3d04 100644
--- a/admin/src/app/views/finance/components/refund-detail.vue
+++ b/admin/src/app/views/finance/components/refund-detail.vue
@@ -52,13 +52,11 @@
 </template>
 
 <script lang="ts" setup>
-import { reactive, ref, computed } from 'vue'
+import { reactive, ref, computed,defineEmits  } from 'vue'
 import { t } from '@/lang'
 import { getPayRefundInfo, getRefundType, getRefundTransfer } from '@/app/api/pay'
-import { FormInstance, ElMessage } from 'element-plus'
+import { FormInstance } from 'element-plus'
 import { useRouter, useRoute } from 'vue-router'
-import { img, filterNumber } from '@/utils/common'
-import useAppStore from '@/stores/modules/app'
 
 const route = useRoute()
 const router = useRouter()
@@ -71,7 +69,6 @@ let refundNo = '';
 const refundList = ref([])
 const formData: Record<string, any> = ref(null)
 
-
 const handleClose = (done: () => void) => {
     showDialog.value = false;
 }
@@ -109,6 +106,7 @@ const transferEvent = (data:any) => {
     transferDialog.value = true
     transferFormData.refund_no = data.refund_no
     transferFormData.refund_money = data.money
+    transferFormData.voucher = ''
 }
 
 const initialFormData = {
@@ -127,6 +125,7 @@ const formRules = computed(() => {
         ]
     }
 })
+const emit = defineEmits(['loadPayRefundList'])
 
 const confirm = async (formEl: FormInstance | undefined) => {
     if (loading.value || !formEl) return
@@ -140,6 +139,7 @@ const confirm = async (formEl: FormInstance | undefined) => {
                 transferDialog.value = false
                 refundList.value = []
                 getRefundListInfo(refundNo)
+                emit('loadPayRefundList')
             }).catch(() => {
                 transferDialog.value = false
                 loading.value = false
diff --git a/admin/src/app/views/finance/offlinepay.vue b/admin/src/app/views/finance/offlinepay.vue
index fbb8cf762..312cca719 100644
--- a/admin/src/app/views/finance/offlinepay.vue
+++ b/admin/src/app/views/finance/offlinepay.vue
@@ -72,8 +72,7 @@
         </div>
     </el-card>
 
-    <el-image-viewer :url-list="previewImageList" v-if="imageViewerShow" @close="imageViewerShow = false" :initial-index="0"
-        :zoom-rate="1" />
+    <el-image-viewer :url-list="previewImageList" v-if="imageViewerShow" @close="imageViewerShow = false" :initial-index="0" :zoom-rate="1" />
 </template>
 
 <script lang="ts" setup>
@@ -136,13 +135,13 @@ loadPayList()
 
 const passEvent = (row: AnyObject) => {
     ElMessageBox.confirm(
-            t('passTips'),
-            t('warning'),
-            {
-                confirmButtonText: t('confirm'),
-                cancelButtonText: t('cancel'),
-                type: 'warning'
-            }
+        t('passTips'),
+        t('warning'),
+        {
+            confirmButtonText: t('confirm'),
+            cancelButtonText: t('cancel'),
+            type: 'warning'
+        }
     ).then(({ value }) => {
         payAuditPass(row.out_trade_no).then(() => {
             loadPayList()
diff --git a/admin/src/app/views/finance/pay_detail.vue b/admin/src/app/views/finance/pay_detail.vue
index 194e31a68..1e58013e6 100644
--- a/admin/src/app/views/finance/pay_detail.vue
+++ b/admin/src/app/views/finance/pay_detail.vue
@@ -56,14 +56,13 @@
 <script lang="ts" setup>
 import { ref } from 'vue'
 import { t } from '@/lang'
-import { useRoute, useRouter } from 'vue-router'
+import { useRoute } from 'vue-router'
 import { getPayDetail, payAuditPass, payAuditRefuse } from '@/app/api/sys'
 import { img } from '@/utils/common'
 import { ElMessageBox } from 'element-plus'
 import { ArrowLeft } from '@element-plus/icons-vue'
 
 const route = useRoute()
-const router = useRouter()
 const pageName = route.meta.title
 const id: number = parseInt((route.query.id || 0))
 const loading = ref(true)
@@ -81,13 +80,13 @@ setFormData()
 
 const passEvent = () => {
     ElMessageBox.confirm(
-            t('passTips'),
-            t('warning'),
-            {
-                confirmButtonText: t('confirm'),
-                cancelButtonText: t('cancel'),
-                type: 'warning'
-            }
+        t('passTips'),
+        t('warning'),
+        {
+            confirmButtonText: t('confirm'),
+            cancelButtonText: t('cancel'),
+            type: 'warning'
+        }
     ).then(({ value }) => {
         payAuditPass(formData.value.out_trade_no).then(() => {
             setFormData()
diff --git a/admin/src/app/views/finance/pay_refund.vue b/admin/src/app/views/finance/pay_refund.vue
index 1f1a810aa..f60c3d434 100644
--- a/admin/src/app/views/finance/pay_refund.vue
+++ b/admin/src/app/views/finance/pay_refund.vue
@@ -10,7 +10,14 @@
             <el-card class="box-card !border-none my-[10px] table-search-wrap" shadow="never">
                 <el-form :inline="true" :model="payRefundTable.searchParam" ref="searchFormRef">
                     <el-form-item :label="t('refundNo')" prop="refund_no">
-                        <el-input v-model.trim="payRefundTable.searchParam.refund_no" :placeholder="t('refundNoPlaceholder')" />
+                        <el-input v-model.trim="payRefundTable.searchParam.refund_no"
+                            :placeholder="t('refundNoPlaceholder')" />
+                    </el-form-item>
+                    <el-form-item :label="t('status')" prop="status">
+                        <el-select v-model="payRefundTable.searchParam.status" clearable class="input-width">
+                            <el-option :label="t('selectPlaceholder')" value="" />
+                            <el-option :label="item" :value="key" v-for="(item, key) in refundStatusList" :key="key" />
+                        </el-select>
                     </el-form-item>
                     <el-form-item :label="t('createTime')" prop="create_time">
                         <el-date-picker v-model="payRefundTable.searchParam.create_time" type="datetimerange"
@@ -36,9 +43,9 @@
                     <el-table-column prop="status_name" :label="t('status')" min-width="120" />
                     <el-table-column prop="create_time" :label="t('createTime')" min-width="160" />
                     <el-table-column :label="t('operation')" fixed="right" align="right" min-width="120">
-                       <template #default="{ row }">
-                           <el-button type="primary" link @click="infoEvent(row)">{{ t('info') }}</el-button>
-                       </template>
+                        <template #default="{ row }">
+                            <el-button type="primary" link @click="infoEvent(row)">{{ t('info') }}</el-button>
+                        </template>
                     </el-table-column>
                 </el-table>
 
@@ -49,22 +56,25 @@
                 </div>
             </div>
         </el-card>
-        <refund-detail ref="refundDetailDialog"></refund-detail>
+        <refund-detail @loadPayRefundList="handleMessage" ref="refundDetailDialog"></refund-detail>
     </div>
 </template>
 
 <script lang="ts" setup>
 import { reactive, ref } from 'vue'
 import { t } from '@/lang'
-import { getPayRefundPages } from '@/app/api/pay'
-import { useRouter, useRoute } from 'vue-router'
+import { getPayRefundPages ,getRefundStatus} from '@/app/api/pay'
+import { useRoute } from 'vue-router'
 import type { FormInstance } from 'element-plus'
 import refundDetail from '@/app/views/finance/components/refund-detail.vue'
 
 const route = useRoute()
-const router = useRouter()
 const pageName = route.meta.title
-
+const refundStatusList = ref([])
+const checkStatusList = async () => {
+    refundStatusList.value = await (await getRefundStatus()).data
+}
+checkStatusList()
 const payRefundTable = reactive({
     page: 1,
     limit: 10,
@@ -73,6 +83,7 @@ const payRefundTable = reactive({
     data: [],
     searchParam: {
         refund_no: '',
+        status: '',
         create_time: []
     }
 })
@@ -99,6 +110,9 @@ const loadPayRefundList = (page: number = 1) => {
     })
 }
 loadPayRefundList()
+const handleMessage = () => {
+    loadPayRefundList()
+}
 const refundDetailDialog: Record<string, any> | null = ref(null)
 const infoEvent = (res:any) => {
     let data = {no: res.refund_no};
diff --git a/admin/src/app/views/index/index.vue b/admin/src/app/views/index/index.vue
index 50da264e0..abe57fb7e 100644
--- a/admin/src/app/views/index/index.vue
+++ b/admin/src/app/views/index/index.vue
@@ -1,5 +1,5 @@
 <template>
-    <div v-loading="loading" >
+    <div v-loading="loading">
         <el-card class="box-card !border-none" shadow="never">
             <div class="box-border">
                 <el-card class="box-card !border-none profile-data" shadow="never">
@@ -12,14 +12,12 @@
                     </template>
 
                     <el-row :gutter="20" class="mt-[15px] top">
-                        <el-col> 
+                        <el-col>
                             <el-card shadow="never" @click="toHref('site/list','1')" class="box-card border cursor-pointer min-w-[180px] first-con">
                                 <img class="max-w-[24px] max-h-[24px] mb-[10px]" src="@/app/assets/images/index/site_normal.png" />
                                 <el-statistic :value="statInfo.today_data.norma_site_count">
                                     <template #title>
-                                        <div class="text-[14px] mb-[15px] text-[#666]">
-                                            {{ t("normalSiteSum") }}
-                                        </div>
+                                        <div class="text-[14px] mb-[15px] text-[#666]">{{ t("normalSiteSum") }}</div>
                                     </template>
                                 </el-statistic>
                             </el-card>
@@ -29,9 +27,7 @@
                                 <img class="max-w-[24px] max-h-[24px] mb-[10px]" src="@/app/assets/images/index/site2.png" />
                                 <el-statistic :value="statInfo.today_data.week_expire_site_count">
                                     <template #title>
-                                        <div class="text-[14px] mb-[15px] text-[#666]">
-                                            {{ t("weekExpireSiteCount") }}
-                                        </div>
+                                        <div class="text-[14px] mb-[15px] text-[#666]">{{ t("weekExpireSiteCount") }}</div>
                                     </template>
                                 </el-statistic>
                             </el-card>
@@ -41,9 +37,7 @@
                                 <img class="max-w-[24px] max-h-[24px] mb-[15px]" src="@/app/assets/images/index/site3.png" />
                                 <el-statistic :value="statInfo.today_data.expire_site_count">
                                     <template #title>
-                                        <div class="text-[14px] mb-[9px] text-[#666]">
-                                            {{ t("expireSiteSum") }}
-                                        </div>
+                                        <div class="text-[14px] mb-[9px] text-[#666]">{{ t("expireSiteSum") }}</div>
                                     </template>
                                 </el-statistic>
                             </el-card>
@@ -53,21 +47,17 @@
                                 <img class="max-w-[24px] max-h-[24px] mb-[15px]" src="@/app/assets/images/index/not_install.png" />
                                 <el-statistic :value="statInfo.app.app_no_installed_count">
                                     <template #title>
-                                        <div class="text-[14px] mb-[9px] text-[#666]">
-                                            {{ t("noInstallAppSun") }}
-                                        </div>
+                                        <div class="text-[14px] mb-[9px] text-[#666]">{{ t("noInstallAppSun") }}</div>
                                     </template>
                                 </el-statistic>
                             </el-card>
                         </el-col>
                         <el-col>
-                            <el-card shadow="never"   @click="toHref('/app_manage/app_store','installed')" class="cursor-pointer min-w-[180px] first-con">
+                            <el-card shadow="never" @click="toHref('/app_manage/app_store','installed')" class="cursor-pointer min-w-[180px] first-con">
                                 <img class="max-w-[24px] max-h-[24px] mb-[10px]" src="@/app/assets/images/index/install.png" />
                                 <el-statistic :value="statInfo.app.app_installed_count">
                                     <template #title>
-                                        <div class="text-[14px] mb-[9px] text-[#666]">
-                                            {{ t("installAppSun") }}
-                                        </div>
+                                        <div class="text-[14px] mb-[9px] text-[#666]">{{ t("installAppSun") }}</div>
                                     </template>
                                 </el-statistic>
                             </el-card>
@@ -76,7 +66,7 @@
                 </el-card>
                 <div class="text-[16px] mt-[20px] mb-[15px]">{{ t("常用功能") }}</div>
                 <el-card class="box-card border" shadow="never">
-                    <div class="flex justify-between" >
+                    <div class="flex justify-between">
                         <div class="flex-1 h-[125px] flex justify-center flex-col items-center cursor-pointer mr-[25px]" @click="toLink('site/list')">
                             <img class="w-[64px] h-[64px] mb-[5px]" src="@/app/assets/images/index/site_list.png" />
                             <span class="text-[14px]">{{ t("siteList") }}</span>
@@ -98,53 +88,49 @@
                             <span class="text-[14px]">{{ t("appMarketplace") }}</span>
                         </div>
                     </div>
-                </el-card> 
-                
+                </el-card>
 
                 <div class="mt-[20px] flex site">
                     <div class="flex-1 ">
-                       <div class="text-[16px] mb-[15px]">{{ t("newSite") }}</div>
+                        <div class="text-[16px] mb-[15px]">{{ t("newSite") }}</div>
                         <el-card class="box-card border profile-data mr-[30px]" shadow="never">
-                            <template #header>
-                        
-                            </template>
+                            <template #header></template>
                             <div ref="newSiteStat" class="echarts-con" :style="{ width: '100%', height: '320px' }"></div>
-                        </el-card> 
+                        </el-card>
                     </div>
                     <div class="flex-1 ">
                         <div class="text-[16px] mb-[15px]">{{ t("addUser") }}</div>
                         <el-card class="box-card border flex-1 profile-data" shadow="never">
-                            <template #header>
-                            </template>
+                            <template #header></template>
                             <div ref="addUser" class="echarts-con" :style="{ width: '100%', height: '320px' }"></div>
                         </el-card>
                     </div>
                 </div>
                 <div class="flex justify-between text-[12px] mt-[20px] text-[#666]" v-if="copyright">
-                <div>
-                    <a :href="copyright.copyright_link" target="_blank">
+                    <div>
+                        <a :href="copyright.copyright_link" target="_blank">
                             <!-- <span class="mr-3" v-if="copyright.copyright_desc">{{ copyright.copyright_desc }}</span> -->
                             <span class="mr-3" v-if="copyright.company_name">{{ copyright.company_name }}</span>
-                    </a>
-                    <a href="https://beian.miit.gov.cn/" v-if="copyright.icp" target="_blank">
+                        </a>
+                        <a href="https://beian.miit.gov.cn/" v-if="copyright.icp" target="_blank">
                             <span class="mr-3">{{ copyright.icp }}</span>
-                    </a>
-                </div>
-                <div class="flex items-center  cursor-pointer"> 
-                    <span class="mx-1" @click="getInfoFn">版权信息</span> | <span class="mx-1">开发者联盟与隐私的声明</span> | <span class="mx-1">隐私政策</span> | <span class="mx-1">联系我们</span> | <span class="mx-1">Cookies</span> 
+                        </a>
+                    </div>
+                    <div class="flex items-center  cursor-pointer">
+                        <span class="mx-1" @click="getInfoFn">版权信息</span> | <span
+                        class="mx-1">开发者联盟与隐私的声明</span> | <span class="mx-1">隐私政策</span> | <span
+                        class="mx-1">联系我们</span> | <span class="mx-1">Cookies</span>
+                    </div>
                 </div>
             </div>
-            </div>
-            
+
         </el-card>
         <el-dialog v-model="dialogVisible" title="版权信息" width="500">
             <span>{{ copyright.copyright_desc }}</span>
             <template #footer>
-            <div class="dialog-footer">
-                <el-button type="primary" @click="dialogVisible = false">
-                确定
-                </el-button>
-            </div>
+                <div class="dialog-footer">
+                    <el-button type="primary" @click="dialogVisible = false">确定</el-button>
+                </div>
             </template>
         </el-dialog>
     </div>
@@ -167,15 +153,16 @@ const loading = ref(true)
 const newSiteStat = ref<any>(null)
 const addUser = ref<any>(null)
 const styleStore = useStyleStore()
-const currLayout = ref(Storage.get('admin_layout') || 'admin')
 
 const copyright = ref(null)
 getWebCopyright().then(({ data }) => {
-    copyright.value = data   
+    copyright.value = data
 })
-interface NewVersion{
+
+interface NewVersion {
     last_version: string
 }
+
 interface StatInfo {
     today_data: AnyObject,
     system: AnyObject,
@@ -192,7 +179,7 @@ const newVersion = ref<NewVersion>({
 })
 
 const getInfoFn = () => {
-    if(copyright.value.copyright_desc){
+    if (copyright.value.copyright_desc) {
         dialogVisible.value = true
     }
 }
@@ -212,7 +199,7 @@ const statInfo = ref<StatInfo>({
     app: {}
 })
 
-const getStatInfoFn = async () => {
+const getStatInfoFn = async() => {
     statInfo.value = await (await getStatInfo()).data
     loading.value = false
     setTimeout(() => {
@@ -239,16 +226,16 @@ const drawChart = () => {
                 name: t('newSite'),
                 type: 'line',
                 data: [],
-                itemStyle:{
-                    normal:{
-                        color:'#2FCEB6',//点的颜色
+                itemStyle: {
+                    normal: {
+                        color: '#2FCEB6',//点的颜色
                     }
                 },
-                lineStyle:{
-                    color:'#2FCEB6',//线的颜色
+                lineStyle: {
+                    color: '#2FCEB6',//线的颜色
                 }
             },
-            
+
         ]
     })
     newSiteStatOption.value.xAxis.data = statInfo.value.site_stat.date
@@ -257,7 +244,7 @@ const drawChart = () => {
 
     // 新增用户
     const newUserChart = echarts.init(addUser.value)
-    const newUserOption:AnyObject = ref({
+    const newUserOption: AnyObject = ref({
         legend: {},
         xAxis: {
             data: []
@@ -271,13 +258,13 @@ const drawChart = () => {
                 name: t('addUser'),
                 type: 'line',
                 data: [],
-                itemStyle:{
-                    normal:{
-                        color:'#F7DC76',//点的颜色
+                itemStyle: {
+                    normal: {
+                        color: '#F7DC76',//点的颜色
                     }
                 },
-                lineStyle:{
-                    color:'#F7DC76',//线的颜色
+                lineStyle: {
+                    color: '#F7DC76',//线的颜色
                 }
             }
         ]
@@ -307,10 +294,10 @@ watch(() => route.path, (newval, oldval) => {
 /**
  * 链接跳转
  */
-const toLink = (link:any) => {
+const toLink = (link: any) => {
     router.push(link)
 }
-const toHref = (url:any, id:any) => {
+const toHref = (url: any, id: any) => {
     router.push({
         path: url,
         query: { id }
@@ -330,12 +317,14 @@ const nowTime = () => {
     const hh = checkTime(date.getHours())
     const mm = checkTime(date.getMinutes())
     const ss = checkTime(date.getSeconds())
-    function checkTime (i:any) {
+
+    function checkTime(i: any) {
         if (i < 10) {
             return '0' + i
         }
         return i
     }
+
     time.value = year + '-' + month + '-' + day + ' ' + hh + ':' + mm + ':' + ss
 }
 nowTime()
@@ -343,32 +332,35 @@ nowTime()
 </script>
 
 <style lang="scss" scoped>
-    .profile-data {
-        background-color: transparent !important;
-    }
+.profile-data {
+    background-color: transparent !important;
+}
 
-    :deep(.profile-data .el-card__header) {
-        padding: 0 !important;
-        border: none !important;
-    }
+:deep(.profile-data .el-card__header) {
+    padding: 0 !important;
+    border: none !important;
+}
 
-    :deep(.profile-data .el-card__body) {
-        padding:  0 !important;
-    }
-    .top :deep(.el-col){
-        max-width: calc(100% / 5) !important;
-    }
-    .first-con{
-        // border: 1px solid #E9ECEF;
-        // background: #fff;
-        padding: 20px 30px 10px;
-        height: 160px;
-        // border-radius: 8px;
-    }
-    .echarts-con{
-        // border: 1px solid #E9ECEF;
-        // background: #fff;
-        padding-top:20px;
-        // border-radius: 8px;
-    }
+:deep(.profile-data .el-card__body) {
+    padding: 0 !important;
+}
+
+.top :deep(.el-col) {
+    max-width: calc(100% / 5) !important;
+}
+
+.first-con {
+    // border: 1px solid #E9ECEF;
+    // background: #fff;
+    padding: 20px 30px 10px;
+    height: 160px;
+    // border-radius: 8px;
+}
+
+.echarts-con {
+    // border: 1px solid #E9ECEF;
+    // background: #fff;
+    padding-top: 20px;
+    // border-radius: 8px;
+}
 </style>
diff --git a/admin/src/app/views/index/preview.vue b/admin/src/app/views/index/preview.vue
index 170a9d17a..c61d65239 100644
--- a/admin/src/app/views/index/preview.vue
+++ b/admin/src/app/views/index/preview.vue
@@ -36,7 +36,7 @@
                     <div class="px-[20px] pb-[10px] font-bold mt-[40px]">{{ t('weapp') }}</div>
                     <el-form label-width="40px" class="px-[20px]">
                         <el-form-item label=" " v-if="weappConfig.qr_code">
-                            <el-image class="w-[100px] h-[100px]" :src="img(weappConfig.qr_code)" />
+                            <el-image class="w-[150px] h-[150px]" :src="img(weappConfig.qr_code)" />
                         </el-form-item>
                         <el-form-item label=" " v-else>
                             <span class="text-gray-400">{{ t('weappNotSet') }}</span>
diff --git a/admin/src/app/views/index/store.vue b/admin/src/app/views/index/store.vue
index 8a56a1de1..9505e26cc 100644
--- a/admin/src/app/views/index/store.vue
+++ b/admin/src/app/views/index/store.vue
@@ -2,13 +2,12 @@
     <!--应用市场-->
     <div class="main-container">
         <el-card class="box-card !border-none" shadow="never">
-
             <div class="flex justify-between items-center">
-                <span class="text-page-title">{{ t('localAppText') }}</span>
+                <span class="text-page-title">{{ t("localAppText") }}</span>
 
                 <el-input class="!w-[250px]" :placeholder="t('search')" v-model.trim="search_name" @keyup.enter="query">
                     <template #suffix>
-                        <el-icon class="el-input__icon  cursor-pointer" size="14px" @click="query">
+                        <el-icon class="el-input__icon cursor-pointer" size="14px" @click="query">
                             <search />
                         </el-icon>
                     </template>
@@ -17,28 +16,26 @@
 
             <div class="flex justify-between my-[20px]">
                 <div class="flex">
-                    <div :class="['flex items-center text-[14px] h-[32px] border-[1px] border-solid my-[3px] border-[var(--el-color-info-light-8)] rounded-full px-[20px] mr-[24px] cursor-pointer hover:bg-[var(--el-color-info-light-8)]', { '!text-[#fff] !bg-[#000] !border-[#000]': activeName === 'installed' }]" @click="activeNameTabFn('installed')">
-                        {{ t('installLabel') }}
-                    </div>
-                    <div :class="['flex items-center text-[14px] h-[32px] border-[1px] border-solid my-[3px] border-[var(--el-color-info-light-8)] rounded-full px-[20px] mr-[24px] cursor-pointer hover:bg-[var(--el-color-info-light-8)]', { '!text-[#fff] !bg-[#000] !border-[#000]': activeName === 'uninstalled' }]" @click="activeNameTabFn('uninstalled')">
-                        {{ t('uninstalledLabel') }}
-                    </div>
-                    <div :class="['flex items-center text-[14px] h-[32px] border-[1px] border-solid my-[3px] border-[var(--el-color-info-light-8)] rounded-full px-[20px] mr-[24px] cursor-pointer hover:bg-[var(--el-color-info-light-8)]', { '!text-[#fff] !bg-[#000] !border-[#000]': activeName === 'all' }]" @click="activeNameTabFn('all')">
-                        {{ t('buyLabel') }}
+                    <div :class="['flex items-center text-[14px] h-[32px] border-[1px] border-solid my-[3px] border-[var(--el-color-info-light-8)] rounded-full px-[20px] mr-[24px] cursor-pointer hover:bg-[var(--el-color-info-light-8)]', { '!text-[#fff] !bg-[#000] !border-[#000]': activeName === 'installed' }]" @click="activeNameTabFn('installed')">{{ t("installLabel") }}</div>
+                    <div :class="['flex items-center text-[14px] h-[32px] border-[1px] border-solid my-[3px] border-[var(--el-color-info-light-8)] rounded-full px-[20px] mr-[24px] cursor-pointer hover:bg-[var(--el-color-info-light-8)]', { '!text-[#fff] !bg-[#000] !border-[#000]': activeName === 'uninstalled' }]" @click="activeNameTabFn('uninstalled')">{{ t("uninstalledLabel") }}</div>
+                    <div :class="['flex items-center text-[14px] h-[32px] border-[1px] border-solid my-[3px] border-[var(--el-color-info-light-8)] rounded-full px-[20px] mr-[24px] cursor-pointer hover:bg-[var(--el-color-info-light-8)]', { '!text-[#fff] !bg-[#000] !border-[#000]': activeName === 'all' }]" @click="activeNameTabFn('all')">{{ t("buyLabel") }}</div>
+                    <div :class="['relative flex items-center text-[14px] h-[32px] border-[1px] border-solid my-[3px] border-[var(--el-color-info-light-8)] rounded-full px-[20px] mr-[24px] cursor-pointer hover:bg-[var(--el-color-info-light-8)]', { '!text-[#fff] !bg-[#000] !border-[#000]': activeName === 'recentlyUpdated' }]" @click="activeNameTabFn('recentlyUpdated')">
+                        <span v-if="localList['recentlyUpdated'].length > 0" class="w-[9px] h-[9px] bg-[#FF0000]" style="position: absolute; border-radius: 50%; right: 5px; top: -5px"></span>
+                        <span>{{ t('recentlyUpdated') }}</span>
                     </div>
                 </div>
-                <el-button type="primary" round @click="handleCloudBuild" :loading="cloudBuildRef?.loading" :disabled="authLoading">{{ t('cloudBuild') }}</el-button>
+                <el-button type="primary" round @click="handleCloudBuild" :loading="cloudBuildRef?.loading" :disabled="authLoading">{{ t("cloudBuild") }}</el-button>
             </div>
 
             <div>
-                <el-table v-if="localList[activeName].length&&!loading" :data="info[activeName]" size="large" class="pt-[5px]">
+                <el-table v-if="localList[activeName].length && !loading" :data="info[activeName]" size="large" class="pt-[5px]">
                     <el-table-column :label="t('appName')" align="left" width="450">
                         <template #default="{ row }">
-                            <div class="flex items-center cursor-pointer" @click = "handleTips">
+                            <div class="flex items-center cursor-pointer">
                                 <el-image class="w-[54px] h-[54px]" :src="row.icon" fit="contain">
                                     <template #error>
                                         <div class="flex items-center w-full h-full">
-                                            <img class="max-w-full max-h-full" src="@/app/assets/images/icon-addon.png" alt="">
+                                            <img class="max-w-full max-h-full" src="@/app/assets/images/icon-addon.png" alt="" />
                                         </div>
                                     </template>
                                 </el-image>
@@ -47,8 +44,8 @@
                                     <div class="w-[236px] truncate leading-[18px] mt-[6px]" v-if="row.install_info && Object.keys(row.install_info)?.length">{{ row.install_info.version }}</div>
                                     <div class="w-[236px] truncate leading-[18px] mt-[6px]" v-else>{{ row.version }}</div>
                                     <div class="mt-[3px] flex flex-nowrap">
-                                        <el-tag type="danger" size="small" v-if="row.install_info && Object.keys(row.install_info)?.length && row.install_info.version != row.version">{{ t('newVersion') }}{{ row.version }}</el-tag>
-                                        <el-tooltip v-if="versionJudge(row)" effect="dark" content="该插件与框架版本不兼容，可能存在未知问题" placement="top-start" >
+                                        <el-tag type="danger" size="small" v-if="activeName == 'recentlyUpdated' && row.install_info && Object.keys(row.install_info)?.length && row.install_info.version != row.version">{{ t("newVersion") }}{{ row.version }}</el-tag>
+                                        <el-tooltip v-if="versionJudge(row)" effect="dark" content="该插件与框架版本不兼容，可能存在未知问题" placement="top-start">
                                             <el-tag type="info" size="small" class="ml-[3px]">该插件与框架版本不兼容，可能存在未知问题</el-tag>
                                         </el-tooltip>
                                     </div>
@@ -59,7 +56,7 @@
                     <el-table-column align="left" min-width="150">
                         <template #header>
                             <div class="flex items-center">
-                                <span class="font-500 text-[13px] mr-[5px]">{{ t('appIdentification') }}</span>
+                                <span class="font-500 text-[13px] mr-[5px]">{{ t("appIdentification") }}</span>
                                 <el-tooltip class="box-item" effect="light" :content="t('tipText')" placement="bottom">
                                     <el-icon class="cursor-pointer text-[16px] text-[#a9a9a9]">
                                         <QuestionFilled />
@@ -78,7 +75,7 @@
                     </el-table-column>
                     <el-table-column :label="t('type')" align="left" min-width="80">
                         <template #default="{ row }">
-                            <span class="font-500 text-[13px]">{{ row.type === 'app' ? t('app') : t('addon') }}</span>
+                            <span class="font-500 text-[13px]">{{ row.type === "app" ? t("app") : t("addon") }}</span>
                         </template>
                     </el-table-column>
                     <el-table-column prop="" :label="t('author')" align="left" min-width="80">
@@ -86,66 +83,67 @@
                             <span class="font-500 text-[13px]">{{ row.author }}</span>
                         </template>
                     </el-table-column>
-                    <el-table-column :label="t('operation')" fixed="right" align="right" width="200">
+                    <el-table-column :label="t('operation')" fixed="right" align="right" width="250">
                         <template #default="{ row }">
-                            <el-button class="!text-[13px]" v-if="row.install_info && Object.keys(row.install_info)?.length && row.install_info.version != row.version" type="primary" link @click="upgradeAddonFn(row.key)">{{ t('upgrade') }}</el-button>
-                            <el-button class="!text-[13px]" v-if="row.install_info && Object.keys(row.install_info)?.length" type="primary" link @click="uninstallAddonFn(row.key)">{{ t('unload') }}</el-button>
+                            <el-button class="!text-[13px]" v-if="activeName == 'recentlyUpdated' && row.install_info && Object.keys(row.install_info)?.length && row.install_info.version != row.version" type="primary" link @click="upgradeAddonFn(row.key)">{{ t("upgrade") }}</el-button>
+                            <el-button class="!text-[13px]" v-if="row.install_info && Object.keys(row.install_info)?.length" type="primary" link @click="uninstallAddonFn(row.key)">{{ t("unload") }}</el-button>
                             <template v-if="row.is_download && (!row.install_info || !Object.keys(row.install_info).length)">
-                                <el-button class="!text-[13px]" type="primary" link @click="installAddonFn(row.key)">{{ t('install') }}</el-button>
-                                <el-button class="!text-[13px]" type="primary" link @click="deleteAddonFn(row.key)">{{ t('delete') }}</el-button>
+                                <el-button class="!text-[13px]" type="primary" link @click="installAddonFn(row.key)">{{ t("install") }}</el-button>
+                                <el-button class="!text-[13px]" type="primary" link @click="deleteAddonFn(row.key)">{{ t("delete") }}</el-button>
                             </template>
                             <el-button class="!text-[13px]" v-if="!row.is_download" :loading="downloading == row.key" :disabled="downloading != ''" type="primary" link @click.stop="downEvent(row)">
-                                <span>{{ t('down') }}</span>
+                                <span>{{ t("down") }}</span>
                             </el-button>
-                            <el-button class="!text-[13px]" type="primary" link @click="getAddonDetailFn(row)">{{ t('detail') }}</el-button>
+                            <el-button class="!text-[13px]" type="primary" link @click="getAddonDetailFn(row)">{{ t("detail") }}</el-button>
+                            <el-button class="!text-[13px]" type="primary" link @click="updateInformationFn(row)">更新信息</el-button>
                         </template>
                     </el-table-column>
                 </el-table>
                 <div class="data-loading" v-if="loading || !localList[activeName].length">
                     <el-table :data="[]" size="large" class="pt-[5px]">
-                        <el-table-column :label="t('appName')" align="left" width="320"></el-table-column>
-                        <el-table-column align="left" min-width="120"></el-table-column>
-                        <el-table-column prop="" :label="t('introduction')" align="left" min-width="200"></el-table-column>
-                        <el-table-column :label="t('type')" align="left" min-width="100"></el-table-column>
-                        <el-table-column prop="" :label="t('author')" align="left" min-width="100"></el-table-column>
-                        <el-table-column :label="t('operation')" fixed="right" align="right" width="150"></el-table-column>
-                        <template #empty><span></span></template>
+                        <el-table-column :label="t('appName')" align="left" width="320" />
+                        <el-table-column align="left" min-width="120" />
+                        <el-table-column :label="t('introduction')" align="left" min-width="200" />
+                        <el-table-column :label="t('type')" align="left" min-width="100" />
+                        <el-table-column :label="t('author')" align="left" min-width="100" />
+                        <el-table-column :label="t('operation')" fixed="right" align="right" width="150" />
+                        <template #empty>
+                            <span></span>
+                        </template>
                     </el-table>
-                    <div class="h-[100px]" v-loading="loading" v-if="loading">
-                    </div>
+                    <div class="h-[100px]" v-loading="loading" v-if="loading"></div>
                 </div>
-                <el-empty class="mx-auto overview-empty" v-if="!localList.installed.length && !loading && activeName == 'installed'&&!authLoading">
+                <el-empty class="mx-auto overview-empty" v-if="!localList.installed.length && !loading && activeName == 'installed' && !authLoading">
                     <template #image>
                         <div class="w-[230px] mx-auto">
-                            <img src="@/app/assets/images/index/apply_empty.png" class="max-w-full" alt="">
+                            <img src="@/app/assets/images/index/apply_empty.png" class="max-w-full" alt="" />
                         </div>
                     </template>
                     <template #description>
-                        <p class="flex items-center">{{ t('installed-empty') }}</p>
+                        <p class="flex items-center">{{ t("installed-empty") }}</p>
                     </template>
                 </el-empty>
-                <el-empty class="mx-auto overview-empty" v-if="!localList.uninstalled.length && !loading && activeName == 'uninstalled'&&!authLoading">
+                <el-empty class="mx-auto overview-empty" v-if="!localList.uninstalled.length && !loading && activeName == 'uninstalled' && !authLoading">
                     <template #image>
                         <div class="w-[230px] mx-auto">
-                            <img src="@/app/assets/images/index/apply_empty.png" class="max-w-full" alt="">
+                            <img src="@/app/assets/images/index/apply_empty.png" class="max-w-full" alt="" />
                         </div>
                     </template>
                     <template #description>
                         <p class="flex items-center">
-                            <span>{{ t('descriptionLeft') }}</span>
-                            <el-link type="primary" @click="goRouter" class="mx-[5px]">{{ t('link') }}</el-link>
-                            <span>{{ t('descriptionRight') }}</span>
+                            <span>{{ t("descriptionLeft") }}</span>
+                            <el-link type="primary" @click="goRouter" class="mx-[5px]">{{ t("link") }}</el-link>
+                            <span>{{ t("descriptionRight") }}</span>
                         </p>
                     </template>
                 </el-empty>
                 <div v-if="!localList.all.length && !loading && !authinfo && activeName == 'all' && !authLoading" class="mx-auto overview-empty flex flex-col items-center pt-14 pb-6">
                     <div class="mb-[20px] text-sm text-[#888]">检测到当前账号尚未绑定授权，请先绑定授权！</div>
-                    <div class="flex flex-1  flex-wrap justify-center relative">
+                    <div class="flex flex-1 flex-wrap justify-center relative">
                         <el-button class="w-[154px] !h-[48px] mt-[8px]" type="primary" @click="authCodeApproveFn">授权码认证</el-button>
                         <el-popover ref="getAuthCodeDialog" placement="bottom" :width="478" trigger="click" class="mt-[8px]">
                             <div class="px-[18px] py-[8px]">
-                                <p class="leading-[32px] text-[14px]">
-                                    您在官方应用市场购买任意一款应用，即可获得授权码。输入正确授权码认证通过后，即可支持在线升级和其它相关服务</p>
+                                <p class="leading-[32px] text-[14px]">您在官方应用市场购买任意一款应用，即可获得授权码。输入正确授权码认证通过后，即可支持在线升级和其它相关服务</p>
                                 <div class="flex justify-end mt-[36px]">
                                     <el-button class="w-[182px] !h-[48px]" plain @click="market">去应用市场逛逛</el-button>
                                     <el-button class="w-[100px] !h-[48px]" plain @click="getAuthCodeDialog.hide()">关闭</el-button>
@@ -160,17 +158,27 @@
                 <el-empty class="mx-auto overview-empty" v-if="!localList.all.length && !loading && authinfo && activeName == 'all' && !authLoading">
                     <template #image>
                         <div class="w-[230px] mx-auto">
-                            <img src="@/app/assets/images/index/apply_empty.png" class="max-w-full" alt="">
+                            <img src="@/app/assets/images/index/apply_empty.png" class="max-w-full" alt="" />
                         </div>
                     </template>
                     <template #description>
                         <p class="flex items-center">
-                            <span>{{ t('buyDescriptionLeft') }}</span>
-                            <el-link type="primary" @click="goRouter" class="mx-[5px]">{{ t('link') }}</el-link>
-                            <span>{{ t('descriptionRight') }}</span>
+                            <span>{{ t("buyDescriptionLeft") }}</span>
+                            <el-link type="primary" @click="goRouter" class="mx-[5px]">{{ t("link") }}</el-link>
+                            <span>{{ t("descriptionRight") }}</span>
                         </p>
                     </template>
                 </el-empty>
+                <el-empty class="mx-auto overview-empty" v-if="!localList.recentlyUpdated.length && !loading && authinfo && activeName == 'recentlyUpdated' && !authLoading">
+                    <template #image>
+                        <div class="w-[230px] mx-auto">
+                            <img src="@/app/assets/images/index/apply_empty.png" class="max-w-full" alt="" />
+                        </div>
+                    </template>
+                    <template #description>
+                        <p class="flex items-center">{{ t("recentlyUpdatedEmpty") }}</p>
+                    </template>
+                </el-empty>
             </div>
 
             <el-dialog v-model="authCodeApproveDialog" title="授权码认证" width="400px">
@@ -186,13 +194,14 @@
                             </el-form-item>
                         </div>
 
-                        <div class="text-sm mt-[10px] text-info">{{ t('authInfoTips') }}</div>
+                        <div class="text-sm mt-[10px] text-info">{{ t("authInfoTips") }}</div>
 
                         <div class="mt-[20px]">
-                            <el-button type="primary" class="w-full" size="large" :loading="saveLoading" @click="save(formRef)">{{ t('confirm') }}</el-button>
+                            <el-button type="primary" class="w-full" size="large" :loading="saveLoading" @click="save(formRef)">{{ t("confirm") }}
+                            </el-button>
                         </div>
                         <div class="mt-[10px] text-right">
-                            <el-button type="primary" link @click="market">{{ t('notHaveAuth') }}</el-button>
+                            <el-button type="primary" link @click="market">{{ t("notHaveAuth") }}</el-button>
                         </div>
                     </el-card>
                 </el-form>
@@ -201,21 +210,21 @@
             <el-dialog v-model="appStoreShowDialog" :title="t('plugDetail')" width="500px" :destroy-on-close="true">
                 <el-form :model="appStoreInfo" label-width="120px" ref="formRef" class="page-form">
                     <el-form-item :label="t('title')">
-                        <div class="input-width"> {{ appStoreInfo.title }} </div>
+                        <div class="input-width">{{ appStoreInfo.title }}</div>
                     </el-form-item>
                     <el-form-item :label="t('desc')">
-                        <div class="input-width"> {{ appStoreInfo.desc }} </div>
+                        <div class="input-width">{{ appStoreInfo.desc }}</div>
                     </el-form-item>
                     <el-form-item :label="t('author')">
-                        <div class="input-width"> {{ appStoreInfo.author }} </div>
+                        <div class="input-width">{{ appStoreInfo.author }}</div>
                     </el-form-item>
                     <el-form-item :label="t('version')">
-                        <div class="input-width"> {{ appStoreInfo.version }} </div>
+                        <div class="input-width">{{ appStoreInfo.version }}</div>
                     </el-form-item>
                 </el-form>
                 <template #footer>
                     <span class="dialog-footer">
-                        <el-button type="primary" @click="appStoreShowDialog = false">{{ t('confirm') }}</el-button>
+                        <el-button type="primary" @click="appStoreShowDialog = false">{{ t("confirm") }}</el-button>
                     </span>
                 </template>
             </el-dialog>
@@ -231,28 +240,32 @@
                     <el-scrollbar max-height="50vh">
                         <div class="min-h-[150px]">
                             <div class="my-3" v-if="installCheckResult.dir">
-                                <p class="pt-[20px] pl-[20px] ">{{ t('dirPermission') }}</p>
+                                <p class="pt-[20px] pl-[20px]">{{ t("dirPermission") }}</p>
                                 <div class="px-[20px] pt-[10px] text-[14px]">
                                     <el-row class="py-[10px] items table-head-bg pl-[15px] mb-[10px]">
                                         <el-col :span="12">
-                                            <span>{{ t('path') }}</span>
+                                            <span>{{ t("path") }}</span>
                                         </el-col>
                                         <el-col :span="6">
-                                            <span>{{ t('demand') }}</span>
+                                            <span>{{ t("demand") }}</span>
                                         </el-col>
                                         <el-col :span="6">
-                                            <span>{{ t('status') }}</span>
+                                            <span>{{ t("status") }}</span>
                                         </el-col>
                                     </el-row>
-                                    <el-row class="pb-[10px] items pl-[15px]" v-for="(item,index) in installCheckResult.dir.is_readable" :key="index">
+                                    <el-row class="pb-[10px] items pl-[15px]" v-for="(item, index) in installCheckResult.dir.is_readable" :key="index">
                                         <el-col :span="12">
                                             <span>{{ item.dir }}</span>
                                         </el-col>
                                         <el-col :span="6">
-                                            <span>{{ t('readable') }}</span>
+                                            <span>{{ t("readable") }}</span>
                                         </el-col>
                                         <el-col :span="6">
-                                            <span v-if="item.status"><el-icon color="green"><Select /></el-icon></span>
+                                            <span v-if="item.status">
+                                                <el-icon color="green">
+                                                    <Select />
+                                                </el-icon>
+                                            </span>
                                             <span v-else>
                                                 <el-icon color="red">
                                                     <CloseBold />
@@ -260,15 +273,19 @@
                                             </span>
                                         </el-col>
                                     </el-row>
-                                    <el-row class="pb-[10px] items pl-[15px]" v-for="(item,index) in installCheckResult.dir.is_write" :key="index">
+                                    <el-row class="pb-[10px] items pl-[15px]" v-for="(item, index) in installCheckResult.dir.is_write" :key="index">
                                         <el-col :span="12">
                                             <span>{{ item.dir }}</span>
                                         </el-col>
                                         <el-col :span="6">
-                                            <span>{{ t('write') }}</span>
+                                            <span>{{ t("write") }}</span>
                                         </el-col>
                                         <el-col :span="6">
-                                            <span v-if="item.status"><el-icon color="green"><Select /></el-icon></span>
+                                            <span v-if="item.status">
+                                                <el-icon color="green">
+                                                    <Select />
+                                                </el-icon>
+                                            </span>
                                             <span v-else>
                                                 <el-icon color="red">
                                                     <CloseBold />
@@ -282,20 +299,20 @@
                     </el-scrollbar>
                     <div class="flex justify-end">
                         <el-tooltip effect="dark" :content="t('installTips')" placement="top">
-                            <el-button type="default" :disabled="!installCheckResult.is_pass || cloudInstalling" :loading="localInstalling" @click="handleInstall">{{ t('localInstall') }}</el-button>
+                            <el-button :disabled="!installCheckResult.is_pass || cloudInstalling" :loading="localInstalling" @click="handleInstall">{{ t("localInstall") }}</el-button>
                         </el-tooltip>
                         <el-tooltip effect="dark" :content="t('cloudInstallTips')" placement="top">
-                            <el-button type="primary" :disabled="!installCheckResult.is_pass || localInstalling" :loading="cloudInstalling" @click="handleCloudInstall">{{ t('cloudInstall') }}</el-button>
+                            <el-button type="primary" :disabled="!installCheckResult.is_pass || localInstalling" :loading="cloudInstalling" @click="handleCloudInstall">{{ t("cloudInstall") }}</el-button>
                         </el-tooltip>
                     </div>
                 </div>
                 <div v-show="installStep == 2" class="h-[50vh] mt-[20px]">
-                    <terminal ref="terminalRef" :context="currAddon" :init-log="null" :show-header="false" :show-log-time="true" @exec-cmd="onExecCmd"/>
+                    <terminal ref="terminalRef" :context="currAddon" :init-log="null" :show-header="false" :show-log-time="true" @exec-cmd="onExecCmd" />
                 </div>
                 <div v-show="installStep == 3" class="h-[50vh] mt-[20px] flex flex-col">
                     <el-result icon="success" :title="t('addonInstallSuccess')"></el-result>
                     <!-- 提示信息 -->
-                    <div v-for="(item,index) in installAfterTips" class="mb-[10px]" :key="index">
+                    <div v-for="(item, index) in installAfterTips" class="mb-[10px]" :key="index">
                         <el-alert :title="item" type="error" :closable="false" />
                     </div>
                 </div>
@@ -305,28 +322,32 @@
                 <el-scrollbar max-height="50vh">
                     <div class="min-h-[150px]">
                         <div class="bg-[#fff] my-3" v-if="uninstallCheckResult.dir">
-                            <p class="pt-[20px] pl-[20px] ">{{ t('dirPermission') }}</p>
+                            <p class="pt-[20px] pl-[20px]">{{ t("dirPermission") }}</p>
                             <div class="px-[20px] pt-[10px] text-[14px]">
                                 <el-row class="py-[10px] items table-head-bg pl-[15px] mb-[10px]">
                                     <el-col :span="12">
-                                        <span>{{ t('path') }}</span>
+                                        <span>{{ t("path") }}</span>
                                     </el-col>
                                     <el-col :span="6">
-                                        <span>{{ t('demand') }}</span>
+                                        <span>{{ t("demand") }}</span>
                                     </el-col>
                                     <el-col :span="6">
-                                        <span>{{ t('status') }}</span>
+                                        <span>{{ t("status") }}</span>
                                     </el-col>
                                 </el-row>
-                                <el-row class="pb-[10px] items pl-[15px]" v-for="(item,index) in uninstallCheckResult.dir.is_readable" :key="index">
+                                <el-row class="pb-[10px] items pl-[15px]" v-for="(item, index) in uninstallCheckResult.dir.is_readable" :key="index">
                                     <el-col :span="12">
                                         <span>{{ item.dir }}</span>
                                     </el-col>
                                     <el-col :span="6">
-                                        <span>{{ t('readable') }}</span>
+                                        <span>{{ t("readable") }}</span>
                                     </el-col>
                                     <el-col :span="6">
-                                        <span v-if="item.status"><el-icon color="green"><Select /></el-icon></span>
+                                        <span v-if="item.status">
+                                            <el-icon color="green">
+                                                <Select />
+                                            </el-icon>
+                                        </span>
                                         <span v-else>
                                             <el-icon color="red">
                                                 <CloseBold />
@@ -334,15 +355,19 @@
                                         </span>
                                     </el-col>
                                 </el-row>
-                                <el-row class="pb-[10px] items pl-[15px]" v-for="(item,index) in uninstallCheckResult.dir.is_write" :key="index">
+                                <el-row class="pb-[10px] items pl-[15px]" v-for="(item, index) in uninstallCheckResult.dir.is_write" :key="index">
                                     <el-col :span="12">
                                         <span>{{ item.dir }}</span>
                                     </el-col>
                                     <el-col :span="6">
-                                        <span>{{ t('write') }}</span>
+                                        <span>{{ t("write") }}</span>
                                     </el-col>
                                     <el-col :span="6">
-                                        <span v-if="item.status"><el-icon color="green"><Select /></el-icon></span>
+                                        <span v-if="item.status">
+                                            <el-icon color="green">
+                                                <Select />
+                                            </el-icon>
+                                        </span>
                                         <span v-else>
                                             <el-icon color="red">
                                                 <CloseBold />
@@ -366,17 +391,28 @@
                     </span>
                 </template>
             </el-dialog>
+            <!-- 更新信息 -->
         </el-card>
     </div>
-
-    <upgrade ref="upgradeRef" @complete="localListFn" @cloudbuild="handleCloudBuild"/>
+    <upgrade-log :upgradeKey="upgradeKey" ref="upgradeLogRef" />
+    <upgrade ref="upgradeRef" @complete="localListFn" @cloudbuild="handleCloudBuild" />
     <cloud-build ref="cloudBuildRef" />
 </template>
 
 <script lang="ts" setup>
 import { ref, reactive, watch, h } from 'vue'
 import { t } from '@/lang'
-import { getAddonLocal, uninstallAddon, installAddon, preInstallCheck, cloudInstallAddon, getAddonInstalltask, getAddonCloudInstallLog, preUninstallCheck, cancelInstall } from '@/app/api/addon'
+import {
+    getAddonLocal,
+    uninstallAddon,
+    installAddon,
+    preInstallCheck,
+    cloudInstallAddon,
+    getAddonInstalltask,
+    getAddonCloudInstallLog,
+    preUninstallCheck,
+    cancelInstall
+} from '@/app/api/addon'
 import { deleteAddonDevelop } from '@/app/api/tools'
 import { downloadVersion, getAuthInfo, setAuthInfo } from '@/app/api/module'
 import { getVersions } from '@/app/api/auth'
@@ -389,6 +425,7 @@ import { useRouter, useRoute } from 'vue-router'
 import useUserStore from '@/stores/modules/user'
 import Upgrade from '@/app/components/upgrade/index.vue'
 import CloudBuild from '@/app/components/cloud-build/index.vue'
+import UpgradeLog from '@/app/components/upgrade-log/index.vue'
 
 const router = useRouter()
 const route = useRoute()
@@ -402,8 +439,8 @@ const userStore = useUserStore()
 const unloadHintDialog = ref(false)
 const terminalRef = ref(null)
 const frameworkVersion = ref('')
-
-getVersions().then(res => {
+const upgradeLogRef = ref<any>(null)
+getVersions().then((res) => {
     frameworkVersion.value = res.data.version.version
 })
 
@@ -412,7 +449,7 @@ const downEventHintFn = () => {
     downEvent(currDownData.value, true)
 }
 
-const activeNameTabFn = (data:any) => {
+const activeNameTabFn = (data: any) => {
     activeName.value = data
     storage.set({ key: 'storeActiveName', data })
 }
@@ -440,11 +477,10 @@ const downEvent = (param: Record<string, any>, isDown = false) => {
 }
 
 const authCode = ref('')
-getAuthInfo().then(res => {
+getAuthInfo().then((res) => {
     if (res.data.data && res.data.data.auth_code) {
         authCode.value = res.data.data.auth_code
     }
-}).catch(() => {
 })
 
 /**
@@ -455,39 +491,47 @@ const search_name = ref('')
 const info = ref({
     installed: [],
     uninstalled: [],
-    all: []
+    all: [],
+    recentlyUpdated: []
 })
 const query = () => {
     if (search_name.value == '' || search_name.value == null) {
         info.value.installed = localList.value.installed
         info.value.uninstalled = localList.value.uninstalled
         info.value.all = localList.value.all
+        info.value.recentlyUpdated = localList.value.recentlyUpdated
         return false
     }
     info.value.installed = localList.value.installed.filter((el: any) => el.title.indexOf(search_name.value) != -1)
     info.value.uninstalled = localList.value.uninstalled.filter((el: any) => el.title.indexOf(search_name.value) != -1)
     info.value.all = localList.value.all.filter((el: any) => el.title.indexOf(search_name.value) != -1)
+    info.value.recentlyUpdated = localList.value.recentlyUpdated.filter((el: any) => el.title.indexOf(search_name.value) != -1)
 }
 const localList = ref({
     installed: [],
     uninstalled: [],
     all: [],
+    recentlyUpdated: [],
     error: ''
 })
 
 const localListFn = () => {
     loading.value = true
-    getAddonLocal({}).then(res => {
+    getAddonLocal({}).then((res) => {
         const data = res.data.list
         localList.value.error = res.data.error
         localList.value.installed = []
         localList.value.uninstalled = []
         localList.value.all = []
+        localList.value.recentlyUpdated = []
         for (const i in data) {
             if (data[i].is_local == false) localList.value.all.push(data[i])
 
             if (data[i].install_info && Object.keys(data[i].install_info)?.length) {
                 localList.value.installed.push(data[i])
+                if (data[i].install_info.version != data[i].version) {
+                    localList.value.recentlyUpdated.push(data[i])
+                }
             } else {
                 if (data[i].is_download == true) localList.value.uninstalled.push(data[i])
             }
@@ -509,11 +553,6 @@ const localListFn = () => {
 
 localListFn()
 
-// 点击应用提示到站点
-const handleTips = () => {
-    ElMessage('请在站点中运行程序!')
-}
-
 // 点击应用可以进系统
 
 const appLink: any = ref({})
@@ -542,7 +581,7 @@ const installCheckResult = ref({})
 
 let flashInterval = null
 const terminalFlash = new TerminalFlash()
-const onExecCmd = (key, command, success, failed, name)=> {
+const onExecCmd = (key, command, success, failed, name) => {
     if (command == '开始安装插件') {
         success(terminalFlash)
         const frames = makeIterator(['/', '——', '\\', '|'])
@@ -552,11 +591,11 @@ const onExecCmd = (key, command, success, failed, name)=> {
     }
 }
 
-function makeIterator(array: string[]) {
+function makeIterator (array: string[]) {
     let nextIndex = 0
     return {
-        next() {
-            if ((nextIndex + 1) == array.length) {
+        next () {
+            if (nextIndex + 1 == array.length) {
                 nextIndex = 0
             }
             return { value: array[nextIndex++] }
@@ -571,13 +610,13 @@ function makeIterator(array: string[]) {
 const installAddonFn = (key: string) => {
     currAddon.value = key
 
-    preInstallCheck(key).then(res => {
+    preInstallCheck(key).then((res) => {
         installStep.value = 1
         installShowDialog.value = true
         installAfterTips.value = []
         installCheckResult.value = res.data
         userStore.clearRouters()
-    }).catch(() => { })
+    })
 }
 
 /**
@@ -585,7 +624,7 @@ const installAddonFn = (key: string) => {
  */
 let notificationEl = null
 const getInstallTask = (first: boolean = true) => {
-    getAddonInstalltask().then(res => {
+    getAddonInstalltask().then((res) => {
         if (res.data) {
             if (first) {
                 installLog = []
@@ -594,10 +633,10 @@ const getInstallTask = (first: boolean = true) => {
                     notificationEl = ElNotification.success({
                         title: t('warning'),
                         dangerouslyUseHTMLString: true,
-                        message: h('div', {}, [
-                            t('installingTips'),
-                            h('span', { class: 'text-primary cursor-pointer', onClick: checkInstallTask }, [t('installPercent')])
-                        ]),
+                        message: h('div', {}, [t('installingTips'), h('span', {
+                            class: 'text-primary cursor-pointer',
+                            onClick: checkInstallTask
+                        }, [t('installPercent')])]),
                         duration: 0,
                         showClose: false
                     })
@@ -641,7 +680,7 @@ const handleInstall = () => {
     if (!installCheckResult.value.is_pass || localInstalling.value) return
     localInstalling.value = true
 
-    installAddon({ addon: currAddon.value }).then(res => {
+    installAddon({ addon: currAddon.value }).then((res) => {
         installStep.value = 3
         localListFn()
         localInstalling.value = false
@@ -665,27 +704,25 @@ const handleCloudInstall = () => {
     if (!installCheckResult.value.is_pass || cloudInstalling.value) return
     cloudInstalling.value = true
 
-    cloudInstallAddon({ addon: currAddon.value }).then(res => {
-        installStep.value = 2
-        terminalRef.value.execute('clear')
-        terminalRef.value.execute('开始安装插件')
-        getInstallTask()
-        cloudInstalling.value = false
-    }).catch((res) => {
-        cloudInstalling.value = false
-    })
+    cloudInstallAddon({ addon: currAddon.value })
+        .then((res) => {
+            installStep.value = 2
+            terminalRef.value.execute('clear')
+            terminalRef.value.execute('开始安装插件')
+            getInstallTask()
+            cloudInstalling.value = false
+        })
+        .catch((res) => {
+            cloudInstalling.value = false
+        })
 }
 
 const authElMessageBox = () => {
-    ElMessageBox.confirm(
-        t('authTips'),
-        t('warning'),
-        {
-            distinguishCancelAndClose: true,
-            confirmButtonText: t('toBind'),
-            cancelButtonText: t('toNiucloud')
-        }
-    ).then(() => {
+    ElMessageBox.confirm(t('authTips'), t('warning'), {
+        distinguishCancelAndClose: true,
+        confirmButtonText: t('toBind'),
+        cancelButtonText: t('toNiucloud')
+    }).then(() => {
         authCodeApproveFn()
     }).catch((action: string) => {
         if (action === 'cancel') {
@@ -696,12 +733,12 @@ const authElMessageBox = () => {
 
 let installLog: string[] = []
 const getCloudInstallLog = () => {
-    getAddonCloudInstallLog(currAddon.value).then(res => {
+    getAddonCloudInstallLog(currAddon.value).then((res) => {
         const data = res.data.data ?? []
         if (data[0] && data[0].length && installShowDialog.value == true) {
-            data[0].forEach(item => {
+            data[0].forEach((item) => {
                 if (!installLog.includes(item.action)) {
-                    terminalRef.value.pushMessage({ content: `正在执行：${ item.action }` })
+                    terminalRef.value.pushMessage({ content: `${ item.action }` })
                     installLog.push(item.action)
 
                     if (item.code == 0) {
@@ -730,17 +767,13 @@ const uninstallCheckResult = ref({})
  * @param key
  */
 const uninstallAddonFn = (key: string) => {
-    ElMessageBox.confirm(
-        t('uninstallTips'),
-        t('warning'),
-        {
-            confirmButtonText: t('confirm'),
-            cancelButtonText: t('cancel'),
-            type: 'warning'
-        }
-    ).then(() => {
+    ElMessageBox.confirm(t('uninstallTips'), t('warning'), {
+        confirmButtonText: t('confirm'),
+        cancelButtonText: t('cancel'),
+        type: 'warning'
+    }).then(() => {
         handleUninstallAddon(key)
-    }).catch(() => { })
+    })
 }
 
 /**
@@ -763,13 +796,11 @@ const handleCloudBuild = () => {
         cloudBuildRef.value?.open()
         return
     }
-    ElMessageBox.confirm(t('cloudBuildTips'), t('warning'),
-        {
-            confirmButtonText: t('confirm'),
-            cancelButtonText: t('cancel'),
-            type: 'warning'
-        }
-    ).then(() => {
+    ElMessageBox.confirm(t('cloudBuildTips'), t('warning'), {
+        confirmButtonText: t('confirm'),
+        cancelButtonText: t('cancel'),
+        type: 'warning'
+    }).then(() => {
         cloudBuildRef.value?.open()
     })
 }
@@ -777,7 +808,7 @@ const handleCloudBuild = () => {
 const handleUninstallAddon = (key: string) => {
     preUninstallCheck(key).then(({ data }) => {
         if (data.is_pass) {
-            uninstallAddon({ addon: key }).then(res => {
+            uninstallAddon({ addon: key }).then((res) => {
                 localListFn()
                 userStore.clearRouters()
                 loading.value = false
@@ -801,18 +832,13 @@ const market = () => {
  */
 const installShowDialogClose = (done: () => {}) => {
     if (installStep.value == 2) {
-        ElMessageBox.confirm(
-            t('installShowDialogCloseTips'),
-            t('warning'),
-            {
-                confirmButtonText: t('confirm'),
-                cancelButtonText: t('cancel'),
-                type: 'warning'
-            }
-        ).then(() => {
+        ElMessageBox.confirm(t('installShowDialogCloseTips'), t('warning'), {
+            confirmButtonText: t('confirm'),
+            cancelButtonText: t('cancel'),
+            type: 'warning'
+        }).then(() => {
             cancelInstall(currAddon.value)
             done()
-        }).catch(() => {
         })
     } else if (installStep.value == 3) {
         activeNameTabFn('installed')
@@ -826,12 +852,20 @@ const installShowDialogClose = (done: () => {}) => {
 
 // 插件详情
 const appStoreShowDialog = ref(false)
-const appStoreInfo = ref<AnyObject>({})
-const getAddonDetailFn = (data: AnyObject) => {
+const appStoreInfo = ref({})
+const getAddonDetailFn = (data: any) => {
     appStoreShowDialog.value = true
     appStoreInfo.value = data
 }
+// 更新信息
 
+const upgradeKey = ref<string>('')
+const updateInformationFn = (data: any) => {
+    // updateInformationDialog.value = true
+
+    upgradeKey.value = data.key
+    upgradeLogRef.value?.open()
+}
 // 授权
 const authCodeApproveDialog = ref(false)
 const authinfo = ref('')
@@ -840,18 +874,17 @@ const saveLoading = ref(false)
 const authLoading = ref(true)
 const checkAppMange = () => {
     authLoading.value = true
-    getAuthInfo()
-        .then((res) => {
-            authLoading.value = false
-            if (res.data.data && res.data.data.length != 0) {
-                authinfo.value = res.data.data
-            }
-        })
-        .catch(() => {
-            authLoading.value = false
-            authCodeApproveDialog.value = false
-        })
+    getAuthInfo().then((res) => {
+        authLoading.value = false
+        if (res.data.data && res.data.data.length != 0) {
+            authinfo.value = res.data.data
+        }
+    }).catch(() => {
+        authLoading.value = false
+        authCodeApproveDialog.value = false
+    })
 }
+
 checkAppMange()
 const authCodeApproveFn = () => {
     authCodeApproveDialog.value = true
@@ -865,12 +898,8 @@ const formRef = ref<FormInstance>()
 
 // 表单验证规则
 const formRules = reactive<FormRules>({
-    auth_code: [
-        { required: true, message: t('authCodePlaceholder'), trigger: 'blur' }
-    ],
-    auth_secret: [
-        { required: true, message: t('authSecretPlaceholder'), trigger: 'blur' }
-    ]
+    auth_code: [{ required: true, message: t('authCodePlaceholder'), trigger: 'blur' }],
+    auth_secret: [{ required: true, message: t('authSecretPlaceholder'), trigger: 'blur' }]
 })
 
 const save = async (formEl: FormInstance | undefined) => {
@@ -897,32 +926,27 @@ const goRouter = () => {
 }
 
 const deleteAddonFn = (key: string) => {
-    ElMessageBox.confirm(
-        t('deleteAddonTips'),
-        t('warning'),
-        {
-            confirmButtonText: t('confirm'),
-            cancelButtonText: t('cancel'),
-            type: 'warning'
-        }
-    ).then(() => {
+    ElMessageBox.confirm(t('deleteAddonTips'), t('warning'), {
+        confirmButtonText: t('confirm'),
+        cancelButtonText: t('cancel'),
+        type: 'warning'
+    }).then(() => {
         deleteAddonDevelop(key).then(() => {
             localListFn()
         })
-    }).catch(() => { })
+    })
 }
 
 const versionJudge = (row: any) => {
     if (!row.support_version) return true
     const supportVersionApp = row.support_version.split('.')
     const frameworkVersionArr = frameworkVersion.value.split('.')
-    if (parseFloat(`${supportVersionApp[0]}.${supportVersionApp[1]}`) < parseFloat(`${frameworkVersionArr[0]}.${frameworkVersionArr[1]}`)) return true
+    if (parseFloat(`${ supportVersionApp[0] }.${ supportVersionApp[1] }`) < parseFloat(`${ frameworkVersionArr[0] }.${ frameworkVersionArr[1] }`)) return true
     return false
 }
 </script>
 
 <style lang="scss" scoped>
-/* 多行超出隐藏 */
 .multi-hidden {
     word-break: break-all;
     text-overflow: ellipsis;
@@ -932,50 +956,6 @@ const versionJudge = (row: any) => {
     -webkit-box-orient: vertical;
 }
 
-.demo-tabs>.el-tabs__content {
-    padding: 32px;
-    color: #6b778c;
-    font-size: 32px;
-    font-weight: 600;
-}
-
-.plug-item {
-    .plug-item-operate {
-        color: var(--el-color-primary);
-        border-color: var(--el-color-primary);
-        font-size: var(--el-font-size-extra-small);
-    }
-}
-
-:deep(.t-container) {
-    box-shadow: none !important;
-
-    .t-window {
-        padding: 10px 20px !important;
-    }
-}
-
-.switch-btn.active {
-    border-color: var(--el-color-primary);
-    color: #fff;
-    background-color: var(--el-color-primary);
-}
-
-.plug-large {
-    .plug-item-operate {
-        color: var(--el-color-primary);
-        border-color: var(--el-color-primary);
-        font-size: var(--el-font-size-extra-small);
-    }
-}
-
-.app-text {
-    overflow: hidden;
-    white-space: nowrap;
-    text-overflow: ellipsis;
-    -o-text-overflow: ellipsis;
-}
-
 // 插件安装-弹窗-表格样式
 .table-head-bg {
     background: #f5f7f9;
@@ -990,16 +970,13 @@ html.dark .table-head-bg {
     line-height: 18px;
 }
 
-.app-store {
-    height: calc(100vh - 120px);
-    box-sizing: border-box;
-}
 :deep(.terminal .t-log-box span) {
     white-space: pre-wrap;
 }
+
 :deep(.data-loading) {
     .el-table__body-wrapper {
-        display: none!important;
+        display: none !important;
     }
 }
 </style>
diff --git a/admin/src/app/views/index/tools.vue b/admin/src/app/views/index/tools.vue
index 2e4dfb7bb..9e82b2a06 100644
--- a/admin/src/app/views/index/tools.vue
+++ b/admin/src/app/views/index/tools.vue
@@ -11,99 +11,105 @@
                 <div class="w-[256px] tools-item-shadow m-[20px] !mr-[0px] !mt-[0px] rounded-[8px] flex flex-col cursor-pointer leading-[1]" @click="toLink('/admin/tools/addon')">
                     <div class="flex-1 pt-[18px] pb-[14px] px-[24px] flex flex-col bg-[var(--el-bg-color)]">
                         <span class="text-[16px] font-bold">插件开发</span>
-                        <div class="text-[13px] text-[#6D7278] leading-[18px] mt-[8px] truncate">
-                            点击新建插件，生成插件后系统会生成对应插
-                        </div>
+                        <div class="text-[13px] text-[#6D7278] leading-[18px] mt-[8px] truncate">点击新建插件，生成插件后系统会生成对应插</div>
                     </div>
                     <img src="@/app/assets/images/tools/addon_develop.png" class="w-[256px] h-[128px]" />
                 </div>
                 <div class="w-[256px] tools-item-shadow m-[20px] !mr-[0px] !mt-[0px] rounded-[8px] flex flex-col cursor-pointer leading-[1]" @click="toLink('/admin/tools/code')">
                     <div class="flex-1 pt-[18px] pb-[14px] px-[24px] flex flex-col bg-[var(--el-bg-color)]">
                         <span class="text-[16px] font-bold">代码生成</span>
-                        <div class="text-[13px] text-[#6D7278] leading-[18px] mt-[8px] truncate">
-                            代码生成
-                        </div>
+                        <div class="text-[13px] text-[#6D7278] leading-[18px] mt-[8px] truncate">代码生成</div>
                     </div>
                     <img src="@/app/assets/images/tools/code.png" class="w-[256px] h-[128px]" />
                 </div>
                 <div class="w-[256px] tools-item-shadow m-[20px] !mr-[0px] !mt-[0px] rounded-[8px] flex flex-col cursor-pointer leading-[1]" @click="toLink('/admin/tools/list')">
                     <div class="flex-1 pt-[18px] pb-[14px] px-[24px] flex flex-col bg-[var(--el-bg-color)]">
                         <span class="text-[16px] font-bold">数据字典</span>
-                        <div class="text-[13px] text-[#6D7278] leading-[18px] mt-[8px] truncate">
-                            数据字典
-                        </div>
+                        <div class="text-[13px] text-[#6D7278] leading-[18px] mt-[8px] truncate">数据字典</div>
                     </div>
                     <img src="@/app/assets/images/tools/sys_dict_list.png" class="w-[256px] h-[128px]" />
                 </div>
-                <div class="w-[256px] tools-item-shadow mb-[24px] mx-[14px] rounded-[8px] flex flex-col cursor-pointer leading-[1]" @click="toLink('/admin/tools/update_cache')">
-                    <div class="flex-1 pt-[18px] pb-[14px] px-[24px] flex flex-col">
-                        <span class="text-[16px] text-[#222] font-bold">更新缓存</span>
-                        <div class="text-[13px] text-[#6D7278] leading-[18px] mt-[8px] truncate">
-                            更新缓存
-                        </div>
+                <div class="w-[256px] tools-item-shadow m-[20px] !mr-[0px] !mt-[0px] rounded-[8px] flex flex-col cursor-pointer leading-[1]" @click="toLink('/admin/tools/update_cache')">
+                    <div class="flex-1 pt-[18px] pb-[14px] px-[24px] flex flex-col bg-[var(--el-bg-color)]">
+                        <span class="text-[16px] font-bold">更新缓存</span>
+                        <div class="text-[13px] text-[#6D7278] leading-[18px] mt-[8px] truncate">更新缓存</div>
                     </div>
-                    <img src="@/app/assets/images/tools/tools_Update_cache.png" class="w-[256px] h-[128px]" />
+                    <img src="@/app/assets/images/tools/tools_update_cache.png" class="w-[256px] h-[128px]" />
                 </div>
                 <div class="w-[256px] tools-item-shadow m-[20px] !mr-[0px] !mt-[0px] rounded-[8px] flex flex-col cursor-pointer leading-[1]" @click="toLink('/admin/tools/detection')">
                     <div class="flex-1 pt-[18px] pb-[14px] px-[24px] flex flex-col bg-[var(--el-bg-color)]">
                         <span class="text-[16px] font-bold">环境监测</span>
-                        <div class="text-[13px] text-[#6D7278] leading-[18px] mt-[8px] truncate">
-                            环境监测
-                        </div>
+                        <div class="text-[13px] text-[#6D7278] leading-[18px] mt-[8px] truncate">环境监测</div>
                     </div>
                     <img src="@/app/assets/images/tools/tools_check_environment.png" class="w-[256px] h-[128px] cursor-pointer" />
                 </div>
                 <div class="w-[256px] tools-item-shadow m-[20px] !mr-[0px] !mt-[0px] rounded-[8px] flex flex-col cursor-pointer leading-[1]" @click="toLink('/admin/tools/schedule')">
                     <div class="flex-1 pt-[18px] pb-[14px] px-[24px] flex flex-col bg-[var(--el-bg-color)]">
                         <span class="text-[16px] font-bold">计划任务</span>
-                        <div class="text-[13px] text-[#6D7278] leading-[18px] mt-[8px] truncate">
-                            计划任务
-                        </div>
+                        <div class="text-[13px] text-[#6D7278] leading-[18px] mt-[8px] truncate">计划任务</div>
                     </div>
                     <img src="@/app/assets/images/tools/tools_schedule.png" class="w-[256px] h-[128px]" />
                 </div>
                 <div class="w-[256px] tools-item-shadow m-[20px] !mr-[0px] !mt-[0px] rounded-[8px] flex flex-col cursor-pointer leading-[1]" @click="toLink('/admin/tools/authorize')">
                     <div class="flex-1 pt-[18px] pb-[14px] px-[24px] flex flex-col bg-[var(--el-bg-color)]">
                         <span class="text-[16px] font-bold">授权信息</span>
-                        <div class="text-[13px] text-[#6D7278] leading-[18px] mt-[8px] truncate">
-                            查看授权信息及重新认证授权
-                        </div>
+                        <div class="text-[13px] text-[#6D7278] leading-[18px] mt-[8px] truncate">查看授权信息及重新认证授权</div>
                     </div>
                     <img src="@/app/assets/images/tools/app_auth.png" class="w-[256px] h-[128px]" />
                 </div>
                 <div class="w-[256px] tools-item-shadow m-[20px] !mr-[0px] !mt-[0px] rounded-[8px] flex flex-col cursor-pointer leading-[1]" @click="toLink('/admin/tools/admin_menu')">
                     <div class="flex-1 pt-[18px] pb-[14px] px-[24px] flex flex-col bg-[var(--el-bg-color)]">
                         <span class="text-[16px] font-bold">平台菜单</span>
-                        <div class="text-[13px] text-[#6D7278] leading-[18px] mt-[8px] truncate">
-                            平台菜单
-                        </div>
+                        <div class="text-[13px] text-[#6D7278] leading-[18px] mt-[8px] truncate">平台菜单</div>
                     </div>
                     <img src="@/app/assets/images/tools/official_market.png" class="w-[256px] h-[128px]" />
                 </div>
                 <div class="w-[256px] tools-item-shadow m-[20px] !mr-[0px] !mt-[0px] rounded-[8px] flex flex-col cursor-pointer leading-[1]" @click="toLink('/admin/tools/site_menu')">
                     <div class="flex-1 pt-[18px] pb-[14px] px-[24px] flex flex-col bg-[var(--el-bg-color)]">
                         <span class="text-[16px] font-bold">站点菜单</span>
-                        <div class="text-[13px] text-[#6D7278] leading-[18px] mt-[8px] truncate">
-                            站点菜单
-                        </div>
+                        <div class="text-[13px] text-[#6D7278] leading-[18px] mt-[8px] truncate">站点菜单</div>
                     </div>
                     <img src="@/app/assets/images/tools/official_market.png" class="w-[256px] h-[128px]" />
                 </div>
+                <div class="w-[256px] tools-item-shadow m-[20px] !mr-[0px] !mt-[0px] rounded-[8px] flex flex-col cursor-pointer leading-[1]" @click="toLink('/admin/tools/upgrade')">
+                    <div class="flex-1 pt-[18px] pb-[14px] px-[24px] flex flex-col bg-[var(--el-bg-color)]">
+                        <span class="text-[16px] font-bold">系统更新</span>
+                        <div class="text-[13px] text-[#6D7278] leading-[18px] mt-[8px] truncate">系统更新</div>
+                    </div>
+                    <img src="@/app/assets/images/tools/tools_upgrade.png" class="w-[256px] h-[128px]" />
+                </div>
+                <div class="w-[256px] tools-item-shadow m-[20px] !mr-[0px] !mt-[0px] rounded-[8px] flex flex-col cursor-pointer leading-[1]" @click="toLink('/admin/tools/upgrade_records')">
+                    <div class="flex-1 pt-[18px] pb-[14px] px-[24px] flex flex-col bg-[var(--el-bg-color)]">
+                        <span class="text-[16px] font-bold">升级记录</span>
+                        <div class="text-[13px] text-[#6D7278] leading-[18px] mt-[8px] truncate">升级记录</div>
+                    </div>
+                    <img src="@/app/assets/images/tools/tools_upgrade_records.png" class="w-[256px] h-[128px]" />
+                </div>
+                <div class="w-[256px] tools-item-shadow m-[20px] !mr-[0px] !mt-[0px] rounded-[8px] flex flex-col cursor-pointer leading-[1]" @click="toLink('/admin/tools/backup_records')">
+                    <div class="flex-1 pt-[18px] pb-[14px] px-[24px] flex flex-col bg-[var(--el-bg-color)]">
+                        <span class="text-[16px] font-bold">备份记录</span>
+                        <div class="text-[13px] text-[#6D7278] leading-[18px] mt-[8px] truncate">备份记录</div>
+                    </div>
+                    <img src="@/app/assets/images/tools/tools_backup_records.png" class="w-[256px] h-[128px]" />
+                </div>
+                <div class="w-[256px] tools-item-shadow m-[20px] !mr-[0px] !mt-[0px] rounded-[8px] flex flex-col cursor-pointer leading-[1]" @click="toLink('/admin/tools/cloud_compile')">
+                    <div class="flex-1 pt-[18px] pb-[14px] px-[24px] flex flex-col bg-[var(--el-bg-color)]">
+                        <span class="text-[16px] font-bold">云编译</span>
+                        <div class="text-[13px] text-[#6D7278] leading-[18px] mt-[8px] truncate">云编译</div>
+                    </div>
+                    <img src="@/app/assets/images/tools/tools_cloud_compile.png" class="w-[256px] h-[128px]" />
+                </div>
                 <div class="w-[256px] tools-item-shadow m-[20px] !mr-[0px] !mt-[0px] rounded-[8px] flex flex-col cursor-pointer leading-[1]" @click="developerDialogVisible = true">
                     <div class="flex-1 pt-[18px] pb-[14px] px-[24px] flex flex-col bg-[var(--el-bg-color)]">
                         <span class="text-[16px] font-bold">开发模式</span>
-                        <div class="text-[13px] text-[#6D7278] leading-[18px] mt-[8px] truncate">
-                            开发环境和生产环境说明
-                        </div>
+                        <div class="text-[13px] text-[#6D7278] leading-[18px] mt-[8px] truncate">开发环境和生产环境说明</div>
                     </div>
                     <img src="@/app/assets/images/tools/developer.png" class="w-[256px] h-[128px]" />
                 </div>
                 <div class="w-[256px] tools-item-shadow m-[20px] !mr-[0px] !mt-[0px] rounded-[8px] flex flex-col cursor-pointer leading-[1]" @click="goRouter">
                     <div class="flex-1 pt-[18px] pb-[14px] px-[24px] flex flex-col bg-[var(--el-bg-color)]">
                         <span class="text-[16px] font-bold">官方市场</span>
-                        <div class="text-[13px] text-[#6D7278] leading-[18px] mt-[8px] truncate">
-                            官方市场
-                        </div>
+                        <div class="text-[13px] text-[#6D7278] leading-[18px] mt-[8px] truncate">官方市场</div>
                     </div>
                     <img src="@/app/assets/images/tools/official_market.png" class="w-[256px] h-[128px]" />
                 </div>
@@ -113,13 +119,9 @@
         <el-dialog v-model="developerDialogVisible" class="developer-dialog-wrap" title="开发人员模式说明" width="30%">
             <div>
                 <p class="text-[16px] mb-[4px]">开发模式</p>
-                <div class="text-[14px] indent-[2em]">
-                    开发人员模式即软件开发环境，指框架开启了开发模式(DEBUG=TRUE) ，开发模式时会出现开发选项卡，仅用于开发人员使用，包括应用及插件的安装卸载，系统升级等等。本菜单及子项功能均不受系统管理和权限控制
-                </div>
+                <div class="text-[14px] indent-[2em]">开发人员模式即软件开发环境，指框架开启了开发模式(DEBUG=TRUE) ，开发模式时会出现开发选项卡，仅用于开发人员使用，包括应用及插件的安装卸载，系统升级等等。本菜单及子项功能均不受系统管理和权限控制</div>
                 <p class="text-[16px] mt-[15px] mb-[4px]">生产模式</p>
-                <div class="text-[14px] indent-[2em]">
-                    生产模式即软件生产环境，指框架关闭了调试开发模式(DEBUG=FALSE) 软件正式部署运营开发选项卡隐藏，一般来说，开发人员开发或者部署好环境后，要关闭开发模式。
-                </div>
+                <div class="text-[14px] indent-[2em]">生产模式即软件生产环境，指框架关闭了调试开发模式(DEBUG=FALSE) 软件正式部署运营开发选项卡隐藏，一般来说，开发人员开发或者部署好环境后，要关闭开发模式。</div>
             </div>
             <template #footer>
                 <span class="dialog-footer">
diff --git a/admin/src/app/views/login/index.vue b/admin/src/app/views/login/index.vue
index d1eeb7172..8f962bd98 100644
--- a/admin/src/app/views/login/index.vue
+++ b/admin/src/app/views/login/index.vue
@@ -1,5 +1,5 @@
 <template>
-    <el-container :class="['w-full h-screen bg-page flex flex-col', { 'login-wrap': loginType == 'admin' }, { 'site-login-wrap': loginType == 'site' }]">
+    <el-container :class="['w-full h-screen bg-page flex flex-col', { 'login-wrap': loginType == 'admin' }, { 'site-login-wrap': loginType == 'site' }]" :style="loginType == 'site' ? siteBackgroundStyle : {}">
         <!-- 平台端登录 -->
         <el-main class="login-main items-center justify-center flex-1 h-0" v-if="loginType == 'admin'">
             <div class="flex rounded-2xl shadow overflow-hidden">
@@ -33,18 +33,20 @@
         <el-main class="login-main w-full mt-[120px] justify-center h-0" v-else-if="!imgLoading && loginType == 'site'">
             <div>
                 <div class="login-main-left flex flex-col items-center justify-center">
-                    <div class="w-[130px] h-[40px] overflow-hidden" v-if="webSite.icon">
-                        <el-image class="w-full h-full" :src="img(webSite.icon)" fit="contain">
+                    <div class="w-[130px] h-[40px] overflow-hidden" v-if="webSite.site_login_logo">
+                        <el-image class="w-full h-full" :src="img(webSite.site_login_logo)" fit="contain">
                             <template #error>
-                                <div class="flex justify-center items-center w-full h-full"><img class="max-w-[130px]" src="@/app/assets/images/logo.default.png" alt=""  object-fit="contain"></div>
+                                <div class="flex justify-center items-center w-full h-full">
+                                    <img class="max-w-[130px]" src="@/app/assets/images/white_logo.png" alt="" object-fit="contain" />
+                                </div>
                             </template>
                         </el-image>
                     </div>
-                    <div class="text-[30px] mt-[10px]">{{ webSite.site_name || t('siteTitle') }}</div>
+                    <div class="text-[30px] mt-[10px] text-[#fff]">{{ webSite.site_name || t('siteTitle') }}</div>
                 </div>
                 <div class="login flex flex-col w-[400px] mt-[60px] h-[350px] rounded-[10px] py-[20px] px-[40px]">
                     <h3 class="text-center mt-[20px] text-[24px]">{{ t('欢迎登录') }}</h3>
-                    <el-form :model="form" ref="formRef" :rules="formRules" class="mt-[30px] formtwo">
+                    <el-form :model="form" ref="formRef" :rules="formRules" class="mt-[30px] form-two">
                         <el-form-item prop="username">
                             <el-input v-model.trim="form.username" :placeholder="t('userPlaceholder')" autocomplete="off" :input-style="{boxShadow: 'none'}" @keyup.enter="handleLogin(formRef)" class="h-[40px]">
                                 <template #prefix>
@@ -64,12 +66,12 @@
                             <el-button type="primary" class="mt-[30px] !h-[40px] w-full" @click="handleLogin(formRef)" :loading="loading">{{ loading ? t('logging') : t('login') }}</el-button>
                         </el-form-item>
                     </el-form>
-                </div> 
+                </div>
             </div>
-            
+
         </el-main>
 
-        <div class="flex items-center justify-center mt-[20px] pb-[20px] text-sm text-[#666]" v-if="copyright">
+        <div class="flex items-center justify-center mt-[20px] pb-[20px] text-sm" :class="[loginType == 'admin' ? 'text-[#666]' : 'text-[#fff]']" v-if="copyright">
             <a :href="copyright.copyright_link" target="_blank">
                 <span class="mr-3" v-if="copyright.copyright_desc">{{ copyright.copyright_desc }}</span>
                 <span class="mr-3" v-if="copyright.company_name">{{ copyright.company_name }}</span>
@@ -108,20 +110,26 @@ const userStore = useUserStore()
 const route = useRoute()
 const router = useRouter()
 const copyright = ref(null)
-const systemStore = useSystemStore()
 
 getWebCopyright().then(({ data }) => {
     copyright.value = data
 })
-route.redirectedFrom && (route.query.redirect = route.redirectedFrom.path)
-const webSite = computed(() => useSystemStore().website)
 
+route.redirectedFrom && (route.query.redirect = route.redirectedFrom.path)
+const webSite: any = computed(() => useSystemStore().website)
+
+const siteBackgroundStyle = computed(() => ({
+    backgroundImage: webSite.value?.site_login_bg_img ? `url(${img(webSite.value.site_login_bg_img)})` : '',
+    backgroundSize: 'cover',
+    backgroundRepeat: 'no-repeat',
+    backgroundPosition: 'center'
+}))
 
 // 判断登录页面[平台或者站点]
 const loginType = ref(getAppType())
 
 // 验证码 - start
-const verifyRef = ref(null)
+const verifyRef: any = ref(null)
 const success = (params:any) => {
     loginFn({ captcha_code: params.captchaVerification })
 }
@@ -133,12 +141,11 @@ const form = reactive({
 })
 
 // 获取登录配置信息
-const loginConfig = ref(null)
+const loginConfig: any = ref(null)
+
 const getLoginConfigFn = async () => {
     imgLoading.value = true
-    const data = await (await getLoginConfig()).data
-    loginConfig.value = data
-    
+    loginConfig.value = await (await getLoginConfig()).data
     imgLoading.value = false
 }
 getLoginConfigFn()
@@ -159,7 +166,11 @@ const handleLogin = async (formEl: FormInstance | undefined) => {
 
     await formEl.validate((valid, fields) => {
         if (valid) {
-            if (parseInt(loginConfig.value.is_captcha) && loginType.value == 'admin' || parseInt(loginConfig.value.is_site_captcha) && loginType.value == 'site') { verifyRef.value.show() } else { loginFn() }
+            if (parseInt(loginConfig.value.is_captcha) && loginType.value == 'admin' || parseInt(loginConfig.value.is_site_captcha) && loginType.value == 'site') {
+                verifyRef.value.show()
+            } else {
+                loginFn()
+            }
         }
     })
 }
@@ -188,7 +199,6 @@ const loginFn = (data = {}) => {
 }
 
 .site-login-wrap {
-    background-image: url("@/app/assets/images/login/login_bg.jpg");
     background-repeat: no-repeat;
     background-size: cover;
 }
@@ -203,10 +213,9 @@ const loginFn = (data = {}) => {
     .el-form-item__error {
         top : 45px;
     }
-    
 
 }
-.formtwo .el-input__wrapper{
+.form-two .el-input__wrapper{
         // border: none !important;
         box-shadow: none !important;
         border-bottom: 1px solid #DCDEE0 !important;
@@ -218,4 +227,4 @@ const loginFn = (data = {}) => {
         display: none;
     }
 }
-</style>
\ No newline at end of file
+</style>
diff --git a/admin/src/app/views/marketing/components/sign-continue.vue b/admin/src/app/views/marketing/components/sign-continue.vue
index 6c5d3e28c..7f706d66e 100644
--- a/admin/src/app/views/marketing/components/sign-continue.vue
+++ b/admin/src/app/views/marketing/components/sign-continue.vue
@@ -38,6 +38,10 @@ const props = defineProps({
         default: () => {
             return {}
         }
+    },
+    sign_period: {
+        type: Number,
+        default: 0
     }
 })
 const emits = defineEmits(['update:modelValue'])
@@ -94,6 +98,8 @@ const formRules = reactive<FormRules>({
                     callback(t('continueSignFormatError'))
                 } else if (value < 2 || value > 365) {
                     callback(t('continueSignBerweenDays'))
+                } else if (Number(value) > Number(props.sign_period)) { 
+                    callback(t('continueSignMustLessThanSignPeriod')) // 添加这个校验
                 } else{
                     callback();
                 }
diff --git a/admin/src/app/views/marketing/components/verify-detail.vue b/admin/src/app/views/marketing/components/verify-detail.vue
index cbc847f05..3349edb67 100644
--- a/admin/src/app/views/marketing/components/verify-detail.vue
+++ b/admin/src/app/views/marketing/components/verify-detail.vue
@@ -40,7 +40,7 @@
                             </span>
                         </div>
                     </el-col>
-                     
+
                     <template v-for="(item,index) in verifyContentData.fixed">
                         <el-col :span="8">
                             <div class="flex items-center mt-[15px]" v-if="item.title">
@@ -150,7 +150,6 @@ const getVerifyDetailFn = async () => {
 }
 
 const setFormData = async (row: any = null) => {
-    console.log("setFormData",row);
     code = row.code;
     getVerifyDetailFn();
 }
diff --git a/admin/src/app/views/marketing/sign_config.vue b/admin/src/app/views/marketing/sign_config.vue
index e329b4523..ce83c960a 100644
--- a/admin/src/app/views/marketing/sign_config.vue
+++ b/admin/src/app/views/marketing/sign_config.vue
@@ -90,7 +90,7 @@
 
         <!-- 连签奖励 -->
         <el-dialog v-model="continueSignDialog" :title="t('continueSignTitle')" width="1200px" :destroy-on-close="true" v-if="formData.is_use">
-            <sign-continue ref="continueRef" v-model="continue_award" />
+            <sign-continue ref="continueRef" v-model="continue_award" :sign_period="formData.sign_period" />
             <template #footer>
                 <span class="dialog-footer">
                     <el-button @click="continueSignDialog = false">{{ t('cancel') }}</el-button>
@@ -141,7 +141,21 @@ const regExp: any = {
 // 表单验证规则
 const formRules = reactive<FormRules>({
     day_award: [
-        { required: true, message: t('daySignAwardPlaceholder'), trigger: 'change' }
+        { 
+            required: true,
+            trigger: 'change',
+            validator: (rule: any, value: any, callback: any) => {
+                let isVerify = false
+                daySignAwardText.value.forEach(item => {
+                    item.is_use && (isVerify = true)
+                })
+                if (!isVerify) {
+                    callback(t('daySignAwardPlaceholder'))
+                } else {
+                    callback()
+                }
+            }
+        }
     ],
     sign_period:[{
         required: true,
diff --git a/admin/src/app/views/marketing/verifier.vue b/admin/src/app/views/marketing/verifier.vue
index ba0578adf..e66df1eda 100644
--- a/admin/src/app/views/marketing/verifier.vue
+++ b/admin/src/app/views/marketing/verifier.vue
@@ -17,8 +17,8 @@
                     <el-table-column :label="t('memberInfo')" min-width="120">
                         <template #default="{ row }">
                             <div class="flex items-center cursor-pointer " @click="toMember(row.member.member_id)" v-if="row.member">
-                                <img class="w-[50px] h-[50px] mr-[10px]" v-if="row.member.headimg" :src="img(row.member.headimg)" alt="">
-                                <img class="w-[50px] h-[50px] mr-[10px] rounded-full" v-else src="@/app/assets/images/member_head.png" alt="">
+                                <img class="w-[50px] h-[50px] mr-[10px]" v-if="row.member.headimg" :src="img(row.member.headimg)" />
+                                <img class="w-[50px] h-[50px] mr-[10px] rounded-full" v-else src="@/app/assets/images/member_head.png" />
                                 <div class="flex flex-col">
                                     <span>{{ row.member.nickname || '' }}</span>
                                     <span>{{ row.member.mobile || '' }}</span>
@@ -30,17 +30,16 @@
                     <el-table-column :label="t('verifyType')" min-width="120">
                         <template #default="{ row }">
                             <div class="flex flex-col">
-                                <div v-for="(item, key) in row.verify_type_array" class="my-[3px]" :key="key">
-                                    {{ item.verify_type_name }}
-                                </div>
+                                <div v-for="(item, key) in row.verify_type_array" class="my-[3px]" :key="key">{{ item.verify_type_name }}</div>
                             </div>
                         </template>
                     </el-table-column>
 
-                    <el-table-column :label="t('createTime')" prop="create_time" min-width="120" />
+                    <el-table-column :label="t('createTime')" prop="create_time" min-width="120"/>
 
-                    <el-table-column :label="t('operation')" fixed="right" align="right" width="100">
+                    <el-table-column :label="t('operation')" fixed="right" align="right" width="120">
                         <template #default="{ row }">
+                            <el-button type="primary" link @click="editEvent(row)">{{ t('edit') }}</el-button>
                             <el-button type="primary" link @click="deleteEvent(row.id)">{{ t('delete') }}</el-button>
                         </template>
                     </el-table-column>
@@ -48,8 +47,8 @@
 
                 <div class="mt-[16px] flex justify-end">
                     <el-pagination v-model:current-page="verifierTable.page" v-model:page-size="verifierTable.limit"
-                        layout="total, sizes, prev, pager, next, jumper" :total="verifierTable.total"
-                        @size-change="loadVerifierList()" @current-change="loadVerifierList" />
+                                   layout="total, sizes, prev, pager, next, jumper" :total="verifierTable.total"
+                                   @size-change="loadVerifierList()" @current-change="loadVerifierList"/>
                 </div>
             </div>
         </el-card>
@@ -57,13 +56,13 @@
         <el-dialog v-model="showDialog" :title="t('addVerifier')" width="500px" :destroy-on-close="true">
             <el-form :model="formData" label-width="90px" ref="formRef" :rules="formRules" class="page-form" v-loading="addLoading">
                 <el-form-item :label="t('member')" prop="member_id">
-                    <el-select v-model="formData.member_id" filterable remote reserve-keyword clearable :placeholder="t('searchPlaceholder')" :remote-method="searchMember" :loading="searchLoading" class="input-width">
-                        <el-option v-for="item in memberList" :key="item.member_id" :label="item.nickname" :value="item.member_id" />
+                    <el-select v-model="formData.member_id" filterable remote reserve-keyword clearable @focus="handleSelectFocus" :disabled="isEditMode" :placeholder="t('searchPlaceholder')" :remote-method="searchMember" :loading="searchLoading" class="input-width">
+                        <el-option v-for="item in memberList" :key="item.member_id" :label="item.nickname" :value="item.member_id"/>
                     </el-select>
                 </el-form-item>
                 <el-form-item :label="t('verifyType')" prop="verify_type">
-                    <el-select v-model="formData.verify_type" multiple collapse-tags clearable :placeholder="t('verifyTypePlaceholder')" class="input-width">
-                        <el-option v-for="(item, index) in verifyTypeList" :key="index" :label="item.name" :value="index" />
+                    <el-select v-model="formData.verify_type" multiple clearable :placeholder="t('verifyTypePlaceholder')" class="input-width">
+                        <el-option v-for="(item, index) in verifyTypeList" :key="index" :label="item.name" :value="index"/>
                     </el-select>
                 </el-form-item>
             </el-form>
@@ -79,10 +78,17 @@
 </template>
 
 <script lang="ts" setup>
-import { reactive, ref } from 'vue'
+import { reactive, ref, nextTick } from 'vue'
 import { t } from '@/lang'
 import { useRouter, useRoute } from 'vue-router'
-import { getVerifierList, deleteVerifier, addVerifier, getVerifyTypeList } from '@/app/api/verify'
+import {
+    getVerifierList,
+    deleteVerifier,
+    addVerifier,
+    getVerifyTypeList,
+    getVerifyInfo,
+    editVerifier
+} from '@/app/api/verify'
 import { getMemberList } from '@/app/api/member'
 import { ElMessageBox, FormInstance } from 'element-plus'
 import { img } from '@/utils/common'
@@ -95,12 +101,15 @@ const showDialog = ref(false)
 const addLoading = ref(false)
 const formData: Record<string, any> = reactive({
     member_id: '',
-    verify_type: '',
+    verify_type: ''
 })
 
 const formRules = reactive({
     member_id: [
         { required: true, message: t('memberIdPlaceholder'), trigger: 'blur' }
+    ],
+    verify_type: [
+        { required: true, message: t('verifyTypePlaceholder'), trigger: 'blur' }
     ]
 })
 const formRef = ref<FormInstance>()
@@ -137,10 +146,44 @@ loadVerifierList()
 /**
  * 添加核销员表
  */
+const isEditMode = ref(false);
 const addEvent = () => {
+    isEditMode.value = false
+    formData.member_id = ''
+    formData.id = ''
+    formData.verify_type = ''
     showDialog.value = true
 }
 
+const editEvent = async (row: any) => {
+    isEditMode.value = true
+    formData.member_id = ''
+    formData.verify_type = ''
+    memberList.value = []
+
+    try {
+        const res = await getVerifyInfo(row.id)
+        memberList.value = [{
+            member_id: res.data.member.member_id,
+            nickname: res.data.member.nickname
+        }]
+
+        nextTick(() => {
+            formData.member_id = res.data.member.member_id
+            formData.verify_type = res.data.verify_type
+            formData.id = row.id
+            showDialog.value = true
+        })
+    } catch (error) {
+    }
+}
+
+const handleSelectFocus = () => {
+    if (isEditMode.value && formData.member_id && memberList.value.length === 0) {
+        searchMember('')
+    }
+}
+
 /**
  * 删除核销员表
  */
@@ -168,8 +211,8 @@ const addVerifiers = async (formEl: FormInstance | undefined) => {
     await formEl.validate(async (valid) => {
         if (valid) {
             addLoading.value = true
-
-            addVerifier(formData).then(res => {
+            const api = formData.id ? editVerifier : addVerifier
+            api(formData).then(res => {
                 addLoading.value = false
                 showDialog.value = false
                 formData.member_id = ''
@@ -193,7 +236,7 @@ const searchMember = (query: string) => {
         getMemberList({ keyword: query }).then(res => {
             memberList.value = res.data.data
             searchLoading.value = false
-        }).catch()
+        })
     } else {
         memberList.value = []
         searchLoading.value = false
@@ -207,17 +250,16 @@ const verifyTypeList = ref<any>([])
 const setVerifyTypeList = () => {
     getVerifyTypeList().then(res => {
         verifyTypeList.value = res.data
-    }).catch()
+    })
 }
-setVerifyTypeList();
+setVerifyTypeList()
 
 /**
  * 会员详情
  */
 const toMember = (member_id: number) => {
-    router.push(`/member/detail?id=${member_id}`)
+    router.push(`/member/detail?id=${ member_id }`)
 }
-
 </script>
 
 <style lang="scss" scoped></style>
diff --git a/admin/src/app/views/marketing/verify.vue b/admin/src/app/views/marketing/verify.vue
index b38869480..fba962b8b 100644
--- a/admin/src/app/views/marketing/verify.vue
+++ b/admin/src/app/views/marketing/verify.vue
@@ -64,7 +64,7 @@
                         @size-change="loadRecordList()" @current-change="loadRecordList" />
                 </div>
             </div>
-            
+
             <verify-detail ref="verifyDetailDialog" />
         </el-card>
     </div>
@@ -73,14 +73,12 @@
 <script lang="ts" setup>
 import { reactive, ref } from 'vue'
 import { t } from '@/lang'
-import { useRoute, useRouter } from 'vue-router'
+import { useRoute } from 'vue-router'
 import { FormInstance } from 'element-plus'
 import { getVerifyRecord, getVerifyTypeList, getVerifierSelect } from '@/app/api/verify'
 import verifyDetail from '@/app/views/marketing/components/verify-detail.vue'
-import { img } from '@/utils/common'
 
 const route = useRoute()
-const router = useRouter()
 const pageName = route.meta.title
 
 const recordTable = reactive({
diff --git a/admin/src/app/views/member/components/detail-member.vue b/admin/src/app/views/member/components/detail-member.vue
index 35d210fc2..acd1f0ddd 100644
--- a/admin/src/app/views/member/components/detail-member.vue
+++ b/admin/src/app/views/member/components/detail-member.vue
@@ -237,7 +237,7 @@
                 </div>
             </div>
         </div>
-        
+
         <point-edit ref="pointDialog" @complete="getMemberInfoFn" />
         <balance-edit ref="balanceDialog" @complete="getMemberInfoFn" />
         <edit-member ref="editMemberDialog" @complete="getMemberInfoFn()" />
@@ -245,33 +245,24 @@
 </template>
 
 <script lang="ts" setup>
-import { reactive, ref, computed } from 'vue'
+import { reactive, ref } from 'vue'
 import { t } from '@/lang'
-import { addMember, getMemberList, getMemberNo, getMemberInfo } from '@/app/api/member'
+import { getMemberInfo } from '@/app/api/member'
 import { FormInstance, ElMessage } from 'element-plus'
-import { ArrowLeft } from '@element-plus/icons-vue'
-import { useRouter, useRoute } from 'vue-router'
-import { img, filterNumber } from '@/utils/common'
+import { useRouter } from 'vue-router'
+import { img } from '@/utils/common'
 import PointEdit from '@/app/views/member/components/member-point-edit.vue'
 import BalanceEdit from '@/app/views/member/components/member-balance-edit.vue'
 import EditMember from '@/app/views/member/components/edit-member.vue'
-import useAppStore from '@/stores/modules/app'
 
 const showDialog = ref(false)
 const loading = ref(false)
-const repeat = ref(false)
 let popTitle: string = '会员详情'
-let memberNo: string = ''
 let id = '';
 
-const route = useRoute()
 const router = useRouter()
 const emit = defineEmits(['load'])
 
-const nickname_name_input = ref(true)
-const password_input = ref(true)
-const password_copy_input = ref(true)
-
 const handleClose = (done: () => void) => {
     showDialog.value = false;
 }
@@ -290,8 +281,6 @@ const initialFormData = {
 }
 const formData: Record<string, any> = reactive({ ...initialFormData })
 
-const formRef = ref<FormInstance>()
-
 const pointDialog: Record<string, any> | null = ref(null)
 const balanceDialog: Record<string, any> | null = ref(null)
 const editMemberDialog: Record<string, any> | null = ref(null)
diff --git a/admin/src/app/views/member/components/member-balance-info.vue b/admin/src/app/views/member/components/member-balance-info.vue
index 01ab8a2b1..824672507 100644
--- a/admin/src/app/views/member/components/member-balance-info.vue
+++ b/admin/src/app/views/member/components/member-balance-info.vue
@@ -9,7 +9,7 @@
                 </div>
             </el-form-item>
 
-			<el-form-item :label="t('memberId')" >
+            <el-form-item :label="t('memberId')" >
                 <div class="input-width"> {{ formData.member.member_no }} </div>
             </el-form-item>
 
diff --git a/admin/src/app/views/member/components/member-point-info.vue b/admin/src/app/views/member/components/member-point-info.vue
index 1a8cbb84a..442cb1905 100644
--- a/admin/src/app/views/member/components/member-point-info.vue
+++ b/admin/src/app/views/member/components/member-point-info.vue
@@ -9,7 +9,7 @@
                 </div>
             </el-form-item>
 
-			<el-form-item :label="t('memberId')" >
+            <el-form-item :label="t('memberId')" >
                 <div class="input-width"> {{ formData.member.member_no }} </div>
             </el-form-item>
 
diff --git a/admin/src/app/views/member/member.vue b/admin/src/app/views/member/member.vue
index 636887015..d44f777b6 100644
--- a/admin/src/app/views/member/member.vue
+++ b/admin/src/app/views/member/member.vue
@@ -135,7 +135,7 @@ import { t } from '@/lang'
 import { img } from '@/utils/common'
 import { getRegisterChannelType, getMemberList, getMemberLabelAll, editMemberStatus, deleteMember, getMemberLevelAll } from '@/app/api/member'
 import { ElMessageBox, FormInstance } from 'element-plus'
-import { useRouter, useRoute } from 'vue-router'
+import { useRoute } from 'vue-router'
 import AddMember from '@/app/views/member/components/add-member.vue'
 import detailMember from '@/app/views/member/components/detail-member.vue'
 import EditMember from '@/app/views/member/components/edit-member.vue'
@@ -205,7 +205,6 @@ const loadMemberList = (page: number = 1) => {
 }
 loadMemberList()
 
-const router = useRouter()
 const addMemberDialog: Record<string, any> | null = ref(null)
 const editMemberDialog: Record<string, any> | null = ref(null)
 const detailMemberDialog: Record<string, any> | null = ref(null)
diff --git a/admin/src/app/views/member/member_detail.vue b/admin/src/app/views/member/member_detail.vue
index 42f6081fd..c4f2555b6 100644
--- a/admin/src/app/views/member/member_detail.vue
+++ b/admin/src/app/views/member/member_detail.vue
@@ -33,9 +33,7 @@
                                 <el-statistic :value="formData.point">
                                     <template #title>
                                         <div style="display: inline-flex; align-items: center">
-                                            <span class="text-[14px]">
-                                                {{ t('point') }}
-                                            </span>
+                                            <span class="text-[14px]">{{ t('point') }}</span>
                                             <el-tooltip effect="dark" :content="t('adjust')" placement="top">
                                                 <el-icon @click="adjustPoint(formData)" class="ml-2 cursor-pointer" :size="12">
                                                     <EditPen color="#273CE2" />
@@ -64,9 +62,7 @@
                                 <el-statistic :value="formData.balance">
                                     <template #title>
                                         <div style="display: inline-flex; align-items: center">
-                                            <span class="text-[14px]">
-                                                {{ t('balance') }}
-                                            </span>
+                                            <span class="text-[14px]">{{ t('balance') }}</span>
                                             <el-tooltip effect="dark" :content="t('adjust')" placement="top">
                                                 <el-icon @click="adjustBalance(formData)" class="ml-2 cursor-pointer" :size="12">
                                                     <EditPen color="#273CE2" />
@@ -83,9 +79,7 @@
                                 <div class="statistic-footer">
                                     <div class="footer-item text-[14px] text-secondary">
                                         <span>{{ t('accumulative') }}</span>
-                                        <span class="red ml-1">
-                                            {{ formData.balance_get }}
-                                        </span>
+                                        <span class="red ml-1">{{ formData.balance_get }}</span>
                                     </div>
                                 </div>
                             </div>
@@ -95,9 +89,7 @@
                                 <el-statistic :value="formData.growth">
                                     <template #title>
                                         <div style="display: inline-flex; align-items: center">
-                                            <span class="text-[14px]">
-                                                {{ t('growth') }}
-                                            </span>
+                                            <span class="text-[14px]">{{ t('growth') }}</span>
 <!--                                            <el-tooltip effect="dark" :content="t('adjust')" placement="top">-->
 <!--                                                <el-icon @click="adjustGrowth(formData)" class="ml-2 cursor-pointer" :size="12">-->
 <!--                                                    <EditPen color="#273CE2" />-->
@@ -118,9 +110,7 @@
                                 <el-statistic :value="formData.money" title="New transactions today">
                                     <template #title>
                                         <div style="display: inline-flex; align-items: center">
-                                            <span class="text-[14px]">
-                                                {{ t("money") }}
-                                            </span>
+                                            <span class="text-[14px]">{{ t("money") }}</span>
                                             <el-tooltip effect="dark" :content="t('detail')" placement="top">
                                                 <el-icon @click="infoBalance(formData)" class="ml-2 cursor-pointer" :size="12">
                                                     <View />
@@ -132,9 +122,7 @@
                                 <div class="statistic-footer">
                                     <div class="footer-item text-[14px] text-secondary">
                                         <span>{{ t('accumulative') }}</span>
-                                        <span class="green ml-1">
-                                            {{ formData.money_get }}
-                                        </span>
+                                        <span class="green ml-1">{{ formData.money_get }}</span>
                                     </div>
                                 </div>
                             </div>
@@ -144,9 +132,7 @@
                                 <el-statistic :value="formData.commission" title="New transactions today">
                                     <template #title>
                                         <div style="display: inline-flex; align-items: center ">
-                                            <span class="text-[14px]">
-                                                {{ t("commission") }}
-                                            </span>
+                                            <span class="text-[14px]">{{ t("commission") }}</span>
                                             <el-tooltip effect="dark" :content="t('detail')" placement="top">
                                                 <el-icon @click="infoCommission(formData)" class="ml-2 cursor-pointer" :size="12">
                                                     <View />
@@ -158,9 +144,7 @@
                                 <div class="statistic-footer">
                                     <div class="footer-item text-[14px] text-secondary">
                                         <span>{{ t('accumulative') }}</span>
-                                        <span class="green ml-1">
-                                            {{ formData.commission_get }}
-                                        </span>
+                                        <span class="green ml-1">{{ formData.commission_get }}</span>
                                     </div>
                                 </div>
                             </div>
@@ -172,22 +156,16 @@
         <el-card class="box-card !border-none" shadow="never">
             <div class="flex items-center mt-[15px]">
                 <span class="text-[14px] w-[130px] text-right mr-[20px]">{{ t('urserName') }}</span>
-                <span class="text-[14px] text-[#666666]">
-                    {{ formData.username || t('notAvailable') }}
-                </span>
+                <span class="text-[14px] text-[#666666]">{{ formData.username || t('notAvailable') }}</span>
             </div>
             <div class="flex items-center mt-[15px]">
                 <span class="text-[14px] w-[130px] text-right mr-[20px]">{{ t('nickname') }}</span>
-                <span class="text-[14px] text-[#666666]">
-                    {{ formData.nickname || t('notAvailable') }}
-                </span>
+                <span class="text-[14px] text-[#666666]">{{ formData.nickname || t('notAvailable') }}</span>
             </div>
 
             <div class="flex items-center mt-[15px]">
                 <span class="text-[14px] w-[130px] text-right mr-[20px]">{{ t('mobile') }}</span>
-                <span class="text-[14px] text-[#666666]">
-                    {{ formData.mobile || t('notAvailable') }}
-                </span>
+                <span class="text-[14px] text-[#666666]">{{ formData.mobile || t('notAvailable') }}</span>
             </div>
             <div class="flex items-center mt-[15px]">
                 <span class="text-[14px] w-[130px] text-right mr-[20px]">{{ t('memberLevel') }}</span>
@@ -276,12 +254,10 @@ import { img } from '@/utils/common'
 import PointEdit from '@/app/views/member/components/member-point-edit.vue'
 import BalanceEdit from '@/app/views/member/components/member-balance-edit.vue'
 import EditMember from '@/app/views/member/components/edit-member.vue'
-import useAppStore from '@/stores/modules/app'
 
 const route = useRoute()
 const pageName = route.meta.title
 
-const appStore = useAppStore()
 const loading = ref(true)
 
 // 获取会员信息
diff --git a/admin/src/app/views/poster/components/edit-draw.vue b/admin/src/app/views/poster/components/edit-draw.vue
index 7ccae935b..d8fe1eff0 100644
--- a/admin/src/app/views/poster/components/edit-draw.vue
+++ b/admin/src/app/views/poster/components/edit-draw.vue
@@ -1,11 +1,11 @@
 <template>
-	<!-- 属性内容 -->
-	<div class="content-wrap">
+    <!-- 属性内容 -->
+    <div class="content-wrap">
 
-		<!-- 组件公共属性 -->
-		 <slot name="common"></slot>
+        <!-- 组件公共属性 -->
+        <slot name="common"></slot>
 
-	</div>
+    </div>
 </template>
 
 <script lang="ts" setup>
diff --git a/admin/src/app/views/poster/components/edit-friendspay-message.vue b/admin/src/app/views/poster/components/edit-friendspay-message.vue
index 39ea162a7..d8fe1eff0 100644
--- a/admin/src/app/views/poster/components/edit-friendspay-message.vue
+++ b/admin/src/app/views/poster/components/edit-friendspay-message.vue
@@ -1,11 +1,11 @@
 <template>
-	<!-- 属性内容 -->
-	<div class="content-wrap">
+    <!-- 属性内容 -->
+    <div class="content-wrap">
 
-		<!-- 组件公共属性 -->
-		<slot name="common"></slot>
+        <!-- 组件公共属性 -->
+        <slot name="common"></slot>
 
-	</div>
+    </div>
 </template>
 
 <script lang="ts" setup>
diff --git a/admin/src/app/views/poster/components/edit-friendspay-money.vue b/admin/src/app/views/poster/components/edit-friendspay-money.vue
index 39ea162a7..d8fe1eff0 100644
--- a/admin/src/app/views/poster/components/edit-friendspay-money.vue
+++ b/admin/src/app/views/poster/components/edit-friendspay-money.vue
@@ -1,11 +1,11 @@
 <template>
-	<!-- 属性内容 -->
-	<div class="content-wrap">
+    <!-- 属性内容 -->
+    <div class="content-wrap">
 
-		<!-- 组件公共属性 -->
-		<slot name="common"></slot>
+        <!-- 组件公共属性 -->
+        <slot name="common"></slot>
 
-	</div>
+    </div>
 </template>
 
 <script lang="ts" setup>
diff --git a/admin/src/app/views/poster/components/edit-headimg.vue b/admin/src/app/views/poster/components/edit-headimg.vue
index b733dab33..8258f2097 100644
--- a/admin/src/app/views/poster/components/edit-headimg.vue
+++ b/admin/src/app/views/poster/components/edit-headimg.vue
@@ -1,22 +1,26 @@
 <template>
-	<!-- 属性内容 -->
-	<div class="content-wrap">
+    <!-- 属性内容 -->
+    <div class="content-wrap">
 
-		<div class="edit-attr-item-wrap">
-			<div class="mb-[10px] text-sm text-primary">{{ t('needLoginTips') }}</div>
-		</div>
+        <div class="edit-attr-item-wrap">
+            <div class="mb-[10px] text-sm text-primary">{{ t('needLoginTips') }}</div>
+        </div>
 
-		<!-- 组件公共属性 -->
-		<slot name="common"></slot>    
+        <!-- 组件公共属性 -->
+        <slot name="common"></slot>
         <el-form label-width="80px" class="px-[10px]">
             <el-form-item :label="t('imgShape')">
                 <div class="flex items-center">
-                    <div class="bg-[#DFDFDF] cursor-pointer w-[50px] h-[50px] border-solid border-[1px] border-transparent rounded-[50%]" :class="{'border-[var(--el-color-primary)]': posterStore.editComponent.shape == 'circle'}" @click="imgShapeChangeFn('circle')"></div>
-                    <div class="bg-[#DFDFDF] cursor-pointer w-[50px] h-[50px] ml-[25px] border-solid border-[1px] border-transparent" :class="{'border-[var(--el-color-primary)]': posterStore.editComponent.shape == 'normal'}" @click="imgShapeChangeFn('normal')"></div>
+                    <div class="bg-[#DFDFDF] cursor-pointer w-[50px] h-[50px] border-solid border-[1px] border-transparent rounded-[50%]"
+                        :class="{'border-[var(--el-color-primary)]': posterStore.editComponent.shape == 'circle'}"
+                        @click="imgShapeChangeFn('circle')"></div>
+                    <div class="bg-[#DFDFDF] cursor-pointer w-[50px] h-[50px] ml-[25px] border-solid border-[1px] border-transparent"
+                        :class="{'border-[var(--el-color-primary)]': posterStore.editComponent.shape == 'normal'}"
+                        @click="imgShapeChangeFn('normal')"></div>
                 </div>
             </el-form-item>
         </el-form>
-	</div>
+    </div>
 </template>
 
 <script lang="ts" setup>
@@ -27,7 +31,7 @@ import usePosterStore from '@/stores/modules/poster'
 const posterStore = usePosterStore()
 
 // 图片形状改变
-const imgShapeChangeFn = (data)=>{
+const imgShapeChangeFn = (data) => {
     posterStore.editComponent.shape = data;
 }
 
diff --git a/admin/src/app/views/poster/components/edit-image.vue b/admin/src/app/views/poster/components/edit-image.vue
index bf25c14d2..2acef1c09 100644
--- a/admin/src/app/views/poster/components/edit-image.vue
+++ b/admin/src/app/views/poster/components/edit-image.vue
@@ -1,21 +1,21 @@
 <template>
-	<!-- 属性内容 -->
-	<div class="content-wrap">
-		<div class="edit-attr-item-wrap">
-			<el-form label-width="80px" class="px-[10px]">
-				<el-form-item :label="t('image')">
-					<upload-image v-model="posterStore.editComponent.value" :limit="1"/>
-				</el-form-item>
-			</el-form>
-		</div>
+    <!-- 属性内容 -->
+    <div class="content-wrap">
+        <div class="edit-attr-item-wrap">
+            <el-form label-width="80px" class="px-[10px]">
+                <el-form-item :label="t('image')">
+                    <upload-image v-model="posterStore.editComponent.value" :limit="1" />
+                </el-form-item>
+            </el-form>
+        </div>
 
-		<!-- 组件公共属性 -->
-		<slot name="common"></slot>
-	</div>
+        <!-- 组件公共属性 -->
+        <slot name="common"></slot>
+    </div>
 </template>
 
 <script lang="ts" setup>
-import { ref,watch } from 'vue'
+import { ref, watch } from 'vue'
 import { t } from '@/lang'
 import { img } from '@/utils/common'
 import usePosterStore from '@/stores/modules/poster'
@@ -39,7 +39,7 @@ watch(
         // 设置图片宽高
         const image = new Image()
         image.src = img(posterStore.editComponent.value)
-        image.onload = async () => {
+        image.onload = async() => {
             posterStore.editComponent.imgWidth = image.width
             posterStore.editComponent.imgHeight = image.height
         }
diff --git a/admin/src/app/views/poster/components/edit-nickname.vue b/admin/src/app/views/poster/components/edit-nickname.vue
index 34317f8ba..7213aab34 100644
--- a/admin/src/app/views/poster/components/edit-nickname.vue
+++ b/admin/src/app/views/poster/components/edit-nickname.vue
@@ -1,15 +1,15 @@
 <template>
-	<!-- 属性内容 -->
-	<div class="content-wrap">
+    <!-- 属性内容 -->
+    <div class="content-wrap">
 
-		<div class="edit-attr-item-wrap">
-			<div class="mb-[10px] text-sm text-primary">{{ t('needLoginTips') }}</div>
-		</div>
+        <div class="edit-attr-item-wrap">
+            <div class="mb-[10px] text-sm text-primary">{{ t('needLoginTips') }}</div>
+        </div>
 
-		<!-- 组件公共属性 -->
-		<slot name="common"></slot>
+        <!-- 组件公共属性 -->
+        <slot name="common"></slot>
 
-	</div>
+    </div>
 </template>
 
 <script lang="ts" setup>
diff --git a/admin/src/app/views/poster/components/edit-page.vue b/admin/src/app/views/poster/components/edit-page.vue
index c4be3ebae..21a75bf6b 100644
--- a/admin/src/app/views/poster/components/edit-page.vue
+++ b/admin/src/app/views/poster/components/edit-page.vue
@@ -1,39 +1,39 @@
 <template>
-	<!-- 内容 -->
-	<div class="content-wrap">
-		<div class="edit-attr-item-wrap">
-			<h3 class="mb-[10px]">{{ t('pageContent') }}</h3>
-			<el-form label-width="80px" class="px-[10px]">
-				<el-form-item :label="t('posterName')">
-					<el-input v-model.trim="posterStore.name" :placeholder="t('posterNamePlaceholder')" clearable maxlength="12" show-word-limit/>
-				</el-form-item>
-				<el-form-item :label="t('bgType')">
-					<el-radio-group v-model="posterStore.global.bgType">
-						<el-radio :label="'url'">{{ t('bgUrl') }}</el-radio>
-						<el-radio :label="'color'">{{ t('bgColor') }}</el-radio>
-					</el-radio-group>
-				</el-form-item>
-				<el-form-item :label="t('bgUrl')" v-show="posterStore.global.bgType == 'url'">
-					<upload-image v-model="posterStore.global.bgUrl" :limit="1"/>
-					<div class="text-sm text-gray-400 mt-[10px]">{{ t('bgUrlTips') }}</div>
-				</el-form-item>
-				<el-form-item :label="t('bgColor')" v-show="posterStore.global.bgType == 'color'">
-					<el-color-picker v-model="posterStore.editComponent.bgColor" :predefine="posterStore.predefineColors" />
-				</el-form-item>
-				<el-form-item :label="t('statusLabel')" class="display-block">
-					<el-switch v-model="posterStore.status" :active-value="1" :inactive-value="0"/>
-					<div class="text-sm text-gray-400">{{ t('statusTips') }}</div>
-				</el-form-item>
-			</el-form>
+    <!-- 内容 -->
+    <div class="content-wrap">
+        <div class="edit-attr-item-wrap">
+            <h3 class="mb-[10px]">{{ t('pageContent') }}</h3>
+            <el-form label-width="80px" class="px-[10px]">
+                <el-form-item :label="t('posterName')">
+                    <el-input v-model.trim="posterStore.name" :placeholder="t('posterNamePlaceholder')" clearable maxlength="12" show-word-limit />
+                </el-form-item>
+                <el-form-item :label="t('bgType')">
+                    <el-radio-group v-model="posterStore.global.bgType">
+                        <el-radio :label="'url'">{{ t('bgUrl') }}</el-radio>
+                        <el-radio :label="'color'">{{ t('bgColor') }}</el-radio>
+                    </el-radio-group>
+                </el-form-item>
+                <el-form-item :label="t('bgUrl')" v-show="posterStore.global.bgType == 'url'">
+                    <upload-image v-model="posterStore.global.bgUrl" :limit="1" />
+                    <div class="text-sm text-gray-400 mt-[10px]">{{ t('bgUrlTips') }}</div>
+                </el-form-item>
+                <el-form-item :label="t('bgColor')" v-show="posterStore.global.bgType == 'color'">
+                    <el-color-picker v-model="posterStore.editComponent.bgColor" :predefine="posterStore.predefineColors" />
+                </el-form-item>
+                <el-form-item :label="t('statusLabel')" class="display-block">
+                    <el-switch v-model="posterStore.status" :active-value="1" :inactive-value="0" />
+                    <div class="text-sm text-gray-400">{{ t('statusTips') }}</div>
+                </el-form-item>
+            </el-form>
 
-		</div>
+        </div>
 
-	</div>
+    </div>
 </template>
 
 <script lang="ts" setup>
 import { t } from '@/lang'
-import { watch, ref } from 'vue'
+import { ref } from 'vue'
 import { img } from '@/utils/common'
 import usePosterStore from '@/stores/modules/poster'
 
diff --git a/admin/src/app/views/poster/components/edit-qrcode.vue b/admin/src/app/views/poster/components/edit-qrcode.vue
index 39ea162a7..d8fe1eff0 100644
--- a/admin/src/app/views/poster/components/edit-qrcode.vue
+++ b/admin/src/app/views/poster/components/edit-qrcode.vue
@@ -1,11 +1,11 @@
 <template>
-	<!-- 属性内容 -->
-	<div class="content-wrap">
+    <!-- 属性内容 -->
+    <div class="content-wrap">
 
-		<!-- 组件公共属性 -->
-		<slot name="common"></slot>
+        <!-- 组件公共属性 -->
+        <slot name="common"></slot>
 
-	</div>
+    </div>
 </template>
 
 <script lang="ts" setup>
diff --git a/admin/src/app/views/poster/components/edit-text.vue b/admin/src/app/views/poster/components/edit-text.vue
index fde8aaf2b..7ec9cbf1c 100644
--- a/admin/src/app/views/poster/components/edit-text.vue
+++ b/admin/src/app/views/poster/components/edit-text.vue
@@ -1,19 +1,19 @@
 <template>
-	<!-- 属性内容 -->
-	<div class="content-wrap">
-		<div class="edit-attr-item-wrap">
-			<h3 class="mb-[10px]">{{ t('textSet') }}</h3>
-			<el-form label-width="80px" class="px-[10px]">
-				<el-form-item :label="t('textLabel')">
-					<el-input v-model.trim="posterStore.editComponent.value" type="textarea" rows="4" :placeholder="t('textPlaceholder')" clearable maxlength="50" show-word-limit />
-				</el-form-item>
-			</el-form>
-		</div>
+    <!-- 属性内容 -->
+    <div class="content-wrap">
+        <div class="edit-attr-item-wrap">
+            <h3 class="mb-[10px]">{{ t('textSet') }}</h3>
+            <el-form label-width="80px" class="px-[10px]">
+                <el-form-item :label="t('textLabel')">
+                    <el-input v-model.trim="posterStore.editComponent.value" type="textarea" rows="4" :placeholder="t('textPlaceholder')" clearable maxlength="50" show-word-limit />
+                </el-form-item>
+            </el-form>
+        </div>
 
-		<!-- 组件公共属性 -->
-		 <slot name="common"></slot>
+        <!-- 组件公共属性 -->
+        <slot name="common"></slot>
 
-	</div>
+    </div>
 </template>
 
 <script lang="ts" setup>
diff --git a/admin/src/app/views/poster/components/preview-draw.vue b/admin/src/app/views/poster/components/preview-draw.vue
index ca12c3055..1395ea583 100644
--- a/admin/src/app/views/poster/components/preview-draw.vue
+++ b/admin/src/app/views/poster/components/preview-draw.vue
@@ -1,9 +1,9 @@
 <template>
-	<div class="overflow-hidden" :style="componentStyle"></div>
+    <div class="overflow-hidden" :style="componentStyle"></div>
 </template>
 
 <script lang="ts" setup>
-import { ref,computed } from 'vue'
+import { ref, computed } from 'vue'
 
 const prop = defineProps({
     value: {
@@ -12,17 +12,17 @@ const prop = defineProps({
     }
 })
 
-const data = computed(()=> {
+const data = computed(() => {
     return prop.value;
 })
 
-const componentStyle = computed(()=> {
+const componentStyle = computed(() => {
     var style = '';
-    style += `background-color: ${prop.value.bgColor};`;
-    style += `width: ${prop.value.width}px;height: ${prop.value.height}px;`;
+    style += `background-color: ${ prop.value.bgColor };`;
+    style += `width: ${ prop.value.width }px;height: ${ prop.value.height }px;`;
     let box: any = document.getElementById(prop.value.id)
     if (box) {
-        style += `width:${box.offsetWidth}px;height:${box.offsetHeight}px;`;
+        style += `width:${ box.offsetWidth }px;height:${ box.offsetHeight }px;`;
     }
     return style;
 })
diff --git a/admin/src/app/views/poster/components/preview-friendspay-message.vue b/admin/src/app/views/poster/components/preview-friendspay-message.vue
index 7de4d79bb..bd1789c43 100644
--- a/admin/src/app/views/poster/components/preview-friendspay-message.vue
+++ b/admin/src/app/views/poster/components/preview-friendspay-message.vue
@@ -1,9 +1,9 @@
 <template>
-	<div class="overflow-hidden" :style="componentStyle">{{ data.value }}</div>
+    <div class="overflow-hidden" :style="componentStyle">{{ data.value }}</div>
 </template>
 
 <script lang="ts" setup>
-import { ref,computed } from 'vue'
+import { ref, computed } from 'vue'
 import usePosterStore from '@/stores/modules/poster'
 
 const posterStore = usePosterStore()
@@ -15,27 +15,27 @@ const prop = defineProps({
     }
 })
 
-const data = computed(()=> {
+const data = computed(() => {
     return prop.value;
 })
 
-const componentStyle = computed(()=> {
+const componentStyle = computed(() => {
     var style = '';
-    style += `font-size: ${prop.value.fontSize}px;color: ${prop.value.fontColor};line-height: ${prop.value.lineHeight + prop.value.fontSize}px;`;
-    if(prop.value.x == 'left' || prop.value.x == 'center' || prop.value.x == 'right'){
-        style += `text-align: ${prop.value.x};`;
+    style += `font-size: ${ prop.value.fontSize }px;color: ${ prop.value.fontColor };line-height: ${ prop.value.lineHeight + prop.value.fontSize }px;`;
+    if (prop.value.x == 'left' || prop.value.x == 'center' || prop.value.x == 'right') {
+        style += `text-align: ${ prop.value.x };`;
     }
-    if(prop.value.weight){
+    if (prop.value.weight) {
         style += `font-weight: bold;`;
     }
-    if(!prop.value.fontFamily || prop.value.fontFamily == 'static/font/SourceHanSansCN-Regular.ttf'){
+    if (!prop.value.fontFamily || prop.value.fontFamily == 'static/font/SourceHanSansCN-Regular.ttf') {
         style += `font-family: poster_default_font;`;
     }
     let box: any = document.getElementById(prop.value.id)
     if (box) {
-        style += `width:${box.offsetWidth}px;height:${box.offsetHeight}px;`;
-    }else{
-        style += `width:${prop.value.width}px;height:${prop.value.height}px;`;
+        style += `width:${ box.offsetWidth }px;height:${ box.offsetHeight }px;`;
+    } else {
+        style += `width:${ prop.value.width }px;height:${ prop.value.height }px;`;
     }
     return style;
 })
diff --git a/admin/src/app/views/poster/components/preview-friendspay-money.vue b/admin/src/app/views/poster/components/preview-friendspay-money.vue
index 7de4d79bb..bd1789c43 100644
--- a/admin/src/app/views/poster/components/preview-friendspay-money.vue
+++ b/admin/src/app/views/poster/components/preview-friendspay-money.vue
@@ -1,9 +1,9 @@
 <template>
-	<div class="overflow-hidden" :style="componentStyle">{{ data.value }}</div>
+    <div class="overflow-hidden" :style="componentStyle">{{ data.value }}</div>
 </template>
 
 <script lang="ts" setup>
-import { ref,computed } from 'vue'
+import { ref, computed } from 'vue'
 import usePosterStore from '@/stores/modules/poster'
 
 const posterStore = usePosterStore()
@@ -15,27 +15,27 @@ const prop = defineProps({
     }
 })
 
-const data = computed(()=> {
+const data = computed(() => {
     return prop.value;
 })
 
-const componentStyle = computed(()=> {
+const componentStyle = computed(() => {
     var style = '';
-    style += `font-size: ${prop.value.fontSize}px;color: ${prop.value.fontColor};line-height: ${prop.value.lineHeight + prop.value.fontSize}px;`;
-    if(prop.value.x == 'left' || prop.value.x == 'center' || prop.value.x == 'right'){
-        style += `text-align: ${prop.value.x};`;
+    style += `font-size: ${ prop.value.fontSize }px;color: ${ prop.value.fontColor };line-height: ${ prop.value.lineHeight + prop.value.fontSize }px;`;
+    if (prop.value.x == 'left' || prop.value.x == 'center' || prop.value.x == 'right') {
+        style += `text-align: ${ prop.value.x };`;
     }
-    if(prop.value.weight){
+    if (prop.value.weight) {
         style += `font-weight: bold;`;
     }
-    if(!prop.value.fontFamily || prop.value.fontFamily == 'static/font/SourceHanSansCN-Regular.ttf'){
+    if (!prop.value.fontFamily || prop.value.fontFamily == 'static/font/SourceHanSansCN-Regular.ttf') {
         style += `font-family: poster_default_font;`;
     }
     let box: any = document.getElementById(prop.value.id)
     if (box) {
-        style += `width:${box.offsetWidth}px;height:${box.offsetHeight}px;`;
-    }else{
-        style += `width:${prop.value.width}px;height:${prop.value.height}px;`;
+        style += `width:${ box.offsetWidth }px;height:${ box.offsetHeight }px;`;
+    } else {
+        style += `width:${ prop.value.width }px;height:${ prop.value.height }px;`;
     }
     return style;
 })
diff --git a/admin/src/app/views/poster/components/preview-headimg.vue b/admin/src/app/views/poster/components/preview-headimg.vue
index fc9d39729..db8a63a50 100644
--- a/admin/src/app/views/poster/components/preview-headimg.vue
+++ b/admin/src/app/views/poster/components/preview-headimg.vue
@@ -1,11 +1,11 @@
 <template>
-	<div class="pointer-events-none max-w-[720px]" :style="componentStyle">
-		<img src="@/app/assets/images/default_headimg_square.jpg" class="w-full h-full" />
-	</div>
+    <div class="pointer-events-none max-w-[720px]" :style="componentStyle">
+        <img src="@/app/assets/images/default_headimg_square.jpg" class="w-full h-full" />
+    </div>
 </template>
 
 <script lang="ts" setup>
-import { ref,computed } from 'vue'
+import { ref, computed } from 'vue'
 import { img } from '@/utils/common'
 
 const prop = defineProps({
@@ -15,14 +15,14 @@ const prop = defineProps({
     }
 })
 
-const data = computed(()=> {
+const data = computed(() => {
     return prop.value;
 })
 
-const componentStyle = computed(()=> {
+const componentStyle = computed(() => {
     var style = '';
-    style += `width: ${prop.value.width}px;`;
-    if(prop.value.shape == 'circle'){
+    style += `width: ${ prop.value.width }px;`;
+    if (prop.value.shape == 'circle') {
         style += `border-radius: 50%; overflow: hidden;`;
     }
     return style;
diff --git a/admin/src/app/views/poster/components/preview-image.vue b/admin/src/app/views/poster/components/preview-image.vue
index 41ecf4f61..65bc6c3df 100644
--- a/admin/src/app/views/poster/components/preview-image.vue
+++ b/admin/src/app/views/poster/components/preview-image.vue
@@ -1,12 +1,12 @@
 <template>
-	<div class="pointer-events-none max-w-[720px]" :style="componentStyle">
-		<img v-if="data.value" :src="img(data.value)" class="w-full h-full" />
-		<img v-else :src="img('static/resource/images/diy/crack_figure.png')" class="w-full h-full" />
-	</div>
+    <div class="pointer-events-none max-w-[720px]" :style="componentStyle">
+        <img v-if="data.value" :src="img(data.value)" class="w-full h-full" />
+        <img v-else :src="img('static/resource/images/diy/crack_figure.png')" class="w-full h-full" />
+    </div>
 </template>
 
 <script lang="ts" setup>
-import { ref,computed } from 'vue'
+import { ref, computed } from 'vue'
 import { img } from '@/utils/common'
 
 const prop = defineProps({
@@ -16,13 +16,13 @@ const prop = defineProps({
     }
 })
 
-const data = computed(()=> {
+const data = computed(() => {
     return prop.value;
 })
 
-const componentStyle = computed(()=> {
+const componentStyle = computed(() => {
     var style = '';
-    style += `width: ${prop.value.width}px;`;
+    style += `width: ${ prop.value.width }px;`;
     return style;
 })
 
diff --git a/admin/src/app/views/poster/components/preview-nickname.vue b/admin/src/app/views/poster/components/preview-nickname.vue
index 1fa2dad8f..d63f66a25 100644
--- a/admin/src/app/views/poster/components/preview-nickname.vue
+++ b/admin/src/app/views/poster/components/preview-nickname.vue
@@ -1,9 +1,9 @@
 <template>
-	<div class="overflow-hidden" :style="componentStyle">会员昵称</div>
+    <div class="overflow-hidden" :style="componentStyle">会员昵称</div>
 </template>
 
 <script lang="ts" setup>
-import { ref,computed } from 'vue'
+import { ref, computed } from 'vue'
 import usePosterStore from '@/stores/modules/poster'
 
 const posterStore = usePosterStore()
@@ -15,27 +15,27 @@ const prop = defineProps({
     }
 })
 
-const data = computed(()=> {
+const data = computed(() => {
     return prop.value;
 })
 
-const componentStyle = computed(()=> {
+const componentStyle = computed(() => {
     var style = '';
-    style += `font-size: ${prop.value.fontSize}px;color: ${prop.value.fontColor};line-height: ${prop.value.lineHeight + prop.value.fontSize}px;`;
-    if(prop.value.x == 'left' || prop.value.x == 'center' || prop.value.x == 'right'){
-        style += `text-align: ${prop.value.x};`;
+    style += `font-size: ${ prop.value.fontSize }px;color: ${ prop.value.fontColor };line-height: ${ prop.value.lineHeight + prop.value.fontSize }px;`;
+    if (prop.value.x == 'left' || prop.value.x == 'center' || prop.value.x == 'right') {
+        style += `text-align: ${ prop.value.x };`;
     }
-    if(prop.value.weight){
+    if (prop.value.weight) {
         style += `font-weight: bold;`;
     }
-    if(!prop.value.fontFamily || prop.value.fontFamily == 'static/font/SourceHanSansCN-Regular.ttf'){
+    if (!prop.value.fontFamily || prop.value.fontFamily == 'static/font/SourceHanSansCN-Regular.ttf') {
         style += `font-family: poster_default_font;`;
     }
     let box: any = document.getElementById(prop.value.id)
     if (box) {
-        style += `width:${box.offsetWidth}px;height:${box.offsetHeight}px;`;
-    }else{
-        style += `width:${prop.value.width}px;height:${prop.value.height}px;`;
+        style += `width:${ box.offsetWidth }px;height:${ box.offsetHeight }px;`;
+    } else {
+        style += `width:${ prop.value.width }px;height:${ prop.value.height }px;`;
     }
     return style;
 })
diff --git a/admin/src/app/views/poster/components/preview-qrcode.vue b/admin/src/app/views/poster/components/preview-qrcode.vue
index b50fba8bb..a92953de5 100644
--- a/admin/src/app/views/poster/components/preview-qrcode.vue
+++ b/admin/src/app/views/poster/components/preview-qrcode.vue
@@ -1,11 +1,11 @@
 <template>
-	<div class="pointer-events-none max-w-[720px]" :style="componentStyle">
-		<img :src="img('static/resource/images/diy/qrcode.png')" class="w-full h-full" />
-	</div>
+    <div class="pointer-events-none max-w-[720px]" :style="componentStyle">
+        <img :src="img('static/resource/images/diy/qrcode.png')" class="w-full h-full" />
+    </div>
 </template>
 
 <script lang="ts" setup>
-import { ref,computed } from 'vue'
+import { ref, computed } from 'vue'
 import { img } from '@/utils/common'
 
 const prop = defineProps({
@@ -15,13 +15,13 @@ const prop = defineProps({
     }
 })
 
-const data = computed(()=> {
+const data = computed(() => {
     return prop.value;
 })
 
-const componentStyle = computed(()=> {
+const componentStyle = computed(() => {
     var style = '';
-    style += `width: ${prop.value.width}px;`;
+    style += `width: ${ prop.value.width }px;`;
     return style;
 })
 
diff --git a/admin/src/app/views/poster/components/preview-text.vue b/admin/src/app/views/poster/components/preview-text.vue
index 7de4d79bb..bd1789c43 100644
--- a/admin/src/app/views/poster/components/preview-text.vue
+++ b/admin/src/app/views/poster/components/preview-text.vue
@@ -1,9 +1,9 @@
 <template>
-	<div class="overflow-hidden" :style="componentStyle">{{ data.value }}</div>
+    <div class="overflow-hidden" :style="componentStyle">{{ data.value }}</div>
 </template>
 
 <script lang="ts" setup>
-import { ref,computed } from 'vue'
+import { ref, computed } from 'vue'
 import usePosterStore from '@/stores/modules/poster'
 
 const posterStore = usePosterStore()
@@ -15,27 +15,27 @@ const prop = defineProps({
     }
 })
 
-const data = computed(()=> {
+const data = computed(() => {
     return prop.value;
 })
 
-const componentStyle = computed(()=> {
+const componentStyle = computed(() => {
     var style = '';
-    style += `font-size: ${prop.value.fontSize}px;color: ${prop.value.fontColor};line-height: ${prop.value.lineHeight + prop.value.fontSize}px;`;
-    if(prop.value.x == 'left' || prop.value.x == 'center' || prop.value.x == 'right'){
-        style += `text-align: ${prop.value.x};`;
+    style += `font-size: ${ prop.value.fontSize }px;color: ${ prop.value.fontColor };line-height: ${ prop.value.lineHeight + prop.value.fontSize }px;`;
+    if (prop.value.x == 'left' || prop.value.x == 'center' || prop.value.x == 'right') {
+        style += `text-align: ${ prop.value.x };`;
     }
-    if(prop.value.weight){
+    if (prop.value.weight) {
         style += `font-weight: bold;`;
     }
-    if(!prop.value.fontFamily || prop.value.fontFamily == 'static/font/SourceHanSansCN-Regular.ttf'){
+    if (!prop.value.fontFamily || prop.value.fontFamily == 'static/font/SourceHanSansCN-Regular.ttf') {
         style += `font-family: poster_default_font;`;
     }
     let box: any = document.getElementById(prop.value.id)
     if (box) {
-        style += `width:${box.offsetWidth}px;height:${box.offsetHeight}px;`;
-    }else{
-        style += `width:${prop.value.width}px;height:${prop.value.height}px;`;
+        style += `width:${ box.offsetWidth }px;height:${ box.offsetHeight }px;`;
+    } else {
+        style += `width:${ prop.value.width }px;height:${ prop.value.height }px;`;
     }
     return style;
 })
diff --git a/admin/src/app/views/poster/edit.vue b/admin/src/app/views/poster/edit.vue
index 9e8140c1e..453fb077a 100644
--- a/admin/src/app/views/poster/edit.vue
+++ b/admin/src/app/views/poster/edit.vue
@@ -82,8 +82,7 @@
                                      :style="previewIframeStyle(item)"
                                      :class="{ 'selected' : posterStore.currentIndex == index }"
                                      @mousedown="posterStore.mouseDown($event,item.id,index)"
-                                     @click.stop="posterStore.changeCurrentIndex(index,item)"
-                                >
+                                     @click.stop="posterStore.changeCurrentIndex(index,item)">
                                     <component :is="modules['preview-' + item.path]" :value="item"/>
                                     <span class="box1" @mousedown.stop="posterStore.resizeMouseDown($event,item, index)"></span>
                                     <span class="box2" @mousedown.stop="posterStore.resizeMouseDown($event,item, index)"></span>
@@ -284,7 +283,7 @@ const previewIframeStyle = (data: any)=>{
             break;
         default:
             style.top = data.y + 'px'
-    } 
+    }
     switch(data.x) {
         case 'left':
             style.left = 0
@@ -299,7 +298,6 @@ const previewIframeStyle = (data: any)=>{
         default:
             style.left = data.x + 'px'
     }
-    // console.log(data.x,data.y)
     return style
 }
 
diff --git a/admin/src/app/views/printer/edit.vue b/admin/src/app/views/printer/edit.vue
index 8b4c6e021..be9e6b1d8 100644
--- a/admin/src/app/views/printer/edit.vue
+++ b/admin/src/app/views/printer/edit.vue
@@ -1,363 +1,373 @@
 <template>
-	<div class="main-container">
+    <div class="main-container">
         <el-card class="card !border-none mb-[15px]" shadow="never">
             <el-page-header :content="pageName" :icon="ArrowLeft" @back="back" />
         </el-card>
 
-		<el-form class="page-form" :model="formData" :rules="formRules" label-width="150px" ref="formRef" v-loading="loading">
-			<el-card class="box-card !border-none" shadow="never">
+        <el-form class="page-form" :model="formData" :rules="formRules" label-width="150px" ref="formRef"
+                 v-loading="loading">
+            <el-card class="box-card !border-none" shadow="never">
 
-				<h3 class="panel-title !text-sm">{{ t('printerSet') }}</h3>
+                <h3 class="panel-title !text-sm">{{ t('printerSet') }}</h3>
 
-				<el-form-item :label="t('printerName')" prop="printer_name">
-					<el-input v-model.trim="formData.printer_name" clearable :placeholder="t('printerNamePlaceholder')" class="input-width" maxlength="20" />
-				</el-form-item>
+                <el-form-item :label="t('printerName')" prop="printer_name">
+                    <el-input v-model.trim="formData.printer_name" clearable :placeholder="t('printerNamePlaceholder')" class="input-width" maxlength="20" />
+                </el-form-item>
 
-				<el-form-item :label="t('brand')" prop="brand">
-					<el-select v-model="formData.brand" :placeholder="t('brandPlaceholder')" clearable>
-						<el-option v-for="(item,key) in brandList" :key="key" :label="item" :value="key" />
-					</el-select>
-				</el-form-item>
+                <el-form-item :label="t('brand')" prop="brand">
+                    <el-select v-model="formData.brand" :placeholder="t('brandPlaceholder')" clearable>
+                        <el-option v-for="(item,key) in brandList" :key="key" :label="item" :value="key" />
+                    </el-select>
+                </el-form-item>
 
-				<el-form-item :label="t('printerCode')" prop="printer_code">
-					<div>
-						<el-input v-model.trim="formData.printer_code" clearable :placeholder="t('printerCodePlaceholder')" class="input-width" maxlength="30" />
-						<p class="text-[12px] text-[#b2b2b2]">{{ t('printerCodeTips') }}</p>
-					</div>
-				</el-form-item>
+                <el-form-item :label="t('printerCode')" prop="printer_code">
+                    <div>
+                        <el-input v-model.trim="formData.printer_code" clearable :placeholder="t('printerCodePlaceholder')" class="input-width" maxlength="30" />
+                        <p class="text-[12px] text-[#b2b2b2]">{{ t('printerCodeTips') }}</p>
+                    </div>
+                </el-form-item>
 
-				<el-form-item :label="t('printerKey')" prop="printer_key">
-					<div>
-						<el-input v-model.trim="formData.printer_key" clearable :placeholder="t('printerKeyPlaceholder')" class="input-width" maxlength="30" />
-						<p class="text-[12px] text-[#b2b2b2]">{{ t('printerKeyTips') }}</p>
-					</div>
-				</el-form-item>
+                <el-form-item :label="t('printerKey')" prop="printer_key">
+                    <div>
+                        <el-input v-model.trim="formData.printer_key" clearable :placeholder="t('printerKeyPlaceholder')" class="input-width" maxlength="30" />
+                        <p class="text-[12px] text-[#b2b2b2]">{{ t('printerKeyTips') }}</p>
+                    </div>
+                </el-form-item>
 
-				<el-form-item :label="t('openId')" prop="open_id">
-					<div>
-						<el-input v-model.trim="formData.open_id" clearable :placeholder="t('openIdPlaceholder')" class="input-width" maxlength="30" />
-						<p class="text-[12px] text-[#b2b2b2]">{{ t('openIdTips') }}</p>
-					</div>
-				</el-form-item>
+                <el-form-item :label="t('openId')" prop="open_id">
+                    <div>
+                        <el-input v-model.trim="formData.open_id" clearable :placeholder="t('openIdPlaceholder')" class="input-width" maxlength="30" />
+                        <p class="text-[12px] text-[#b2b2b2]">{{ t('openIdTips') }}</p>
+                    </div>
+                </el-form-item>
 
-				<el-form-item :label="t('apikey')" prop="apikey">
-					<div>
-						<el-input v-model.trim="formData.apikey" clearable :placeholder="t('apikeyPlaceholder')" class="input-width" maxlength="60" />
-						<p class="text-[12px] text-[#b2b2b2]">{{ t('apikeyTips') }}</p>
-					</div>
-				</el-form-item>
+                <el-form-item :label="t('apikey')" prop="apikey">
+                    <div>
+                        <el-input v-model.trim="formData.apikey" clearable :placeholder="t('apikeyPlaceholder')" class="input-width" maxlength="60" />
+                        <p class="text-[12px] text-[#b2b2b2]">{{ t('apikeyTips') }}</p>
+                    </div>
+                </el-form-item>
 
-				<el-form-item :label="t('printWidth')" prop="print_width">
-					<el-radio-group v-model="formData.print_width">
-						<el-radio label="58mm">58mm</el-radio>
-					</el-radio-group>
-				</el-form-item>
+                <el-form-item :label="t('printWidth')" prop="print_width">
+                    <el-radio-group v-model="formData.print_width">
+                        <el-radio label="58mm">58mm</el-radio>
+                    </el-radio-group>
+                </el-form-item>
 
-				<el-form-item :label="t('status')">
-					<el-switch v-model="formData.status" :active-value="1" :inactive-value="0" />
-				</el-form-item>
+                <el-form-item :label="t('status')">
+                    <el-switch v-model="formData.status" :active-value="1" :inactive-value="0" />
+                </el-form-item>
 
-			</el-card>
-			<el-card v-for="(item,index) in printerType" :key="item.key" class="box-card !border-none" shadow="never">
-				<h3 class="panel-title !text-sm">{{ item.title }}</h3>
+            </el-card>
+            <el-card v-for="(item,index) in printerType" :key="item.key" class="box-card !border-none" shadow="never">
+                <h3 class="panel-title !text-sm">{{ item.title }}</h3>
 
-				<div class="flex mb-[10px] py-[8px] bg-[#F5F7F9] text-[14px]">
-					<div class="px-[12px] w-[200px]">{{ t('printTrigger') }}</div>
-					<div class="px-[12px] w-[100px]">{{ t('status') }}</div>
-					<div class="px-[12px] w-[250px]">{{ t('usePrintTemplate') }}</div>
-					<div class="px-[12px] w-[300px] flex-1" v-for="childItem in item.condition" :key="childItem.key">{{ childItem.title }}</div>
-					<div class="px-[12px] w-[200px]">{{ t('printNum') }}</div>
-				</div>
+                <div class="flex mb-[10px] py-[8px] bg-[#F5F7F9] text-[14px]">
+                    <div class="px-[12px] w-[200px]">{{ t('printTrigger') }}</div>
+                    <div class="px-[12px] w-[100px]">{{ t('status') }}</div>
+                    <div class="px-[12px] w-[250px]">{{ t('usePrintTemplate') }}</div>
+                    <div class="px-[12px] w-[300px] flex-1" v-for="childItem in item.condition" :key="childItem.key">{{ childItem.title }}</div>
+                    <div class="px-[12px] w-[200px]">{{ t('printNum') }}</div>
+                </div>
 
-				<template v-if="item.trigger">
-					<div class="flex bg-[#f8f8f9] mb-[10px] py-[20px]" v-for="(triggerItem,triggerKey) in item.trigger" :key="triggerKey">
-						<template v-if="formData.value[item.key]['trigger_' + triggerKey]">
-							<div class="font-bold w-[200px] px-[12px]">{{ triggerItem }}</div>
-							<div class="w-[100px] px-[12px]">
-								<el-switch v-model="formData.value[item.key]['trigger_' + triggerKey].status" :active-value="1" :inactive-value="0" />
-							</div>
-							<div class="w-[250px] px-[12px]">
-								<el-select v-model="formData.value[item.key]['trigger_' + triggerKey].template_id" :placeholder="t('请选择小票打印模板')" clearable>
-									<el-option v-for="templateItem in templateList[item.key]" :key="templateItem.template_id" :label="templateItem.template_name" :value="templateItem.template_id" />
-								</el-select>
-							</div>
-							<template v-for="childItem in item.condition">
-								<div class="w-[300px] px-[12px] flex-1" v-if="childItem.type == 'checkbox'">
-									<el-checkbox-group v-model="formData.value[item.key]['trigger_' + triggerKey][childItem.key]">
-										<el-checkbox v-for="(checkboxItem, index) in childItem.list" :label="checkboxItem.value" :key="index">{{ checkboxItem.name }}</el-checkbox>
-									</el-checkbox-group>
-								</div>
-							</template>
-							<div class="w-[200px] px-[12px]">
-								<el-select v-model="formData.value[item.key]['trigger_' + triggerKey].print_num">
-									<el-option label="1联" :value="1" />
-									<el-option label="2联" :value="2" />
-									<el-option label="3联" :value="3" />
-									<el-option label="4联" :value="4" />
-								</el-select>
-							</div>
-						</template>
-					</div>
-				</template>
+                <template v-if="item.trigger">
+                    <div class="flex bg-[#f8f8f9] mb-[10px] py-[20px]" v-for="(triggerItem,triggerKey) in item.trigger" :key="triggerKey">
+                        <template v-if="formData.value[item.key]['trigger_' + triggerKey]">
+                            <div class="font-bold w-[200px] px-[12px]">{{ triggerItem }}</div>
+                            <div class="w-[100px] px-[12px]">
+                                <el-switch v-model="formData.value[item.key]['trigger_' + triggerKey].status" :active-value="1" :inactive-value="0" />
+                            </div>
+                            <div class="w-[250px] px-[12px]">
+                                <el-select v-model="formData.value[item.key]['trigger_' + triggerKey].template_id" :placeholder="t('请选择小票打印模板')" clearable>
+                                    <el-option v-for="templateItem in templateList[item.key]" :key="templateItem.template_id" :label="templateItem.template_name" :value="templateItem.template_id" />
+                                </el-select>
+                            </div>
+                            <template v-for="childItem in item.condition">
+                                <div class="w-[300px] px-[12px] flex-1" v-if="childItem.type == 'checkbox'">
+                                    <el-checkbox-group
+                                        v-model="formData.value[item.key]['trigger_' + triggerKey][childItem.key]">
+                                        <el-checkbox v-for="(checkboxItem, index) in childItem.list" :label="checkboxItem.value" :key="index">{{ checkboxItem.name }}
+                                        </el-checkbox>
+                                    </el-checkbox-group>
+                                </div>
+                            </template>
+                            <div class="w-[200px] px-[12px]">
+                                <el-select v-model="formData.value[item.key]['trigger_' + triggerKey].print_num">
+                                    <el-option label="1联" :value="1" />
+                                    <el-option label="2联" :value="2" />
+                                    <el-option label="3联" :value="3" />
+                                    <el-option label="4联" :value="4" />
+                                </el-select>
+                            </div>
+                        </template>
+                    </div>
+                </template>
 
-			</el-card>
-		</el-form>
+            </el-card>
+        </el-form>
 
-		<div class="fixed-footer-wrap">
-			<div class="fixed-footer">
-				<el-button type="primary" :loading="repeat" @click="confirm(formRef)">{{ t('save') }}</el-button>
-				<el-button @click="back()">{{ t('cancel') }}</el-button>
-			</div>
-		</div>
-	</div>
+        <div class="fixed-footer-wrap">
+            <div class="fixed-footer">
+                <el-button type="primary" :loading="repeat" @click="confirm(formRef)">{{ t('save') }}</el-button>
+                <el-button @click="back()">{{ t('cancel') }}</el-button>
+            </div>
+        </div>
+    </div>
 </template>
 
 <script lang="ts" setup>
-    import { ref, reactive, computed } from 'vue'
-    import { t } from '@/lang'
-    import { FormInstance, ElMessage } from 'element-plus'
-    import { useRoute, useRouter } from 'vue-router'
-    import { deepClone } from '@/utils/common';
-    import { addPrinter, editPrinter,getPrinterInfo,getPrinterType,getPrinterBrand,getPrinterTemplateList } from '@/app/api/printer'
+import { ref, reactive, computed } from 'vue'
+import { t } from '@/lang'
+import { FormInstance, ElMessage } from 'element-plus'
+import { useRoute, useRouter } from 'vue-router'
+import { deepClone } from '@/utils/common';
+import {
+    addPrinter,
+    editPrinter,
+    getPrinterInfo,
+    getPrinterType,
+    getPrinterBrand,
+    getPrinterTemplateList
+} from '@/app/api/printer'
 
-    const route = useRoute()
-    const router = useRouter()
-    const repeat = ref(false)
-    const loading = ref(true)
+const route = useRoute()
+const router = useRouter()
+const repeat = ref(false)
+const loading = ref(true)
 
-    const pageName = route.meta.title
+const pageName = route.meta.title
 
-    /**
-     * 表单数据
-     */
-    const initialFormData:any = {
-        printer_id: route.query.printer_id || 0,
-        brand: '',
-        printer_name: '',
-        printer_code: '',
-        printer_key: '',
-        open_id: '',
-        apikey: '',
-        template_type: [],
-        trigger: [],
-        value: {},
-        print_width: '58mm',
-        status: 1,
+/**
+ * 表单数据
+ */
+const initialFormData: any = {
+    printer_id: route.query.printer_id || 0,
+    brand: '',
+    printer_name: '',
+    printer_code: '',
+    printer_key: '',
+    open_id: '',
+    apikey: '',
+    template_type: [],
+    trigger: [],
+    value: {},
+    print_width: '58mm',
+    status: 1,
+}
+
+const formData: Record<string, any> = reactive({ ...initialFormData })
+
+const formRef = ref<FormInstance>()
+
+// 表单验证规则
+const formRules = computed(() => {
+    return {
+        printer_name: [
+            { required: true, message: t('printerNamePlaceholder'), trigger: 'blur' },
+        ],
+        brand: [
+            { required: true, message: t('brandPlaceholder'), trigger: 'blur' },
+        ],
+        printer_code: [
+            { required: true, message: t('printerCodePlaceholder'), trigger: 'blur' },
+        ],
+        printer_key: [
+            { required: true, message: t('printerKeyPlaceholder'), trigger: 'blur' },
+        ],
+        open_id: [
+            { required: true, message: t('openIdPlaceholder'), trigger: 'blur' },
+        ],
+        apikey: [
+            { required: true, message: t('apikeyPlaceholder'), trigger: 'blur' },
+        ]
     }
+})
 
-    const formData: Record<string, any> = reactive({ ...initialFormData })
+const printerType = ref([])
 
-    const formRef = ref<FormInstance>()
-
-    // 表单验证规则
-    const formRules = computed(() => {
-        return {
-            printer_name: [
-                { required: true, message: t('printerNamePlaceholder'), trigger: 'blur' },
-            ],
-            brand: [
-                { required: true, message: t('brandPlaceholder'), trigger: 'blur' },
-            ],
-            printer_code: [
-                { required: true, message: t('printerCodePlaceholder'), trigger: 'blur' },
-            ],
-            printer_key: [
-                { required: true, message: t('printerKeyPlaceholder'), trigger: 'blur' },
-            ],
-            open_id: [
-                { required: true, message: t('openIdPlaceholder'), trigger: 'blur' },
-            ],
-            apikey: [
-                { required: true, message: t('apikeyPlaceholder'), trigger: 'blur' },
-            ]
-        }
-    })
-
-    const printerType = ref([])
-
-    const init = async ()=> {
-        await getPrinterType({}).then((res: any) => {
-            if (res.data) {
-                printerType.value = res.data;
-
-                for (let i = 0; i < printerType.value.length; i++) {
-                    let item: any = printerType.value[i];
-
-                    formData.value[item.key] = {};
-
-                    let extendData: any = {};
-                    for (let ci = 0; ci < item.condition.length; ci++) {
-                        let condition = item.condition[ci];
-                        extendData[condition.key] = [];
-                        if (condition.type == 'checkbox') {
-                            extendData[condition.key] = []; // 默认全选
-                            for (let k = 0; k < condition.list.length; k++) {
-                                extendData[condition.key].push(condition.list[k].value);
-                            }
-                        }
-                    }
-
-                    for (let key in item.trigger) {
-                        formData.value[item.key]['trigger_' + key] = {
-                            status: 1,
-                            template_id: '',
-                            print_num: 1,
-                        };
-                        Object.assign(formData.value[item.key]['trigger_' + key], deepClone(extendData));
-                    }
-                }
-
-            }
-            if (!formData.printer_id) {
-                loading.value = false
-            }
-        })
-
-        if (formData.printer_id) {
-            getPrinterInfo(formData.printer_id).then((res: any) => {
-                let data = res.data;
-                if (data) Object.keys(formData).forEach((key: string) => {
-                    if (data[key] != undefined) {
-                        if (key == 'value') {
-                            for (let ck in formData[key]){
-                                Object.assign(formData[key][ck],data[key][ck])
-                            }
-                        } else {
-                            formData[key] = data[key]
-                        }
-                    }
-                })
-                loading.value = false
-            })
-        }
-    }
-
-    init()
-
-    const brandList = ref([])
-    getPrinterBrand({}).then((res: any) => {
-        brandList.value = res.data;
-    })
-
-    const templateList:any = ref({}) // 小票打印模板列表
-    getPrinterTemplateList({}).then((res:any)=> {
+const init = async() => {
+    await getPrinterType({}).then((res: any) => {
         if (res.data) {
-            let data = res.data;
-            for (let i = 0; i < data.length; i++) {
-                let item = data[i];
-                if (templateList.value[item.template_type] == undefined) {
-                    templateList.value[item.template_type] = []
+            printerType.value = res.data;
+
+            for (let i = 0; i < printerType.value.length; i++) {
+                let item: any = printerType.value[i];
+
+                formData.value[item.key] = {};
+
+                let extendData: any = {};
+                for (let ci = 0; ci < item.condition.length; ci++) {
+                    let condition = item.condition[ci];
+                    extendData[condition.key] = [];
+                    if (condition.type == 'checkbox') {
+                        extendData[condition.key] = []; // 默认全选
+                        for (let k = 0; k < condition.list.length; k++) {
+                            extendData[condition.key].push(condition.list[k].value);
+                        }
+                    }
+                }
+
+                for (let key in item.trigger) {
+                    formData.value[item.key]['trigger_' + key] = {
+                        status: 1,
+                        template_id: '',
+                        print_num: 1,
+                    };
+                    Object.assign(formData.value[item.key]['trigger_' + key], deepClone(extendData));
                 }
-                templateList.value[item.template_type].push({
-                    template_id: item.template_id,
-                    template_name: item.template_name,
-                })
             }
+
+        }
+        if (!formData.printer_id) {
+            loading.value = false
         }
     })
 
-    /**
-     * 确认
-     * @param formEl
-     */
-    const confirm = async(formEl: FormInstance | undefined) => {
-        if (loading.value || !formEl) return
-
-        if (printerType.value.length == 0) {
-            ElMessage({
-                type: 'warning',
-                message: t('printTypeEmpty')
+    if (formData.printer_id) {
+        getPrinterInfo(formData.printer_id).then((res: any) => {
+            let data = res.data;
+            if (data) Object.keys(formData).forEach((key: string) => {
+                if (data[key] != undefined) {
+                    if (key == 'value') {
+                        for (let ck in formData[key]) {
+                            Object.assign(formData[key][ck], data[key][ck])
+                        }
+                    } else {
+                        formData[key] = data[key]
+                    }
+                }
+            })
+            loading.value = false
+        })
+    }
+}
+
+init()
+
+const brandList = ref([])
+getPrinterBrand({}).then((res: any) => {
+    brandList.value = res.data;
+})
+
+const templateList: any = ref({}) // 小票打印模板列表
+getPrinterTemplateList({}).then((res: any) => {
+    if (res.data) {
+        let data = res.data;
+        for (let i = 0; i < data.length; i++) {
+            let item = data[i];
+            if (templateList.value[item.template_type] == undefined) {
+                templateList.value[item.template_type] = []
+            }
+            templateList.value[item.template_type].push({
+                template_id: item.template_id,
+                template_name: item.template_name,
             })
-            return;
         }
+    }
+})
 
-        let save = formData.printer_id ? editPrinter : addPrinter
+/**
+ * 确认
+ * @param formEl
+ */
+const confirm = async(formEl: FormInstance | undefined) => {
+    if (loading.value || !formEl) return
 
-        await formEl.validate(async(valid) => {
-            if (valid) {
+    if (printerType.value.length == 0) {
+        ElMessage({
+            type: 'warning',
+            message: t('printTypeEmpty')
+        })
+        return;
+    }
 
-                let validateFlag = false;
-                let validateMessage = '';
+    let save = formData.printer_id ? editPrinter : addPrinter
 
-                for (let i = 0; i < printerType.value.length; i++) {
-                    let item: any = printerType.value[i];
+    await formEl.validate(async(valid) => {
+        if (valid) {
 
-                    for (let k = 0; k < Object.keys(item.trigger).length; k++) {
-                        let triggerItem = Object.keys(item.trigger)[k];
-                        if (formData.value[item.key]['trigger_' + triggerItem].status == 0) {
-                            continue;
-                        }
+            let validateFlag = false;
+            let validateMessage = '';
 
-                        if (!formData.value[item.key]['trigger_' + triggerItem].template_id) {
-                            validateFlag = true;
-                            validateMessage = `请设置${ item.title }[${ item.trigger[triggerItem] }]的小票打印模板`
-                            break;
-                        }
+            for (let i = 0; i < printerType.value.length; i++) {
+                let item: any = printerType.value[i];
 
-                        let isFail = false;
-                        for (let ck = 0; ck < item.condition.length; ck++) {
-                            let condition = item.condition[ck];
-                            if (condition.type == 'checkbox') {
-                                if (formData.value[item.key]['trigger_' + triggerItem][condition.key].length == 0) {
-                                    validateFlag = true;
-                                    validateMessage = `请设置${ item.title }[${ item.trigger[triggerItem] }]的${ condition.title }`
-                                    isFail = true;
-                                    break;
-                                }
+                for (let k = 0; k < Object.keys(item.trigger).length; k++) {
+                    let triggerItem = Object.keys(item.trigger)[k];
+                    if (formData.value[item.key]['trigger_' + triggerItem].status == 0) {
+                        continue;
+                    }
+
+                    if (!formData.value[item.key]['trigger_' + triggerItem].template_id) {
+                        validateFlag = true;
+                        validateMessage = `请设置${ item.title }[${ item.trigger[triggerItem] }]的小票打印模板`
+                        break;
+                    }
+
+                    let isFail = false;
+                    for (let ck = 0; ck < item.condition.length; ck++) {
+                        let condition = item.condition[ck];
+                        if (condition.type == 'checkbox') {
+                            if (formData.value[item.key]['trigger_' + triggerItem][condition.key].length == 0) {
+                                validateFlag = true;
+                                validateMessage = `请设置${ item.title }[${ item.trigger[triggerItem] }]的${ condition.title }`
+                                isFail = true;
+                                break;
                             }
                         }
-
-                        // 防止重复循环
-                        if (isFail) {
-                            break;
-                        }
-
                     }
 
                     // 防止重复循环
-                    if (validateFlag) {
+                    if (isFail) {
                         break;
                     }
+
                 }
 
+                // 防止重复循环
                 if (validateFlag) {
-                    ElMessage({
-                        type: 'warning',
-                        message: validateMessage
-                    })
-                    return;
+                    break;
                 }
-
-                formData.template_type = [];
-                formData.trigger = [];
-
-                for (let key in formData.value) {
-                    for (let childKey in formData.value[key]) {
-                        formData.trigger.push(key + '_' + childKey);
-                    }
-                    formData.template_type.push(key)
-                }
-
-                if (repeat.value) return
-                repeat.value = true
-
-                let data = formData
-
-                save(data).then(res => {
-                    repeat.value = false
-                    if (!formData.printer_id) {
-                        router.push('/printer/list')
-                    }
-                }).catch(err => {
-                    repeat.value = false
-                })
             }
-        })
-    }
 
-    const back = () => {
-        router.push('/printer/list')
-    }
+            if (validateFlag) {
+                ElMessage({
+                    type: 'warning',
+                    message: validateMessage
+                })
+                return;
+            }
+
+            formData.template_type = [];
+            formData.trigger = [];
+
+            for (let key in formData.value) {
+                for (let childKey in formData.value[key]) {
+                    formData.trigger.push(key + '_' + childKey);
+                }
+                formData.template_type.push(key)
+            }
+
+            if (repeat.value) return
+            repeat.value = true
+
+            let data = formData
+
+            save(data).then(res => {
+                repeat.value = false
+                if (!formData.printer_id) {
+                    router.push('/printer/list')
+                }
+            }).catch(err => {
+                repeat.value = false
+            })
+        }
+    })
+}
+
+const back = () => {
+    router.push('/printer/list')
+}
 </script>
 
 <style lang="scss" scoped></style>
diff --git a/admin/src/app/views/printer/list.vue b/admin/src/app/views/printer/list.vue
index 055e5d599..dd7066a8e 100644
--- a/admin/src/app/views/printer/list.vue
+++ b/admin/src/app/views/printer/list.vue
@@ -4,9 +4,7 @@
 
             <div class="flex justify-between items-center mb-[5px]">
                 <span class="text-lg">{{pageName}}</span>
-                <el-button type="primary" @click="addEvent">
-                    {{ t('addPrinter') }}
-                </el-button>
+                <el-button type="primary" @click="addEvent">{{ t('addPrinter') }}</el-button>
             </div>
 
             <el-tabs class="demo-tabs" model-value="/printer/list" @tab-change="handleClick">
@@ -41,8 +39,8 @@
 
                     <el-table-column prop="status" :label="t('status')" min-width="80" :show-overflow-tooltip="true" >
                         <template #default="{ row }">
-	                        <el-tag type="success" v-if="row.status == 1" @click="modifyPrinterStatusEvent(row.printer_id, 0)" class="cursor-pointer">{{ t('statusOn') }}</el-tag>
-	                        <el-tag type="info" v-else @click="modifyPrinterStatusEvent(row.printer_id, 1)" class="cursor-pointer">{{ t('statusOff') }}</el-tag>
+                            <el-tag type="success" v-if="row.status == 1" @click="modifyPrinterStatusEvent(row.printer_id, 0)" class="cursor-pointer">{{ t('statusOn') }}</el-tag>
+                            <el-tag type="info" v-else @click="modifyPrinterStatusEvent(row.printer_id, 1)" class="cursor-pointer">{{ t('statusOff') }}</el-tag>
                         </template>
                     </el-table-column>
 
@@ -73,6 +71,7 @@ import { t } from '@/lang'
 import { getPrinterPageList, modifyPrinterStatus, deletePrinter,refreshPrinterToken,testPrint } from '@/app/api/printer'
 import { ElMessageBox,FormInstance } from 'element-plus'
 import { useRoute,useRouter } from 'vue-router'
+import { setTablePageStorage,getTablePageStorage } from "@/utils/common";
 
 const route = useRoute()
 const router = useRouter()
@@ -89,8 +88,8 @@ const printerTable = reactive({
     total: 0,
     loading: true,
     data: [],
-    searchParam:{
-      printer_name:''
+    searchParam: {
+        printer_name: ''
     }
 })
 
@@ -106,17 +105,18 @@ const loadPrinterList = (page: number = 1) => {
     getPrinterPageList({
         page: printerTable.page,
         limit: printerTable.limit,
-         ...printerTable.searchParam
+        ...printerTable.searchParam
     }).then(res => {
         printerTable.loading = false
         printerTable.data = res.data.data
         printerTable.total = res.data.total
+        setTablePageStorage(printerTable.page, printerTable.limit, printerTable.searchParam);
     }).catch(() => {
         printerTable.loading = false
     })
 }
 
-loadPrinterList()
+loadPrinterList(getTablePageStorage(printerTable.searchParam).page)
 
 const isRepeat = ref(false)
 
@@ -224,4 +224,4 @@ const refreshTokenEvent = (printer_id: any) => {
 </script>
 
 <style lang="scss" scoped>
-</style>
\ No newline at end of file
+</style>
diff --git a/admin/src/app/views/printer/template_edit.vue b/admin/src/app/views/printer/template_edit.vue
index f92ca2032..204db203f 100644
--- a/admin/src/app/views/printer/template_edit.vue
+++ b/admin/src/app/views/printer/template_edit.vue
@@ -1,349 +1,354 @@
 <template>
-	<div class="main-container">
+    <div class="main-container">
         <el-card class="card !border-none mb-[15px]" shadow="never">
             <el-page-header :content="pageName" :icon="ArrowLeft" @back="back" />
         </el-card>
 
-		<el-form class="page-form" :model="formData" :rules="formRules" label-width="150px" ref="formRef" v-loading="loading">
+        <el-form class="page-form" :model="formData" :rules="formRules" label-width="150px" ref="formRef" v-loading="loading">
 
-			<div class="flex">
+            <div class="flex">
 
-				<div class="flex-1 mr-[20px] bg-[#fff]">
+                <div class="flex-1 mr-[20px] bg-[#fff]">
 
-					<el-card class="box-card !border-none" shadow="never">
+                    <el-card class="box-card !border-none" shadow="never">
 
-						<h3 class="panel-title !text-sm">{{ t('templateInfoLabel') }}</h3>
+                        <h3 class="panel-title !text-sm">{{ t('templateInfoLabel') }}</h3>
 
-						<el-form-item :label="t('templateName')" prop="template_name">
-							<el-input v-model.trim="formData.template_name" clearable :placeholder="t('templateNamePlaceholder')" class="input-width" maxlength="20" />
-						</el-form-item>
+                        <el-form-item :label="t('templateName')" prop="template_name">
+                            <el-input v-model.trim="formData.template_name" clearable :placeholder="t('templateNamePlaceholder')" class="input-width" maxlength="20" />
+                        </el-form-item>
 
-						<el-form-item :label="t('templateType')" prop="template_type" v-if="printerType.length">
-							<el-radio-group v-model="formData.template_type">
-								<el-radio v-for="item in printerType" :key="item.key" :label="item.key" @change="handlePrintType">{{ item.title }}</el-radio>
-							</el-radio-group>
-						</el-form-item>
+                        <el-form-item :label="t('templateType')" prop="template_type" v-if="printerType.length">
+                            <el-radio-group v-model="formData.template_type">
+                                <el-radio v-for="item in printerType" :key="item.key" :label="item.key" @change="handlePrintType">{{ item.title }}</el-radio>
+                            </el-radio-group>
+                        </el-form-item>
 
-					</el-card>
-					<el-card class="box-card !border-none" shadow="never" v-if="printerType.length">
+                    </el-card>
+                    <el-card class="box-card !border-none" shadow="never" v-if="printerType.length">
 
-						<h3 class="panel-title !text-sm">{{ t('templateEditLabel') }}</h3>
+                        <h3 class="panel-title !text-sm">{{ t('templateEditLabel') }}</h3>
 
-						<div v-for="item in template" :key="item.key" class="bg-[#f8f8f9] mb-[20px] py-[20px] px-[40px] text-[14px]">
-							<h4 class="panel-title !text-sm">{{ item.title }}</h4>
-							<div v-for="(childItem,index) in item.list" :key="childItem.key" class="ml-[30px]" :style="{ 'margin-bottom' : item.list.length == (index + 1) ? '0' : '20px' }">
-								<div class="flex">
-									<el-checkbox v-model="formData.value[item.key][childItem.key].status" v-if="childItem.label" :label="childItem.label" :value="childItem.status" :true-value="1" :false-value="0" class="w-[180px] mr-[10px]" :disabled="childItem.disabled" />
+                        <div v-for="item in template" :key="item.key" class="bg-[#f8f8f9] mb-[20px] py-[20px] px-[40px] text-[14px]">
+                            <h4 class="panel-title !text-sm">{{ item.title }}</h4>
+                            <div v-for="(childItem,index) in item.list" :key="childItem.key" class="ml-[30px]" :style="{ 'margin-bottom' : item.list.length == (index + 1) ? '0' : '20px' }">
+                                <div class="flex">
+                                    <el-checkbox v-model="formData.value[item.key][childItem.key].status"
+                                                 v-if="childItem.label" :label="childItem.label"
+                                                 :value="childItem.status" :true-value="1" :false-value="0"
+                                                 class="w-[180px] mr-[10px]" :disabled="childItem.disabled" />
 
-									<template v-if="childItem.type == 'input'">
-										<el-input v-model.trim="formData.value[item.key][childItem.key].value" clearable :placeholder="'请输入' + (childItem.placeholder ? childItem.placeholder : childItem.label)" class="input-width mr-[30px]" maxlength="32" />
-									</template>
+                                    <template v-if="childItem.type == 'input'">
+                                        <el-input v-model.trim="formData.value[item.key][childItem.key].value" clearable
+                                                  :placeholder="'请输入' + (childItem.placeholder ? childItem.placeholder : childItem.label)"
+                                                  class="input-width mr-[30px]" maxlength="32" />
+                                    </template>
 
-									<template v-if="childItem.type == 'checkbox'">
-										<el-checkbox-group v-model="formData.value[item.key][childItem.key].value" class="mr-[30px]">
-											<el-checkbox v-for="(checkboxItem, key) in childItem.list" :label="key" :key="key" :disabled="childItem.disabled">{{ checkboxItem }}</el-checkbox>
-										</el-checkbox-group>
-									</template>
+                                    <template v-if="childItem.type == 'checkbox'">
+                                        <el-checkbox-group v-model="formData.value[item.key][childItem.key].value" class="mr-[30px]">
+                                            <el-checkbox v-for="(checkboxItem, key) in childItem.list" :label="key" :key="key" :disabled="childItem.disabled">{{ checkboxItem }}</el-checkbox>
+                                        </el-checkbox-group>
+                                    </template>
 
-									<template v-if="childItem.type == 'select'">
+                                    <template v-if="childItem.type == 'select'">
 
-										<div class="leading-[30px] w-[50px] text-center text-[#707070] bg-[#d7d7d7] border-1 border-solid border-[#ededed]">{{ childItem.text }}</div>
-										<el-select v-model="formData.value[item.key][childItem.key].value" class="!w-[130px] mr-[30px]">
-											<el-option v-for="(item,key) in childItem.list" :key="key" :label="item" :value="key" />
-										</el-select>
+                                        <div class="leading-[30px] w-[50px] text-center text-[#707070] bg-[#d7d7d7] border-1 border-solid border-[#ededed]">{{ childItem.text }}</div>
+                                        <el-select v-model="formData.value[item.key][childItem.key].value" class="!w-[130px] mr-[30px]">
+                                            <el-option v-for="(item,key) in childItem.list" :key="key" :label="item" :value="key" />
+                                        </el-select>
 
-									</template>
+                                    </template>
 
-									<template v-if="childItem.fontSize">
-										<div class="flex mr-[30px]">
-											<div class="leading-[30px] w-[50px] text-center text-[#707070] bg-[#d7d7d7] border-1 border-solid border-[#ededed]">字号</div>
-											<el-select v-model="formData.value[item.key][childItem.key].fontSize" class="!w-[130px]">
-												<el-option label="小" value="normal" />
-<!--												<el-option label="小" value="small" />-->
-												<el-option label="大" value="big" />
-											</el-select>
-										</div>
+                                    <template v-if="childItem.fontSize">
+                                        <div class="flex mr-[30px]">
+                                            <div class="leading-[30px] w-[50px] text-center text-[#707070] bg-[#d7d7d7] border-1 border-solid border-[#ededed]">字号</div>
+                                            <el-select v-model="formData.value[item.key][childItem.key].fontSize" class="!w-[130px]">
+                                                <el-option label="小" value="normal" />
+                                                <!--<el-option label="小" value="small" />-->
+                                                <el-option label="大" value="big" />
+                                            </el-select>
+                                        </div>
 
-									</template>
+                                    </template>
 
-									<template v-if="childItem.fontWeight">
+                                    <template v-if="childItem.fontWeight">
 
-										<div class="flex mr-[30px]">
-											<div class="leading-[30px] w-[50px] text-center text-[#707070] bg-[#d7d7d7] border-1 border-solid border-[#ededed]">粗细</div>
-											<el-select v-model="formData.value[item.key][childItem.key].fontWeight" class="!w-[130px]">
-												<el-option label="正常" value="normal" />
-												<el-option label="加粗" value="bold" />
-											</el-select>
-										</div>
-									</template>
+                                        <div class="flex mr-[30px]">
+                                            <div class="leading-[30px] w-[50px] text-center text-[#707070] bg-[#d7d7d7] border-1 border-solid border-[#ededed]">粗细</div>
+                                            <el-select v-model="formData.value[item.key][childItem.key].fontWeight" class="!w-[130px]">
+                                                <el-option label="正常" value="normal" />
+                                                <el-option label="加粗" value="bold" />
+                                            </el-select>
+                                        </div>
+                                    </template>
 
-								</div>
+                                </div>
 
-								<div v-if="childItem.remark" class="text-[12px] text-[#b2b2b2] mt-[10px]">{{ childItem.remark }}</div>
+                                <div v-if="childItem.remark" class="text-[12px] text-[#b2b2b2] mt-[10px]">{{ childItem.remark }}</div>
 
-							</div>
+                            </div>
 
-						</div>
+                        </div>
 
-					</el-card>
-				</div>
+                    </el-card>
+                </div>
 
-				<el-card class="box-card !border-none w-[450px]" shadow="never">
+                <el-card class="box-card !border-none w-[450px]" shadow="never">
 
-					<h3 class="panel-title !text-sm">{{ t('preview') }}</h3>
+                    <h3 class="panel-title !text-sm">{{ t('preview') }}</h3>
 
-					<!-- 动态加载组件 -->
-					<component :is="modules[previewPath]" :value="formData.value"/>
+                    <!-- 动态加载组件 -->
+                    <component :is="modules[previewPath]" :value="formData.value" />
 
-				</el-card>
+                </el-card>
 
-			</div>
+            </div>
 
-		</el-form>
+        </el-form>
 
-		<div class="fixed-footer-wrap">
-			<div class="fixed-footer">
-				<el-button type="primary" :loading="repeat" @click="confirm(formRef)">{{ t('save') }}</el-button>
-				<el-button @click="back()">{{ t('cancel') }}</el-button>
-			</div>
-		</div>
-	</div>
+        <div class="fixed-footer-wrap">
+            <div class="fixed-footer">
+                <el-button type="primary" :loading="repeat" @click="confirm(formRef)">{{ t('save') }}</el-button>
+                <el-button @click="back()">{{ t('cancel') }}</el-button>
+            </div>
+        </div>
+    </div>
 </template>
 
 <script lang="ts" setup>
-    import { ref, reactive, computed } from 'vue'
-    import { t } from '@/lang'
-    import { FormInstance, ElMessage } from 'element-plus'
-    import { useRoute, useRouter } from 'vue-router'
-    import { getPrinterType, addPrinterTemplate, editPrinterTemplate, getPrinterTemplateInfo } from '@/app/api/printer'
+import { ref, reactive, computed } from 'vue'
+import { t } from '@/lang'
+import { FormInstance, ElMessage } from 'element-plus'
+import { useRoute, useRouter } from 'vue-router'
+import { getPrinterType, addPrinterTemplate, editPrinterTemplate, getPrinterTemplateInfo } from '@/app/api/printer'
 
-    const route = useRoute()
-    const router = useRouter()
-    const pageName = route.meta.title
-    const repeat = ref(false)
-    const loading = ref(true)
+const route = useRoute()
+const router = useRouter()
+const pageName = route.meta.title
+const repeat = ref(false)
+const loading = ref(true)
 
-    /**
-     * 表单数据
-     */
-    const initialFormData:any = {
-        template_id: route.query.template_id || 0,
-        template_type: '',
-        template_name: '',
-        value: {},
+/**
+ * 表单数据
+ */
+const initialFormData: any = {
+    template_id: route.query.template_id || 0,
+    template_type: '',
+    template_name: '',
+    value: {},
+}
+
+const formData: Record<string, any> = reactive({ ...initialFormData })
+
+const formRef = ref<FormInstance>()
+
+// 表单验证规则
+const formRules = computed(() => {
+    return {
+        template_name: [
+            { required: true, message: t('templateNamePlaceholder'), trigger: 'blur' },
+        ],
+        template_type: [
+            { required: true, message: t('templateTypePlaceholder'), trigger: 'blur' },
+        ]
     }
+})
 
-    const formData: Record<string, any> = reactive({ ...initialFormData })
+// 动态加载组件
+const modulesFiles = import.meta.glob('./components/*.vue', { eager: true })
+const addonModulesFiles = import.meta.glob('@/addon/**/views/printer/components/*.vue', { eager: true })
+addonModulesFiles && Object.assign(modulesFiles, addonModulesFiles)
 
-    const formRef = ref<FormInstance>()
+const modules: any = {}
+for (const [key, value] of Object.entries(modulesFiles)) {
+    const moduleName: any = key.split('/').pop()
+    const name = moduleName.split('.')[0]
+    modules[name] = value.default
+}
 
-    // 表单验证规则
-    const formRules = computed(() => {
-        return {
-            template_name: [
-                { required: true, message: t('templateNamePlaceholder'), trigger: 'blur' },
-            ],
-            template_type: [
-                { required: true, message: t('templateTypePlaceholder'), trigger: 'blur' },
-            ]
+const previewPath = ref('')
+const printerType: any = ref([])
+const template: any = ref([])
+
+const init = async() => {
+    await getPrinterType({}).then((res: any) => {
+        if (res.data && res.data.length) {
+            printerType.value = res.data;
+            handlePrintType(printerType.value[0].key, Boolean(parseInt(formData.template_id)));
+        }
+        if (!formData.template_id) {
+            loading.value = false
         }
     })
 
-    // 动态加载组件
-    const modulesFiles = import.meta.glob('./components/*.vue', { eager: true })
-    const addonModulesFiles = import.meta.glob('@/addon/**/views/printer/components/*.vue', { eager: true })
-    addonModulesFiles && Object.assign(modulesFiles, addonModulesFiles)
-
-    const modules:any = {}
-    for (const [key, value] of Object.entries(modulesFiles)) {
-        const moduleName:any = key.split('/').pop()
-        const name = moduleName.split('.')[0]
-        modules[name] = value.default
-    }
-
-    const previewPath = ref('')
-    const printerType:any = ref([])
-    const template:any = ref([])
-
-    const init = async ()=> {
-        await getPrinterType({}).then((res: any) => {
-            if (res.data && res.data.length) {
-                printerType.value = res.data;
-                handlePrintType(printerType.value[0].key, Boolean(parseInt(formData.template_id)));
-            }
-            if (!formData.template_id) {
-                loading.value = false
-            }
-        })
-
-        if(formData.template_id) {
-            getPrinterTemplateInfo(formData.template_id).then((res:any)=>{
-                let data = res.data;
-                if (data && Object.keys(data).length) {
-                    Object.keys(formData).forEach((key: string) => {
-                        if (key == 'value') {
-                            for (let ck in formData[key]){
-                                Object.assign(formData[key][ck],data[key][ck])
-                            }
-                        } else {
-                            formData[key] = data[key]
-                        }
-                    })
-                    loading.value = false
-                }else {
-                    ElMessage({
-                        type: 'warning',
-                        duration: 1500,
-                        message: t('printTemplateEmpty')
-                    })
-                    setTimeout(()=>{
-                        back();
-                        loading.value = false
-                    }, 2000);
-                }
-            })
-        }
-    };
-
-    init();
-
-    // 切换模板类型
-    const handlePrintType = (value: any, load: boolean = false) => {
-        for (let i = 0; i < printerType.value.length; i++) {
-            if (printerType.value[i].key == value) {
-                formData.template_type = printerType.value[i].key;
-                previewPath.value = printerType.value[i].path;
-                template.value = printerType.value[i].template;
-                break;
-            }
-        }
-
-        // 清空模板内容数据
-        for (let key in formData.value) {
-            delete formData.value[key];
-        }
-
-        refreshTemplateData();
-    }
-
-    // 刷新模板内容数据
-    const refreshTemplateData = ()=> {
-        for (let i = 0; i < template.value.length; i++) {
-            let item: any = template.value[i];
-            formData.value[item.key] = {};
-            for (let k = 0; k < item.list.length; k++) {
-                let childItem = item.list[k];
-                formData.value[item.key][childItem.key] = {
-                    type: childItem.type,
-                    value: childItem.value,
-                    status: childItem.status,
-                    fontSize: childItem.fontSize,
-                    fontWeight: childItem.fontWeight,
-                };
-            }
-        }
-    }
-
-    /**
-     * 确认
-     * @param formEl
-     */
-    const confirm = async(formEl: FormInstance | undefined) => {
-        if (loading.value || !formEl) return
-
-        if (printerType.value.length == 0) {
-            ElMessage({
-                type: 'warning',
-                message: t('printTypeEmpty')
-            })
-            return;
-        }
-
-        let save = formData.template_id ? editPrinterTemplate : addPrinterTemplate
-
-        await formEl.validate(async(valid) => {
-            if (valid) {
-
-                let validateFlag = false;
-                let validateMessage = '';
-
-                for (let i = 0; i < template.value.length; i++) {
-
-                    let item: any = template.value[i];
-                    let isFail = false;
-
-                    for (let k = 0; k < item.list.length; k++) {
-                        let childItem = item.list[k];
-                        if (formData.value[item.key][childItem.key].status == 0) {
-                            continue;
-                        }
-                        if (childItem.type == 'input') {
-                            if (formData.value[item.key][childItem.key].value == '') {
-                                validateFlag = true;
-                                validateMessage = `请输入${ childItem.label }`;
-                                isFail = true;
-                                break;
-                            }
-                        } else if (childItem.type == 'select') {
-                            if (formData.value[item.key][childItem.key].value == '') {
-                                validateFlag = true;
-                                validateMessage = `${ childItem.label }未设置[${ childItem.text }]`;
-                                isFail = true;
-                                break;
-                            }
+    if (formData.template_id) {
+        getPrinterTemplateInfo(formData.template_id).then((res: any) => {
+            let data = res.data;
+            if (data && Object.keys(data).length) {
+                Object.keys(formData).forEach((key: string) => {
+                    if (key == 'value') {
+                        for (let ck in formData[key]) {
+                            Object.assign(formData[key][ck], data[key][ck])
                         }
+                    } else {
+                        formData[key] = data[key]
                     }
-
-                    // 防止重复循环
-                    if (isFail) {
-                        break;
-                    }
-                }
-
-                if (validateFlag) {
-                    ElMessage({
-                        type: 'warning',
-                        message: validateMessage
-                    })
-                    return;
-                }
-
-                for (let i = 0; i < template.value.length; i++) {
-
-                    let item: any = template.value[i];
-
-                    for (let k = 0; k < item.list.length; k++) {
-                        let childItem = item.list[k];
-                        if (childItem.type == 'checkbox') {
-                            if (formData.value[item.key][childItem.key].value.length) {
-                                formData.value[item.key][childItem.key].status = 1;
-                            } else {
-                                formData.value[item.key][childItem.key].status = 0;
-                            }
-                        }
-                    }
-                }
-
-                if (repeat.value) return
-                repeat.value = true
-
-                let data = formData
-
-                save(data).then(res => {
-                    repeat.value = false
-                    if (!formData.template_id) {
-                        back()
-                    }
-                }).catch(err => {
-                    repeat.value = false
                 })
+                loading.value = false
+            } else {
+                ElMessage({
+                    type: 'warning',
+                    duration: 1500,
+                    message: t('printTemplateEmpty')
+                })
+                setTimeout(() => {
+                    back();
+                    loading.value = false
+                }, 2000);
             }
         })
     }
+};
 
-    const back = () => {
-        router.push('/printer/template/list')
+init();
+
+// 切换模板类型
+const handlePrintType = (value: any, load: boolean = false) => {
+    for (let i = 0; i < printerType.value.length; i++) {
+        if (printerType.value[i].key == value) {
+            formData.template_type = printerType.value[i].key;
+            previewPath.value = printerType.value[i].path;
+            template.value = printerType.value[i].template;
+            break;
+        }
     }
+
+    // 清空模板内容数据
+    for (let key in formData.value) {
+        delete formData.value[key];
+    }
+
+    refreshTemplateData();
+}
+
+// 刷新模板内容数据
+const refreshTemplateData = () => {
+    for (let i = 0; i < template.value.length; i++) {
+        let item: any = template.value[i];
+        formData.value[item.key] = {};
+        for (let k = 0; k < item.list.length; k++) {
+            let childItem = item.list[k];
+            formData.value[item.key][childItem.key] = {
+                type: childItem.type,
+                value: childItem.value,
+                status: childItem.status,
+                fontSize: childItem.fontSize,
+                fontWeight: childItem.fontWeight,
+            };
+        }
+    }
+}
+
+/**
+ * 确认
+ * @param formEl
+ */
+const confirm = async(formEl: FormInstance | undefined) => {
+    if (loading.value || !formEl) return
+
+    if (printerType.value.length == 0) {
+        ElMessage({
+            type: 'warning',
+            message: t('printTypeEmpty')
+        })
+        return;
+    }
+
+    let save = formData.template_id ? editPrinterTemplate : addPrinterTemplate
+
+    await formEl.validate(async(valid) => {
+        if (valid) {
+
+            let validateFlag = false;
+            let validateMessage = '';
+
+            for (let i = 0; i < template.value.length; i++) {
+
+                let item: any = template.value[i];
+                let isFail = false;
+
+                for (let k = 0; k < item.list.length; k++) {
+                    let childItem = item.list[k];
+                    if (formData.value[item.key][childItem.key].status == 0) {
+                        continue;
+                    }
+                    if (childItem.type == 'input') {
+                        if (formData.value[item.key][childItem.key].value == '') {
+                            validateFlag = true;
+                            validateMessage = `请输入${ childItem.label }`;
+                            isFail = true;
+                            break;
+                        }
+                    } else if (childItem.type == 'select') {
+                        if (formData.value[item.key][childItem.key].value == '') {
+                            validateFlag = true;
+                            validateMessage = `${ childItem.label }未设置[${ childItem.text }]`;
+                            isFail = true;
+                            break;
+                        }
+                    }
+                }
+
+                // 防止重复循环
+                if (isFail) {
+                    break;
+                }
+            }
+
+            if (validateFlag) {
+                ElMessage({
+                    type: 'warning',
+                    message: validateMessage
+                })
+                return;
+            }
+
+            for (let i = 0; i < template.value.length; i++) {
+
+                let item: any = template.value[i];
+
+                for (let k = 0; k < item.list.length; k++) {
+                    let childItem = item.list[k];
+                    if (childItem.type == 'checkbox') {
+                        if (formData.value[item.key][childItem.key].value.length) {
+                            formData.value[item.key][childItem.key].status = 1;
+                        } else {
+                            formData.value[item.key][childItem.key].status = 0;
+                        }
+                    }
+                }
+            }
+
+            if (repeat.value) return
+            repeat.value = true
+
+            let data = formData
+
+            save(data).then(res => {
+                repeat.value = false
+                if (!formData.template_id) {
+                    back()
+                }
+            }).catch(err => {
+                repeat.value = false
+            })
+        }
+    })
+}
+
+const back = () => {
+    router.push('/printer/template/list')
+}
 </script>
 
 <style lang="scss" scoped>
diff --git a/admin/src/app/views/printer/template_list.vue b/admin/src/app/views/printer/template_list.vue
index ab8c65aa4..11afb2d42 100644
--- a/admin/src/app/views/printer/template_list.vue
+++ b/admin/src/app/views/printer/template_list.vue
@@ -68,6 +68,7 @@ import { t } from '@/lang'
 import { getPrinterTemplatePageList, deletePrinterTemplate,getPrinterType } from '@/app/api/printer'
 import { ElMessageBox,FormInstance } from 'element-plus'
 import { useRoute,useRouter } from 'vue-router'
+import { setTablePageStorage,getTablePageStorage } from "@/utils/common";
 
 const route = useRoute()
 const router = useRouter()
@@ -113,11 +114,12 @@ const loadPrinterTemplateList = (page: number = 1) => {
         printerTemplateTable.loading = false
         printerTemplateTable.data = res.data.data
         printerTemplateTable.total = res.data.total
+        setTablePageStorage(printerTemplateTable.page, printerTemplateTable.limit, printerTemplateTable.searchParam);
     }).catch(() => {
         printerTemplateTable.loading = false
     })
 }
-loadPrinterTemplateList()
+loadPrinterTemplateList(getTablePageStorage(printerTemplateTable.searchParam).page)
 
 /**
  * 添加小票打印模板
diff --git a/admin/src/app/views/setting/adminlogin.vue b/admin/src/app/views/setting/adminlogin.vue
index 6ff4de0d3..1fbb0ca2f 100644
--- a/admin/src/app/views/setting/adminlogin.vue
+++ b/admin/src/app/views/setting/adminlogin.vue
@@ -40,12 +40,8 @@ import { reactive, ref } from 'vue'
 import { t } from '@/lang'
 import { getConfigLogin, setConfigLogin } from '@/app/api/sys'
 import { FormInstance } from 'element-plus'
-import { useRoute } from 'vue-router'
 import { cloneDeep } from 'lodash-es'
 
-const route = useRoute()
-const pageName = route.meta.title
-
 const loading = ref(true)
 const ruleFormRef = ref<FormInstance>()
 const formData = reactive<Record<string, number | string>>({
diff --git a/admin/src/app/views/setting/components/pay-friendspay.vue b/admin/src/app/views/setting/components/pay-friendspay.vue
index b31a29dad..e57ce8703 100644
--- a/admin/src/app/views/setting/components/pay-friendspay.vue
+++ b/admin/src/app/views/setting/components/pay-friendspay.vue
@@ -154,7 +154,6 @@ const cancel = () => {
 }
 
 const setFormData = async (data: any = null) => {
-    console.log(data)
     initData.value = cloneDeep(data)
     loading.value = true
     Object.assign(formData, initialFormData)
diff --git a/admin/src/app/views/setting/export.vue b/admin/src/app/views/setting/export.vue
index e28cbef1c..58f174eb4 100644
--- a/admin/src/app/views/setting/export.vue
+++ b/admin/src/app/views/setting/export.vue
@@ -83,7 +83,7 @@ import { t } from '@/lang'
 import { img } from '@/utils/common'
 import { getExportStatusList, getExportKeyList, getExportList, deleteExport } from '@/app/api/sys'
 import { ElMessageBox, FormInstance } from 'element-plus'
-import { useRouter, useRoute } from 'vue-router'
+import { useRoute } from 'vue-router'
 
 const route = useRoute()
 const pageName = route.meta.title
@@ -141,8 +141,6 @@ const loadExportList = (page: number = 1) => {
 }
 loadExportList()
 
-const router = useRouter()
-
 /**
  * 下载导出报表
  */
@@ -168,7 +166,6 @@ const deleteEvent = (id: number) => {
     ).then(() => {
         deleteExport(id).then(() => {
             loadExportList()
-        }).catch(() => {
         })
     })
 }
diff --git a/admin/src/app/views/setting/layout.vue b/admin/src/app/views/setting/layout.vue
index f5b13dfb9..db300504d 100644
--- a/admin/src/app/views/setting/layout.vue
+++ b/admin/src/app/views/setting/layout.vue
@@ -46,9 +46,7 @@
                         <span class="iconfont iconwenhao text-[#999] !text-[14px]"></span>
                         <div class="ml-[2px] text-[12px] text-[#999]">如何开发自定义布局</div>
                     </div>
-                    
                 </div>
-               
                 <div class="flex justify-items-stretch">
                     <div class="w-[180px] h-[130px] mr-[10px] mb-[10px] border hover:border-primary cursor-pointer"
                          :class="{'border-primary': ((!layoutConfig[currAddon] && item.layout == 'default') || (layoutConfig[currAddon] == item.layout)) }"
@@ -64,7 +62,7 @@
                     </div>
                 </div>
                 <h3 class="panel-title !text-sm">{{ t('themeColor') }}</h3>
-                <div class="">
+                <div>
                     <el-color-picker v-model="themeColor[currAddon]" size="large" />
                     <div class="form-tip text-[#999] mt-2">设置的色调会在前端站点列表体现[home/index]，用于区分不同的应用</div>
                 </div>
@@ -120,11 +118,9 @@ getInstalledAddonList().then(({ data }) => {
 const getLayoutConfig = () => {
     getLayout().then(({ data }) => {
         layoutConfig.value = data
-        console.log('getLayoutConfig - layoutConfig', layoutConfig.value)
     })
     getThemecolor().then(({ data }) => {
         themeColor.value = data
-        console.log('getLayoutConfig - themeColor', themeColor.value)
     })
 }
 getLayoutConfig()
diff --git a/admin/src/app/views/setting/login.vue b/admin/src/app/views/setting/login.vue
index 9c8dc9c91..cd646038f 100644
--- a/admin/src/app/views/setting/login.vue
+++ b/admin/src/app/views/setting/login.vue
@@ -65,12 +65,8 @@ import { reactive, ref, computed } from 'vue'
 import { t } from '@/lang'
 import { getLoginConfig, setLoginConfig } from '@/app/api/member'
 import { FormInstance } from 'element-plus'
-import { useRoute } from 'vue-router'
 import { cloneDeep } from 'lodash-es'
 
-const route = useRoute()
-const pageName = route.meta.title
-
 const loading = ref(true)
 const ruleFormRef = ref<FormInstance>()
 const formData:any = reactive({
diff --git a/admin/src/app/views/setting/notice.vue b/admin/src/app/views/setting/notice.vue
index 30df41d1a..75b09cfbc 100644
--- a/admin/src/app/views/setting/notice.vue
+++ b/admin/src/app/views/setting/notice.vue
@@ -85,10 +85,6 @@ import { getNoticeList } from '@/app/api/notice'
 import Sms from '@/app/views/setting/components/notice-sms.vue'
 import Wechat from '@/app/views/setting/components/notice-wechat.vue'
 import Weapp from '@/app/views/setting/components/notice-weapp.vue'
-import { useRoute } from 'vue-router'
-
-const route = useRoute()
-const pageName = route.meta.title
 
 const smsDialog : Record<string, any> | null = ref(null)
 const wechatDialog : Record<string, any> | null = ref(null)
@@ -153,9 +149,17 @@ loadNoticeList()
 
 const setNotice = (data : any, type : string) => {
     data.type = type
-    eval('data.status=data.is_' + type)
-    eval(type + 'Dialog.value.setFormData(data)')
-    eval(type + 'Dialog.value.showDialog = true;')
+    data.status = data['is_' + type]
+    if (type === 'sms') {
+        smsDialog.value.setFormData(data)
+        smsDialog.value.showDialog = true
+    } else if (type === 'wechat') {
+        wechatDialog.value.setFormData(data)
+        wechatDialog.value.showDialog = true
+    } else if (type === 'weapp') {
+        weappDialog.value.setFormData(data)
+        weappDialog.value.showDialog = true
+    }
 }
 </script>
 
diff --git a/admin/src/app/views/setting/notice_records.vue b/admin/src/app/views/setting/notice_records.vue
index 63290aef7..1f0f15a3a 100644
--- a/admin/src/app/views/setting/notice_records.vue
+++ b/admin/src/app/views/setting/notice_records.vue
@@ -157,7 +157,6 @@ const loadNoticeLogList = (page: number = 1) => {
     })
 }
 loadNoticeLogList()
-
 const resetForm = (formEl: FormInstance | undefined) => {
     if (!formEl) return
     formEl.resetFields()
diff --git a/admin/src/app/views/setting/pay.vue b/admin/src/app/views/setting/pay.vue
index 72aa4473b..722512aa0 100644
--- a/admin/src/app/views/setting/pay.vue
+++ b/admin/src/app/views/setting/pay.vue
@@ -156,10 +156,6 @@ const enablePaymentMode = async (data: any) => {
     }
 }
 
-interface SortableEvt extends SortableEvent {
-    originalEvent?: DragEvent
-}
-
 // 拖动
 const fieldBoxRefs = ref<any>([])
 watch(isEdit, (newValue, oldValue) => {
diff --git a/admin/src/app/views/setting/system.vue b/admin/src/app/views/setting/system.vue
index 7d9151ce3..da6863ea4 100644
--- a/admin/src/app/views/setting/system.vue
+++ b/admin/src/app/views/setting/system.vue
@@ -20,6 +20,18 @@
                         <p class="text-[12px] text-[#a9a9a9]">{{ t('iconPlaceholder') }}</p>
                     </div>
                 </el-form-item>
+                <el-form-item :label="t('siteLoginLogo')" v-if="appType == 'admin'">
+                    <div>
+                        <upload-image v-model="formData.site_login_logo" />
+                        <p class="text-[12px] text-[#a9a9a9]">{{ t('siteLoginLogoTips') }}</p>
+                    </div>
+                </el-form-item>
+                <el-form-item :label="t('siteLoginBgImg')" v-if="appType == 'admin'">
+                    <div>
+                        <upload-image v-model="formData.site_login_bg_img" />
+                        <p class="text-[12px] text-[#a9a9a9]">{{ t('siteLoginBgImgTips') }}</p>
+                    </div>
+                </el-form-item>
                 <el-form-item :label="t('keywords')">
                     <el-input v-model.trim="formData.keywords" :placeholder="t('keywordsPlaceholder')" class="input-width" clearable maxlength="20" show-word-limit />
                 </el-form-item>
@@ -57,6 +69,7 @@
                     <upload-image v-model="formData.enterprise_wechat" />
                 </el-form-item>
             </el-card>
+
         </el-form>
 
         <div class="fixed-footer-wrap">
@@ -73,15 +86,12 @@ import { t } from '@/lang'
 import { setWebsite, getWebsite, getService } from '@/app/api/sys'
 import { FormInstance, FormRules } from 'element-plus'
 import { getAppType } from '@/utils/common'
-import { useRoute } from 'vue-router'
 import useUserStore from '@/stores/modules/user'
-import useSystemStore from '@/stores/modules/system';
+import useSystemStore from '@/stores/modules/system'
 
-const route = useRoute()
-const pageName = route.meta.title
 const loading = ref(true)
 const appType = ref(getAppType())
-const formData = reactive<Record<string, string>>({
+const formData: any = reactive<Record<string, string>>({
     site_name: '',
     logo: '',
     desc: '',
@@ -101,7 +111,9 @@ const formData = reactive<Record<string, string>>({
     icon: '',
     wechat_code: '',
     enterprise_wechat: '',
-    tel: ''
+    tel: '',
+    site_login_logo: '',
+    site_login_bg_img: ''
 })
 
 const setFormData = async () => {
@@ -110,10 +122,12 @@ const setFormData = async () => {
         if (data[key] != undefined) formData[key] = data[key]
     })
 
-    const service_data = await (await getService()).data
-    formData['wechat_code'] = service_data.wechat_code
-    formData['enterprise_wechat'] = service_data.enterprise_wechat
-    formData['tel'] = service_data.tel
+    const service_data: any = await (await getService()).data
+    formData.wechat_code = service_data.wechat_code
+    formData.enterprise_wechat = service_data.enterprise_wechat
+    formData.tel = service_data.tel
+    formData.site_login_logo = service_data.site_login_logo
+    formData.site_login_bg_img = service_data.site_login_bg_img
     loading.value = false
 }
 setFormData()
@@ -139,7 +153,6 @@ const save = async (formEl: FormInstance | undefined) => {
     await formEl.validate(async (valid) => {
         if (valid) {
             loading.value = true
-
             setWebsite(formData).then(() => {
                 loading.value = false
                 appType.value == 'admin' ? useSystemStore().getWebsiteInfo() : useUserStore().getSiteInfo()
diff --git a/admin/src/app/views/setting/transfer.vue b/admin/src/app/views/setting/transfer.vue
index a596852df..b7bebeca4 100644
--- a/admin/src/app/views/setting/transfer.vue
+++ b/admin/src/app/views/setting/transfer.vue
@@ -8,7 +8,7 @@
             </div>
 
             <div class="mt-[20px]">
-                <el-alert :description="t('transferTips')" type="warning" show-icon>
+                <el-alert type="warning" show-icon>
                     <template #title>
                         <span class="!text-[14px]">{{ t('operationTip') }}</span>
                     </template>
@@ -40,6 +40,17 @@
                     </div>
                     <div class="form-tip">{{ t('mchPublicCertPathTips') }}</div>
                 </el-form-item>
+                <el-form-item :label="t('wechatpayPublicCert')" prop="wechatpay_config.wechat_public_cert_path">
+                    <div class="input-width">
+                        <upload-file v-model="formData.wechatpay_config.wechat_public_cert_path" api="sys/document/wechat" />
+                    </div>
+                </el-form-item>
+
+                <el-form-item :label="t('wechatpayPublicCertId')" prop="wechatpay_config.wechat_public_cert_id">
+                    <div class="input-width">
+                        <el-input v-model.trim="formData.wechatpay_config.wechat_public_cert_id" placeholder="" class="input-width" show-word-limit clearable />
+                    </div>
+                </el-form-item>
             </el-card>
 
             <!-- <el-card class="box-card mt-[15px] !border-none" shadow="never">
@@ -98,7 +109,9 @@ const initialFormData = {
         mch_id: '',
         mch_secret_key: '',
         mch_secret_cert: '',
-        mch_public_cert_path: ''
+        mch_public_cert_path: '',
+        wechat_public_cert_path: '',
+        wechat_public_cert_id: ''
     },
     alipay_config: {
         app_secret_cert: '',
diff --git a/admin/src/app/views/site/components/user-edit.vue b/admin/src/app/views/site/components/user-edit.vue
index 2d61f9206..6b1ea151a 100644
--- a/admin/src/app/views/site/components/user-edit.vue
+++ b/admin/src/app/views/site/components/user-edit.vue
@@ -16,11 +16,23 @@
                     </el-form-item>
 
                     <el-form-item :label="t('password')" prop="password">
-                        <el-input v-model.trim="formData.password" clearable :placeholder="t('passwordPlaceholder')" class="input-width" :show-password="true" type="password" :readonly="passwordInput" @click="passwordInput = false" @blur="passwordInput = true"  />
+                        <el-input v-model.trim="formData.password" :class="passwordType == 'text' ? '' :'displayPass'" clearable :placeholder="t('passwordPlaceholder')" class="input-width" :readonly="passwordInput" @click="passwordInput = false" @blur="passwordInput = true"  >
+                            <template #suffix>
+                                <el-icon @click="togglePasswordVisibility" class="cursor-pointer">
+                                    <component :is=" passwordType === 'password' ? 'Hide' : 'View'" />
+                                </el-icon>
+                            </template>
+                        </el-input>
                     </el-form-item>
 
                     <el-form-item :label="t('confirmPassword')" prop="confirm_password">
-                        <el-input v-model.trim="formData.confirm_password" :placeholder="t('confirmPasswordPlaceholder')" type="password" :show-password="true" clearable class="input-width" :readonly="confirmPasswordInput" @click="confirmPasswordInput = false" @blur="confirmPasswordInput = true" />
+                        <el-input v-model.trim="formData.confirm_password" :class="confirmPasswordType == 'text' ? '' :'displayPass'"  :placeholder="t('confirmPasswordPlaceholder')" clearable class="input-width" :readonly="confirmPasswordInput" @click="confirmPasswordInput = false" @blur="confirmPasswordInput = true" >
+                            <template #suffix>
+                                <el-icon @click="toggleConfirmPasswordVisibility" class="cursor-pointer">
+                                    <component :is=" confirmPasswordType === 'password' ? 'Hide' : 'View'" />
+                                </el-icon>
+                            </template>
+                        </el-input>
                     </el-form-item>
 
                     <el-form-item :label="t('userCreateSiteLimit')" v-if="!formData.uid && Object.keys(siteGroup).length" prop="create_site_limit">
@@ -223,6 +235,18 @@ const realnameInput = ref(true)
 const passwordInput = ref(true)
 const confirmPasswordInput = ref(true)
 
+const passwordType = ref('password')
+
+const togglePasswordVisibility = () => {
+    passwordType.value = passwordType.value === 'password' ? 'text' : 'password'
+}
+const confirmPasswordType = ref('password')
+
+const toggleConfirmPasswordVisibility = () => {
+    confirmPasswordType.value = confirmPasswordType.value === 'password' ? 'text' : 'password'
+}
+
+
 defineExpose({
     showDialog,
     setFormData
@@ -230,5 +254,9 @@ defineExpose({
 </script>
 
 <style lang="scss" scoped>
-
+.displayPass {
+  ::v-deep .el-input__inner{
+    -webkit-text-security: disc !important;
+  }
+}
 </style>
diff --git a/admin/src/app/views/site/list.vue b/admin/src/app/views/site/list.vue
index 5ecaf2af4..536b3160e 100644
--- a/admin/src/app/views/site/list.vue
+++ b/admin/src/app/views/site/list.vue
@@ -9,7 +9,7 @@
                     <el-button type="primary" class="w-[100px]" @click="addEvent">
                         {{ t('addSite') }}
                     </el-button>
-                    <el-button type="default" class="w-[100px]" @click="toSiteLink()">
+                    <el-button class="w-[100px]" @click="toSiteLink()">
                         {{ t('toSite') }}
                     </el-button>
                 </div>
diff --git a/admin/src/app/views/site/user.vue b/admin/src/app/views/site/user.vue
index f6aaf6247..c4966ad21 100644
--- a/admin/src/app/views/site/user.vue
+++ b/admin/src/app/views/site/user.vue
@@ -98,8 +98,7 @@ import { img } from '@/utils/common'
 import type { FormInstance } from 'element-plus'
 import { useRouter, useRoute } from 'vue-router'
 import userEdit from './components/user-edit.vue'
-import {ElMessageBox} from "element-plus";
-import {deleteSite} from "@/app/api/site";
+import { ElMessageBox } from "element-plus";
 
 const router = useRouter()
 const route = useRoute()
diff --git a/admin/src/app/views/tools/addon/edit.vue b/admin/src/app/views/tools/addon/edit.vue
index 65c558dcc..f9ee826e9 100644
--- a/admin/src/app/views/tools/addon/edit.vue
+++ b/admin/src/app/views/tools/addon/edit.vue
@@ -205,7 +205,6 @@ const getAddonDevelopCheckFn = (key: any) => {
             // autofocus: false,
             confirmButtonText: t('confirm'),
             callback: (action: any) => {
-                console.log(action)
             }
         })
     })
diff --git a/admin/src/app/views/tools/attachment.vue b/admin/src/app/views/tools/attachment.vue
index 518af1180..116531f91 100644
--- a/admin/src/app/views/tools/attachment.vue
+++ b/admin/src/app/views/tools/attachment.vue
@@ -1,18 +1,18 @@
 <template>
-	<div class="main-container attachment-container">
-		<el-card class="box-card !border-none full-container" shadow="never">
+    <div class="main-container attachment-container">
+        <el-card class="box-card !border-none full-container" shadow="never">
 
-			<div class="flex justify-between items-center mb-[20px]">
+            <div class="flex justify-between items-center mb-[20px]">
                 <span class="text-page-title">{{ pageName }}</span>
             </div>
 
-			<el-tabs v-model="type">
-				<el-tab-pane :label="t(tab)" v-for="(tab, index) in attachmentType" :name="tab" :key="index">
-					<attachment scene="attachment" :type="tab" />
-				</el-tab-pane>
-			</el-tabs>
-		</el-card>
-	</div>
+            <el-tabs v-model="type">
+                <el-tab-pane :label="t(tab)" v-for="(tab, index) in attachmentType" :name="tab" :key="index">
+                    <attachment scene="attachment" :type="tab" />
+                </el-tab-pane>
+            </el-tabs>
+        </el-card>
+    </div>
 </template>
 
 <script lang="ts" setup>
@@ -29,47 +29,47 @@ const type = ref(attachmentType[0])
 </script>
 
 <style lang="scss">
-	.attachment-container {
-        overflow: hidden;
-        min-height: calc(100vh - 94px);
-        background-color: var(--el-bg-color-overlay);
+.attachment-container {
+    overflow: hidden;
+    min-height: calc(100vh - 94px);
+    background-color: var(--el-bg-color-overlay);
 
-        .full-container {
-            height: calc(100vh - 100px);
+    .full-container {
+        height: calc(100vh - 100px);
+    }
+
+    .el-card__body {
+        height: 100%;
+    }
+
+    .el-tabs {
+        display: flex;
+        flex-direction: column;
+        height: calc(100% - 40px);
+    }
+
+    .el-tabs__content {
+        flex: 1;
+
+        .el-tab-pane {
+            height: 100%;
+        }
+    }
+
+    .el-tabs__nav-wrap::after {
+        height: 1px;
+    }
+
+    .main-wrap {
+        border: none;
+
+        .group-wrap {
+            padding: 0 15px 0 0;
         }
 
-		.el-card__body {
-			height: 100%;
-		}
-
-		.el-tabs {
-			display: flex;
-            flex-direction: column;
-            height: calc(100% - 40px);
-		}
-
-		.el-tabs__content {
-			flex: 1;
-
-			.el-tab-pane {
-				height: 100%;
-			}
-		}
-
-		.el-tabs__nav-wrap::after {
-			height: 1px;
-		}
-
-		.main-wrap {
-			border: none;
-
-			.group-wrap {
-				padding: 0 15px 0 0;
-			}
-
-			.attachment-list-wrap {
-				padding: 0 0 0 15px;
-			}
-		}
-	}
+        .attachment-list-wrap {
+            padding: 0 0 0 15px;
+        }
+    }
+}
 </style>
diff --git a/admin/src/app/views/tools/backup_records.vue b/admin/src/app/views/tools/backup_records.vue
new file mode 100644
index 000000000..786281267
--- /dev/null
+++ b/admin/src/app/views/tools/backup_records.vue
@@ -0,0 +1,784 @@
+
+<template>
+    <div class="main-container">
+        <el-card class="box-card !border-none" shadow="never">
+
+            <div class="flex justify-between items-center">
+                <span class="text-page-title">{{ pageName }}</span>
+                <el-button type="primary" @click="manualBackupEvent">
+                    {{ t('manualBackup') }}
+                </el-button>
+            </div>
+
+            <el-card class="box-card !border-none my-[10px] table-search-wrap" shadow="never">
+                <el-form :inline="true" :model="tableData.searchParam" ref="searchFormRef">
+                    <el-form-item :label="t('content')" prop="content">
+                        <el-input v-model.trim="tableData.searchParam.content" :placeholder="t('contentPlaceholder')" />
+                    </el-form-item>
+
+                    <el-form-item>
+                        <el-button type="primary" @click="loadList()">{{ t('search') }}</el-button>
+                        <el-button @click="resetForm(searchFormRef)">{{ t('reset') }}</el-button>
+                    </el-form-item>
+                </el-form>
+            </el-card>
+
+            <div class="mb-[10px] flex items-center">
+                <el-button @click="batchDelete" size="small">{{ t('batchDelete') }}</el-button>
+            </div>
+
+            <el-table :data="tableData.data" size="large" v-loading="tableData.loading" ref="tableRef" @selection-change="handleSelectionChange">
+
+                <template #empty>
+                    <span>{{ !tableData.loading ? t('emptyData') : '' }}</span>
+                </template>
+
+                <el-table-column type="selection" width="55" />
+                <el-table-column prop="id" :label="t('id')" width="120" />
+                <el-table-column prop="content" :label="t('content')" width="120" />
+                <el-table-column prop="version" :label="t('currentVersion')" width="120" />
+                <el-table-column prop="backup_dir" :label="t('backupDir')" width="220" />
+                <el-table-column prop="complete_time" :label="t('completeTime')" width="220" />
+                <el-table-column prop="remark" :label="t('remark')">
+                    <template #default="{ row }">
+                        <span v-if="row.remark" class="multi-hidden">{{ row.remark }}</span>
+                        <span v-else>{{ t('remarkEmpty') }}</span>
+                    </template>
+                </el-table-column>
+                <el-table-column :label="t('operation')" align="right" fixed="right" width="200">
+                    <template #default="{ row }">
+                        <el-button type="primary" link @click="remarkEvent(row)">{{ t('remark') }}</el-button>
+                        <el-button type="primary" link @click="restoreEvent(row)">{{ t('restore') }}</el-button>
+                        <el-button type="primary" link @click="deleteEvent(row.id)">{{ t('delete') }}</el-button>
+                    </template>
+                </el-table-column>
+            </el-table>
+
+            <div class="mt-[16px] flex justify-end">
+                <el-pagination v-model:current-page="tableData.page"
+                    v-model:page-size="tableData.limit" layout="total, sizes, prev, pager, next, jumper"
+                    :total="tableData.total" @size-change="loadList()"
+                    @current-change="loadList" />
+            </div>
+        </el-card>
+
+        <el-dialog v-model="showDialog" :title="iSBackupRecovery == 1 ? t('manualBackupTitle') : t('restoreTitle')" width="850px" :close-on-click-modal="false" :close-on-press-escape="false" :show-close="true" :before-close="dialogClose">
+
+            <el-steps :active="numberOfSteps" align-center class="number-of-steps" finish-status="success" process-status="process">
+                <template v-if="iSBackupRecovery == 1">
+                    <!-- 手动备份 -->
+                    <el-step :title="t('testDirectoryPermissions')" />
+                    <el-step :title="t('startBackUp')" />
+                    <el-step :title="t('backUpEnd')" />
+                </template>
+                <template v-else>
+                    <!-- 恢复 -->
+                    <el-step :title="t('testDirectoryPermissions')" />
+                    <el-step :title="t('startUpgrade')" />
+                    <el-step :title="t('upgradeEnd')" />
+                </template>
+            </el-steps>
+
+            <div class="h-[400px]" style="overflow: auto">
+
+                <!-- 检测目录权限 -->
+                <div class="flex flex-col" v-show="active == 'check'">
+                    <el-scrollbar>
+                        <div class="bg-[#fff] my-3">
+                            <div class="px-[20px] pt-[10px] text-[14px] el-table">
+                                <el-row class="py-[10px] items table-head-bg pl-[15px] mb-[10px]">
+                                    <el-col :span="18">
+                                        <span>{{ t("upgrade.path") }}</span>
+                                    </el-col>
+                                    <el-col :span="3">
+                                        <span>{{ t("upgrade.demand") }}</span>
+                                    </el-col>
+                                    <el-col :span="3">
+                                        <span>{{ t("status") }}</span>
+                                    </el-col>
+                                </el-row>
+
+                                <div style="height: calc(300px); overflow: auto" v-if="upgradeCheck && upgradeCheck.dir">
+                                    <el-row class="pb-[10px] items pl-[15px]" v-for="item in upgradeCheck.dir.is_readable">
+                                        <el-col :span="18">
+                                            <span>{{ item.dir }}</span>
+                                        </el-col>
+                                        <el-col :span="3">
+                                            <span :class="{ 'mx-[10px]' : (upgradeCheck.dir.is_readable.length + upgradeCheck.dir.is_write.length) > 9 }">{{ t("upgrade.readable") }}</span>
+                                        </el-col>
+                                        <el-col :span="3">
+                                            <span v-if="item.status" :class="{ 'mx-[20px]' : (upgradeCheck.dir.is_readable.length + upgradeCheck.dir.is_write.length) > 9 }">
+                                                <el-icon color="green">
+                                                    <Select />
+                                                </el-icon>
+                                            </span>
+                                            <span v-else :class="{ 'mx-[20px]' : (upgradeCheck.dir.is_readable.length + upgradeCheck.dir.is_write.length) > 9 }">
+                                                <el-icon color="red">
+                                                    <CloseBold />
+                                                </el-icon>
+                                            </span>
+                                        </el-col>
+                                    </el-row>
+                                    <el-row class="pb-[10px] items pl-[15px]" v-for="item in upgradeCheck.dir.is_write">
+                                        <el-col :span="18">
+                                            <span>{{ item.dir }}</span>
+                                        </el-col>
+                                        <el-col :span="3">
+                                            <span :class="{ 'mx-[10px]' : (upgradeCheck.dir.is_readable.length + upgradeCheck.dir.is_write.length) > 9 }">{{ t("upgrade.write") }}</span>
+                                        </el-col>
+                                        <el-col :span="3">
+                                            <span v-if="item.status" :class="{ 'mx-[20px]' : (upgradeCheck.dir.is_readable.length + upgradeCheck.dir.is_write.length) > 9 }">
+                                                <el-icon color="green">
+                                                    <Select />
+                                                </el-icon>
+                                            </span>
+                                            <span v-else :class="{ 'mx-[20px]' : (upgradeCheck.dir.is_readable.length + upgradeCheck.dir.is_write.length) > 9 }">
+                                                <el-icon color="red">
+                                                    <CloseBold />
+                                                </el-icon>
+                                            </span>
+                                        </el-col>
+                                    </el-row>
+                                </div>
+                                <div v-else>
+                                    <div v-loading="true" style="height: calc(300px); overflow: auto"></div>
+                                </div>
+                            </div>
+                        </div>
+                    </el-scrollbar>
+                </div>
+
+                <!-- 执行任务 -->
+                <div class="h-[370px] mt-[30px]" v-if="active == 'execute'">
+                    <terminal ref="terminalRef" context="" :init-log="null" :show-header="false" :show-log-time="true" @exec-cmd="onExecCmd"/>
+                </div>
+
+                <!-- 完成 -->
+                <div class="mt-[50px]" v-if="active == 'complete'">
+                    <el-result icon="success" :title="iSBackupRecovery == 1 ? t('backupCompleteTips') : t('restoreCompleteTips')"></el-result>
+                </div>
+            </div>
+
+            <template #footer>
+                <div class="dialog-footer" v-if="active == 'check'">
+                    <!-- 手动备份 -->
+                    <el-button v-if="iSBackupRecovery == 1" type="primary" :loading="uploading" :disabled="isPass" @click="manualBackupFn()">{{ t("nextStep") }}</el-button>
+
+                    <!-- 恢复 -->
+                    <el-button v-else type="primary" :loading="uploading" :disabled="isPass" @click="restoreUpgradeBackupFn(currentId)">{{ t("nextStep") }}</el-button>
+                </div>
+            </template>
+
+        </el-dialog>
+
+        <el-dialog v-model="showRemarkDialog" :title="t('remark')" width="460px" :destroy-on-close="true">
+            <el-form :model="formData" ref="formRef" class="page-form" v-loading="remarkLoading">
+                <el-form-item class="mb-0">
+                    <el-input v-model.trim="formData.remark" :rows="5" type="textarea" maxlength="200" show-word-limit />
+                </el-form-item>
+            </el-form>
+            <template #footer>
+            <span class="dialog-footer">
+                <el-button @click="showRemarkDialog = false">{{ t('cancel') }}</el-button>
+                <el-button type="primary" :loading="remarkLoading" @click="modifyRemarkFn()">{{ t('confirm') }}</el-button>
+            </span>
+            </template>
+        </el-dialog>
+    </div>
+</template>
+
+<script lang="ts" setup>
+import { ref, reactive, nextTick, watch, h } from 'vue'
+import { t } from '@/lang'
+import { ElMessage, ElMessageBox, FormInstance } from 'element-plus'
+import { useRoute } from 'vue-router'
+import { checkDirExist, checkPermission, getBackupRecords, restoreUpgradeBackup, deleteRecords, modifyBackupRemark, manualBackup, performBackupTasks, performRecoveryTasks } from '@/app/api/upgrade'
+import { Terminal, TerminalFlash } from 'vue-web-terminal'
+import 'vue-web-terminal/lib/theme/dark.css'
+import { AnyObject } from '@/types/global'
+
+const route = useRoute()
+const pageName = route.meta.title
+const searchFormRef = ref<FormInstance>()
+const multipleSelection: any = ref([]) // 选中数据
+const tableRef = ref()
+const repeat = ref(false)
+const cloudBuildTask = ref<null | AnyObject>(null)
+const tableData: any = reactive({
+    page: 1,
+    limit: 10,
+    total: 0,
+    loading: true,
+    data: [],
+    searchParam: {
+        content: ''
+    }
+})
+
+const showDialog: any = ref<boolean>(false)
+const active = ref('check')
+const interrupt: any = ref(false) // 是否中断
+const upgradeCheck = ref<null | AnyObject>(null)
+const terminalRef: any = ref(null)
+const cloudBuildLog: any = []
+let notificationEl: any = null
+const isPass: any = ref(false)
+const uploading: any = ref(false)
+const numberOfSteps = ref(0)
+const currentId: any = ref(0)
+
+const resetForm = (formEl: FormInstance | undefined) => {
+    if (!formEl) return
+
+    formEl.resetFields()
+    loadList()
+}
+
+// 监听表格单行选中
+const handleSelectionChange = (val: []) => {
+    multipleSelection.value = val
+}
+
+/**
+ * 获取列表
+ */
+const loadList = (page: number = 1) => {
+    tableData.loading = true
+    tableData.page = page
+    getBackupRecords({
+        page: tableData.page,
+        limit: tableData.limit,
+        ...tableData.searchParam
+    }).then(res => {
+        tableData.loading = false
+        tableData.data = res.data.data
+        tableData.total = res.data.total
+    }).catch(() => {
+        tableData.loading = false
+    })
+}
+
+loadList()
+const iSBackupRecovery = ref(0) // 1：手动备份 2：恢复
+
+// 手动备份
+const manualBackupEvent = () => {
+    ElMessageBox.confirm(t('manualBackupTips'), t('warning'),
+        {
+            confirmButtonText: t('confirm'),
+            cancelButtonText: t('cancel'),
+            type: 'warning'
+        }
+    ).then(() => {
+        // if (repeat.value) return
+        // repeat.value = true
+
+        iSBackupRecovery.value = 1
+        showDialog.value = true
+        uploading.value = true
+        active.value = 'check'
+        interrupt.value = false
+        checkPermissionFn()
+    })
+}
+
+// 进入执行备份
+const manualBackupFn = (task: any = '') => {
+    // 执行一半，中途取消，拦截执行
+    if (interrupt.value) return
+
+    if (task == '') {
+        numberOfSteps.value = 1
+        active.value = 'execute'
+    }
+    manualBackup({ task }).then((res: any) => {
+        const data = res.data
+        if (task == '') {
+            terminalRef.value.execute('clear')
+            terminalRef.value.execute('开始执行')
+        }
+        terminalRef.value.pushMessage({ content: `${ data.content }` })
+        if (data.task == 'end') {
+            numberOfSteps.value = 2
+            setTimeout(() => {
+                numberOfSteps.value = 3
+                active.value = 'complete'
+                loadList()
+                repeat.value = false
+            }, 1500)
+        } else if (data.task == 'fail') {
+            // 恢复失败
+            setTimeout(() => {
+                loadList()
+                repeat.value = false
+            }, 2000)
+        } else {
+            // 延迟2秒请求，等待恢复数据加载完成
+            setTimeout(() => {
+                manualBackupFn(data.task)
+            }, 2000)
+        }
+    }).catch(() => {
+        repeat.value = false
+        tableData.loading = false
+    })
+}
+
+/**
+ * 查询备份任务
+*/
+const getCloudBuildTaskFn = () => {
+    performBackupTasks({}).then(({ data }) => {
+        if (!data) return
+
+        cloudBuildTask.value = data
+
+        if (!showDialog.value && data.data && data.data.length > 0) {
+            showElNotification()
+        }
+    }).catch()
+}
+
+// 注释获取任务 后续改
+// getCloudBuildTaskFn()
+/**
+ * 备份中任务提示
+ */
+const showElNotification = () => {
+    notificationEl = ElNotification.success({
+        title: t('warning'),
+        dangerouslyUseHTMLString: true,
+        message: h('div', {}, [
+            t('cloudbuild.executingTips'),
+            h('span', { class: 'text-primary cursor-pointer', onClick: elNotificationClick }, [t('cloudbuild.clickView')])
+        ]),
+        duration: 0,
+        showClose: false
+    })
+}
+
+// 点击进入备份窗口
+const elNotificationClick = () => {
+    iSBackupRecovery.value = 1
+    showDialog.value = true
+    nextTick(() => {
+        notificationEl && notificationEl.close()
+        terminalRef.value.execute('clear')
+        terminalRef.value.execute('开始执行')
+        getCloudBuildLogFn()
+    })
+}
+
+// 窗口list展示
+const getCloudBuildLogFn = () => {
+    performBackupTasks({}).then(({ data }) => {
+        if (!data) return
+        cloudBuildTask.value = data
+        cloudBuildTask.value.data.forEach(item => {
+            if (!cloudBuildLog.includes(item.content)) {
+                terminalRef.value.pushMessage({ content: `${item.content}` })
+                cloudBuildLog.push(item.content)
+            }
+        })
+
+        const lastTask = data.data[data.data.length - 1].task
+        if (lastTask === 'end' || data.data.length == 0) {
+            setTimeout(() => {
+                active.value = 'complete'
+                loadList()
+                repeat.value = false
+            }, 1500)
+        } else if (lastTask === 'fail') {
+            // 恢复失败
+            setTimeout(() => {
+                loadList()
+                repeat.value = false
+            }, 2000)
+        } else {
+            setTimeout(() => {
+                getCloudBuildLogFn()
+            }, 2000)
+        }
+    })
+}
+
+// 恢复备份
+const restoreEvent = (data: any) => {
+    ElMessageBox.confirm(t('restoreTips'), t('warning'),
+        {
+            confirmButtonText: t('confirm'),
+            cancelButtonText: t('cancel'),
+            type: 'warning'
+        }
+    ).then(() => {
+        // if (repeat.value) return
+        // repeat.value = true
+        iSBackupRecovery.value = 2
+        currentId.value = data.id
+        active.value = 'check'
+        interrupt.value = false
+        checkDirExistFn(data.id)
+    })
+}
+
+// 检测目录是否存在
+const checkDirExistFn = (id: any) => {
+    checkDirExist({ id }).then(({ data }) => {
+        if (data) {
+            showDialog.value = true
+            uploading.value = true
+            checkPermissionFn()
+        }
+    })
+}
+
+// 检测目录权限
+const checkPermissionFn = () => {
+    checkPermission({}).then(({ data }) => {
+        upgradeCheck.value = data
+        isPass.value = !data.is_pass
+        uploading.value = false
+    })
+}
+
+// 执行恢复备份
+const restoreUpgradeBackupFn = (id: any, task: any = '') => {
+    // 执行一半，中途取消，拦截执行
+    if (interrupt.value) return
+    if (task == '') {
+        numberOfSteps.value = 1
+        active.value = 'execute'
+    }
+
+    restoreUpgradeBackup({
+        id,
+        task
+    }).then((res: any) => {
+        const data = res.data
+        if (task == '') {
+            uploading.value = false
+            terminalRef.value.execute('clear')
+            terminalRef.value.execute('开始执行')
+        }
+        terminalRef.value.pushMessage({ content: `${ data.content }` })
+        if (data.task == 'end') {
+            numberOfSteps.value = 2
+            setTimeout(() => {
+                numberOfSteps.value = 3
+                active.value = 'complete'
+                loadList()
+                repeat.value = false
+            }, 1500)
+        } else if (data.task == 'fail') {
+            // 恢复失败
+            setTimeout(() => {
+                loadList()
+                repeat.value = false
+            }, 2000)
+        } else {
+            // 延迟2秒请求，等待恢复数据加载完成
+            setTimeout(() => {
+                restoreUpgradeBackupFn(id, data.task)
+            }, 2000)
+        }
+    }).catch(() => {
+        repeat.value = false
+        tableData.loading = false
+    })
+}
+
+/**
+ * 查询恢复任务
+ */
+const resumeUpgradeTasks = () => {
+    performRecoveryTasks({}).then(({ data }) => {
+        if (!data) return
+
+        cloudBuildTask.value = data
+
+        if (!showDialog.value && data.data && data.data.length > 0) {
+            recoveryTaskPrompt()
+        }
+    }).catch()
+}
+// 注释获取任务 后续改
+// resumeUpgradeTasks()
+/**
+ * 恢复中任务提示
+ */
+
+const recoveryTaskPrompt = () => {
+    notificationEl = ElNotification.success({
+        title: t('warning'),
+        dangerouslyUseHTMLString: true,
+        message: h('div', {}, [
+            t('cloudbuild.executingTips'),
+            h('span', { class: 'text-primary cursor-pointer', onClick: recoveryTaskPromptClick }, [t('cloudbuild.clickView')])
+        ]),
+        duration: 0,
+        showClose: false
+    })
+}
+
+// 点击任务提示进入窗口
+const recoveryTaskPromptClick = () => {
+    iSBackupRecovery.value = 2
+    showDialog.value = true
+    nextTick(() => {
+        notificationEl && notificationEl.close()
+        terminalRef.value.execute('clear')
+        terminalRef.value.execute('开始执行')
+        restoreTaskList()
+    })
+}
+
+// 进入恢复窗口列表
+const restoreTaskList = () => {
+    performRecoveryTasks({}).then(({ data }) => {
+        if (!data) return
+        cloudBuildTask.value = data
+        cloudBuildTask.value.data.forEach(item => {
+            if (!cloudBuildLog.includes(item.content)) {
+                terminalRef.value.pushMessage({ content: `${item.content}` })
+                cloudBuildLog.push(item.content)
+            }
+        })
+
+        const lastTask = data.data[data.data.length - 1].task
+        if (lastTask === 'end' || data.data.length == 0) {
+            setTimeout(() => {
+                active.value = 'complete'
+                loadList()
+                repeat.value = false
+            }, 1500)
+        } else if (lastTask === 'fail') {
+            // 恢复失败
+            setTimeout(() => {
+                loadList()
+                repeat.value = false
+            }, 2000)
+        } else {
+            setTimeout(() => {
+                restoreTaskList()
+            }, 2000)
+        }
+    })
+}
+
+const dialogClose = (done: () => {}) => {
+    if (active.value == 'execute') {
+        ElMessageBox.confirm(
+            t('showDialogCloseTips'),
+            t('warning'),
+            {
+                confirmButtonText: t('confirm'),
+                cancelButtonText: t('cancel'),
+                type: 'warning'
+            }
+        ).then(() => {
+            terminalRef.value.execute('clear')
+            interrupt.value = true // 执行一半，中途取消，需要恢复初始状态
+            done()
+        }).catch(() => {
+        })
+    } else {
+        if (active.value == 'complete') {
+            // 恢复备份需要等待恢复数据加载完成，延迟刷新页面
+            setTimeout(() => {
+                location.reload()
+            }, 500)
+        }
+        done()
+    }
+}
+
+/**
+ * 升级进度动画
+ */
+let flashInterval: null | number = null
+const terminalFlash = new TerminalFlash()
+const onExecCmd = (key, command, success, failed, name) => {
+    if (command == '开始执行') {
+        success(terminalFlash)
+        const frames = makeIterator(['/', '——', '\\', '|'])
+        flashInterval = setInterval(() => {
+            terminalFlash.flush('> ' + frames.next().value)
+        }, 150)
+    }
+}
+
+const makeIterator = (array: string[]) => {
+    let nextIndex = 0
+    return {
+        next () {
+            if ((nextIndex + 1) == array.length) {
+                nextIndex = 0
+            }
+            return { value: array[nextIndex++] }
+        }
+    }
+}
+
+watch(() => showDialog.value, () => {
+    if (!showDialog.value) {
+        active.value = 'execute'
+        flashInterval && clearInterval(flashInterval)
+    }
+})
+
+const showRemarkDialog: any = ref<boolean>(false)
+const remarkLoading = ref(false)
+const formData: any = reactive({
+    id: 0,
+    remark: ''
+})
+
+// 修改备注
+const remarkEvent = (row: any) => {
+    formData.id = row.id
+    formData.remark = row.remark
+    showRemarkDialog.value = true
+}
+
+const modifyRemarkFn = () => {
+    remarkLoading.value = true
+    modifyBackupRemark({
+        id: formData.id,
+        remark: formData.remark
+    }).then(() => {
+        showRemarkDialog.value = false
+        remarkLoading.value = false
+        loadList()
+    }).catch(() => {
+        remarkLoading.value = false
+    })
+}
+
+// 删除升级记录
+const deleteEvent = (id: number) => {
+    ElMessageBox.confirm(t('deleteTips'), t('warning'),
+        {
+            confirmButtonText: t('confirm'),
+            cancelButtonText: t('cancel'),
+            type: 'warning'
+        }
+    ).then(() => {
+        if (repeat.value) return
+        repeat.value = true
+        tableData.loading = true
+        deleteRecords({
+            ids: id
+        }).then(() => {
+            loadList()
+            repeat.value = false
+        }).catch(() => {
+            repeat.value = false
+            tableData.loading = false
+        })
+    })
+}
+
+// 批量删除升级记录
+const batchDelete = () => {
+    if (multipleSelection.value.length == 0) {
+        ElMessage({
+            type: 'warning',
+            message: `${t('batchEmptySelectedTips')}`
+        })
+        return
+    }
+
+    ElMessageBox.confirm(t('deleteTips'), t('warning'),
+        {
+            confirmButtonText: t('confirm'),
+            cancelButtonText: t('cancel'),
+            type: 'warning'
+        }
+    ).then(() => {
+        tableData.loading = true
+        if (repeat.value) return
+        repeat.value = true
+
+        const ids: any = []
+        multipleSelection.value.forEach((item: any) => {
+            ids.push(item.id)
+        })
+
+        deleteRecords({
+            ids
+        }).then(() => {
+            loadList()
+            repeat.value = false
+        }).catch(() => {
+            repeat.value = false
+            tableData.loading = false
+        })
+    })
+}
+</script>
+
+<style lang="scss" scoped>
+:deep(.terminal .t-log-box span) {
+    white-space: pre-wrap;
+}
+
+.table-head-bg {
+    background-color: var(--el-table-header-bg-color);
+}
+
+::v-deep .number-of-steps {
+    .el-step__line {
+        margin: 0 25px;
+        background: #dddddd;
+    }
+
+    .el-step__head {
+        margin-top: 10px;
+    }
+
+    .is-success {
+        color: var(--el-color-primary);
+        border-color: var(--el-color-primary);
+
+        .el-step__icon {
+            background: var(--el-color-primary);
+
+            box-shadow: 0 0 0 4px var(--el-color-primary-light-9);
+
+            i {
+                color: #fff;
+            }
+        }
+
+        .el-step__line {
+            margin: 0 25px;
+            background: var(--el-color-primary);
+        }
+    }
+
+    .is-process {
+        color: var(--el-color-primary);
+        font-weight: inherit;
+
+        // font-size: 18px;
+        .el-step__icon {
+            padding: 10px;
+            border: 1px solid var(--el-color-primary);
+            box-shadow: 0 0 0 4px var(--el-color-primary-light-9);
+        }
+    }
+
+    .is-wait {
+        color: #333;
+    }
+}
+/* 多行超出隐藏 */
+.multi-hidden {
+    word-break: break-all;
+    text-overflow: ellipsis;
+    overflow: hidden;
+    display: -webkit-box;
+    -webkit-line-clamp: 1;
+    -webkit-box-orient: vertical;
+}
+</style>
diff --git a/admin/src/app/views/tools/cloud_compile.vue b/admin/src/app/views/tools/cloud_compile.vue
new file mode 100644
index 000000000..21369cd6e
--- /dev/null
+++ b/admin/src/app/views/tools/cloud_compile.vue
@@ -0,0 +1,218 @@
+<template>
+    <div v-loading="loading" class="main-container w-full">
+        <div class="p-5 bg-[#fff] overflow-hidden">
+
+            <div class="bg-[#fff] w-[100%] rounded-[8px] overflow-hidden">
+                <div class=" relative pb-[13px]" style="border-bottom: 2px solid #f0f2f6">
+                    <div class="w-[66px] bg-primary h-[2px] absolute bottom-[0px]"></div>
+                    <span class=" text-primary text-[18px] ml-[4px]">云编译</span>
+                </div>
+                <div class="flex mt-[20px]  ml-[20px]">
+                    <el-button class="w-[98px] !h-[36px]" type="primary" @click="handleCloudBuild" :loading="cloudBuildRef?.loading">云编译</el-button>
+                    <div class="btn-time w-[181px] h-[36px] rounded-[4px] text-[#606266] text-[14px] ml-[10px]">
+                        <span>云编译执行时间大约</span>
+                         <span class="text-[16px] text-[#D43030] mx-[3px]">3</span>
+                        <span>分钟</span>
+                    </div>
+                </div>
+                <div class="mt-[21px] flex mb-[21px] items-center">
+                    <span class="flex ml-[20px] text-[16px] items-center">
+                        <i class="w-[3px] h-[12px] bg-primary mr-[6px] block"></i>
+                        温馨提示
+                    </span>
+                    <span class="text-[14px] text-[#606266] ml-[7px]"> 以下情况可以进行云编译</span>
+                </div>
+
+                <div class="text-[14px] text-[#606266] ml-[13px] mb-[18px]">云编译不需要本地安装node环境即可进行，针对使用者方便快捷</div>
+                <div class="ml-[40px] text-[14px] text-[#606266] mb-[18px]">1、系统或插件，每次安装或升级完成后，需要云编译</div>
+                <div class="ml-[40px] text-[14px] text-[#606266] mb-[18px]">2、开发者编写完前端代码之后，可以使用云编译进行源码编译</div>
+                <div class="ml-[40px] text-[14px] text-[#606266] mb-[18px]">3、由于云编译不是针对某个插件进行编译，而是系统整体编译，因此如果同时需要安装多个插件时，往往需要安装到最后一个插件才整体进行云编译</div>
+                <div class="mt-[21px] flex mb-[21px] text-[16px] items-center">
+                    <span class="flex ml-[20px] items-center">
+                        <i class="w-[3px] h-[12px] bg-primary mr-[6px] block"></i>
+                        云编译流程
+                    </span>
+                </div>
+                <div class="ml-[40px]">
+                    <el-timeline>
+                        <el-timeline-item color="#4268EF">
+                            <template #dot>
+                                <div class="w-[15px] h-[15px] bg-primary rounded-[50%] text-[9px] text-[#fff] flex items-center justify-center">1</div>
+                            </template>
+                            <div class="text-[16px] text-[#303133]">编译admin代码</div>
+                            <div class="py-[12px] px-[10px] bg-[#F7F8FA] mt-[10px] text-[#606266] text-[14px] w-[1085px]">
+                                <span>云编译会将admin端的vue代码编译为对应的html文件，同时将生成的代码下载到系统 niucloud 下的</span>
+                                <span class="text-[#FF9D31] mx-[3px]">public/admin</span>
+                                <span>目录中。后台的访问路径将变为</span>
+                                <span class="text-primary ml-[3px]">https://域名/admin</span>
+                            </div>
+                        </el-timeline-item>
+                        <el-timeline-item color="#4268EF">
+                            <template #dot>
+                                <div class="w-[15px] h-[15px] bg-primary rounded-[50%] text-[9px] text-[#fff] flex items-center justify-center">2</div>
+                            </template>
+                            <div class="text-[16px] text-[#303133]">编译uniapp代码</div>
+                            <div class="py-[12px] px-[10px] bg-[#F7F8FA] mt-[10px] text-[#606266] text-[14px] w-[1085px]">
+                                <span>云编泽会将uniapp端的vue代码编译为对应的html文件，同时将生成的代码下载到系统 niucloud下的</span>
+                                <span class="text-[#FF9D31] mx-[3px]">public/wap</span>
+                                <span>目录中，这样手机端网页的访问路径将变为</span>
+                                <span class="text-primary ml-[3px]"> https://域名/wap</span>
+                            </div>
+                        </el-timeline-item>
+                        <el-timeline-item color="#4268EF">
+                            <template #dot>
+                                <div class="w-[15px] h-[15px] bg-primary rounded-[50%] text-[9px] text-[#fff] flex items-center justify-center">3</div>
+                            </template>
+                            <div class="text-[16px] text-[#303133]">编译web代码</div>
+                            <div class="py-[12px] px-[10px] bg-[#F7F8FA] mt-[10px] text-[#606266] text-[14px] w-[1085px]">
+                                <span>云编泽会将web端的vue代码编译为对应的html文件，同时将生成的代码下载到系统 niucloud下的</span>
+                                <span class="text-[#FF9D31] mx-[3px]">public/web</span>
+                                <span>目录中，这样电脑端网页的访问路径将变为</span>
+                                <span class="text-primary ml-[3px]"> https://域名/web</span>
+                            </div>
+                        </el-timeline-item>
+                    </el-timeline>
+                </div>
+            </div>
+        </div>
+        <div class="p-5 bg-[#fff] mt-[26px]">
+            <div class="bg-[#fff] w-[100%] rounded-[8px] overflow-hidden">
+                <div class="relative pb-[13px]" style="border-bottom: 2px solid #f0f2f6">
+                    <div class="w-[85px] bg-primary h-[2px] absolute bottom-[0px]"></div>
+                    <span class="text-primary text-[18px] ml-[4px]">本地编译</span>
+                </div>
+                <div class="mt-[21px] flex mb-[21px] text-[16px] items-center">
+                    <span class="flex ml-[20px] items-center">
+                        <i class="w-[3px] h-[12px] bg-primary mr-[6px] block"></i>
+                        温馨提示
+                    </span>
+                </div>
+                <div class="ml-[40px] text-[14px] text-[#606266] mb-[18px]">
+                    <span>1、如果本地安装了Node环境，可以进行本地编译，要求</span>
+                    <span class="text-[#D43030] ml-[3px]">Node版本>18</span>
+                </div>
+                <div class="ml-[40px] text-[14px] text-[#606266] mb-[18px]">2、默认本地编译流程与云编译相同，执行本地编译命令后，会将编译后的代码移动到系统niucloud下的public下的对应端口目录下</div>
+                <div class="ml-[40px] text-[14px] text-[#606266] mb-[18px]">3、由于云编译配置的访问路径时固定的，针对客户有独立部署admin，wap，web等个性化端口名称配置需求，需要进行本地编译</div>
+                <div class="mt-[34px] flex mb-[21px] text-[16px] items-center">
+                    <span class="flex ml-[20px] items-center">
+                        <i class="w-[3px] h-[12px] bg-primary mr-[6px] block"></i>
+                        本地编译命令参考
+                    </span>
+                </div>
+                <div>
+                    <div class="ml-[40px] text-[14px] text-[#606266]">
+                        <span class=" text-[#303133]">安装依赖：</span>
+                        进入admin端与uniapp端以及web端目录都可执行
+                    </div>
+                    <div class="ml-[40px] w-[900px] h-[42px] bg-[#282C34] rounded-[4px] mt-[10px] flex items-center">
+                        <span class="text-[16px] text-[#FF9D31] ml-[10px]">npm install</span>
+                        <span class="w-[58px] h-[20px] bg-[rgba(204,204,204,0.3)] ml-[auto] text-[#fff] text-[10px] flex cursor-pointer rounded-[4px] mr-[17px] items-center justify-center" @click="copyEvent('npm install')">复制命令</span>
+                    </div>
+                </div>
+                <div class="mt-[21px]">
+                    <div class="ml-[40px] text-[14px] text-[#606266]">
+                        <span class="text-[#303133]">后台admin端口打包：</span>
+                        <span>进入admin目录下执行，执行后编译代码默认移动到系统的niucloud下的</span>
+                        <span class="text-[#FF9D31] mx-[3px]">public/admin</span>
+                        <span>目录下</span>
+                    </div>
+                    <div class="ml-[40px] w-[900px] h-[42px] bg-[#282C34] rounded-[4px] mt-[10px] flex items-center">
+                        <span class="text-[16px] text-[#FF9D31] ml-[10px]">npm run build</span>
+                        <span class="w-[58px] h-[20px] bg-[rgba(204,204,204,0.3)] ml-[auto] text-[#fff] text-[10px] flex cursor-pointer rounded-[4px] mr-[17px] items-center justify-center" @click="copyEvent('npm run build')">复制命令</span>
+                    </div>
+                </div>
+                <div class="mt-[21px]">
+                    <div class="ml-[40px] text-[14px] text-[#606266]">
+                        <span class="text-[#303133]">使用uniapp打包H5：</span>
+                        <span>进入uniapp目录下执行，执行后编译代码默认移动到系统niucloud下的</span>
+                        <span class="text-[#FF9D31] mx-[3px]">public/wap</span>
+                        <span>目录下</span>
+                    </div>
+                    <div class="ml-[40px] w-[900px] h-[42px] bg-[#282C34] rounded-[4px] mt-[10px] flex items-center">
+                        <span class="text-[16px] text-[#FF9D31] ml-[10px]">npm run build:h5</span>
+                        <span class="w-[58px] h-[20px] bg-[rgba(204,204,204,0.3)] ml-[auto] text-[#fff] text-[10px] flex cursor-pointer rounded-[4px] mr-[17px] items-center justify-center" @click="copyEvent('npm run build:h5')">复制命令</span>
+                    </div>
+                </div>
+                <div class="mt-[21px]">
+                    <div class="ml-[40px] text-[14px] text-[#606266]">
+                        <span class=" text-[#303133]">使用uniapp打包微信小程序：</span>
+                        <span>进入uniapp目录下执行，执行后编译代码默认移动到系统niucloud下的</span>
+                        <span class="text-[#FF9D31] mx-[3px]">uni-app/dist/build/mp-weixin</span>
+                        <span>目录</span>
+                    </div>
+                    <div class="ml-[40px] w-[900px] h-[42px] bg-[#282C34] rounded-[4px] mt-[10px] flex items-center">
+                        <span class="text-[16px] text-[#FF9D31] ml-[10px]">npm run build:mp-weixin</span>
+                        <span class="w-[58px] h-[20px] bg-[rgba(204,204,204,0.3)] ml-[auto] text-[#fff] text-[10px] flex cursor-pointer rounded-[4px] mr-[17px] items-center justify-center" @click="copyEvent('npm run build:mp-weixin')">复制命令</span>
+                    </div>
+                </div>
+                <div class="mt-[21px]">
+                    <div class="ml-[40px] text-[14px] text-[#606266]">
+                        <span class="text-[#303133]">web端打包：</span>
+                        <span>进入web目录下执行，执行后编译代码默认移动到系统niucloud下的</span>
+                        <span class="text-[#FF9D31] mx-[3px]">public/web</span>
+                        <span>目录下</span>
+                    </div>
+                    <div class="ml-[40px] w-[900px] h-[42px] bg-[#282C34] rounded-[4px] mt-[10px] flex items-center">
+                        <span class="text-[16px] text-[#FF9D31] ml-[10px]">npm run generate</span>
+                        <span class="w-[58px] h-[20px] bg-[rgba(204,204,204,0.3)] ml-[auto] text-[#fff] text-[10px] flex cursor-pointer rounded-[4px] mr-[17px] items-center justify-center" @click="copyEvent('npm run build')">复制命令</span>
+                    </div>
+                </div>
+            </div>
+        </div>
+        <upgrade ref="upgradeRef" @cloudbuild="handleCloudBuild"/>
+        <cloud-build ref="cloudBuildRef"/>
+    </div>
+</template>
+
+<script lang="ts" setup>
+import { ref, watch } from "vue"
+import { ElMessage } from "element-plus"
+import { useClipboard } from "@vueuse/core"
+import { t } from "@/lang"
+import Upgrade from "@/app/components/upgrade/index.vue"
+import CloudBuild from "@/app/components/cloud-build/index.vue"
+
+const loading = ref<Boolean>(false)
+
+// 云编译调用
+const cloudBuildRef = ref<any>(null)
+const handleCloudBuild = () => {
+    ElMessageBox.confirm(t("cloudBuildTips"), t("warning"), {
+        confirmButtonText: t("confirm"),
+        cancelButtonText: t("cancel"),
+        type: "warning"
+    }).then(() => {
+        cloudBuildRef.value?.open()
+    })
+}
+
+// 复制命令
+const { copy, isSupported, copied } = useClipboard()
+
+const copyEvent = (text: string) => {
+    if (!isSupported.value) {
+        ElMessage({
+            message: t("notSupportCopy"),
+            type: "warning"
+        })
+        return
+    }
+    copy(text)
+}
+
+watch(copied, () => {
+    if (copied.value) {
+        ElMessage({
+            message: t("copySuccess"),
+            type: "success"
+        })
+    }
+})
+</script>
+
+<style lang="scss" scoped>
+.btn-time {
+    line-height: 36px;
+    text-align: center;
+}
+</style>
diff --git a/admin/src/app/views/tools/code/components/edit-view-type.vue b/admin/src/app/views/tools/code/components/edit-view-type.vue
index 730117dec..baa68c2c8 100644
--- a/admin/src/app/views/tools/code/components/edit-view-type.vue
+++ b/admin/src/app/views/tools/code/components/edit-view-type.vue
@@ -2,18 +2,18 @@
     <el-dialog v-model="showDialog" :title="title" width="480px" :before-close="beforeClose" :destroy-on-close="true">
         <el-form :model="formData" label-width="130px" ref="formRef" :rules="formRules" class="page-form">
             <el-form-item :label="t('selectType')" prop="type">
-					<el-radio-group v-model="formData.select_type">
-						<el-radio :label="1">{{ t('dictType' )}}</el-radio>
-						<el-radio :label="2">{{ t('remotePullDown') }}</el-radio>
-					</el-radio-group>
-			</el-form-item>
+                <el-radio-group v-model="formData.select_type">
+                    <el-radio :label="1">{{ t('dictType') }}</el-radio>
+                    <el-radio :label="2">{{ t('remotePullDown') }}</el-radio>
+                </el-radio-group>
+            </el-form-item>
 
-            <el-form-item :label="t('dictType')"  v-if="formData.select_type == 1" prop="dict_type">
+            <el-form-item :label="t('dictType')" v-if="formData.select_type == 1" prop="dict_type">
                 <el-select class="input-width" :placeholder="t('dictTypePlaceholder')" v-model="formData.dict_type" filterable remote clearable>
                     <el-option :label="item.name" :value="item.key" v-for="item in dicList" :key="item.key" />
                 </el-select>
             </el-form-item>
-               
+
             <el-form-item :label="t('addons')" prop="addon" v-if="formData.select_type == 2">
                 <el-select v-model="formData.addon" :placeholder="t('addonsPlaceholder')" class="input-width" @change="addonChange">
                     <el-option v-for="(item, index) in addonList" :label="item.title" :value="item.key" :key="index" />
@@ -21,12 +21,12 @@
             </el-form-item>
 
             <el-form-item :label="t('associatedModel')" prop="model" v-if="formData.select_type == 2">
-                <el-select :placeholder="t('associatedModelPlaceholder')" v-model="formData.model" class="input-width" filterable  @change="modelChange"> 
+                <el-select :placeholder="t('associatedModelPlaceholder')" v-model="formData.model" class="input-width" filterable @change="modelChange">
                     <el-option v-for="item in modelList" :label="item" :value="item" :key="item" />
                 </el-select>
             </el-form-item>
 
-             <el-form-item prop="value_key" :label="t('remotePullDownValue')" v-if="formData.select_type == 2">
+            <el-form-item prop="value_key" :label="t('remotePullDownValue')" v-if="formData.select_type == 2">
                 <el-select class="input-width" :placeholder="t('remotePullDownValuePlaceholder')" v-model="formData.value_key">
                     <el-option :label="`${item.name}:${item.comment}`" :value="item.name" v-for="(item, index) in keyList" :key="index" />
                 </el-select>
@@ -53,7 +53,7 @@ import { t } from '@/lang'
 import { getDictAll } from '@/app/api/dict'
 import type { FormInstance } from 'element-plus'
 import { cloneDeep } from 'lodash-es'
-import { getGeneratorAllModel, getAddonDevelop,getGeneratorModelTableColumn } from '@/app/api/tools'
+import { getGeneratorAllModel, getAddonDevelop, getGeneratorModelTableColumn } from '@/app/api/tools'
 
 const showDialog = ref(false)
 const title = ref('')
@@ -61,7 +61,7 @@ const title = ref('')
  * 表单数据
  */
 const initialFormData = {
-    select_type : 1,
+    select_type: 1,
     dict_type: "",
     addon: "",
     model: "",
@@ -77,7 +77,7 @@ const dicList = ref<Array<any>>([])
  * 获取关联模型
  */
 const modelList = ref([])
-const getGeneratorAllModelFn = (params:any) => {
+const getGeneratorAllModelFn = (params: any) => {
     getGeneratorAllModel(params).then(res => {
         modelList.value = res.data
     })
@@ -85,31 +85,31 @@ const getGeneratorAllModelFn = (params:any) => {
 
 //获取插件列表
 const addonList = ref<Array<any>>([])
-const getAddonDevelopFn = async () => {
+const getAddonDevelopFn = async() => {
     let { data } = await getAddonDevelop({})
     addonList.value = [{ title: "系统", key: "system" }]
     addonList.value.push(...data)
-    getGeneratorAllModelFn({addon:'system'})
+    getGeneratorAllModelFn({ addon: 'system' })
 }
 getAddonDevelopFn()
 
 //选择应用
-const addonChange =(val:any)=>{
+const addonChange = (val: any) => {
     formData.value.model = ''
-   getGeneratorAllModelFn({addon:val})
+    getGeneratorAllModelFn({ addon: val })
 }
 
 const keyList = ref([])
-const getGeneratorModelTableColumnFn = (params:any) => {
+const getGeneratorModelTableColumnFn = (params: any) => {
     getGeneratorModelTableColumn(params).then(res => {
         keyList.value = res.data
     })
 }
 
 //根据模型获取字段
-const modelChange = (val:any) => {
+const modelChange = (val: any) => {
     // formData.value.model = ''
-    getGeneratorModelTableColumnFn({model:val})
+    getGeneratorModelTableColumnFn({ model: val })
 }
 
 // 表单验证规则
@@ -117,24 +117,24 @@ const formRules = computed(() => {
     return {
         dict_type: [
             {
-            validator: (rule: any, value: any, callback: any) => {
-                if (formData.value.select_type == 1 && formData.value.dict_type == '') {
-                    callback(new Error(t('dictTypePlaceholder')))
-                }else{
+                validator: (rule: any, value: any, callback: any) => {
+                    if (formData.value.select_type == 1 && formData.value.dict_type == '') {
+                        callback(new Error(t('dictTypePlaceholder')))
+                    } else {
                         callback()
-                    } 
-            },
-            trigger: 'blur'
-        }
+                    }
+                },
+                trigger: 'blur'
+            }
         ],
         addon: [
             {
                 validator: (rule: any, value: any, callback: any) => {
                     if (formData.value.select_type == 2 && formData.value.addon == '') {
                         callback(new Error(t('addonsPlaceholder')))
-                    }else{
+                    } else {
                         callback()
-                    } 
+                    }
                 },
                 trigger: 'blur'
             }
@@ -144,7 +144,7 @@ const formRules = computed(() => {
                 validator: (rule: any, value: any, callback: any) => {
                     if (formData.value.select_type == 2 && formData.value.model == '') {
                         callback(new Error(t('associatedModelPlaceholder')))
-                    }else{
+                    } else {
                         callback()
                     }
                 },
@@ -156,9 +156,9 @@ const formRules = computed(() => {
                 validator: (rule: any, value: any, callback: any) => {
                     if (formData.value.select_type == 2 && formData.value.value_key == '') {
                         callback(new Error(t('remotePullDownValuePlaceholder')))
-                    }else{
+                    } else {
                         callback()
-                    } 
+                    }
                 },
                 trigger: 'blur'
             }
@@ -168,9 +168,9 @@ const formRules = computed(() => {
                 validator: (rule: any, value: any, callback: any) => {
                     if (formData.value.select_type == 2 && formData.value.label_key == '') {
                         callback(new Error(t('remotePullDownLabelPlaceholder')))
-                    }else{
+                    } else {
                         callback()
-                    } 
+                    }
                 },
                 trigger: 'blur'
             }
@@ -189,10 +189,10 @@ const emit = defineEmits(['complete'])
  * 确认
  * @param formEl
  */
-const confirm = async (formEl: FormInstance | undefined) => {
+const confirm = async(formEl: FormInstance | undefined) => {
     if (!formEl) return
 
-    await formEl.validate(async (valid) => {
+    await formEl.validate(async(valid) => {
         if (valid) {
             emit('complete', toRaw(formData.value))
             showDialog.value = false
@@ -200,13 +200,12 @@ const confirm = async (formEl: FormInstance | undefined) => {
     })
 }
 
-const setFormData = async (row: any = null) => {
+const setFormData = async(row: any = null) => {
     formData.value = cloneDeep(Object.assign(initialFormData, row))
     getDictAllFn()
-    if(formData.value.model != '')
-    {
-        getGeneratorAllModelFn({addon:formData.value.addon})
-        getGeneratorModelTableColumnFn({model:formData.value.model})
+    if (formData.value.model != '') {
+        getGeneratorAllModelFn({ addon: formData.value.addon })
+        getGeneratorModelTableColumnFn({ model: formData.value.model })
     }
     showDialog.value = true
 }
diff --git a/admin/src/app/views/tools/code/index.vue b/admin/src/app/views/tools/code/index.vue
index 978e7f90c..6df650348 100644
--- a/admin/src/app/views/tools/code/index.vue
+++ b/admin/src/app/views/tools/code/index.vue
@@ -174,7 +174,7 @@
 import { reactive, ref, onMounted } from 'vue'
 import { t } from '@/lang'
 import { getGenerateTableList, deleteGenerateTable, generateCreate, generatePreview, generatorCheckFile, getAddonDevelop } from '@/app/api/tools'
-import { img } from '@/utils/common'
+import { img,setTablePageStorage,getTablePageStorage } from '@/utils/common'
 import { ElMessageBox, ElMessage } from 'element-plus'
 import AddTable from '@/app/views/tools/code/components/add-table.vue'
 import type { FormInstance } from 'element-plus'
@@ -211,7 +211,7 @@ onMounted(() => {
         activeName.value = window.codeActiveName + ''
         window.codeActiveName = null
     }
-    loadGenerateTableList()
+    loadGenerateTableList(getTablePageStorage(codeTableData.searchParam).page)
 })
 /**
  * 获取代码生成列表
@@ -228,6 +228,7 @@ const loadGenerateTableList = (page: number = 1) => {
         codeTableData.loading = false
         codeTableData.data = res.data.data
         codeTableData.total = res.data.total
+        setTablePageStorage(codeTableData.page, codeTableData.limit, codeTableData.searchParam);
     }).catch(() => {
         codeTableData.loading = false
     })
diff --git a/admin/src/app/views/tools/detection.vue b/admin/src/app/views/tools/detection.vue
index aa2d6d872..b1b1cb2a4 100644
--- a/admin/src/app/views/tools/detection.vue
+++ b/admin/src/app/views/tools/detection.vue
@@ -75,10 +75,6 @@
 import { ref } from 'vue'
 import { t } from '@/lang'
 import { getSystem } from '@/app/api/tools'
-import { useRoute } from 'vue-router'
-
-const route = useRoute()
-const pageName = route.meta.title
 
 const systemService = ref({})
 const loading = ref(true);
diff --git a/admin/src/app/views/tools/updatecache.vue b/admin/src/app/views/tools/updatecache.vue
index 86b8de390..a1d943eb3 100644
--- a/admin/src/app/views/tools/updatecache.vue
+++ b/admin/src/app/views/tools/updatecache.vue
@@ -1,14 +1,19 @@
 <template>
-    <div class="main-container h-[500px] w-full p-5 bg-white" v-loading="loading">
-        <div class="flex flex-wrap px-2 plug-list pb-10">
-            <div class="flex items-center bg-[#F7F8FA] p-3 w-[295px] relative plug-item mr-4 mb-4 cursor-pointer">
-                <div class="flex flex-col ml-2">
-                    <span class="text-sm truncate w-[190px]">{{t('dataCache')}}</span>
-                    <span class="text-xs text-gray-400 mt-1 truncate w-[190px]" :title="t('dataCacheDesc')">{{t('dataCacheDesc')}}</span>
-                </div>
-                <span class="plug-item-operate" @click="schemaCache()">{{t('refresh')}}</span>
+    <div class="main-container" >
+        <el-card class="box-card !border-none" shadow="never" v-loading="loading">
+            <div class="flex justify-between items-center">
+                <span class="text-page-title">{{ pageName }}</span>
             </div>
-        </div>
+            <div class="flex flex-wrap px-2 plug-list pb-10 mt-[20px] ">
+                <div class="flex items-center  p-3 w-[295px] relative plug-item mr-4 mb-4 bg-[var(--el-color-info-light-9)] cursor-pointer">
+                    <div class="flex flex-col ml-2">
+                        <span class="text-sm truncate w-[190px]">{{t('dataCache')}}</span>
+                        <span class="text-xs text-gray-400 mt-1 truncate w-[190px]" :title="t('dataCacheDesc')">{{t('dataCacheDesc')}}</span>
+                    </div>
+                    <span class="plug-item-operate" @click="schemaCache()">{{t('refresh')}}</span>
+                </div>
+            </div>
+        </el-card>
     </div>
 </template>
 
@@ -17,8 +22,10 @@ import { ref } from 'vue'
 import { t } from '@/lang'
 import { clearCache } from '@/app/api/sys'
 import { ElMessageBox } from 'element-plus'
-
+import { useRouter, useRoute } from 'vue-router'
 const loading = ref<Boolean>(false)
+const route = useRoute()
+const pageName = route.meta.title
 
 // 数据缓存
 const schemaCache = () => {
diff --git a/admin/src/app/views/tools/upgrade_records.vue b/admin/src/app/views/tools/upgrade_records.vue
new file mode 100644
index 000000000..8583a606c
--- /dev/null
+++ b/admin/src/app/views/tools/upgrade_records.vue
@@ -0,0 +1,98 @@
+
+<template>
+    <div class="main-container">
+        <el-card class="box-card !border-none" shadow="never">
+
+            <div class="flex justify-between items-center">
+                <span class="text-page-title">{{ pageName }}</span>
+            </div>
+
+            <el-card class="box-card !border-none my-[10px] table-search-wrap" shadow="never">
+                <el-form :inline="true" :model="tableData.searchParam" ref="searchFormRef">
+                    <el-form-item :label="t('upgradeName')" prop="name">
+                        <el-input v-model.trim="tableData.searchParam.name" :placeholder="t('upgradeNamePlaceholder')" />
+                    </el-form-item>
+                    <el-form-item>
+                        <el-button type="primary" @click="loadList()">{{ t('search') }}</el-button>
+                        <el-button @click="resetForm(searchFormRef)">{{ t('reset') }}</el-button>
+                    </el-form-item>
+                </el-form>
+            </el-card>
+
+            <el-table :data="tableData.data" size="large" v-loading="tableData.loading" ref="tableRef">
+
+                <template #empty>
+                    <span>{{ !tableData.loading ? t('emptyData') : '' }}</span>
+                </template>
+
+                <el-table-column prop="id" :label="t('id')" width="140" />
+                <el-table-column prop="name" :label="t('upgradeName')" />
+                <el-table-column prop="prev_version" :label="t('prevVersion')" />
+                <el-table-column prop="current_version" :label="t('currentVersion')" />
+                <el-table-column prop="complete_time" :label="t('completeTime')" />
+            </el-table>
+
+            <div class="mt-[16px] flex justify-end">
+                <el-pagination v-model:current-page="tableData.page"
+                    v-model:page-size="tableData.limit" layout="total, sizes, prev, pager, next, jumper"
+                    :total="tableData.total" @size-change="loadList()"
+                    @current-change="loadList" />
+            </div>
+        </el-card>
+
+    </div>
+</template>
+
+<script lang="ts" setup>
+import { ref, reactive } from 'vue'
+import { t } from '@/lang'
+import { FormInstance } from 'element-plus'
+import { useRoute } from 'vue-router'
+import { getUpgradeRecords } from '@/app/api/upgrade'
+import 'vue-web-terminal/lib/theme/dark.css'
+
+const route = useRoute()
+const pageName = route.meta.title
+const searchFormRef = ref<FormInstance>()
+const tableRef = ref()
+const tableData: any = reactive({
+    page: 1,
+    limit: 10,
+    total: 0,
+    loading: true,
+    data: [],
+    searchParam: {
+        name: ''
+    }
+})
+
+const resetForm = (formEl: FormInstance | undefined) => {
+    if (!formEl) return
+    formEl.resetFields()
+    loadList()
+}
+
+/**
+ * 获取列表
+ */
+const loadList = (page: number = 1) => {
+    tableData.loading = true
+    tableData.page = page
+    getUpgradeRecords({
+        page: tableData.page,
+        limit: tableData.limit,
+        ...tableData.searchParam
+    }).then(res => {
+        tableData.loading = false
+        tableData.data = res.data.data
+        tableData.total = res.data.total
+    }).catch(() => {
+        tableData.loading = false
+    })
+}
+
+loadList()
+</script>
+
+<style lang="scss" scoped>
+</style>
diff --git a/admin/src/app/views/wxoplatform/setting.vue b/admin/src/app/views/wxoplatform/setting.vue
index be81a133b..7f5fd5db0 100644
--- a/admin/src/app/views/wxoplatform/setting.vue
+++ b/admin/src/app/views/wxoplatform/setting.vue
@@ -91,13 +91,9 @@ import { reactive, ref, watch } from 'vue'
 import { t } from '@/lang'
 import { getStatic, getConfig, editConfig } from '@/app/api/wxoplatform'
 import { ElMessage, FormInstance, FormRules } from 'element-plus'
-import { useRoute } from 'vue-router'
 import { useClipboard } from '@vueuse/core'
 import { guid } from '@/utils/common'
 
-const route = useRoute()
-const pageName = route.meta.title
-
 const loading = ref(true)
 const formData = ref({
     app_id: '',
diff --git a/admin/src/app/views/wxoplatform/weapp_version.vue b/admin/src/app/views/wxoplatform/weapp_version.vue
index 765142a0a..3fa9e5901 100644
--- a/admin/src/app/views/wxoplatform/weapp_version.vue
+++ b/admin/src/app/views/wxoplatform/weapp_version.vue
@@ -1,18 +1,71 @@
 <template>
     <div class="main-container">
         <el-card class="box-card !border-none" shadow="never">
-
             <div class="flex justify-between items-center">
                 <span class="text-page-title">{{ pageName }}</span>
+                <el-button type="primary" class="w-[100px]" @click="commit()">
+                    {{ t('oneClickSync') }}
+                </el-button>
             </div>
 
-            <div class="mt-[50px] ml-[100px] h-[60vh]">
-                <el-button type="primary" :loading="uploading" @click="commit">{{ t('weappVersionUpdate') }}</el-button>
-                <p class="text-secondary text-sm mt-[10px]">{{ t('updateTips') }}</p>
-                <p class="text-secondary text-sm mt-[10px]" v-if="lastRecord.create_time">
-                    {{ t('lastTime') }}：{{ lastRecord.create_time }}
-                    <el-button type="primary" link @click="commitRecordDialogShow = true">{{ t('seeUpdateRecord') }}</el-button>
-                </p>
+            <div class="mt-[20px]">
+                <el-alert :title="t('updateTips')" type="info" show-icon />
+            </div>
+
+            <div class="mt-[20px]">
+                <el-table :data="siteGroupCommitRecordTableData.data" size="large" v-loading="siteGroupCommitRecordTableData.loading">
+                    <template #empty>
+                        <span>{{ !siteGroupCommitRecordTableData.loading ? t('emptyData') : '' }}</span>
+                    </template>
+
+                    <el-table-column prop="group_name" :label="t('groupName')" />
+
+                    <el-table-column :label="t('userVersion')" :show-overflow-tooltip="true">
+                        <template #default="{ row }">
+                            {{ row.commit_record.user_version || '--' }}
+                        </template>
+                    </el-table-column>
+
+                    <el-table-column prop="create_time" :label="t('createTime')">
+                        <template #default="{ row }">
+                            {{ row.commit_record.create_time || '--' }}
+                        </template>
+                    </el-table-column>
+
+                    <el-table-column prop="create_time" :label="t('status')">
+                        <template #default="{ row }">
+                            <div v-if="row.commit_record.user_version">
+                                {{ row.commit_record.status_name }}
+                                <div v-if="row.commit_record.template_id == '0'" class="text-error">
+                                    {{ t('syncTemplateError') }}
+                                </div>
+                            </div>
+                            <div>
+                                --
+                            </div>
+                        </template>
+                    </el-table-column>
+
+                    <el-table-column prop="create_time" :label="t('templateID')">
+                        <template #default="{ row }">
+                            {{ row.commit_record.template_id || '--' }}
+                        </template>
+                    </el-table-column>
+
+                    <el-table-column :label="t('operation')" align="right" fixed="right" width="330">
+                        <template #default="{ row }">
+                            <el-button type="primary" link @click="showCommitRecordDialog(row.group_id)">{{ t('commitRecord') }}</el-button>
+                            <el-button type="primary" link @click="commit(row.group_id)">{{ t('weappVersionUpdate') }}</el-button>
+                        </template>
+                    </el-table-column>
+                </el-table>
+            </div>
+
+            <div class="mt-[16px] flex justify-end">
+                <el-pagination v-model:current-page="siteGroupCommitRecordTableData.page"
+                               v-model:page-size="siteGroupCommitRecordTableData.limit" layout="total, sizes, prev, pager, next, jumper"
+                               :total="siteGroupCommitRecordTableData.total" @size-change="loadSiteGroupCommitRecordTableData()"
+                               @current-change="loadSiteGroupCommitRecordTableData" />
             </div>
         </el-card>
     </div>
@@ -24,7 +77,6 @@
             </template>
 
             <el-table-column prop="user_version" :label="t('userVersion')" />
-            <el-table-column prop="site_group_name" :label="t('groupName')" />
             <el-table-column :label="t('status')" prop="status_name"></el-table-column>
             <el-table-column prop="create_time" :label="t('createTime')"></el-table-column>
             <el-table-column :label="t('operation')" align="right" fixed="right" width="130">
@@ -49,7 +101,7 @@
 <script lang="ts" setup>
 import { reactive, ref } from 'vue'
 import { useRoute } from 'vue-router'
-import { getWeappLastCommitRecord, weappCommit, getWeappCommitRecord } from '@/app/api/wxoplatform'
+import { getWeappLastCommitRecord, weappCommit, getWeappCommitRecord, getSiteGroupCommitRecord } from '@/app/api/wxoplatform'
 import { t } from '@/lang'
 
 const route = useRoute()
@@ -64,9 +116,17 @@ const commitRecordTableData = reactive({
     loading: true,
     data: [],
     searchParam: {
-        search: ''
+        site_group_id: ''
     }
 })
+const siteGroupCommitRecordTableData = reactive({
+    page: 1,
+    limit: 10,
+    total: 0,
+    loading: true,
+    data: [],
+    searchParam: {}
+})
 const failReason = ref('')
 const failReasonDialogShow = ref(false)
 
@@ -79,11 +139,11 @@ getWeappLastCommitRecord().then(({ data }) => {
     lastRecord.value = data
 })
 
-const commit = () => {
+const commit = (siteGroupId = '') => {
     if (uploading.value) return
     uploading.value = true
 
-    weappCommit().then(() => {
+    weappCommit({ site_group_id: siteGroupId }).then(() => {
         uploading.value = false
     }).catch(() => {
         uploading.value = false
@@ -100,7 +160,7 @@ const loadCommitRecordList = (page: number = 1) => {
     getWeappCommitRecord({
         page: commitRecordTableData.page,
         limit: commitRecordTableData.limit,
-        role_name: commitRecordTableData.searchParam.search
+        site_group_id: commitRecordTableData.searchParam.site_group_id
     }).then(res => {
         commitRecordTableData.loading = false
         commitRecordTableData.data = res.data.data
@@ -109,7 +169,33 @@ const loadCommitRecordList = (page: number = 1) => {
         commitRecordTableData.loading = false
     })
 }
-loadCommitRecordList()
+
+const loadSiteGroupCommitRecordTableData = (page: number = 1) => {
+    siteGroupCommitRecordTableData.loading = true
+    siteGroupCommitRecordTableData.page = page
+
+    getSiteGroupCommitRecord({
+        page: siteGroupCommitRecordTableData.page,
+        limit: siteGroupCommitRecordTableData.limit
+    }).then(res => {
+        siteGroupCommitRecordTableData.loading = false
+        siteGroupCommitRecordTableData.data = res.data.data
+        siteGroupCommitRecordTableData.total = res.data.total
+    }).catch(() => {
+        siteGroupCommitRecordTableData.loading = false
+    })
+}
+loadSiteGroupCommitRecordTableData()
+
+const showCommitRecordDialog = (siteGroupId: number) => {
+    commitRecordTableData.searchParam.site_group_id = siteGroupId
+    loadCommitRecordList()
+    commitRecordDialogShow.value = true
+}
 </script>
 
-<style lang="scss" scoped></style>
+<style lang="scss" scoped>
+:deep(.el-alert__title) {
+    white-space: pre;
+}
+</style>
diff --git a/admin/src/components/editor/index.vue b/admin/src/components/editor/index.vue
index 563b75940..e4fac8490 100644
--- a/admin/src/components/editor/index.vue
+++ b/admin/src/components/editor/index.vue
@@ -7,7 +7,7 @@
 </template>
 
 <script lang="ts" setup>
-import { computed, nextTick, onMounted, ref } from 'vue'
+import { computed, ref } from 'vue'
 import { getToken, img } from '@/utils/common'
 import { VueUeditorWrap } from 'vue-ueditor-wrap'
 import storage from '@/utils/storage'
@@ -85,11 +85,15 @@ const handleEditorReady = (editor) => {
     //     // 同步到统计栏（需操作DOM）
     //     updateStatsDisplay(charCount.value)
     // })
-    console.log('扩展原型链', editor)
+    // console.log('扩展原型链', editor)
+    editor.addListener('blur', () => {
+        // console.log('失焦了')
+        emit('handleBlur', editor.getContent()) // 把内容传出去
+    })
 
     // 方案二：原型链扩展（如果编辑器版本支持）
     const originalCount = editor.getContentLength; // 原生统计方法
-  
+
   // 覆盖方法：去除空格后统计
   editor.getContentLength = function () {
     const rawContent = editor.getContent();
diff --git a/admin/src/components/icon/index.vue b/admin/src/components/icon/index.vue
index 5ff09b5a3..382e91d07 100644
--- a/admin/src/components/icon/index.vue
+++ b/admin/src/components/icon/index.vue
@@ -1,8 +1,8 @@
 <template>
-	<el-icon v-if="type=='element'" :style="style" :class="['icon el-icon',props.class]">
-		<component :is="name"/>
-	</el-icon>
-	<i v-else :class="[type,name,props.class]" :style="style"></i>
+    <el-icon v-if="type=='element'" :style="style" :class="['icon el-icon',props.class]">
+        <component :is="name" />
+    </el-icon>
+    <i v-else :class="[type,name,props.class]" :style="style"></i>
 </template>
 <script lang="ts" setup>
 import { watch, ref, reactive } from 'vue'
diff --git a/admin/src/components/markdown/index.vue b/admin/src/components/markdown/index.vue
new file mode 100644
index 000000000..a97fbea84
--- /dev/null
+++ b/admin/src/components/markdown/index.vue
@@ -0,0 +1,87 @@
+<template>
+    <div id="vditor" />
+    <upload-attachment type="image" ref="imageRef" limit="" @confirm="imageSelect" />
+    <upload-attachment type="video" ref="videoRef" @confirm="videoSelect" />
+</template>
+
+<script lang="ts" setup>
+import { computed, onMounted, ref } from 'vue'
+import Vditor from 'vditor'
+import 'vditor/dist/index.css'
+import { img } from '@/utils/common'
+
+const props = defineProps({
+    modelValue: {
+        type: String,
+        default: ''
+    },
+    height: {
+        type: Number,
+        default: 600
+    },
+    mode: {
+        type: String,
+        default: 'wysiwyg'
+    }
+})
+
+const emits = defineEmits(['update:modelValue', 'handleBlur'])
+
+const content = computed({
+    get() {
+        return props.modelValue
+    },
+    set(value) {
+        emits('update:modelValue', value)
+    }
+})
+
+const imageRef: Record<string, any> | null = ref(null)
+const videoRef: Record<string, any> | null = ref(null)
+const vditor = ref<Vditor | null>(null)
+
+onMounted(() => {
+    vditor.value = new Vditor('vditor', {
+        height: props.height,
+        after: () => {
+            vditor.value!.setValue(content.value)
+        },
+        mode: props.mode,
+        toolbar: [
+            'emoji', 'headings', 'bold', 'italic', 'strike', '|', 'line', 'quote', 'list', 'ordered-list', 'check', 'outdent', 'indent',
+            {
+                name: 'image',
+                tip: '插入图片',
+                icon: '<svg t="1743135560768" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="32640" width="200" height="200"><path d="M734.608696 155.826087a200.347826 200.347826 0 0 1 200.347826 200.347826v311.652174c0 32.122435-7.568696 62.464-20.992 89.35513L410.000696 461.401043a100.173913 100.173913 0 0 0-111.549218 6.811827L89.043478 628.357565V356.173913a200.347826 200.347826 0 0 1 200.347826-200.347826h445.217392zM376.208696 518.989913L874.362435 811.408696A199.68 199.68 0 0 1 734.608696 868.173913H289.391304c-96.478609 0-177.040696-68.185043-196.073739-159.009391l245.693218-187.881739a33.391304 33.391304 0 0 1 37.175652-2.29287zM289.391304 89.043478C141.868522 89.043478 22.26087 208.65113 22.26087 356.173913v311.652174c0 147.522783 119.607652 267.130435 267.130434 267.130435h445.217392c147.522783 0 267.130435-119.607652 267.130434-267.130435V356.173913c0-147.522783-119.607652-267.130435-267.130434-267.130435H289.391304z m445.217392 356.173913a89.043478 89.043478 0 1 0 0-178.086956 89.043478 89.043478 0 0 0 0 178.086956z" fill="#333333" p-id="32641"></path></svg>',
+                click: () => {
+                    imageRef.value.showDialog = true
+                }
+            },
+            {
+                name: 'video',
+                tip: '插入视频',
+                icon: '<svg t="1743136124938" class="icon" viewBox="0 0 1256 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="34055" width="200" height="200"><path d="M201.681455 74.472727a111.709091 111.709091 0 0 0-111.709091 111.709091v651.636364a111.709091 111.709091 0 0 0 111.709091 111.709091h837.818181a111.709091 111.709091 0 0 0 111.709091-111.709091V186.181818a111.709091 111.709091 0 0 0-111.709091-111.709091h-837.818181z m0-74.472727h837.818181a186.181818 186.181818 0 0 1 186.181819 186.181818v651.636364a186.181818 186.181818 0 0 1-186.181819 186.181818h-837.818181a186.181818 186.181818 0 0 1-186.181819-186.181818V186.181818a186.181818 186.181818 0 0 1 186.181819-186.181818zM798.72 533.085091a9.309091 9.309091 0 0 0-1.861818-13.032727l-248.226909-186.181819a9.309091 9.309091 0 0 0-14.894546 7.447273v372.363637a9.309091 9.309091 0 0 0 14.894546 7.447272l248.226909-186.181818a9.309091 9.309091 0 0 0 1.861818-1.861818z m-205.405091 247.621818a83.781818 83.781818 0 0 1-134.050909-67.025454v-372.363637a83.781818 83.781818 0 0 1 134.050909-67.025454l248.226909 186.181818a83.781818 83.781818 0 0 1 0 134.050909l-248.226909 186.181818z" fill="#000000" p-id="34056"></path></svg>',
+                click: () => {
+                    videoRef.value.showDialog = true
+                }
+            },
+            'code', 'inline-code', 'insert-after', 'insert-before ', 'undo', 'redo', 'link', 'table', 'record', 'edit-mode', 'both', 'preview', 'fullscreen', 'outline', 'code-theme', 'content-theme', 'export', 'br'
+        ],
+        blur: () => {
+            content.value = vditor.value!.getValue()
+        }
+    })
+})
+
+const imageSelect = (data: Record<string, any>) => {
+    data.forEach((item: any) => {
+        vditor.value.insertValue(`![描述](${img(item.url)})`)
+    })
+}
+
+const videoSelect = (data: Record<string, any>) => {
+    vditor.value.insertValue(`<video src="${img(data.url)}">`)
+}
+</script>
+
+<style lang="scss" scoped></style>
diff --git a/admin/src/components/popover-input/index.vue b/admin/src/components/popover-input/index.vue
index 066d153a6..3ce780709 100644
--- a/admin/src/components/popover-input/index.vue
+++ b/admin/src/components/popover-input/index.vue
@@ -12,7 +12,7 @@
 </template>
 
 <script lang="ts" setup>
-import {computed, ref, watch} from 'vue'
+import { computed, ref } from 'vue'
 import { t } from '@/lang'
 import { ElMessage } from 'element-plus'
 
diff --git a/admin/src/components/select-icon/index.vue b/admin/src/components/select-icon/index.vue
index 9e522ba81..364e34334 100644
--- a/admin/src/components/select-icon/index.vue
+++ b/admin/src/components/select-icon/index.vue
@@ -1,44 +1,44 @@
 <template>
-	<div class="flex flex-wrap">
-		<template v-if="limit == 1">
-			<div class="rounded cursor-pointer overflow-hidden relative border border-dashed border-color icon-wrap mr-[10px]" :style="style">
-				<div class="w-full h-full relative" v-if="icons.data.length">
-					<div class="w-full h-full flex items-center justify-center">
-						<icon :name="icons.data[0]" size="40px"></icon>
-					</div>
-					<div class="absolute z-[1] flex items-center justify-center w-full h-full inset-0 bg-black bg-opacity-60 operation">
-						<icon name="element Delete" color="#fff" size="18px" @click="removeIcon"/>
-					</div>
-				</div>
-				<upload-attachment :limit="limit" type="icon" @confirm="confirmSelect" v-else>
-					<div class="w-full h-full flex items-center justify-center flex-col">
-						<icon name="element Plus" size="20px" color="var(--el-text-color-secondary)"/>
-						<div class="leading-none text-xs mt-[10px] text-secondary">{{ iconText || t('upload.selecticon') }}</div>
-					</div>
-				</upload-attachment>
-			</div>
-		</template>
-		<template v-else>
-			<div class="rounded cursor-pointer overflow-hidden relative border border-dashed border-color icon-wrap mr-[10px]" :style="style" v-for="(item, index) in icons.data" :key="index">
-				<div class="w-full h-full relative">
-					<div class="w-full h-full flex items-center justify-center">
-						<icon :name="item" size="40px"></icon>
-					</div>
-					<div class="absolute z-[1] flex items-center justify-center w-full h-full inset-0 bg-black bg-opacity-60 operation">
-						<icon name="element Delete" color="#fff" size="18px" @click="removeIcon(index)"/>
-					</div>
-				</div>
-			</div>
-			<div class="rounded cursor-pointer overflow-hidden relative border border-dashed border-color" :style="style" v-if="icons.data.length < limit">
-				<upload-attachment :limit="limit" @confirm="confirmSelect">
-					<div class="w-full h-full flex items-center justify-center flex-col">
-						<icon name="element Plus" size="20px" color="var(--el-text-color-secondary)"/>
-						<div class="leading-none text-xs mt-[10px] text-secondary">{{ iconText || t('upload.selecticon') }}</div>
-					</div>
-				</upload-attachment>
-			</div>
-		</template>
-	</div>
+    <div class="flex flex-wrap">
+        <template v-if="limit == 1">
+            <div class="rounded cursor-pointer overflow-hidden relative border border-dashed border-color icon-wrap mr-[10px]" :style="style">
+                <div class="w-full h-full relative" v-if="icons.data.length">
+                    <div class="w-full h-full flex items-center justify-center">
+                        <icon :name="icons.data[0]" size="40px"></icon>
+                    </div>
+                    <div class="absolute z-[1] flex items-center justify-center w-full h-full inset-0 bg-black bg-opacity-60 operation">
+                        <icon name="element Delete" color="#fff" size="18px" @click="removeIcon" />
+                    </div>
+                </div>
+                <upload-attachment :limit="limit" type="icon" @confirm="confirmSelect" v-else>
+                    <div class="w-full h-full flex items-center justify-center flex-col">
+                        <icon name="element Plus" size="20px" color="var(--el-text-color-secondary)" />
+                        <div class="leading-none text-xs mt-[10px] text-secondary">{{ iconText || t('upload.selecticon') }}</div>
+                    </div>
+                </upload-attachment>
+            </div>
+        </template>
+        <template v-else>
+            <div class="rounded cursor-pointer overflow-hidden relative border border-dashed border-color icon-wrap mr-[10px]" :style="style" v-for="(item, index) in icons.data" :key="index">
+                <div class="w-full h-full relative">
+                    <div class="w-full h-full flex items-center justify-center">
+                        <icon :name="item" size="40px"></icon>
+                    </div>
+                    <div class="absolute z-[1] flex items-center justify-center w-full h-full inset-0 bg-black bg-opacity-60 operation">
+                        <icon name="element Delete" color="#fff" size="18px" @click="removeIcon(index)" />
+                    </div>
+                </div>
+            </div>
+            <div class="rounded cursor-pointer overflow-hidden relative border border-dashed border-color" :style="style" v-if="icons.data.length < limit">
+                <upload-attachment :limit="limit" @confirm="confirmSelect">
+                    <div class="w-full h-full flex items-center justify-center flex-col">
+                        <icon name="element Plus" size="20px" color="var(--el-text-color-secondary)" />
+                        <div class="leading-none text-xs mt-[10px] text-secondary">{{ iconText || t('upload.selecticon') }}</div>
+                    </div>
+                </upload-attachment>
+            </div>
+        </template>
+    </div>
 
 </template>
 
@@ -71,10 +71,10 @@ const prop = defineProps({
 const emit = defineEmits(['update:modelValue', 'change'])
 
 const value = computed({
-    get () {
+    get() {
         return prop.modelValue
     },
-    set (value) {
+    set(value) {
         emit('update:modelValue', value)
     }
 })
@@ -131,15 +131,15 @@ const removeIcon = (index: number = 0) => {
 </script>
 
 <style lang="scss" scoped>
-	.icon-wrap {
-		.operation {
-			display: none;
-		}
+.icon-wrap {
+    .operation {
+        display: none;
+    }
 
-		&:hover {
-			.operation {
-				display: flex;
-			}
-		}
-	}
+    &:hover {
+        .operation {
+            display: flex;
+        }
+    }
+}
 </style>
diff --git a/admin/src/components/spread-popup/index.vue b/admin/src/components/spread-popup/index.vue
new file mode 100644
index 000000000..9f9f42fd6
--- /dev/null
+++ b/admin/src/components/spread-popup/index.vue
@@ -0,0 +1,158 @@
+<template>
+    <el-dialog v-model="showDialog" :title="titleName" width="500px" :destroy-on-close="true">
+        <el-tabs v-model="channel" class="mb-[10px]">
+            <el-tab-pane label="H5" name="h5"></el-tab-pane>
+            <el-tab-pane label="微信小程序" name="weapp"></el-tab-pane>
+        </el-tabs>
+
+        <!-- H5推广 -->
+        <div class="promote-flex flex" v-if="channel === 'h5'">
+            <div class="promote-img flex justify-center items-center bg-[#f8f8f8] w-[150px] h-[150px]">
+                <el-image :src="wapImage"/>
+            </div>
+            <div class="px-[20px] flex-1">
+                <div class="mb-[10px]">{{ t('promoteUrl') }}</div>
+                <el-input class="mb-[10px]" readonly :value="wapPreview">
+                    <template #append>
+                        <el-button @click="copyEvent(wapPreview)">{{ t('copy') }}</el-button>
+                    </template>
+                </el-input>
+                <a class="text-primary" :href="wapImage" download>{{ t('downLoadQRCode') }}</a>
+            </div>
+        </div>
+
+        <!-- 小程序推广 -->
+        <div class="promote-flex flex" v-if="channel === 'weapp'">
+            <div class="promote-img flex justify-center items-center bg-[#f8f8f8] w-[150px] h-[150px]">
+                <el-image :src="img(weappData.path)" v-if="weappData.path" class="w-[150px] h-[150px]">
+                    <template #error>
+                        <div class="w-[150px] h-[150px] text-[14px] text-center leading-[150px]">{{ t('configureFailed') }}</div>
+                    </template>
+                </el-image>
+                <div v-else class="w-[150px] h-[150px] text-[14px] text-center leading-[150px]">{{ t('configureFailed') }}</div>
+            </div>
+            <div class="px-[20px] flex-1" v-if="weappData.path">
+                <a class="text-primary" :href="img(weappData.path)" target="_blank" download>{{ t('downLoadQRCode') }}</a>
+            </div>
+        </div>
+    </el-dialog>
+</template>
+
+<script lang="ts" setup>
+import { t } from '@/lang'
+import { ref, reactive, watch } from 'vue'
+import { ElMessage } from 'element-plus'
+import QRCode from 'qrcode'
+import storage from '@/utils/storage'
+import { useClipboard } from '@vueuse/core'
+import { getUrl, getQrcode } from '@/app/api/sys'
+import { img } from '@/utils/common'
+
+const showDialog = ref(false)
+const channel = ref('h5')
+const wapUrl = ref('')
+const wapDomain = ref('')
+const wapImage = ref('')
+const wapPreview = ref('')
+const pageName = ref('')
+const weappData = reactive({
+    path: ''
+})
+
+getUrl().then((res: any) => {
+    wapUrl.value = res.data.wap_url
+
+    // 生产模式禁止
+    if (import.meta.env.MODE == 'production') return
+
+    wapDomain.value = res.data.wap_domain
+
+    // env文件配置过wap域名
+    if (wapDomain.value) {
+        wapUrl.value = wapDomain.value + '/wap'
+    }
+
+    const wapDomainStorage = storage.get('wap_domain')
+    if (wapDomainStorage) {
+        wapUrl.value = wapDomainStorage
+    }
+})
+
+// **生成H5二维码**
+const generateH5QRCode = () => {
+    wapPreview.value = `${ wapUrl.value }${ pageName.value }`
+    QRCode.toDataURL(wapPreview.value, { errorCorrectionLevel: 'L', margin: 0, width: 120 }).then(url => {
+        wapImage.value = url
+    })
+}
+
+// **获取小程序二维码**
+const fetchWeAppQRCode = () => {
+    // 去掉 page 参数前面的 '/'
+    if (pagePath.value.startsWith('/')) {
+        pagePath.value = pagePath.value.slice(1);
+    }
+
+    getQrcode({
+        page: pagePath.value, // 传递页面路径
+        folder: folder.value, // 传递模块目录
+        params: [
+            {
+                column_name: columnName.value,
+                column_value: columnValue.value
+            }
+        ]
+    }).then((res: any) => {
+        if (res.data) {
+            weappData.path = res.data.weapp_path
+        }
+    })
+}
+
+// 定义变量存储传入的数据
+const pagePath = ref("")
+const columnName = ref("")
+const columnValue = ref("")
+const titleName = ref("")
+const folder: any = ref("")
+
+// **显示对话框**
+const show = (page: string, column: string, value: string, title: string, dir: string) => {
+    pagePath.value = page
+    columnName.value = column
+    columnValue.value = value
+    titleName.value = title
+    folder.value = dir
+    pageName.value = `${ pagePath.value }?${ columnName.value }=${ columnValue.value }`
+
+    generateH5QRCode()
+    fetchWeAppQRCode()
+    showDialog.value = true
+}
+
+// **复制链接**
+const { copy, isSupported, copied } = useClipboard()
+const copyEvent = (text: string) => {
+    if (!isSupported.value) {
+        ElMessage({
+            message: t('notSupportCopy'),
+            type: 'warning'
+        })
+    }
+    copy(text)
+}
+
+watch(copied, () => {
+    if (copied.value) {
+        ElMessage({
+            message: t('copySuccess'),
+            type: 'success'
+        })
+    }
+})
+
+// **暴露给父组件**
+defineExpose({
+    show
+})
+</script>
diff --git a/admin/src/components/upload-video/index.vue b/admin/src/components/upload-video/index.vue
index 3d6ef784a..74a9d713d 100644
--- a/admin/src/components/upload-video/index.vue
+++ b/admin/src/components/upload-video/index.vue
@@ -1,52 +1,53 @@
 <template>
-	<div class="flex flex-wrap">
-		<template v-if="limit == 1">
-			<div class="rounded cursor-pointer relative bg-page video-wrap mr-[10px]" :style="style">
-				<template v-if="videos.data.length">
-					<div class="w-full h-full relative flex items-center overflow-hidden rounded">
-						<video :src="img(videos.data[0])" class="w-full"/>
-						<div class="absolute z-[1] flex items-center justify-center w-full h-full inset-0 bg-black bg-opacity-60 operation">
-							<icon name="iconfont icon24gf-playCircle" color="#fff" size="25px" @click="previewVideo()"/>
-						</div>
-					</div>
-					<icon name="element CircleCloseFilled" color="#bbb" size="18px" @click="removeVideo" class="!absolute z-[2] top-[-9px] right-[-9px]"/>
-				</template>
-				<upload-attachment :limit="limit" type="video" @confirm="confirmSelect" v-else>
-					<div class="w-full h-full flex items-center justify-center flex-col">
+    <div class="flex flex-wrap">
+        <template v-if="limit == 1">
+            <div class="rounded cursor-pointer relative bg-page video-wrap mr-[10px]" :style="style">
+                <template v-if="videos.data.length">
+                    <div class="w-full h-full relative flex items-center overflow-hidden rounded">
+                        <video :src="img(videos.data[0])" class="w-full" />
+                        <div class="absolute z-[1] flex items-center justify-center w-full h-full inset-0 bg-black bg-opacity-60 operation">
+                            <icon name="iconfont icon24gf-playCircle" color="#fff" size="25px" @click="previewVideo()" />
+                        </div>
+                    </div>
+                    <icon name="element CircleCloseFilled" color="#bbb" size="18px" @click="removeVideo" class="!absolute z-[2] top-[-9px] right-[-9px]" />
+                </template>
+                <upload-attachment :limit="limit" type="video" @confirm="confirmSelect" v-else>
+                    <div class="w-full h-full flex items-center justify-center flex-col">
                         <slot name="icon">
-                            <icon name="iconfont icon24gf-playCircle" size="25px" color="var(--el-text-color-secondary)"/>
+                            <icon name="iconfont icon24gf-playCircle" size="25px" color="var(--el-text-color-secondary)" />
                         </slot>
-					</div>
-				</upload-attachment>
-			</div>
-		</template>
-		<template v-else>
-			<div class="rounded cursor-pointer relative bg-page video-wrap mr-[10px]" :style="style" v-for="(item, index) in videos.data" :key="index">
-				<div class="w-full h-full relative flex items-center overflow-hidden rounded">
-					<video :src="img(item)" class="w-full"/>
-					<div class="absolute z-[1] flex items-center justify-center w-full h-full inset-0 bg-black bg-opacity-60 operation">
-						<icon name="iconfont icon24gf-playCircle" color="#fff" size="25px" @click="previewVideo(index)"/>
-					</div>
-				</div>
-				<icon name="element CircleCloseFilled" color="#bbb" size="18px" @click="removeVideo(index)" class="absolute z-[2] top-[-9px] right-[-9px]"/>
-			</div>
-			<div class="rounded cursor-pointer relative bg-page video-wrap mr-[10px]" :style="style" v-if="videos.data.length < limit">
-				<upload-attachment :limit="limit" type="video" @confirm="confirmSelect">
-					<div class="w-full h-full flex items-center justify-center flex-col">
+                    </div>
+                </upload-attachment>
+            </div>
+        </template>
+        <template v-else>
+            <div class="rounded cursor-pointer relative bg-page video-wrap mr-[10px]" :style="style" v-for="(item, index) in videos.data" :key="index">
+                <div class="w-full h-full relative flex items-center overflow-hidden rounded">
+                    <video :src="img(item)" class="w-full" />
+                    <div class="absolute z-[1] flex items-center justify-center w-full h-full inset-0 bg-black bg-opacity-60 operation">
+                        <icon name="iconfont icon24gf-playCircle" color="#fff" size="25px" @click="previewVideo(index)" />
+                    </div>
+                </div>
+                <icon name="element CircleCloseFilled" color="#bbb" size="18px" @click="removeVideo(index)"
+                      class="absolute z-[2] top-[-9px] right-[-9px]" />
+            </div>
+            <div class="rounded cursor-pointer relative bg-page video-wrap mr-[10px]" :style="style" v-if="videos.data.length < limit">
+                <upload-attachment :limit="limit" type="video" @confirm="confirmSelect">
+                    <div class="w-full h-full flex items-center justify-center flex-col">
                         <slot name="icon">
-                            <icon name="iconfont icon24gf-playCircle" size="25px" color="var(--el-text-color-secondary)"/>
+                            <icon name="iconfont icon24gf-playCircle" size="25px" color="var(--el-text-color-secondary)" />
                         </slot>
-					</div>
-				</upload-attachment>
-			</div>
-		</template>
+                    </div>
+                </upload-attachment>
+            </div>
+        </template>
 
-		<!-- 视频预览 -->
-		<el-dialog v-model="videoViewer.visible" width="50%" align-center :destroy-on-close="true" custom-class="video-preview">
-			<video-player :src="videoViewer.src" width="100%"/>
-		</el-dialog>
+        <!-- 视频预览 -->
+        <el-dialog v-model="videoViewer.visible" width="50%" align-center :destroy-on-close="true" custom-class="video-preview">
+            <video-player :src="videoViewer.src" width="100%" />
+        </el-dialog>
 
-	</div>
+    </div>
 </template>
 
 <script lang="ts" setup>
@@ -75,10 +76,10 @@ const prop = defineProps({
 const emit = defineEmits(['update:modelValue'])
 
 const value = computed({
-    get () {
+    get() {
         return prop.modelValue
     },
-    set (value) {
+    set(value) {
         emit('update:modelValue', value)
     }
 })
@@ -88,7 +89,7 @@ const videos: Record<string, any> = reactive({
 })
 
 const setValue = () => {
-	value.value = toRaw(videos.data).toString()
+    value.value = toRaw(videos.data).toString()
 }
 
 watch(() => value.value, () => {
@@ -145,18 +146,18 @@ const previewVideo = (index: number = 0) => {
 </script>
 
 <style lang="scss">
-	.video-preview {
-		background: none !important;
-		box-shadow: none !important;
+.video-preview {
+    background: none !important;
+    box-shadow: none !important;
 
-		.el-dialog__headerbtn .el-dialog__close {
-			border-radius: 50%;
-			width: 34px;
-			height: 34px;
-			font-size: 24px;
-			color: #fff;
-			background-color: var(--el-text-color-regular);
-			border-color: #fff;
-		}
-	}
+    .el-dialog__headerbtn .el-dialog__close {
+        border-radius: 50%;
+        width: 34px;
+        height: 34px;
+        font-size: 24px;
+        color: #fff;
+        background-color: var(--el-text-color-regular);
+        border-color: #fff;
+    }
+}
 </style>
diff --git a/admin/src/components/verifition/api/index.js b/admin/src/components/verifition/api/index.js
index 271a3e7bb..b109aafc8 100644
--- a/admin/src/components/verifition/api/index.js
+++ b/admin/src/components/verifition/api/index.js
@@ -7,9 +7,9 @@ import request from "./../utils/axios"  //组件内部封装的axios
 
 //获取验证图片  以及token
 export function reqGet(data) {
-    return request.get('/captcha/create',{params:{...data}});
+    return request.get('/captcha/create', { params: { ...data } });
 
-	// return  request({
+    // return  request({
     //     url: '/captcha/create',
     //     method: 'get',
     //     data
@@ -18,9 +18,9 @@ export function reqGet(data) {
 
 //滑动或者点选验证
 export function reqCheck(data) {
-    return request.get('/captcha/check',{params:{...data}});
+    return request.get('/captcha/check', { params: { ...data } });
 
-	// return  request({
+    // return  request({
     //     url: '/captcha/check',
     //     method: 'post',
     //     data
diff --git a/admin/src/lang/zh-cn/common.json b/admin/src/lang/zh-cn/common.json
index 76c81acb5..6752f2b17 100644
--- a/admin/src/lang/zh-cn/common.json
+++ b/admin/src/lang/zh-cn/common.json
@@ -1,191 +1,217 @@
 {
-  "edit": "编辑",
-  "delete": "删除",
-  "info": "详情",
-  "createTime": "创建时间",
-  "sort": "排序",
-  "status": "状态",
-  "operation": "操作",
-  "more": "更多",
-  "statusNormal": "正常",
-  "statusDeactivate": "停用",
-  "startUsing": "启用",
-  "confirm": "确认",
-  "save": "保存",
-  "back": "返回",
-  "cancel": "取消",
-  "search": "搜索",
-  "reset": "重置",
-  "refresh": "刷新",
-  "refreshSuccess": "刷新成功",
-  "select": "选择",
-  "export": "导出列表",
-  "exportPlaceholder": "确定要导出数据吗？",
-  "exportTip": "批量导出数据",
-  "exportConfirm": "确定并导出",
-  "warning": "提示",
-  "isShow": "是否显示",
-  "show": "显示",
-  "hidden": "隐藏",
-  "icon": "图标",
-  "userName": "用户名",
-  "headImg": "头像",
-  "accountNumber": "账号",
-  "accountSettings": "账号设置",
-  "realName":"名称",
-  "realNamePlaceholder": "请输入用户名称",
-  "password": "密码",
-  "confirmPassword": "确认密码",
-  "image": "图片",
-  "video": "视频",
-  "rename": "重命名",
-  "lookOver": "查看",
-  "selectAll": "全选",
-  "yes": "是",
-  "no": "否",
-  "copy": "复制",
-  "complete": "完成",
-  "copySuccess": "复制成功",
-  "notSupportCopy": "浏览器不支持一键复制，请手动进行复制",
-  "selectPlaceholder": "全部",
-  "provincePlaceholder": "请选择省",
-  "cityPlaceholder": "请选择市",
-  "districtPlaceholder": "请选择区/县",
-  "emptyData": "暂无数据",
-  "emptyQrCode": "暂无二维码",
-  "fileErr": "无法显示",
-  "upload": {
-    "root": "上传",
-    "selectimage": "选择图片",
-    "selectvideo": "选择视频",
-    "selecticon": "选择图标",
-    "selectnews": "选择图文",
-    "uploadimage": "上传图片",
-    "uploadvideo": "上传视频",
-    "addAttachmentCategory": "添加分组",
-    "attachmentCategoryPlaceholder": "请输入分组名称",
-    "attachmentEmpty": "暂无附件，请点击上传按钮上传",
-    "iconEmpty": "暂无图标",
-    "deleteCategoryTips": "确定要删除该分组吗？",
-    "deleteAttachmentTips": "确定要删除所选附件吗？如所选附件已被使用删除将会受到影响，请谨慎操作！",
-    "move": "移动",
-    "moveCategory": "移动分组",
-    "moveTo": "移动至",
-    "placeholderimageName": "请输入图片名称",
-    "placeholdervideoName": "请输入视频名称",
-    "placeholdericonName": "请输入图标名称",
-    "success": "上传成功",
-    "triggerUpperLimit": "可选数量已达上限",
-    "mediaEmpty": "暂无素材，请点击上传按钮上传"
-  },
-  "tabs": {
-    "closeLeft": "关闭左侧",
-    "closeRight": "关闭右侧",
-    "closeOther": "关闭其他"
-  },
-  "layout": {
-    "layoutSetting": "主题设置",
-    "darkMode": "黑暗模式",
-    "sidebarMode": "主题风格",
-    "themeColor": "主题颜色",
-    "detectionLoginOperation": "确定",
-    "detectionLoginContent": "已检测到有其他账号登录，需要刷新后才能继续操作。",
-    "detectionLoginTip": "提示",
-    "layoutStyle": "布局风格",
-    "tab": "开启标签栏"
-  },
-  "axios": {
-    "unknownError": "未知错误",
-    "400": "错误的请求",
-    "401": "请重新登录",
-    "403": "拒绝访问",
-    "404": "请求错误",
-    "405": "请求方法未允许",
-    "408": "请求超时",
-    "409": "请求跨域",
-    "500": "服务器端出错，错误原因：",
-    "501": "网络未实现",
-    "502": "网络错误",
-    "503": "服务不可用",
-    "504": "网络超时",
-    "505": "http版本不支持该请求",
-    "timeout": "网络请求超时！",
-    "requestError": "请求错误",
-    "errNetwork": "网络请求错误",
-    "baseUrlError": " 接口请求错误,请检查VITE_APP_BASE_URL参数配置或者伪静态配置, <a style='text-decoration: underline;' href='https://www.kancloud.cn/niucloud/niucloud-admin-develop/3213750' target='blank'>点击查看相关手册</a>"
-  },
-  "linkPlaceholder": "请选择跳转链接",
-  "selectLinkTips": "链接选择",
-  "diyLinkName": "链接名称",
-  "diyLinkNamePlaceholder": "请输入链接名称",
-  "diyLinkNameNotEmpty": "链接名称不能为空",
-  "diyLinkUrl": "跳转路径",
-  "diyLinkUrlPlaceholder": "请输入跳转路径",
-  "diyLinkUrlNotEmpty": "跳转路径不能为空",
-  "diyAppletId": "小程序AppID",
-  "diyAppletIdPlaceholder": "请输入要打开的小程序的appid",
-  "diyAppletIdNotEmpty": "小程序AppID不能为空",
-  "diyAppletPage": "小程序路径",
-  "diyAppletPagePlaceholder": "请输入要打开的小程序路径",
-  "diyAppletPageNotEmpty": "小程序路径不能为空",
-  "diyMakePhone": "电话号码",
-  "diyMakePhonePlaceholder": "请输入电话号码",
-  "diyMakePhoneNotEmpty": "电话号码不能为空",
-  "returnToPreviousPage": "返回",
-  "preview": "预览",
-  "emptyApp": "暂未安装任何应用",
-  "newInfo": "最新消息",
-  "visitWap": "访问店铺",
-  "mapSetting": "地图设置",
-  "mapKey": "腾讯地图KEY",
-  "indexTemplate": "首页模版",
-  "indexSwitch": "切换首页",
-  "indexWarning": "你确定要切换首页吗？",
-  "originalPassword": "原始密码",
-  "newPassword": "新密码",
-  "passwordCopy": "确认密码",
-  "passwordTip": "修改密码时必填.不修改密码时留空",
-  "originalPasswordPlaceholder": "请输入原始密码",
-  "passwordPlaceholder": "请输入新密码",
-  "originalPasswordHint": "原始密码不能为空",
-  "newPasswordHint": "请输入确认密码",
-  "doubleCipherHint": "两次新密码不同",
-  "confirmPasswordError": "两次新密码不同",
-  "upgrade": {
-    "upgradeButton": "立即升级",
-    "title": "升级",
-    "upgradingTips": "有正在执行的升级任务，",
-    "clickView": "点击查看",
-    "dirPermission": "目录读写权限",
-    "path": "路径",
-    "demand": "要求",
-    "readable": "可读",
-    "write": "可写",
-    "upgradeSuccess": "升级成功",
-    "localBuild": "手动编译",
-    "cloudBuild": "云编译",
-    "showDialogCloseTips": "升级任务尚未完成，关闭将取消升级，是否要继续关闭？",
-    "upgradeCompleteTips": "升级完成后还需要编译admin wap web端可选择云编译或者是手动编译",
-    "upgradeTips": "应用和插件升级时，系统会自动备份当前程序及数据库。升级功能不会造成您当前程序的损坏或者数据的丢失，请放心使用，但是升级过程可能会因为兼容性等各种原因出现意外的升级错误，当出现错误时，请参考链接<a href='https://www.kancloud.cn/niushop/niushop_v6/3228611' target='_blank' class='text-primary'> https://www.kancloud.cn/niushop/niushop_v6/3228611 </a>手动回退上一版本!",
-    "knownToKnow": "我已知晓，不需要再次提示"
-  },
-  "cloudbuild": {
-    "title": "云编译",
-    "executingTips": "有正在执行的编译任务，",
-    "clickView": "点击查看",
-    "dirPermission": "目录读写权限",
-    "path": "路径",
-    "demand": "要求",
-    "readable": "可读",
-    "write": "可写",
-    "cloudbuildSuccess": "编译完成",
-    "showDialogCloseTips": "编译任务尚未完成，关闭将取消编译，是否要继续关闭？"
-  },
-  "formSelectContentTitle": "表单名称",
-  "formSelectContentTitlePlaceholder": "请输入表单名称",
-  "formSelectContentTypeName": "表单类型",
-  "formSelectContentTypeNamePlaceholder": "请选择表单类型",
-  "formSelectContentTypeAll": "全部",
-  "formSelectContentTips": "请选择表单"
-
+	"edit": "编辑",
+	"delete": "删除",
+	"info": "详情",
+	"createTime": "创建时间",
+	"sort": "排序",
+	"status": "状态",
+	"operation": "操作",
+	"more": "更多",
+	"statusNormal": "正常",
+	"statusDeactivate": "停用",
+	"startUsing": "启用",
+	"confirm": "确认",
+	"save": "保存",
+	"back": "返回",
+	"cancel": "取消",
+	"search": "搜索",
+	"reset": "重置",
+	"refresh": "刷新",
+	"refreshSuccess": "刷新成功",
+	"select": "选择",
+	"export": "导出列表",
+	"exportPlaceholder": "确定要导出数据吗？",
+	"exportTip": "批量导出数据",
+	"exportConfirm": "确定并导出",
+	"warning": "提示",
+	"isShow": "是否显示",
+	"show": "显示",
+	"hidden": "隐藏",
+	"icon": "图标",
+	"userName": "用户名",
+	"headImg": "头像",
+	"accountNumber": "账号",
+	"accountSettings": "账号设置",
+	"realName": "名称",
+	"realNamePlaceholder": "请输入用户名称",
+	"password": "密码",
+	"confirmPassword": "确认密码",
+	"image": "图片",
+	"video": "视频",
+	"rename": "重命名",
+	"lookOver": "查看",
+	"selectAll": "全选",
+	"yes": "是",
+	"no": "否",
+	"copy": "复制",
+	"complete": "完成",
+	"copySuccess": "复制成功",
+	"notSupportCopy": "浏览器不支持一键复制，请手动进行复制",
+	"selectPlaceholder": "全部",
+	"provincePlaceholder": "请选择省",
+	"cityPlaceholder": "请选择市",
+	"districtPlaceholder": "请选择区/县",
+	"emptyData": "暂无数据",
+	"emptyQrCode": "暂无二维码",
+	"fileErr": "无法显示",
+	"upload": {
+		"root": "上传",
+		"selectimage": "选择图片",
+		"selectvideo": "选择视频",
+		"selecticon": "选择图标",
+		"selectnews": "选择图文",
+		"uploadimage": "上传图片",
+		"uploadvideo": "上传视频",
+		"addAttachmentCategory": "添加分组",
+		"attachmentCategoryPlaceholder": "请输入分组名称",
+		"attachmentEmpty": "暂无附件，请点击上传按钮上传",
+		"iconEmpty": "暂无图标",
+		"deleteCategoryTips": "确定要删除该分组吗？",
+		"deleteAttachmentTips": "确定要删除所选附件吗？如所选附件已被使用删除将会受到影响，请谨慎操作！",
+		"move": "移动",
+		"moveCategory": "移动分组",
+		"moveTo": "移动至",
+		"placeholderimageName": "请输入图片名称",
+		"placeholdervideoName": "请输入视频名称",
+		"placeholdericonName": "请输入图标名称",
+		"success": "上传成功",
+		"triggerUpperLimit": "可选数量已达上限",
+		"mediaEmpty": "暂无素材，请点击上传按钮上传"
+	},
+	"tabs": {
+		"closeLeft": "关闭左侧",
+		"closeRight": "关闭右侧",
+		"closeOther": "关闭其他"
+	},
+	"layout": {
+		"layoutSetting": "主题设置",
+		"darkMode": "黑暗模式",
+		"sidebarMode": "主题风格",
+		"themeColor": "主题颜色",
+		"detectionLoginOperation": "确定",
+		"detectionLoginContent": "已检测到有其他账号登录，需要刷新后才能继续操作。",
+		"detectionLoginTip": "提示",
+		"layoutStyle": "布局风格",
+		"tab": "开启标签栏"
+	},
+	"axios": {
+		"unknownError": "未知错误",
+		"400": "错误的请求",
+		"401": "请重新登录",
+		"403": "拒绝访问",
+		"404": "请求错误",
+		"405": "请求方法未允许",
+		"408": "请求超时",
+		"409": "请求跨域",
+		"500": "服务器端出错，错误原因：",
+		"501": "网络未实现",
+		"502": "网络错误",
+		"503": "服务不可用",
+		"504": "网络超时",
+		"505": "http版本不支持该请求",
+		"timeout": "网络请求超时！",
+		"requestError": "请求错误",
+		"errNetwork": "网络请求错误",
+		"baseUrlError": " 接口请求错误,请检查VITE_APP_BASE_URL参数配置或者伪静态配置, <a style='text-decoration: underline;' href='https://www.kancloud.cn/niucloud/niucloud-admin-develop/3213750' target='blank'>点击查看相关手册</a>"
+	},
+	"linkPlaceholder": "请选择跳转链接",
+	"selectLinkTips": "链接选择",
+	"diyLinkName": "链接名称",
+	"diyLinkNamePlaceholder": "请输入链接名称",
+	"diyLinkNameNotEmpty": "链接名称不能为空",
+	"diyLinkUrl": "跳转路径",
+	"diyLinkUrlPlaceholder": "请输入跳转路径",
+	"diyLinkUrlNotEmpty": "跳转路径不能为空",
+	"diyAppletId": "小程序AppID",
+	"diyAppletIdPlaceholder": "请输入要打开的小程序的appid",
+	"diyAppletIdNotEmpty": "小程序AppID不能为空",
+	"diyAppletPage": "小程序路径",
+	"diyAppletPagePlaceholder": "请输入要打开的小程序路径",
+	"diyAppletPageNotEmpty": "小程序路径不能为空",
+	"diyMakePhone": "电话号码",
+	"diyMakePhonePlaceholder": "请输入电话号码",
+	"diyMakePhoneNotEmpty": "电话号码不能为空",
+	"returnToPreviousPage": "返回",
+	"preview": "预览",
+	"emptyApp": "暂未安装任何应用",
+	"newInfo": "最新消息",
+	"visitWap": "访问店铺",
+	"mapSetting": "地图设置",
+	"mapKey": "腾讯地图KEY",
+	"indexTemplate": "首页模版",
+	"indexSwitch": "切换首页",
+	"indexWarning": "你确定要切换首页吗？",
+	"originalPassword": "原始密码",
+	"newPassword": "新密码",
+	"passwordCopy": "确认密码",
+	"passwordTip": "修改密码时必填.不修改密码时留空",
+	"originalPasswordPlaceholder": "请输入原始密码",
+	"passwordPlaceholder": "请输入新密码",
+	"originalPasswordHint": "原始密码不能为空",
+	"newPasswordHint": "请输入确认密码",
+	"doubleCipherHint": "两次新密码不同",
+	"confirmPasswordError": "两次新密码不同",
+	"upgrade": {
+		"upgradeButton": "立即升级",
+		"title": "升级",
+		"upgradingTips": "有正在执行的升级任务，",
+		"clickView": "点击查看",
+		"dirPermission": "目录读写权限",
+		"path": "路径",
+		"demand": "要求",
+		"readable": "可读",
+		"write": "可写",
+		"upgradeSuccess": "升级成功",
+		"localBuild": "本地编译",
+		"cloudBuild": "重试",
+		"rollback": "回滚",
+		"showDialogCloseTips": "升级任务尚未完成，关闭将取消升级，是否要继续关闭？",
+		"upgradeCompleteTips": "升级完成后还必须要重新编译admin wap web端，以免影响到程序正常运行。",
+		"upgradeTips": "应用和插件升级时，系统会自动备份当前程序及数据库。升级功能不会造成您当前程序的损坏或者数据的丢失，请放心使用，但是升级过程可能会因为兼容性等各种原因出现意外的升级错误，当出现错误时，请参考链接<a href='https://www.kancloud.cn/niushop/niushop_v6/3228611' target='_blank' class='text-primary'> https://www.kancloud.cn/niushop/niushop_v6/3228611 </a>手动回退上一版本!",
+		"knownToKnow": "我已知晓，不需要再次提示",
+		"cloudBuildErrorTips": "一键云编译队列任务过多，请等待几分钟后重试！"
+	},
+	"cloudbuild": {
+		"title": "云编译",
+		"executingTips": "有正在执行的编译任务，",
+		"clickView": "点击查看",
+		"dirPermission": "目录读写权限",
+		"path": "路径",
+		"demand": "要求",
+		"readable": "可读",
+		"write": "可写",
+		"cloudbuildSuccess": "编译完成",
+		"showDialogCloseTips": "编译任务尚未完成，关闭将取消编译，是否要继续关闭？"
+	},
+	"formSelectContentTitle": "表单名称",
+	"formSelectContentTitlePlaceholder": "请输入表单名称",
+	"formSelectContentTypeName": "表单类型",
+	"formSelectContentTypeNamePlaceholder": "请选择表单类型",
+	"formSelectContentTypeAll": "全部",
+	"formSelectContentTips": "请选择表单",
+	"appName": "应用名/版本信息",
+	"appIdentification": "应用标识",
+	"introduction": "简介",
+	"type": "类型",
+	"localAppText": "插件管理",
+	"upgrade2": "升级",
+	"installLabel": "已安装",
+	"uninstalledLabel": "未安装",
+	"buyLabel": "已购买",
+	"cloudBuild": "云编译",
+	"newVersion": "最新版本",
+	"tipText": "标识指开发应用或插件的文件夹名称",
+	"gxx": "更新信息",
+	"return": "返回",
+	"nextStep": "下一步",
+	"prev": "上一步",
+	"viewUpgradeContent": "查看升级内容",
+	"testDirectoryPermissions": "检测目录权限",
+	"backupFiles": "备份文件",
+	"startUpgrade": "开始升级",
+	"upgradeEnd": "升级完成",
+	"cloudBuildTips": "是否要进行云编译该操作可能会影响到正在访问的客户是否要继续操作？",
+	"promoteUrl": "推广链接",
+	"downLoadQRCode": "下载二维码",
+	"configureFailed": "配置失败"
 }
diff --git a/admin/src/layout/admin_simplicity/components/aside/menu-item.vue b/admin/src/layout/admin_simplicity/components/aside/menu-item.vue
index 8a7ce23de..f6c401e50 100644
--- a/admin/src/layout/admin_simplicity/components/aside/menu-item.vue
+++ b/admin/src/layout/admin_simplicity/components/aside/menu-item.vue
@@ -2,14 +2,26 @@
     <template v-if="meta.show">
         <el-sub-menu  v-if="meta.type == 0 && routes.children"  :index="String(routes.name)">
             <template #title>
-                <icon v-if="meta.icon && systemStore.menuIsCollapse || props.level != 1"  :name="meta.icon" :size="(meta.icon && systemStore.menuIsCollapse && props.level == 1) ? '20px' : '16px'" class="absolute" />
+                <div class="flex h-full flex-col items-center justify-center" v-if="systemStore.menuIsCollapse && props.level == 1">
+                    <icon v-if="meta.icon"  :name="meta.icon" :size="'20px'" class="leading-none"/>
+                    <div class="leading-none mt-[5px]">{{ meta.short_title || meta.title }}</div>
+                </div>
+                <template v-else>
+                    <icon v-if="meta.icon && props.level != 1"  :name="meta.icon" :size="props.level == 1 ? '20px' : '16px'" class="absolute" />
+                </template>
                 <span class="text-[14px]" :class="{ 'font-bold': props.level === 1 , ' ml-[20px]': (meta.icon && props.level != 1) }">{{ meta.title }}</span>
             </template>
             <menu-item v-for="(route, index) in routes.children" :routes="route" :key="index" :level="props.level + 1" />
         </el-sub-menu>
         <template v-else>
             <el-menu-item :index="String(routes.name)" @click="router.push({ name: routes.name })" >
-                <icon v-if="meta.icon && systemStore.menuIsCollapse || props.level != 1" :name="meta.icon" :size="(meta.icon && systemStore.menuIsCollapse && props.level == 1) ? '20px' : '16px'" class="absolute"   />
+                <div class="flex h-full flex-col items-center justify-center" v-if="systemStore.menuIsCollapse && props.level == 1">
+                    <icon v-if="meta.icon"  :name="meta.icon" :size="'20px'" class="leading-none"/>
+                    <div class="leading-none mt-[5px]">{{ meta.short_title || meta.title }}</div>
+                </div>
+                <template v-else>
+                    <icon v-if="meta.icon && props.level != 1"  :name="meta.icon" :size="props.level == 1 ? '20px' : '16px'" class="absolute" />
+                </template>
                 <template #title>
                     <span class="text-[14px]" :class="{ 'font-bold': props.level === 1 , ' ml-[20px]': (meta.icon && props.level != 1) }">{{ meta.title }}</span>
                 </template>
@@ -87,7 +99,7 @@ watch(route, () => {
             color: var(--el-color-primary);
         }
     }
-    
+
     .el-icon.el-sub-menu__icon-arrow{
         font-size: 15px;
         top: 50%;
diff --git a/admin/src/layout/admin_simplicity/components/aside/side.vue b/admin/src/layout/admin_simplicity/components/aside/side.vue
index 6c19b4c70..1bde07c6b 100644
--- a/admin/src/layout/admin_simplicity/components/aside/side.vue
+++ b/admin/src/layout/admin_simplicity/components/aside/side.vue
@@ -121,8 +121,12 @@ defaultOpeneds.value = menuData.value.map(item => item.name)
             justify-content: center;
             align-items: center;
         }
-        &.el-menu--collapse .el-sub-menu__title{
-            justify-content: center;
+        
+        &.el-menu--collapse {
+            .el-menu-item, .el-sub-menu__title {
+                --el-menu-item-height: 60px;
+                justify-content: center;
+            }
         }
     }
 
diff --git a/admin/src/layout/default/components/aside/menu-item.vue b/admin/src/layout/default/components/aside/menu-item.vue
index c9ad014c7..af85c1da7 100644
--- a/admin/src/layout/default/components/aside/menu-item.vue
+++ b/admin/src/layout/default/components/aside/menu-item.vue
@@ -40,7 +40,6 @@
 <script lang="ts" setup>
 import { useRouter, useRoute } from 'vue-router'
 import { ref, computed, watch } from 'vue'
-import { img } from '@/utils/common'
 import menuItem from './menu-item.vue'
 import useSystemStore from '@/stores/modules/system'
 import useUserStore from '@/stores/modules/user'
diff --git a/admin/src/layout/profession/components/aside/index.vue b/admin/src/layout/profession/components/aside/index.vue
index 491598fa1..5be2a4925 100644
--- a/admin/src/layout/profession/components/aside/index.vue
+++ b/admin/src/layout/profession/components/aside/index.vue
@@ -17,7 +17,6 @@ import useSystemStore from '@/stores/modules/system'
 import side from './side.vue'
 
 const route = useRoute()
-
 const systemStore = useSystemStore()
 const dark = computed(() => {
     return systemStore.dark
@@ -31,14 +30,14 @@ watch(route, () => {
 </script>
 
 <style lang="scss">
-    .layout-aside {
-        border-right: 1px solid var(--el-border-color-lighter);
-    }
+.layout-aside {
+    border-right: 1px solid var(--el-border-color-lighter);
+}
 
-    .aside-drawer {
+.aside-drawer {
 
-        .el-drawer__body {
-            padding: 0px !important;
-        }
+    .el-drawer__body {
+        padding: 0px !important;
     }
+}
 </style>
diff --git a/admin/src/layout/profession/components/aside/menu-item.vue b/admin/src/layout/profession/components/aside/menu-item.vue
index 5e3385eb0..5c22cb8fc 100644
--- a/admin/src/layout/profession/components/aside/menu-item.vue
+++ b/admin/src/layout/profession/components/aside/menu-item.vue
@@ -26,7 +26,6 @@
 <script lang="ts" setup>
 import { useRouter } from 'vue-router'
 import { computed } from 'vue'
-import { img } from '@/utils/common'
 import menuItem from './menu-item.vue'
 import useUserStore from '@/stores/modules/user'
 
@@ -51,14 +50,14 @@ const addons = computed(() => {
 </script>
 
 <style lang="scss">
-    .el-sub-menu {
+.el-sub-menu {
 
-        .el-icon {
-            width: auto;
-        }
-
-        li {
-            font-size: 15px;
-        }
+    .el-icon {
+        width: auto;
     }
+
+    li {
+        font-size: 15px;
+    }
+}
 </style>
diff --git a/admin/src/layout/profession/components/header/user-info.vue b/admin/src/layout/profession/components/header/user-info.vue
index db2ff42c5..96df25019 100644
--- a/admin/src/layout/profession/components/header/user-info.vue
+++ b/admin/src/layout/profession/components/header/user-info.vue
@@ -106,15 +106,15 @@ const saveInfo = reactive({
 });
 // 表单验证规则
 const formRules = reactive<FormRules>({
-  original_password: [
-    { required: true, message: t("originalPasswordPlaceholder"), trigger: "blur" },
-  ],
-  password: [
-    { required: true, message: t("passwordPlaceholder"), trigger: "blur" },
-  ],
-  password_copy: [
-    { required: true, message: t("passwordPlaceholder"), trigger: "blur" },
-  ]
+    original_password: [
+        { required: true, message: t("originalPasswordPlaceholder"), trigger: "blur" },
+    ],
+    password: [
+        { required: true, message: t("passwordPlaceholder"), trigger: "blur" },
+    ],
+    password_copy: [
+        { required: true, message: t("passwordPlaceholder"), trigger: "blur" },
+    ]
 });
 const submitForm = (formEl: FormInstance | undefined) => {
     if (!formEl) return
diff --git a/admin/src/stores/modules/diy.ts b/admin/src/stores/modules/diy.ts
index 8df1e1b6e..ff44345fc 100644
--- a/admin/src/stores/modules/diy.ts
+++ b/admin/src/stores/modules/diy.ts
@@ -260,7 +260,7 @@ const useDiyStore = defineStore('diy', {
                     // 指定位置添加组件
                     this.value.splice(this.value.length, 0, component);
                     this.currentIndex = this.value.length - 1;
-                }else{
+                } else {
 
                     this.currentIndex = 0;
                     // 指定位置添加组件
@@ -270,7 +270,7 @@ const useDiyStore = defineStore('diy', {
             } else if (this.currentIndex === -99) {
                 let index = this.currentIndex;
                 for (let i = this.value.length - 1; i >= 0; i--) {
-                    if (this.value[i].position) {
+                    if (this.value[i].position == 'bottom_fixed') {
                         index = i; // 在定位组件之前添加
                         break;
                     }
diff --git a/admin/src/stores/modules/user.ts b/admin/src/stores/modules/user.ts
index a2cca7021..d36629df0 100644
--- a/admin/src/stores/modules/user.ts
+++ b/admin/src/stores/modules/user.ts
@@ -59,6 +59,9 @@ const userStore = defineStore('user', {
                 })
             })
         },
+        clearRouters() {
+            this.routers = []
+        },
         logout() {
             if (!this.token) return
             this.token = ''
diff --git a/admin/src/styles/common.scss b/admin/src/styles/common.scss
index d1fa48c4d..41cb5f033 100644
--- a/admin/src/styles/common.scss
+++ b/admin/src/styles/common.scss
@@ -142,7 +142,7 @@ html.dark {
         --el-table-header-text-color: var(--el-text-color-secondary) !important;
         --el-table-header-bg-color: var(--el-bg-color) !important;
     }
-    
+
     // 编辑器
     .edui-default {
 
@@ -292,3 +292,30 @@ html.dark {
         font-size: 24px;
     }
 }
+
+.t-window {
+    line-height: normal!important;
+    padding-top: 10px!important;
+    --t-main-background-color: #1d1f3a;
+    --t-main-font-color: #ececee;
+
+    .t-cmd-key {
+        font-weight: normal;
+        color: var(--t-main-font-color);
+    }
+
+    .t-log-box {
+        margin-block-start: 3px;
+        margin-block-end: 3px;
+        &:first-child {
+            display: none;
+        }
+    }
+    .t-content-normal .error {
+        display: none;
+
+        & + span {
+            color: red;
+        }
+    }
+}
diff --git a/admin/src/styles/icon/iconfont.css b/admin/src/styles/icon/iconfont.css
index 06774671b..1dfabbb7c 100644
--- a/admin/src/styles/icon/iconfont.css
+++ b/admin/src/styles/icon/iconfont.css
@@ -1,8 +1,8 @@
 @font-face {
   font-family: "iconfont"; /* Project id 3883393 */
-  src: url('//at.alicdn.com/t/c/font_3883393_7g8irvl9kow.woff2?t=1740712666977') format('woff2'),
-       url('//at.alicdn.com/t/c/font_3883393_7g8irvl9kow.woff?t=1740712666977') format('woff'),
-       url('//at.alicdn.com/t/c/font_3883393_7g8irvl9kow.ttf?t=1740712666977') format('truetype');
+  src: url('//at.alicdn.com/t/c/font_3883393_i5dh2ca32bh.woff2?t=1744192920398') format('woff2'),
+  url('//at.alicdn.com/t/c/font_3883393_i5dh2ca32bh.woff?t=1744192920398') format('woff'),
+  url('//at.alicdn.com/t/c/font_3883393_i5dh2ca32bh.ttf?t=1744192920398') format('truetype');
 }
 
 .iconfont {
@@ -13,6 +13,22 @@
   -moz-osx-font-smoothing: grayscale;
 }
 
+.iconbeifenjiluV6xx:before {
+  content: "\e89d";
+}
+
+.iconyun2:before {
+  content: "\e88d";
+}
+
+.iconxitonggengxin:before {
+  content: "\e88c";
+}
+
+.iconshengjijilu:before {
+  content: "\e88e";
+}
+
 .iconshanchu-fanggaiV6xx:before {
   content: "\e88a";
 }
diff --git a/admin/src/utils/common.ts b/admin/src/utils/common.ts
index 7a153d9b4..6a52b3ed4 100644
--- a/admin/src/utils/common.ts
+++ b/admin/src/utils/common.ts
@@ -127,7 +127,12 @@ export function isUrl(str: string): boolean {
  * @returns
  */
 export function img(path: string): string {
-    return isUrl(path) ? path : `${ import.meta.env.VITE_IMG_DOMAIN || location.origin }/${ path }`
+    let imgDomain = import.meta.env.VITE_IMG_DOMAIN || location.origin
+
+    if (typeof path == 'string' && path.startsWith('/')) path = path.replace(/^\//, '')
+    if (typeof imgDomain == 'string' && imgDomain.endsWith('/')) imgDomain = imgDomain.slice(0, -1)
+
+    return isUrl(path) ? path : `${imgDomain}/${path}`
 }
 
 /**