fix: 修复分类统计显示undefined问题 #42

feat: 添加文章访问统计功能
1. 新增getDomainOnly工具函数用于提取URL域名 2. 新增postTrackersCounter接口调用方法 3. 在文章详情页添加访问数据上报 #31 #41
2026-07-27 20:40:41 +08:00 · 2026-07-20 16:21:18 +08:00 · 2026-06-05 13:20:25 +08:00 · 2026-05-25 00:33:24 +08:00 · 2026-05-25 00:32:16 +08:00 · 2026-05-25 00:27:42 +08:00
117 changed files with 24791 additions and 8021 deletions
@@ -2,8 +2,4 @@ node_modules/
 unpackage/
 package-lock.json
 .idea
-
-config/halo.config.js 
-config/love.config.js
-config/token.config.js
-config/plugins.config.js
+.trae
@@ -1,5 +1,5 @@
 <script>
-import HaloTokenConfig from '@/config/token.config.js';
+import HaloTokenConfig from '@/config/uhalo.config.js';

 // app升级检测（搭配：https://ext.dcloud.net.cn/plugin?id=4470 升级中心）
 import CheckAppUpdate from '@/uni_modules/uni-upgrade-center-app/utils/check-update';
@@ -1,6 +1,6 @@
 <p align="center">
    <a href="https://uni-halo.925i.cn" target="_blank" rel="noopener noreferrer">
-        <img width="100" src="https://b.925i.cn/uni_halo/uni_halo_logo.png" alt="uni-halo logo" />
+        <img width="100" src="https://uni-halo.925i.cn/logo.png" alt="uni-halo logo" />
    </a>
 </p>

@@ -20,9 +20,9 @@

 如果您觉得这个项目对您有帮助，可以帮作者买杯饮料鼓励鼓励，同时为了项目能够持续发展，可以根据您的喜好支持一下本项目哦，非常感谢您的支持，作者也会更有动力持续维护和更新新的功能哦~

-|                支付宝												                 |                微信												                 |                QQ												                 |
-|:----------------------------------------------:|:---------------------------------------------:|:---------------------------------------------:|
-| ![支付宝赞赏](https://b.925i.cn/skm/zf_zfb_skm.png) | ![微信赞赏](https://b.925i.cn/skm/zf_wx_zsm.png)	 | ![QQ赞赏](https://b.925i.cn/skm/zf_qq_skm.png)	 |
+|                                                 支付宝                                                 |                                                微信                                                 |                                                QQ                                                 |
+|:---------------------------------------------------------------------------------------------------:|:-------------------------------------------------------------------------------------------------:|:-------------------------------------------------------------------------------------------------:|
+| ![支付宝赞助](https://gcore.jsdelivr.net/gh/uni-halo/uni-halo-static-resources/author/ZFBRewardCode.png) | ![微信赞助](https://gcore.jsdelivr.net/gh/uni-halo/uni-halo-static-resources/author/WXRewardCode.png) | ![QQ赞助](https://gcore.jsdelivr.net/gh/uni-halo/uni-halo-static-resources/author/QQRewardCode.png) |

 ## 一、项目介绍

@@ -34,30 +34,20 @@
 - 支持特色功能，恋爱日记
 - 理论支持编译为 小程序（推荐）、APP

-
-### 在线预览
-
-微信内容扫描下方二维码，即可在线预览小程序。
-
-![QQ交流群](https://blog.925i.cn/upload/xiaochengxu.gif)
-
-
 ### 部分截图

-|首页|分类|图库|
+|首页|分类|我的|
 |:--:|:--:|:--:|
-|![首页](https://blog.925i.cn/upload/39789CF4434C9CD6A6289D7209AF6EEF.jpg)|![分类](https://blog.925i.cn/upload/19CB6B66F40200045B6F572A9C28C5E8.jpg)|![图库](https://blog.925i.cn/upload/464F22FDB216CE802653A5F03BE34351.jpg)|
+|![首页](https://gcore.jsdelivr.net/gh/uni-halo/uni-halo-static-resources/screenshots/v2/首页.png)|![分类](https://gcore.jsdelivr.net/gh/uni-halo/uni-halo-static-resources/screenshots/v2/分类.jpg)|![我的](https://gcore.jsdelivr.net/gh/uni-halo/uni-halo-static-resources/screenshots/v2/关于.jpg)|

-|瞬间|我的|
-|:--:|:--:|
-|![瞬间](https://blog.925i.cn/upload/41EE8ADBFAE709A483A6E5F814C6A6E4.jpg)|![我的](https://blog.925i.cn/upload/9AEFE8DA4671A3C7F20F76FF3F9D15C9.jpg)|


 ### 恋爱日记

-|主页|恋爱清单|
-|:--:|:--:|
-|![主页](https://uni-halo.925i.cn/assets/love_001.6bf8b4e9.jpg)|![恋爱清单](https://uni-halo.925i.cn/assets/love_002.a08bd8d6.jpg)|
+- 在 uni-halo 中，我们为您准备了一个恋爱日记的模块，您可以在其中记录您的恋爱故事，分享给您的朋友们，请扫示例小程序，在线体验恋爱日记的功能。
+
+![恋爱日记](https://gcore.jsdelivr.net/gh/uni-halo/uni-halo-static-resources/screenshots/v2/恋爱日记.jpg)
+
 <br/>


@@ -83,7 +73,7 @@
 ## 三、相关文档

 - 作者主页：[https://www.xiaoxiaomo.cn/](https://www.xiaoxiaomo.cn/)
- 作者博客：[https://blog.925i.cn/](https://blog.925i.cn/)
+- 作者博客：[https://blog.xiaoxiaomo.cn/](https://blog.xiaoxiaomo.cn/)
 - 官方文档：[https://uni-halo.925i.cn/](https://uni-halo.925i.cn/)
 - 代码仓库：[https://github.com/ialley-workshop-open/uni-halo](https://github.com/ialley-workshop-open/uni-halo)
 - 插件地址：[https://github.com/ialley-workshop-open/plugin-uni-halo](https://github.com/ialley-workshop-open/uni-halo)
@@ -93,11 +83,8 @@
 ## 四、使用交流

 - 提交 issues：[Github Issues](https://github.com/ialley-workshop-open/uni-halo/issues)
-  丨 [Gitee Issues](https://gitee.com/ialley-workshop-open/uni-halo/issues)
- 微信交流群：由于微信交流群时效性太短，所以有需要的话可以先加入QQ群，再邀请进微信群
 - QQ 交流群：632969367
-
-![QQ交流群](https://blog.925i.cn/upload/qun.png)
+- 微信交流群：由于微信交流群时效性太短，所以有需要的话可以先加入QQ群，再邀请进微信群

 <br/>

@@ -109,6 +96,16 @@ uni-halo 还在持续更新中，本项目欢迎您的参与，共同维护，

 <br/>

+## 💪 贡献者们
+
+感谢以下所有给 uni-halo 贡献过代码的 [开发者](https://github.com/ialley-workshop-open/uni-halo/graphs/contributors)。
+
+<a href="https://github.com/ialley-workshop-open/uni-halo/graphs/contributors">
+  <img src="https://contrib.rocks/image?repo=ialley-workshop-open/uni-halo" />
+</a>
+
+<br/>
+
 ## 🔍 开源许可

 uni-halo 使用 AGPL-3.0 协议开源，请遵守开源协议。
@@ -16,7 +16,7 @@ import v2Config from './v2/all.config.js'

 const ApiManager = {
    v2,
-    v2Config,
+    v2Config
 };

 const install = (Vue) => {
@@ -1,216 +1,185 @@
-/**
- * 所有的接口
- */
-import HaloTokenConfig from '@/config/token.config.js'
+import {
+	getPersonalToken
+} from '@/utils/token.js'
 import HttpHandler from '@/common/http/request.js'
+import qs from 'qs'

 import {
 	getAppConfigs
 } from '@/config/index.js'
+import { getNologinEmail, getOpenid } from "@/utils/auth";

 export default {
-	/**
-	 * 获取文章列表
-	 * @param {Object} params 参数
-	 */
 	getPostList: (params) => {
 		return HttpHandler.Get(`/apis/api.content.halo.run/v1alpha1/posts`, params)
 	},

-	/**
-	 * 根据名称获取文章
-	 * @param {String} name 分类名称
-	 */
 	getPostByName: (name) => {
 		return HttpHandler.Get(`/apis/api.content.halo.run/v1alpha1/posts/${name}`, {}, {
 			header: {
-				'Wechat-Session-Id': uni.getStorageSync('openid'),
+				'Wechat-Session-Id': getOpenid(),
+				'nologin-email': getNologinEmail()
 			}
 		})
 	},

-	/**
-	 * 搜索文章
-	 * @param {Object} params 数据
-	 */
 	getPostListByKeyword: (params) => {
-		return HttpHandler.Get(`/apis/api.halo.run/v1alpha1/indices/post`, params)
+		return HttpHandler.Post(`/apis/api.halo.run/v1alpha1/indices/-/search`, params)
 	},

-	/**
-	 * 查询分类列表
-	 * @param {Object} params  查询参数
-	 */
 	getCategoryList: (params) => {
-		return HttpHandler.Get('/apis/api.content.halo.run/v1alpha1/categories', params)
+		const param = qs.stringify(params, {
+			allowDots: true,
+			encodeValuesOnly: true,
+			skipNulls: true,
+			encode: false,
+			arrayFormat: 'repeat'
+		})
+		return HttpHandler.Get(`/apis/api.content.halo.run/v1alpha1/categories?${param}`, {})
 	},
-	/**
-	 * 查询分类下的文章
-	 * @param {String} name  分类名称
-	 * @param {Object} params  查询参数
-	 */
+
 	getCategoryPostList: (name, params) => {
 		return HttpHandler.Get(`/apis/api.content.halo.run/v1alpha1/categories/${name}/posts`, params)
 	},


-	/**
-	 * 获取评论列表接口（列表数据）
-	 * @param {Object} params  查询参数
-	 */
 	getPostCommentList: (params) => {
 		return HttpHandler.Get(`/apis/api.halo.run/v1alpha1/comments`, params)
 	},

-	/**
-	 * 获取回复列表
-	 * @param {String} commentName  名称
-	 * @param {Object} params  查询参数
-	 */
 	getPostCommentReplyList: (commentName, params) => {
 		return HttpHandler.Get(`/apis/api.halo.run/v1alpha1/comments/${commentName}/reply`, params)
 	},

-	// 提交评论
 	addPostComment: (data) => {
 		return HttpHandler.Post(`/apis/api.halo.run/v1alpha1/comments`, data)
 	},
-	// 提交回复
+
 	addPostCommentReply: (commentName, data) => {
 		return HttpHandler.Post(`/apis/api.halo.run/v1alpha1/comments/${commentName}/reply`, data)
 	},

-	/**
-	 * 获取标签列表
-	 * @param {Object} params  查询参数
-	 */
 	getTagList: (params) => {
 		return HttpHandler.Get(`/apis/api.content.halo.run/v1alpha1/tags`, params)
 	},

-	/**
-	 * 根据标签获取文章列表
-	 * @param {String} tagName  参数
-	 * @param {Object} params  查询参数
-	 */
 	getPostByTagName: (tagName, params) => {
 		return HttpHandler.Get(`/apis/api.content.halo.run/v1alpha1/tags/${tagName}/posts`, params)
 	},

-	/**
-	 * 获取瞬间列表
-	 */
 	getMomentList: (params) => {
-		return HttpHandler.Get(`/apis/moment.halo.run/v1alpha1/moments`, params, {
+		return HttpHandler.Get(`/apis/api.moment.halo.run/v1alpha1/moments`, params, {
 			custom: {
-				systemToken: HaloTokenConfig.systemToken
+				personalToken: getPersonalToken()
+			}
+		})
+	},
+
+	getMomentByName: (name) => {
+		return HttpHandler.Get(`/apis/api.moment.halo.run/v1alpha1/moments/${name}`, {}, {
+			custom: {
+				personalToken: getPersonalToken()
 			}
 		})
 	},

-	/**
-	 * 查询站点统计信息
-	 */
 	getBlogStatistics: () => {
 		return HttpHandler.Get(`/apis/api.halo.run/v1alpha1/stats/-`, {})
 	},

-
-	/**
-	 * 获取相册分组
-	 */
 	getPhotoGroupList: (params) => {
-		return HttpHandler.Get(`/apis/core.halo.run/v1alpha1/photogroups`, params, {
-			custom: {
-				systemToken: HaloTokenConfig.systemToken
-			}
-		})
+		return HttpHandler.Get(`/apis/api.photo.halo.run/v1alpha1/photogroups`, params)
 	},

-
-	/**
-	 * 根据分组获取相册
-	 */
 	getPhotoListByGroupName: (params) => {
-		return HttpHandler.Get(`/apis/console.api.photo.halo.run/v1alpha1/photos`, params, {
-			custom: {
-				systemToken: HaloTokenConfig.systemToken
-			}
-		})
+		return HttpHandler.Get(`/apis/api.photo.halo.run/v1alpha1/photos`, params)
 	},

-	/**
-	 * 获取友链分组
-	 */
 	getFriendLinkGroupList: (params) => {
-		return HttpHandler.Get(`/apis/core.halo.run/v1alpha1/linkgroups`, params,{
-			custom: {
-				systemToken: HaloTokenConfig.systemToken
-			}
-		})
+		return HttpHandler.Get(`/apis/api.link.halo.run/v1alpha1/linkgroups`, params)
 	},

-	/**
-	 * 获取友链
-	 */
 	getFriendLinkList: (params) => {
-		return HttpHandler.Get(`/apis/api.plugin.halo.run/v1alpha1/plugins/PluginLinks/links`, params)
+		return HttpHandler.Get(`/apis/api.link.halo.run/v1alpha1/links`, params)
 	},

-
-	/**
-	 * 校验文章访问密码
-	 */
-	checkPostVerifyCode: (verifyCode, postId) => {
-		return HttpHandler.Get(`/apis/tools.muyin.site/v1alpha1/verificationCode/check?code=${verifyCode}`, null, {
+	requestRestrictReadCheck: (restrictType, code, keyId) => {
+		const params = {
+			code: code,
+			templateType: 'post',
+			restrictType: restrictType,
+			keyId: keyId
+		}
+		return HttpHandler.Post(`/apis/tools.muyin.site/v1alpha1/restrict-read/check`, params, {
 			header: {
 				'Authorization': getAppConfigs().pluginConfig.toolsPlugin?.Authorization,
-				'Wechat-Session-Id': uni.getStorageSync('openid'),
-				'Post-Id': postId
+				'Wechat-Session-Id': getOpenid(),
+				'nologin-email': getNologinEmail()
 			}
 		})
 	},

-	/**
-	 * 校验文章访问密码
-	 */
-	checkPostPasswordAccess: (password, postId) => {
-		return HttpHandler.Get(`/apis/tools.muyin.site/v1alpha1/visitPassword/checkPost?password=${password}`,
-		null, {
+	createVerificationCode: () => {
+		return HttpHandler.Get(`/apis/tools.muyin.site/v1alpha1/restrict-read/create`, null, {
 			header: {
 				'Authorization': getAppConfigs().pluginConfig.toolsPlugin?.Authorization,
-				'Wechat-Session-Id': uni.getStorageSync('openid'),
-				'Post-Id': postId
+				'Wechat-Session-Id': getOpenid(),
 			}
 		})
 	},

-	/**
-	 * 获取文章验证码
-	 */
-	getPostVerifyCode: () => {
-		return HttpHandler.Get(`/apis/tools.muyin.site/v1alpha1/verificationCode/create`, null, {
-			header: {
-				'Authorization': getAppConfigs().pluginConfig.toolsPlugin?.Authorization,
-			}
-		})
-	},
-	/**
-	 * 提交友情链接
-	 */
 	submitLink(form) {
-		return HttpHandler.Post(`/apis/linksSubmit.muyin.site/v1alpha1/submit`, form, null)
+		return HttpHandler.Post(`/apis/linkssubmit.muyin.site/v1alpha1/submit`, form, {
+			header: {
+				'Authorization': getAppConfigs().pluginConfig.linksSubmitPlugin?.Authorization,
+				'Wechat-Session-Id': getOpenid(),
+			}
+		})
 	},
-	/**
-	 * 获取二维码信息
-	 */
+
 	getQRCodeInfo: (key) => {
-		return HttpHandler.Get(`/apis/api.uni.uhalo.pro/v1alpha1/plugins/plugin-uni-halo/getQRCodeInfo/${key}`, null,)
+		return HttpHandler.Get(`/apis/api.uni.uhalo.pro/v1alpha1/plugins/plugin-uni-halo/getQRCodeInfo/${key}`,
+			null, {})
 	},
-	/**
-	 * 获取二维码图片
-	 */
+
 	getQRCodeImg: (postId) => {
-		return HttpHandler.Get(`/apis/api.uni.uhalo.pro/v1alpha1/plugins/plugin-uni-halo/getQRCodeImg/${postId}`, null,)
-	}
+		return HttpHandler.Get(`/apis/api.uni.uhalo.pro/v1alpha1/plugins/plugin-uni-halo/getQRCodeImg/${postId}`,
+			null, {})
+	},
+
+	submitUpvote(data) {
+		return HttpHandler.Post(`/apis/api.halo.run/v1alpha1/trackers/upvote`, data, {})
+	},
+
+	getVoteList: (params) => {
+		return HttpHandler.Get(`/apis/api.vote.kunkunyu.com/v1alpha1/votes`, params)
+	},
+
+	getVoteDetail: (name) => {
+		return HttpHandler.Get(`/apis/api.vote.kunkunyu.com/v1alpha1/votes/${name}/detail`, {})
+	},
+
+	getVoteUserList: (name) => {
+		return HttpHandler.Get(`/apis/api.vote.kunkunyu.com/v1alpha1/votes/${name}/user-list`, {})
+	},
+
+	submitVote: (name, data, canAnonymously = true) => {
+		return HttpHandler.Post(`/apis/api.vote.kunkunyu.com/v1alpha1/votes/${name}/submit`, data, {
+			custom: {
+				personalToken: canAnonymously ? undefined : getPersonalToken()
+			}
+		})
+	},
+
+	checkPluginAvailable: (name) => {
+		return HttpHandler.Get(`/apis/api.plugin.halo.run/v1alpha1/plugins/${name}/available`, {})
+	},
+
+	getDoubanDetail: (url) => {
+		return HttpHandler.Get(`/apis/api.douban.moony.la/v1alpha1/doubanmovies/-/getDoubanDetail`, { url })
+	},
+	
+	postTrackersCounter: (data) => {
+		return HttpHandler.Post(`/apis/api.halo.run/v1alpha1/trackers/counter`, data)
+	},
 }
@@ -0,0 +1,35 @@
+/**
+ * Halo 数据看板插件
+ * @link https://www.halo.run/store/apps/app-rtnbbgfk
+ */
+import {
+	getPersonalToken
+} from '@/utils/token.js'
+import HttpHandler from '@/common/http/request.js'
+import qs from 'qs'
+
+import {
+	getAppConfigs
+} from '@/config/index.js'
+
+export default {
+	/**
+	* 获取图表统计数据
+	* @description - 标签、分类、文章发布趋势、评论活跃用户、获取热门文章top10 
+	*/
+	getChartData: () => {
+		return HttpHandler.Get(`/apis/api.data.statistics.xhhao.com/v1alpha1/chart/data`,{})
+	},
+	/**
+	* 获取Github配置信息 
+	*/
+	getGithubConfig:()=>{
+		return HttpHandler.Get('/apis/api.data.statistics.xhhao.com/v1alpha1/github/config',{})
+	},
+	/**
+	* 获取 Uptime Kuma 状态页面数据
+	*/
+	getUptimeStatus:()=>{
+		return HttpHandler.Get('/apis/api.data.statistics.xhhao.com/v1alpha1/github/config',{})
+	}
+}
@@ -10,7 +10,7 @@
 *  修改时间：
 */

-import HaloTokenConfig from '@/config/token.config.js'
+import HaloTokenConfig from '@/config/uhalo.config.js'
 import {
 	setInterceptors
 } from "./interceptors.js";
@@ -21,7 +21,7 @@ const http = new Request()
 http.setConfig((config) => {

 	// 如果是在外部浏览器调试或者编译为h5，请注释该行代码
-	config.baseURL = HaloTokenConfig.BASE_API;
+	config.baseURL = HaloTokenConfig.BASE_API.replace(/\/+$/, "");

 	config.header = {
 		...config.header,
@@ -9,149 +9,133 @@
 *  修改人员：
 *  修改时间：
 */
-import {
-	getAdminAccessToken
-} from "@/utils/auth.js";
-import {
-	delCache,
-	setCache
-} from "@/utils/storage";
+import {delCache, setCache} from "@/utils/storage";

 const getCategoryNameByUrl = (url) => {
-	const reg = '(?<=/api/content/categories/).+(?=/posts)'
-	return url.match(reg)[0] || '无分类名'
+    const reg = '(?<=/api/content/categories/).+(?=/posts)'
+    return url.match(reg)[0] || '无分类名'
 }
 const showCategoryInputPasswordModal = (response, category) => {
-	uni.showModal({
-		title: `[ ${category} ] 分类已加密`, // TODO 这里应该获取分类的名字，可以在弹窗之前请求后台拿到所有分类根据分类code拿到名称，但是不会在这之前发送请求
-		content: '',
-		editable: true,
-		placeholderText: '请输入分类密码后访问',
-		confirmText: '验证密码',
-		cancelText: '暂不访问',
-		showCancel: true,
-		cancelColor: '#999999',
-		confirmColor: '#03a9f4',
-		success: (res) => {
-			if (res.confirm) {
-				// TODO 这里如果没有输入密码点击确认应该阻止窗口关闭，但是没找到方法
-				if (!res.content) {
-					uni.showToast({
-						title: '提示：请输入密码',
-						icon: 'none',
-						success: () => {
-							setTimeout(() => {
-								showCategoryInputPasswordModal(response, category);
-							}, 800)
-						}
-					})
-					return;
-				}
-				// 根据请求URL正则匹配分类code，然后把输入的密码根据分类code放入缓存，然后在category.getCategoryPostList中获取，解决多个分类加密输入密码后点错的问题
-				// 目前存在一个问题，比如前两个都需要密码，如果先输入第二个的密码之后，重新进来默认打开第一个还会弹窗，所以想在弹窗标题上增加分类名字
-				// 另外有以下两种方式科技解决
-				// TODO 1.其实这里获取到密码之后可以直接发送一个请求追加上password参数，因为后台会缓存权限，后续不输入密码也可以访问,可惜不会
-				// TODO 2.另外也可以拿到密码之后，直接选中该分类追加password参数，重新请求，可惜也不会
-				setCache('APP_CATEGORY_PWD_' + category, res.content)
-				uni.reLaunch({
-					url: '/pages/tabbar/category/category'
-				});
-			} else if (res.cancel) {}
-		},
-	})
+    uni.showModal({
+        title: `[ ${category} ] 分类已加密`, // TODO 这里应该获取分类的名字，可以在弹窗之前请求后台拿到所有分类根据分类code拿到名称，但是不会在这之前发送请求
+        content: '',
+        editable: true,
+        placeholderText: '请输入分类密码后访问',
+        confirmText: '验证密码',
+        cancelText: '暂不访问',
+        showCancel: true,
+        cancelColor: '#999999',
+        confirmColor: '#03a9f4',
+        success: (res) => {
+            if (res.confirm) {
+                // TODO 这里如果没有输入密码点击确认应该阻止窗口关闭，但是没找到方法
+                if (!res.content) {
+                    uni.showToast({
+                        title: '提示：请输入密码', icon: 'none', success: () => {
+                            setTimeout(() => {
+                                showCategoryInputPasswordModal(response, category);
+                            }, 800)
+                        }
+                    })
+                    return;
+                }
+                // 根据请求URL正则匹配分类code，然后把输入的密码根据分类code放入缓存，然后在category.getCategoryPostList中获取，解决多个分类加密输入密码后点错的问题
+                // 目前存在一个问题，比如前两个都需要密码，如果先输入第二个的密码之后，重新进来默认打开第一个还会弹窗，所以想在弹窗标题上增加分类名字
+                // 另外有以下两种方式科技解决
+                // TODO 1.其实这里获取到密码之后可以直接发送一个请求追加上password参数，因为后台会缓存权限，后续不输入密码也可以访问,可惜不会
+                // TODO 2.另外也可以拿到密码之后，直接选中该分类追加password参数，重新请求，可惜也不会
+                setCache('APP_CATEGORY_PWD_' + category, res.content)
+                uni.reLaunch({
+                    url: '/pages/tabbar/category/category'
+                });
+            } else if (res.cancel) {
+            }
+        },
+    })
 }

 export const setInterceptors = (http) => {
-	http.interceptors.request.use(
-		(config) => {
-			console.log("config", config)
+    http.interceptors.request.use((config) => {
+        console.log("config", config)

-			// 可使用async await 做异步操作
-			config.header = {
-				...config.header
-				// ... 可以直接加参数
-			};
-			if (config.custom.systemToken) {
-				config.header['Authorization'] = `Bearer ${config.custom.systemToken}`
-			}
-			return config;
-		},
-		(config) => {
-			// 可使用async await 做异步操作
-			return Promise.reject(config);
-		}
-	);
+        // 可使用async await 做异步操作
+        config.header = {
+            ...config.header
+            // ... 可以直接加参数
+        };
+        if (config.custom.personalToken) {
+            config.header['Authorization'] = `Bearer ${config.custom.personalToken}`
+        }
+        return config;
+    }, (config) => {
+        // 可使用async await 做异步操作
+        return Promise.reject(config);
+    });

-	http.interceptors.response.use(
-		(response) => {
-			/* 对响应成功做点什么 可使用async await 做异步操作*/
-			//  if (response.data.code !== 200) { // 服务端返回的状态码不等于200，则reject()
-			//    return Promise.reject(response) // return Promise.reject 可使promise状态进入catch
-			// if (response.config.custom.verification) { // 演示自定义参数的作用
-			//   return response.data
-			// } 
+    http.interceptors.response.use((response) => {
+        /* 对响应成功做点什么 可使用async await 做异步操作*/
+        //  if (response.data.code !== 200) { // 服务端返回的状态码不等于200，则reject()
+        //    return Promise.reject(response) // return Promise.reject 可使promise状态进入catch
+        // if (response.config.custom.verification) { // 演示自定义参数的作用
+        //   return response.data
+        // }

-			if (response.statusCode == 200) {
-				return response.data;
-			} else {
-				return Promise.reject(response);
-			}
-		},
-		(response) => {
-			/*  对响应错误做点什么 （statusCode !== 200）*/
-			if (!response.data) {
-				return Promise.reject({
-					status: 500,
-					message: 'API接口服务异常！'
-				})
-			} else if (response.data.status == 401) {
-				uni.$tm.toast(response.data.message);
-				// 如果是请求分类之后报401说明密码错误，那么清除该密码，下次点击会报403弹窗再次输入密码
-				if (response.config.url.indexOf('/api/content/categories') >= 0) {
-					const category = getCategoryNameByUrl(response.config.url)
-					delCache('APP_CATEGORY_PWD_' + category);
-					uni.showToast({
-						title: '提示：密码不正确',
-						icon: 'none',
-						success: () => {
-							setTimeout(() => {
-								showCategoryInputPasswordModal(response, category);
-							}, 800)
-						}
-					})
-				} else {
-					// 其他情况维持原来的逻辑
-					delCache('APP_ADMIN_LOGIN_TOKEN');
-					uni.$eShowModal({
-						title: '提示',
-						content: '您未登录超管账号或登录已过期，是否重新登录？',
-						showCancel: true,
-						cancelText: '否',
-						cancelColor: '#999999',
-						confirmText: '是',
-						confirmColor: '#03a9f4'
-					}).then(res => {
-						uni.navigateTo({
-							url: '/pagesB/login/login'
-						})
-					}).catch(err => {
-						uni.switchTab({
-							url: '/pages/tabbar/about/about'
-						})
-					})
-				}
-				return Promise.reject(response.data);
-			} else if (response.data.status == 403) {
-				// 如果报403是请求分类文章接口（您没有该分类的访问权限）的话说明是私密分类，需要输入密码请求
-				if (response.config.url.indexOf('/api/content/categories') >= 0) {
-					const category = getCategoryNameByUrl(response.config.url);
-					showCategoryInputPasswordModal(response, category);
-				}
-				return Promise.reject(response.data);
-			} else {
-				return Promise.reject(response.data);
-			}
+        if (response.statusCode == 200) {
+            return response.data;
+        } else {
+            return Promise.reject(response);
+        }
+    }, (response) => {
+        /*  对响应错误做点什么 （statusCode !== 200）*/
+        if (!response.data) {
+            return Promise.reject({
+                status: 500, message: 'API接口服务异常！'
+            })
+        } else if (response.data.status == 401) {
+            uni.$tm.toast(response.data.message);
+            // 如果是请求分类之后报401说明密码错误，那么清除该密码，下次点击会报403弹窗再次输入密码
+            if (response.config.url.indexOf('/api/content/categories') >= 0) {
+                const category = getCategoryNameByUrl(response.config.url)
+                delCache('APP_CATEGORY_PWD_' + category);
+                uni.showToast({
+                    title: '提示：密码不正确', icon: 'none', success: () => {
+                        setTimeout(() => {
+                            showCategoryInputPasswordModal(response, category);
+                        }, 800)
+                    }
+                })
+            } else {
+                // 其他情况维持原来的逻辑
+                delCache('APP_ADMIN_LOGIN_TOKEN');
+                uni.$eShowModal({
+                    title: '提示',
+                    content: '您未登录超管账号或登录已过期，是否重新登录？',
+                    showCancel: true,
+                    cancelText: '否',
+                    cancelColor: '#999999',
+                    confirmText: '是',
+                    confirmColor: '#03a9f4'
+                }).then(res => {
+                    uni.navigateTo({
+                        url: '/pagesB/login/login'
+                    })
+                }).catch(err => {
+                    uni.switchTab({
+                        url: '/pages/tabbar/about/about'
+                    })
+                })
+            }
+            return Promise.reject(response.data);
+        } else if (response.data.status == 403) {
+            // 如果报403是请求分类文章接口（您没有该分类的访问权限）的话说明是私密分类，需要输入密码请求
+            if (response.config.url.indexOf('/api/content/categories') >= 0) {
+                const category = getCategoryNameByUrl(response.config.url);
+                showCategoryInputPasswordModal(response, category);
+            }
+            return Promise.reject(response.data);
+        } else {
+            return Promise.reject(response.data);
+        }

-		}
-	);
+    });
 };
@@ -1,23 +0,0 @@
-/**
- *
- *  可以以页面为单位来写，
- *  比如首页的内容，写在index字段，个人中心写在center，共同部分写在common部分
- * */
-
-export default {
-  app: {
-    name: "alley studio",
-    author: "Evan Mo",
-  },
-  tabbar: {
-    home: "Home",
-    moments: "Moments",
-    publish: "Publish",
-    mall: "Mall",
-    mine: "Mine",
-  },
-  // 提示文本
-  tips: {
-    switchLang: "switch Lang",
-  },
-};
@@ -1,23 +0,0 @@
-/**
- *
- *  可以以页面为单位来写，
- *  比如首页的内容，写在index字段，个人中心写在center，共同部分写在common部分
- * */
-
-export default {
-  app: {
-    name: "巷子工坊",
-    author: "小莫唐尼",
-  },
-  tabbar: {
-    home: "首页",
-    moments: "动态",
-    publish: "发布",
-    mall: "商店",
-    mine: "我的",
-  },
-  // 提示文本
-  tips: {
-    switchLang: "切换语言",
-  },
-};
@@ -3,7 +3,7 @@
 */

 import {getAppConfigs} from '@/config/index.js'
-import HaloTokenConfig from '@/config/token.config.js'
+import HaloTokenConfig from '@/config/uhalo.config.js'
 import utils from '@/utils/index.js'

 export default {
@@ -0,0 +1,55 @@
+/**
+ *  功能：插件检查
+ */
+import {
+	NeedPluginIds,
+	NeedPlugins,
+	checkNeedPluginAvailable
+} from "@/utils/plugin.js"
+
+const HaloPluginAvailableMixin = {
+	data() {
+		return {
+			NeedPluginIds,
+			NeedPlugins,
+			uniHaloPluginAvailableError: "",
+			uniHaloPluginAvailable: true,
+			uniHaloPluginPageClass: "",
+			uniHaloPluginId: "", // 当前需要的插件
+			uniHaloPluginInfo: "" // 当前插件信息
+		};
+	},
+	watch: {
+		uniHaloPluginAvailable: {
+			immediate: true,
+			handler(val) {
+				if (val) {
+					this.uniHaloPluginPageClass = ""
+				} else {
+					this.uniHaloPluginPageClass = "box-border items-center justify-center"
+				}
+			}
+		}
+	},
+	methods: {
+		/** 设置插件ID */
+		setPluginId(pluginId) {
+			this.uniHaloPluginId = pluginId
+			this.uniHaloPluginInfo = NeedPlugins.get(pluginId)
+		},
+		/** 检查插件状态 */
+		async checkPluginAvailable(pluginId) {
+			pluginId = pluginId ?? this.uniHaloPluginId
+			if (!pluginId) return false;
+			const available = await checkNeedPluginAvailable(pluginId)
+			this.uniHaloPluginAvailable = available
+			return available
+		},
+		/** 设置错误信息 */
+		setPluginError(text) {
+			this.uniHaloPluginAvailableError = text
+		}
+	},
+}
+
+export default HaloPluginAvailableMixin;
@@ -172,3 +172,178 @@
 }

 /* 文本省略样式 结束 */
+
+.box-border{
+	box-sizing: border-box;
+}
+
+// 定义尺寸变量（单位：rpx）
+$spacing-sizes: (
+        0: 0,
+        2: 4rpx,
+        4: 8rpx,
+        8: 16rpx,
+        12: 24rpx,
+        24: 48rpx,
+        48: 96rpx
+);
+
+// 内边距类
+@each $name, $size in $spacing-sizes {
+  // 全方向内边距：p-{size}
+  .uh-p-#{$name} {
+    padding: $size !important;
+  }
+
+  // 水平方向内边距：px-{size}
+  .uh-px-#{$name} {
+    padding-left: $size !important;
+    padding-right: $size !important;
+  }
+
+  // 垂直方向内边距：py-{size}
+  .uh-py-#{$name} {
+    padding-top: $size !important;
+    padding-bottom: $size !important;
+  }
+
+  // 上内边距：pt-{size}
+  .uh-pt-#{$name} {
+    padding-top: $size !important;
+  }
+
+  // 右内边距：pr-{size}
+  .uh-pr-#{$name} {
+    padding-right: $size !important;
+  }
+
+  // 下内边距：pb-{size}
+  .uh-pb-#{$name} {
+    padding-bottom: $size !important;
+  }
+
+  // 左内边距：pl-{size}
+  .uh-pl-#{$name} {
+    padding-left: $size !important;
+  }
+}
+
+//外边距工具类
+@each $name, $size in $spacing-sizes {
+  // 全方向外边距：m-{size}
+  .uh-m-#{$name} {
+    margin: $size !important;
+  }
+
+  // 水平方向外边距：mx-{size}
+  .uh-mx-#{$name} {
+    margin-left: $size !important;
+    margin-right: $size !important;
+  }
+
+  // 垂直方向外边距：my-{size}
+  .uh-my-#{$name} {
+    margin-top: $size !important;
+    margin-bottom: $size !important;
+  }
+
+  // 上外边距：mt-{size}
+  .uh-mt-#{$name} {
+    margin-top: $size !important;
+  }
+
+  // 右外边距：mr-{size}
+  .uh-mr-#{$name} {
+    margin-right: $size !important;
+  }
+
+  // 下外边距：mb-{size}
+  .uh-mb-#{$name} {
+    margin-bottom: $size !important;
+  }
+
+  // 左外边距：ml-{size}
+  .uh-ml-#{$name} {
+    margin-left: $size !important;
+  }
+}
+
+// gap 类
+@each $name, $size in $spacing-sizes {
+  // 全方向gap：gap-{size}
+  .uh-gap-#{$name} {
+    gap: $size !important;
+  }
+
+  // 水平方向gap：gap-x-{size}
+  .uh-gap-x-#{$name} {
+    column-gap: $size !important;
+  }
+
+  // 垂直方向gap：gap-y-{size}
+  .uh-gap-y-#{$name} {
+    row-gap: $size !important;
+  }
+}
+
+
+.w-full {
+  width: 100%;
+}
+
+.h-full {
+  height: 100%;
+}
+
+.flex {
+  display: flex;
+}
+
+.flex-col {
+  flex-direction: column;
+}
+
+.flex-1 {
+  flex: 1;
+}
+
+.flex-shrink-0 {
+  flex-shrink: 0;
+}
+
+.items-center {
+  align-items: center;
+}
+
+.items-start {
+  align-items: flex-start;
+}
+
+.items-end {
+  align-items: flex-end;
+}
+
+.justify-between {
+  justify-content: space-between;
+}
+
+.justify-around {
+  justify-content: space-around;
+}
+
+.justify-end {
+  justify-content: flex-end;
+}
+
+.justify-start {
+  justify-content: flex-start;
+}
+
+.justify-center {
+	justify-content: center;
+}
+
+.text-break {
+	overflow-wrap: break-word;
+	word-break: break-all;
+}
@@ -66,7 +66,7 @@
 		display: flex;
 		box-sizing: border-box;
 		margin: 0 24rpx;
-		padding: 24rpx;
+		padding:22rpx 24rpx;
 		border-radius: 12rpx;
 		background-color: #ffff;
 		box-shadow: 0rpx 2rpx 24rpx rgba(0, 0, 0, 0.03);
@@ -0,0 +1,231 @@
+<template>
+	<view class="card" :class="[loading]">
+		<view v-if="loading !== 'success'" class="card-error" @click="fnGetData()">
+			{{ loadingText }}
+		</view>
+		<template v-else>
+			<view class="tag">豆瓣</view>
+			<view class="flex w-full">
+				<view v-if="posterEmpty" class="poster round-2">无封面</view>
+				<image v-else class="poster round-2" :src="poster" mode="aspectFill" @error="onPosterError"></image>
+				<view class="box">
+					<view class="title text-overflow">{{ detail.spec.name }}</view>
+					<view class="flex" style="align-items: center; margin-top: 12rpx">
+						<text class="text-size-s">评分：</text>
+						<tm-rate v-model="detail.spec.score / 2" color="orange" size="24" :margin="2" :num="5"></tm-rate>
+						<text class="text-size-s" style="margin-left: 4rpx">{{ detail.spec.score }}</text>
+					</view>
+
+					<view class="content text-overflow-2">{{ detail.spec.cardSubtitle }}</view>
+					<view class="flex flex-wrap" style="margin-left: -10rpx">
+						<tm-tags color="orange" :shadow="0" size="s" model="fill">{{ types[detail.spec.type] }}</tm-tags>
+						<tm-tags v-for="(gen, genIndex) in detail.spec.genres" :key="genIndex" color="light-blue" :shadow="0" size="s" model="fill">{{ gen }}</tm-tags>
+					</view>
+				</view>
+			</view>
+			<!-- 扩展内容 -->
+			<view class="btn-group">
+				<tm-button theme="bg-gradient-orange-accent" icon="icon-copy" :shadow="0" :dense="true" size="m" @click="copy('post')">原文地址</tm-button>
+				<tm-button theme="bg-gradient-light-blue-accent" icon="icon-copy" :shadow="0" :dense="true" size="m" @click="copy('douban')">豆瓣地址</tm-button>
+				<tm-button theme="bg-gradient-light-blue-accent" icon="icon-copy" :shadow="0" :dense="true" size="m" @click="copy('info')">资源信息</tm-button>
+			</view>
+		</template>
+	</view>
+</template>
+
+<script>
+import tmButton from '@/tm-vuetify/components/tm-button/tm-button.vue';
+import tmTags from '@/tm-vuetify/components/tm-tags/tm-tags.vue';
+import tmRate from '@/tm-vuetify/components/tm-rate/tm-rate.vue';
+
+export default {
+	name: 'ArticleDouban',
+	components: {
+		tmButton,
+		tmTags,
+		tmRate
+	},
+	props: {
+		url: {
+			type: String,
+			default: ''
+		},
+		index: {
+			type: Number,
+			default: 0
+		},
+		article: {
+			type: Object,
+			default: () => ({})
+		}
+	},
+	data() {
+		return {
+			loading: 'loading',
+			loadingText: '加载中，请稍等...',
+			detail: null,
+			types: {
+				movie: '电影',
+				book: '图书',
+				music: '音乐',
+				game: '游戏',
+				drama: '舞台剧'
+			},
+			poster: '',
+			posterEmpty: false
+		};
+	},
+	created() {
+		this.fnGetData();
+	},
+	methods: {
+		onPosterError() {
+			if (!this.article.spec.cover) {
+				this.poster = '';
+				this.posterEmpty = true;
+			} else {
+				this.poster = this.$utils.checkImageUrl(this.article.spec.cover);
+				this.posterEmpty = false;
+			}
+		},
+		fnGetData() {
+			this.loadingText = '加载中，请稍等...';
+			this.loading = 'loading';
+			this.$httpApi.v2
+				.getDoubanDetail(this.url)
+				.then((res) => {
+					this.detail = res;
+					this.poster = res.spec.poster;
+					setTimeout(() => {
+						this.loading = 'success';
+					}, 200);
+				})
+				.catch((err) => {
+					console.error(err);
+					this.loading = 'error';
+					this.loadingText = '豆瓣内容加载失败，点击重试';
+				});
+		},
+
+		showToast(content) {
+			uni.showToast({
+				icon: 'none',
+				title: content,
+				mask: true
+			});
+		},
+		copy(type) {
+			if (type === 'post') {
+				const articleUrl = this.$baseApiUrl + (this.article?.status?.permalink ?? '');
+				this.$utils.copyText(articleUrl, '文章原文地址复制成功');
+				return;
+			}
+			if (type === 'douban') {
+				this.$utils.copyText(this.detail?.spec.link, '豆瓣资源地址复制成功');
+				return;
+			}
+			if (type === 'info') {
+				const content = `名称:${this.detail?.spec.name}丨其他:${this.detail?.spec.cardSubtitle}丨标签:${this.detail?.spec.genres.join('/')}丨时间:${
+					this.detail?.spec.pubdate
+				}丨评分:${this.detail?.spec.score}分丨链接:${this.detail?.spec.link}`;
+				this.$utils.copyText(content, '资源信息复制成功');
+			}
+		}
+	}
+};
+</script>
+
+<style lang="scss" scoped>
+.w-full {
+	width: 100%;
+}
+
+.wp-50 {
+	width: 50%;
+}
+
+.card {
+	position: relative;
+	display: flex;
+	flex-direction: column;
+	box-sizing: border-box;
+	padding: 24rpx;
+	border-radius: 12rpx;
+	background-color: #ffff;
+	overflow: hidden;
+	margin-bottom: 12rpx;
+	border: 1px solid #eee;
+
+	&.error {
+		padding: 0;
+		border-style: dashed;
+		border-color: #e88080;
+		color: #e88080;
+		background-color: rgba(232, 128, 128, 0.075);
+	}
+
+	&.loading {
+		padding: 0;
+		border-style: dashed;
+		border-color: rgba(3, 174, 252, 1);
+		color: rgba(3, 174, 252, 1);
+		background-color: rgba(3, 174, 252, 0.075);
+	}
+}
+
+.card-error {
+	box-sizing: border-box;
+	padding: 50rpx 24rpx;
+	font-size: 24rpx;
+	border-radius: 12rpx;
+	text-align: center;
+}
+.poster {
+	box-sizing: border-box;
+	width: 180rpx;
+	height: 220rpx;
+	flex-shrink: 0;
+	background-color: #eee;
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	font-size: 24rpx;
+}
+
+.box {
+	flex-grow: 1;
+	box-sizing: border-box;
+	font-size: 26rpx;
+	padding-left: 24rpx;
+	overflow: hidden;
+}
+.title {
+	box-sizing: border-box;
+	font-size: 32rpx;
+	font-weight: bold;
+}
+.content {
+	box-sizing: border-box;
+	margin-top: 12rpx;
+	line-height: 36rpx;
+	color: rgba(0, 0, 0, 0.85);
+}
+.tag {
+	box-sizing: border-box;
+	position: absolute;
+	right: 0;
+	top: 0;
+	font-size: 24rpx;
+	padding: 2rpx 12rpx;
+	background-color: #f5c618;
+	border-radius: 0 6rpx 0 12rpx;
+}
+.btn-group {
+	box-sizing: border-box;
+	display: flex;
+	align-items: center;
+	justify-content: space-between;
+	margin-top: 22rpx;
+	gap: 0 22rpx;
+}
+</style>
@@ -1,220 +1,222 @@
 <template>
-	<view class="article-min-card" :class="[globalAppSettings.layout.cardType]" @click="fnClickEvent('card')">
-		<view class="left">
-			<cache-image class="thumbnail" radius="6rpx" :url="$utils.checkThumbnailUrl(article.thumbnail)" :fileMd5="$utils.checkThumbnailUrl(article.thumbnail)" mode="aspectFill"></cache-image>
-		</view>
-		<view class="right">
-			<view class="title text-overflow">{{ article.title }}</view>
-			<view class="content text-overflow">{{ article.summary }}</view>
-			<view class="foot">
-				<view class="create-time">
-					<!-- <text class="icon iconfont icon-clock"></text> -->
-					<text class="time-label">发布时间：</text>
-					{{ { d: article.createTime, f: 'yyyy-MM-dd' } | formatTime }}
-				</view>
-				<view class="visits">
-					<!-- <text class="icon iconfont icon-eye"></text> -->
-					浏览
-					<text class="number">{{ article.visits }}</text>
-					次
-				</view>
-			</view>
-		</view>
-	</view>
+    <view class="article-min-card" @click="fnClickEvent('card')">
+        <view class="left">
+            <cache-image class="thumbnail" radius="6rpx" :url="$utils.checkThumbnailUrl(article.spec.cover)" :fileMd5="article.spec.cover"
+                         mode="aspectFill"></cache-image>
+        </view>
+        <view class="right">
+            <view class="title text-overflow">{{ article.spec.title }}</view>
+            <view class="content text-overflow">{{ article.status.excerpt }}</view>
+            <view class="foot">
+                <view class="create-time">
+                    <text class="time-label">发布时间：</text>
+                    {{ {d: article.spec.publishTime, f: 'yyyy-MM-dd'} | formatTime }}
+                </view>
+                <view class="visits">
+                    浏览
+                    <text class="number">{{ article.stats.visit }}</text>
+                    次
+                </view>
+            </view>
+        </view>
+    </view>
 </template>

 <script>
-	export default {
-		name: 'article-min-card',
-		props: {
-			article: {
-				type: Object,
-				default: () => {}
-			}
-		},
-		methods: {
-			fnClickEvent() {
-				this.$emit('on-click', this.article);
-			}
-		}
-	};
+export default {
+    name: 'article-min-card',
+    props: {
+        article: {
+            type: Object,
+            default: () => {
+            }
+        }
+    },
+    methods: {
+        fnClickEvent() {
+            this.$emit('on-click', this.article);
+        }
+    }
+};
 </script>

 <style scoped lang="scss">
-	.article-min-card {
-		display: flex;
-		box-sizing: border-box;
-		border-radius: 12rpx;
-		background-color: #ffff;
-		overflow: hidden;
-		margin: 12rpx 24rpx;
-		margin-bottom: 24rpx;
-		padding: 16rpx;
-		box-shadow: 0rpx 2rpx 24rpx rgba(0, 0, 0, 0.03);
+.article-min-card {
+    display: flex;
+    box-sizing: border-box;
+    border-radius: 12rpx;
+    background-color: #ffff;
+    overflow: hidden;
+    margin: 12rpx 24rpx;
+    margin-bottom: 24rpx;
+    padding: 16rpx;
+    box-shadow: 0rpx 2rpx 24rpx rgba(0, 0, 0, 0.03);

-		&.lr_image_text {}
+    &.lr_image_text {
+    }

-		&.lr_text_image {
-			.left {
-				order: 2;
-				padding-left: 30rpx;
-			}
+    &.lr_text_image {
+        .left {
+            order: 2;
+            padding-left: 30rpx;
+        }

-			.right {
-				order: 1;
-				padding-left: 0;
-			}
-		}
+        .right {
+            order: 1;
+            padding-left: 0;
+        }
+    }

-		&.tb_image_text {
-			flex-direction: column;
+    &.tb_image_text {
+        flex-direction: column;

-			.left {
-				width: 100%;
-				height: 220rpx;
-			}
+        .left {
+            width: 100%;
+            height: 220rpx;
+        }

-			.right {
-				padding-left: 0;
-				width: 100%;
+        .right {
+            padding-left: 0;
+            width: 100%;

-				.title {
-					margin-top: 24rpx;
-				}
+            .title {
+                margin-top: 24rpx;
+            }

-				.foot {
-					justify-content: flex-start;
+            .foot {
+                justify-content: flex-start;

-					.create-time {
-						.time-label {
-							display: inline-block;
-						}
-					}
+                .create-time {
+                    .time-label {
+                        display: inline-block;
+                    }
+                }

-					.visits {
-						margin-left: 24rpx;
-					}
-				}
-			}
-		}
+                .visits {
+                    margin-left: 24rpx;
+                }
+            }
+        }
+    }

-		&.tb_text_image {
-			flex-direction: column;
+    &.tb_text_image {
+        flex-direction: column;

-			.left {
-				width: 100%;
-				height: 220rpx;
-				order: 2;
-				margin-top: 20rpx;
-			}
+        .left {
+            width: 100%;
+            height: 220rpx;
+            order: 2;
+            margin-top: 20rpx;
+        }

-			.right {
-				padding-left: 0;
-				width: 100%;
-				order: 1;
+        .right {
+            padding-left: 0;
+            width: 100%;
+            order: 1;

-				.foot {
-					justify-content: flex-start;
+            .foot {
+                justify-content: flex-start;

-					.create-time {
-						.time-label {
-							display: inline-block;
-						}
-					}
+                .create-time {
+                    .time-label {
+                        display: inline-block;
+                    }
+                }

-					.visits {
-						margin-left: 24rpx;
-					}
-				}
-			}
-		}
+                .visits {
+                    margin-left: 24rpx;
+                }
+            }
+        }
+    }

-		&.only_text {
-			.left {
-				display: none;
-			}
+    &.only_text {
+        .left {
+            display: none;
+        }

-			.right {
-				padding-left: 0;
+        .right {
+            padding-left: 0;

-				.foot {
-					justify-content: flex-start;
+            .foot {
+                justify-content: flex-start;

-					.create-time {
-						.time-label {
-							display: inline-block;
-						}
-					}
+                .create-time {
+                    .time-label {
+                        display: inline-block;
+                    }
+                }

-					.visits {
-						margin-left: 24rpx;
-					}
-				}
-			}
-		}
+                .visits {
+                    margin-left: 24rpx;
+                }
+            }
+        }
+    }

-		.left {
-			width: 180rpx;
-			height: 130rpx;
+    .left {
+        width: 180rpx;
+        height: 130rpx;

-			.thumbnail {
-				width: 100%;
-				height: 100%;
-				border-radius: 12rpx;
-			}
-		}
+        .thumbnail {
+            width: 100%;
+            height: 100%;
+            border-radius: 12rpx;
+        }
+    }

-		.right {
-			width: 0;
-			flex-grow: 1;
-			display: flex;
-			flex-direction: column;
-			padding-left: 20rpx;
+    .right {
+        width: 0;
+        flex-grow: 1;
+        display: flex;
+        flex-direction: column;
+        padding-left: 20rpx;

-			.title {
-				font-size: 28rpx;
-				font-weight: 600;
-				color: var(--main-text-color);
-			}
+        .title {
+            font-size: 28rpx;
+            font-weight: 600;
+            color: var(--main-text-color);
+        }

-			.content {
-				font-size: 26rpx;
-				color: #909399;
-				margin-top: 14rpx;
-			}
+        .content {
+            font-size: 26rpx;
+            color: #909399;
+            margin-top: 14rpx;
+        }

-			.foot {
-				display: flex;
-				font-size: 24rpx;
-				justify-content: space-between;
-				align-items: center;
-				color: #909399;
-				margin-top: 14rpx;
+        .foot {
+            display: flex;
+            font-size: 24rpx;
+            justify-content: space-between;
+            align-items: center;
+            color: #909399;
+            margin-top: 14rpx;

-				.create-time {
-					font-size: 24rpx;
+            .create-time {
+                font-size: 24rpx;

-					.time-label {
-						display: none;
-					}
+                .time-label {
+                    display: none;
+                }

-					.icon {
-						font-size: 24rpx;
-						padding-right: 4rpx;
-					}
-				}
+                .icon {
+                    font-size: 24rpx;
+                    padding-right: 4rpx;
+                }
+            }

-				.visits {
-					.icon {
-						font-size: 28rpx;
-					}
+            .visits {
+                .icon {
+                    font-size: 28rpx;
+                }
+
+                .number {
+                    padding: 0 6rpx;
+                    font-size: 24rpx;
+                }
+            }
+        }
+    }
+}

-					.number {
-						padding: 0 6rpx;
-						font-size: 24rpx;
-					}
-				}
-			}
-		}
-	}
 </style>
@@ -0,0 +1,569 @@
+<template>
+	<view class="vote-card" :class="[loading]">
+		<view v-if="loading !=='success'" class="vote-error" @click="fnGetData()">
+			{{loadingText}}
+		</view>
+		<template v-else>
+			<view class="vote-card-head flex flex-col">
+				<view class="flex justify-between">
+					<view class="flex">
+						<tm-tags color="orange" style="min-width:40rpx;" :shadow="0" rounded size="s"
+							model="fill">{{ index + 1 }}</tm-tags>
+						<tm-tags color="light-blue" :shadow="0" rounded size="s"
+							model="fill">{{ vote.spec._uh_type }}</tm-tags>
+						<tm-tags :color="vote.spec._uh_state.color" size="s" rounded :shadow="0"
+							model="fill">{{vote.spec._uh_state.state}}</tm-tags>
+					</view>
+					<view class="flex-shrink">
+						<tm-button theme="light-blue" :shadow="0" dense size="s"
+							@click="handleToVoteDetail(vote)">查看投票详情</tm-button>
+					</view>
+				</view>
+				<view class="title">
+					{{ vote.spec.title }}
+				</view>
+			</view>
+			<view class="vote-card-body">
+
+				<view v-if="vote.spec.remark" class="remark text-size-s">
+					{{vote.spec.remark}}
+				</view>
+
+				<template>
+					<!-- 单选 -->
+					<view v-if="vote.spec.type==='single'" class="single">
+						<view class="w-full flex flex-col uh-gap-8">
+							<template v-if="vote.spec.isVoted || vote.spec.hasEnded">
+								<view v-for="(option,optionIndex) in vote.spec.options" :key="optionIndex"
+									class="is-voted-item" :class="[option.checked?'selected':'']" :style="{
+										'--percent': option._uh_percent + '%'
+									}">
+									<view class="is-voted-item-content flex w-full flex-between uh-gap-4">
+										<view class="text-align-left flex-1 text-break">
+											{{option.title }}
+										</view>
+										<view class="flex-shrink ">
+											{{option._uh_percent }}%
+										</view>
+									</view>
+								</view>
+							</template>
+							<template v-else>
+								<view v-for="(option,optionIndex) in vote.spec.options" :key="optionIndex"
+									class="vote-select-option flex-1 w-full text-break"
+									:class="[option.checked?'light-blue':'grey-lighten-3']"
+									@click="handleSelectSingleOption(option)">
+									{{option.title }}
+								</view>
+							</template>
+						</view>
+					</view>
+
+					<!-- 多选 -->
+					<view v-else-if="vote.spec.type==='multiple'" class="multiple">
+						<view class="w-full flex flex-col uh-gap-8">
+							<template v-if="vote.spec.isVoted || vote.spec.hasEnded">
+								<view v-for="(option,optionIndex) in vote.spec.options" :key="optionIndex"
+									class="is-voted-item" :class="[option.checked?'selected':'']" :style="{
+										'--percent': option._uh_percent + '%'
+									}">
+									<view class="is-voted-item-content flex w-full flex-between uh-gap-4">
+										<view class="text-align-left flex-1 text-break">
+											{{option.title }}
+										</view>
+										<view class="flex-shrink ">
+											{{option._uh_percent }}%
+										</view>
+									</view>
+								</view>
+							</template>
+							<template v-else>
+								<view v-for="(option,optionIndex) in vote.spec.options" :key="optionIndex"
+									class="vote-select-option flex-1 w-full text-break"
+									:class="[option.checked?'light-blue':'grey-lighten-3']"
+									@click="handleSelectCheckboxOption(option)">
+									{{option.title }}
+								</view>
+							</template>
+						</view>
+					</view>
+
+					<!-- PK -->
+					<view v-else-if="vote.spec.type==='pk'" class="pk">
+						<view class="pk-container">
+							<view class="radio-item" v-for="(option,optionIndex) in vote.spec.options"
+								:key="optionIndex" :class="[optionIndex==0?'radio-left':'radio-right']"
+								:style="{width:option._uh_percent + '%'}">
+								<view class="option-item"
+									:class="[optionIndex==0?'option-item-left':'option-item-right']">
+									{{option._uh_percent }}%
+								</view>
+							</view>
+						</view>
+						<view class="option-foot w-full flex flex-between uh-mt-12">
+							<view class="w-full flex flex-col uh-gap-8">
+								<template v-if="vote.spec.isVoted || vote.spec.hasEnded">
+									<view v-for="(option,optionIndex) in vote.spec.options" :key="optionIndex"
+										class="is-voted-item" :class="[option.checked?'selected':'']" :style="{
+											'--percent': option._uh_percent + '%'
+										}">
+										<view class="is-voted-item-content flex w-full flex-between uh-gap-4">
+											<view class="text-align-left flex-1 text-break">
+												{{option.title }}
+											</view>
+											<view class="flex-shrink ">
+												{{option._uh_percent }}%
+											</view>
+										</view>
+									</view>
+								</template>
+								<template v-else>
+									<view v-for="(option,optionIndex) in vote.spec.options" :key="optionIndex"
+										class="vote-select-option flex-1 w-full text-break"
+										:class="[option.checked?'light-blue':'grey-lighten-3']"
+										@click="handleSelectSingleOption(option)">
+										选项{{ optionIndex+1}}：{{option.title }}
+									</view>
+								</template>
+							</view>
+						</view>
+					</view>
+				</template>
+			</view>
+			<view class="vote-card-foot flex flex-between">
+				<view class="left flex">
+					<tm-tags v-if="vote.spec.timeLimit==='permanent'" color="grey-darken-2" rounded size="s"
+						model="text">结束：永久有效 </tm-tags>
+					<tm-tags v-else color="grey-darken-2" rounded size="s" model="text">
+						<template
+							v-if="vote.spec._state=='未开始'">开始：{{ {d: vote.spec.startDate, f: 'yyyy-MM-dd HH:mm'} | formatTime }}
+						</template>
+						<template v-else>结束：{{ {d: vote.spec.endDate, f: 'yyyy-MM-dd HH:mm'} | formatTime }}
+						</template>
+					</tm-tags>
+				</view>
+
+				<view class="right flex flex-end">
+					<tm-tags color="grey-darken-2" rounded size="s" model="text">{{ vote.stats.voteCount }}
+						人已参与</tm-tags>
+					<tm-tags v-if="vote.spec.isVoted" color="blue" rounded size="s" model="text">已投票</tm-tags>
+				</view>
+			</view>
+
+			<view v-if="submitForm.voteData.length!==0" class="box-border uh-mt-12 w-full uh-px-2">
+				<tm-button v-if="fnCalcIsVoted()" theme="white" text :block="true" class="w-full">您已参与投票</tm-button>
+				<tm-button v-else-if="vote.spec._uh_state.state==='未开始'" theme="orange" text class="w-full" :height="72"
+					:block="true" @click="handleSubmitTip('投票未开始')">投票未开始</tm-button>
+				<tm-button v-else-if="vote.spec._uh_state.state==='已结束'" theme="red" text class="w-full" :height="72"
+					:block="true" @click="handleSubmitTip('投票已结束')">投票已结束</tm-button>
+				<tm-button v-else-if="!vote.spec.canAnonymously" theme="red" :shadow="0" class="w-full" :height="72"
+					text :block="true" @click="handleSubmit()">不支持匿名投票</tm-button>
+				<tm-button v-else-if="submitForm.voteData.length===0" theme="white" text class="w-full" :height="72"
+					:block="true" @click="handleSubmitTip('请选择选项')">提交投票（请选择选项）</tm-button>
+				<tm-button v-else theme="light-blue" class="w-full" :height="72" :block="true" :loading="submitLoading"
+					:disabled="submitLoading" @click="handleSubmit()">提交投票</tm-button>
+			</view>
+		</template>
+	</view>
+</template>
+
+<script>
+	import tmButton from '@/tm-vuetify/components/tm-button/tm-button.vue';
+	import tmTags from '@/tm-vuetify/components/tm-tags/tm-tags.vue';
+	import {
+		VOTE_TYPES,
+		calcVoteState,
+		calcVotePercent,
+		voteCacheUtil
+	} from '@/utils/vote.js'
+
+	export default {
+		name: "ArticleVote",
+		components: {
+			tmButton,
+			tmTags
+		},
+		props: {
+			voteId: {
+				type: String,
+				default: ""
+			},
+			index: {
+				type: Number,
+				default: 0
+			},
+			article: {
+				type: Object,
+				default: () => ({})
+			}
+		},
+		data() {
+			return {
+				loading: "loading",
+				loadingText: "加载中，请稍等...",
+				detail: null,
+				vote: null,
+				submitForm: {
+					voteData: []
+				},
+				submitLoading: false
+			}
+		},
+		created() {
+			this.fnGetData();
+		},
+		methods: {
+			fnGetData() {
+				this.loadingText = "加载中，请稍等...";
+				this.loading = "loading";
+				this.$httpApi.v2
+					.getVoteDetail(this.voteId)
+					.then(res => {
+						this.pageTitle = "投票详情" + `（${VOTE_TYPES[res.vote.spec.type]}）`
+
+						const tempVoteRes = res;
+
+						tempVoteRes.vote.spec.isVoted = this.fnCalcIsVoted()
+						tempVoteRes.vote.spec.disabled = this.fnCalcIsVoted()
+						tempVoteRes.vote.spec._uh_state = calcVoteState(tempVoteRes.vote)
+						tempVoteRes.vote.spec._uh_type = VOTE_TYPES[tempVoteRes.vote.spec.type]
+
+						tempVoteRes.vote.spec.options.map((option, index) => {
+							option.value = option.id
+							option.label = option.title
+							option.isVoted = this.fnCalcIsVoted()
+							option.checked = this.fnCalcIsChecked(option)
+							option._uh_percent = calcVotePercent(tempVoteRes.vote, option);
+							option.dataStr = JSON.stringify(option)
+
+							return option
+						})
+
+						this.vote = tempVoteRes.vote
+						this.detail = tempVoteRes;
+
+						setTimeout(() => {
+							this.loading = 'success';
+						}, 200);
+					})
+					.catch(err => {
+						console.error(err);
+						this.loading = 'error';
+						this.loadingText = "投票内容加载失败，点击重试"
+					})
+			},
+
+			fnCalcIsVoted() {
+				return voteCacheUtil.has(this.voteId)
+			},
+			fnCalcIsChecked(option) {
+				const data = voteCacheUtil.get(this.voteId)
+				if (!data) return false;
+				const checked = data.selected.includes(option.id)
+				return checked
+			},
+			formatJsonStr(jsonStr) {
+				return jsonStr ? JSON.parse(jsonStr) : {}
+			},
+			handleSubmitTip(text) {
+				uni.showToast({
+					icon: "none",
+					title: text
+				})
+			},
+			handleSubmit() {
+				if (!this.vote.spec.canAnonymously) {
+					uni.showModal({
+						icon: "none",
+						title: "提示",
+						content: "该投票不支持匿名，请到博主的 网站端 进行投票！",
+						cancelColor: "#666666",
+						cancelText: "关闭",
+						confirmText: "复制地址",
+						success: (res) => {
+							if (res.confirm) {
+								console.log("this.article", this.article)
+								const articleUrl = this.$baseApiUrl + (this.article?.status?.permalink ?? "")
+								this.$utils.copyText(articleUrl, "原文地址复制成功")
+							}
+						}
+					})
+					return
+				}
+
+				uni.showLoading({
+					title: "正在保存..."
+				})
+				this.submitLoading = true
+				this.$httpApi.v2
+					.submitVote(this.voteId, this.submitForm, this.vote.spec.canAnonymously)
+					.then(res => {
+						uni.showToast({
+							icon: "none",
+							title: "提交成功"
+						})
+
+						voteCacheUtil.set(this.voteId, {
+							selected: [...this.submitForm.voteData],
+							data: this.vote
+						})
+
+						this.fnGetData()
+					})
+					.catch(err => {
+						console.error(err);
+						uni.showToast({
+							icon: "none",
+							title: "提交失败，请重试"
+						})
+					}).finally(() => {
+						this.submitLoading = false
+					})
+			},
+
+			handleSelectSingleOption(option) {
+				if (this.vote.spec._uh_state.state == '未开始') {
+					this.showToast(`投票未开始`)
+					return
+				}
+				if (this.vote.spec.hasEnded) return
+				if (this.vote.spec.disabled) return
+				this.vote.spec.options.map(item => {
+					if (option.id == item.id) {
+						item.checked = true
+					} else {
+						item.checked = false
+					}
+				})
+				this.submitForm.voteData = this.vote.spec.options.filter(x => x.checked).map(item => item.id)
+			},
+
+			handleSelectCheckboxOption(option) {
+				if (this.vote.spec._uh_state.state == '未开始') {
+					this.showToast(`投票未开始`)
+					return
+				}
+
+				if (this.vote.spec.hasEnded) return
+				if (this.vote.spec.disabled) return
+
+				const checkedList = this.vote.spec.options.filter(x => x.checked && x.id != option.id)
+
+				if (this.vote.spec.type === 'multiple' && checkedList.length >= this.vote.spec.maxVotes) {
+					this.showToast(`最多选择 ${this.vote.spec.maxVotes} 项`)
+					return
+				}
+
+				this.vote.spec.options.map(item => {
+					if (option.id == item.id) {
+						item.checked = !item.checked
+					}
+				})
+				this.submitForm.voteData = this.vote.spec.options.filter(x => x.checked).map(item => item.id)
+			},
+			handleToVoteDetail(vote) {
+				uni.navigateTo({
+					url: `/pagesA/vote-detail/vote-detail?name=${vote.metadata.name}`
+				});
+			},
+			showToast(content) {
+				uni.showToast({
+					icon: "none",
+					title: content,
+					mask: true
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.w-full {
+		width: 100%;
+	}
+
+	.wp-50 {
+		width: 50%;
+	}
+
+	.vote-card {
+		display: flex;
+		flex-direction: column;
+		box-sizing: border-box;
+		padding: 24rpx;
+		border-radius: 12rpx;
+		background-color: #ffff;
+		overflow: hidden;
+		margin-bottom: 12rpx;
+		border: 1px solid #eee;
+
+		&.error {
+			padding: 0;
+			border-style: dashed;
+			border-color: #e88080;
+			color: #e88080;
+			background-color: rgba(232, 128, 128, 0.075);
+		}
+
+		&.loading {
+			padding: 0;
+			border-style: dashed;
+			border-color: rgba(3, 174, 252, 1);
+			color: rgba(3, 174, 252, 1);
+			background-color: rgba(3, 174, 252, 0.075);
+		}
+	}
+
+
+	.vote-error {
+		padding: 50rpx 24rpx;
+		font-size: 24rpx;
+		border-radius: 12rpx;
+		text-align: center;
+	}
+
+	.vote-card-head {
+		margin-bottom: 12rpx;
+
+		.title {
+			padding: 12rpx 0;
+			font-size: 28rpx;
+			font-weight: bold;
+		}
+	}
+
+	.vote-card-body {
+
+		.remark {
+			box-sizing: border-box;
+			color: rgba(0, 0, 0, 0.75);
+			margin-bottom: 24rpx;
+		}
+	}
+
+	.vote-card-foot {
+		box-sizing: border-box;
+		padding-top: 6px;
+		margin-top: 12px;
+		border-top: 2rpx solid #eee;
+
+		.left {}
+	}
+
+	.is-voted-item {
+		min-height: 72rpx;
+		box-sizing: border-box;
+		position: relative;
+		border-radius: 12rpx;
+		background-color: rgba(229, 229, 229, 0.75);
+		font-size: 24rpx;
+		overflow: hidden;
+
+		&::before {
+			content: "";
+			width: var(--percent);
+			position: absolute;
+			left: 0;
+			top: 0;
+			bottom: 0;
+			background-color: rgba(208, 208, 208, 1);
+			z-index: 0;
+			border-radius: 6rpx;
+		}
+
+		&.selected {
+			background-color: rgba(3, 169, 244, 0.35);
+			color: #ffffff;
+
+			&::before {
+				background-color: rgba(3, 169, 244, 1);
+			}
+		}
+	}
+
+	.is-voted-item-content {
+		box-sizing: border-box;
+		min-height: 72rpx;
+		padding: 12rpx 24rpx;
+		position: relative;
+		z-index: 2;
+	}
+
+	.vote-select-option {
+		box-sizing: border-box;
+		padding: 20rpx 24rpx;
+		font-size: 24rpx;
+		border-radius: 12rpx;
+		transition: all 0.1s ease-in-out;
+	}
+
+	.single {
+		::v-deep {}
+	}
+
+	.multiple {
+		::v-deep {}
+	}
+
+	.pk {
+		box-sizing: border-box;
+		width: 100%;
+		padding: 0 12rpx;
+
+		::v-deep {
+
+			.pk-container {
+				box-sizing: border-box;
+				width: 100%;
+				display: flex;
+			}
+
+			.radio-item {
+				flex-grow: 1;
+				min-width: 30% !important;
+				max-width: 70% !important;
+			}
+
+			.radio-left {}
+
+			.radio-right {}
+
+			.option-item {
+				box-sizing: border-box;
+				width: 100%;
+				padding: 24rpx;
+				border-radius: 12rpx;
+			}
+
+			.option-item-left {
+				background: linear-gradient(90deg, #3B82F6, #60A5FA);
+				color: white;
+				clip-path: polygon(0 0, calc(100% - 40rpx) 0, 100% 100%, 0 100%);
+			}
+
+			.option-item-right {
+				background: linear-gradient(90deg, #F87171, #EF4444);
+				color: white;
+				clip-path: polygon(0 0, 100% 0, 100% 100%, 40rpx 100%);
+				text-align: right;
+			}
+
+			.option-foot {
+				width: 100%;
+				margin-top: 6rpx;
+				font-size: 24rpx;
+				color: #666;
+
+				.left {
+					box-sizing: border-box;
+					padding-right: 24rpx;
+				}
+
+				.right {
+					box-sizing: border-box;
+					padding-left: 24rpx;
+				}
+			}
+		}
+	}
+</style>
@@ -43,7 +43,7 @@
 			top: 0;
 			width: 100%;
 			height: 100%;
-			background-color: rgba(0, 0, 0, 0.5);
+			background-color: rgba(0, 0, 0, 0.25);
 			backdrop-filter: blur(3rpx);
 		}

@@ -6,6 +6,10 @@
                <text>评论列表</text>
                <text class="count">（{{ (result && result.total) || 0 }}条）</text>
            </view>
+			<view class="refresh">
+				<text class="icon iconfont icon-sync-alt text-weight-s text-grey-darken-1"></text>
+				<text class="text-weight-s text-grey-darken-1 ml-6" style="font-size: 26rpx;" @click="fnGetData">刷新</text>
+			</view>
        </view>
        <!-- 内容区域 -->
        <view class="comment-list_content">
@@ -208,15 +208,17 @@ export default {
        },
        handleOnChange(isOpen) {
            this.isShow = isOpen;
-            if (!isOpen) {
-                this.$emit("on-close", {
-                    refresh: false
-                })
-            }
+			if(!isOpen){
+				this.$emit("on-close", {
+					isSubmit:false,
+					refresh: false
+				})
+			}
        },
        handleClose(refresh = false) {
            this.isShow = false;
            this.$emit("on-close", {
+				isSubmit:true,
                refresh: refresh
            })
        }
@@ -102,6 +102,8 @@
 			width: 100%;
 			box-sizing: border-box;
 			padding: 20rpx 24rpx;
+			background-color: rgba(0, 0, 0, 0.085);
+			backdrop-filter: blur(3rpx);
 			&.no-dot {
 				bottom: 0;
 			}
@@ -43,7 +43,7 @@
 						</view>
 					</view>
 					<view class="right-hot-ttf">
-						<text class="text hot-text">{{ title }}</text>
+						<text class="text hot-text text-overflow-2">{{ title }}</text>
 					</view>
 				</view>
 			</view>
@@ -63,10 +63,10 @@
 						</view>
 						<!-- 标题 -->
 						<view class="Top-Title">
-							<text class="text title-text">{{ item.title }}</text>
+							<text class="text title-text text-overflow-2">{{ item.title }}</text>
 						</view>
 						<!-- 用户信息 -->
-						<view class="Bottom-UserInfo">
+						<view v-if="false" class="Bottom-UserInfo">
 							<!-- 头像 -->
 							<view class="UserImage-box">
 								<image :src="item.avatar" class="Image" mode="aspectFill"></image>
@@ -0,0 +1,479 @@
+<template>
+	<view class="contribution-heatmap pa-24">
+		<view class="header">
+			<view class="title">
+				<view v-if="false" style="color: #7e7e7f">数据范围:</view>
+				<view>{{ dataRangeYears }}</view>
+			</view>
+			<view class="controls">
+				<tm-stepper v-model="currentYear" :width="220" :height="48" :min="0" :max="2099" :shadow="0" :round="2" color="light-blue" @change="changeYear"></tm-stepper>
+			</view>
+		</view>
+
+		<view class="heatmap-container">
+			<view class="weeks">
+				<view class="week-label" v-for="week in weeks" :key="week">{{ week }}</view>
+			</view>
+			<view class="heatmap-content">
+				<view class="months" :style="[calcContentStyle]">
+					<view class="month-label" v-for="month in monthLabels" :key="month.index">
+						{{ month.name }}
+					</view>
+				</view>
+				<view class="days-container" :style="[calcContentStyle]">
+					<view
+						v-for="(day, index) in displayDays"
+						:key="index"
+						class="day-cell"
+						:style="{ backgroundColor: getDayColor(day) }"
+						@click="handleDayClick(day, index)"
+					></view>
+				</view>
+			</view>
+		</view>
+
+		<view class="footer">
+			<view class="releases-count">
+				<text>累计 {{ calcAllYearCount }} 篇</text>
+				<text>丨</text>
+				<text>本年 {{ calcCurrentYearCount }} 篇</text>
+			</view>
+			<view class="legend">
+				<text class="legend-text">少</text>
+				<view v-for="(color, index) in intensityColors" :key="index" class="day-cell legend-day-cell" :style="{ backgroundColor: color }"></view>
+				<text class="legend-text">多</text>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+import tmStepper from '@/tm-vuetify/components/tm-stepper/tm-stepper.vue';
+export default {
+	name: 'Heatmap',
+	components: {
+		tmStepper 
+	},
+	props: {
+		year: {
+			type: Number,
+			default: () => new Date().getFullYear()
+		},
+		chartData: {
+			type: Array,
+			default: () => []
+		}
+	},
+	data() {
+		return {
+			weeks: ['周一', '周二', '周三', '周四', '周五', '周六', '周日'],
+			intensityColors: [
+				'#ebedf0', // 无贡献
+				'#dbeafe', // 1-2次
+				'#93c5fd', // 3-4次
+				'#3b82f6', // 5-6次
+				'#1e40af' // 7次以上
+			],
+			displayDays: [],
+			showTooltip: null,
+			currentYear: '1900',
+			currentYearData: [],
+			yearList:[]
+		};
+	},
+	computed: {
+		dataRangeYears() {
+			const arr = this.chartData;
+			const dateField = 'name';
+
+			if (!arr || !Array.isArray(arr) || arr.length === 0) {
+				return { minDate: null, maxDate: null };
+			}
+
+			// 提取所有有效日期
+			const validDates = arr
+				.map((item) => {
+					if (item && item[dateField]) {
+						const date = new Date(item[dateField]);
+						return isNaN(date.getTime()) ? null : date;
+					}
+					return null;
+				})
+				.filter((date) => date !== null);
+
+			if (validDates.length === 0) {
+				return { minDate: null, maxDate: null };
+			}
+
+			// 找到最小和最大日期
+			const minDate = new Date(Math.min(...validDates.map((date) => date.getTime())));
+			const maxDate = new Date(Math.max(...validDates.map((date) => date.getTime())));
+
+			const result = {
+				minDate: this.formatDate(minDate),
+				maxDate: this.formatDate(maxDate)
+			};
+
+			return `${result.minDate} 至 ${result.maxDate}`;
+		},
+		// 计算内容宽度
+		calcContentStyle() {
+			const rowCount = Math.ceil(this.displayDays.length / 7);
+			const singleWidth = 36;
+			return {
+				width: rowCount * singleWidth + 'rpx'
+			};
+		},
+		//累计的发文次数
+		calcAllYearCount() {
+			return this.chartData.reduce((acc, cur) => {
+				return acc + cur.total;
+			}, 0);
+		},
+		// 统计当前年累计的发文次数
+		calcCurrentYearCount() {
+			return this.currentYearData.reduce((acc, cur) => {
+				return acc + cur.total;
+			}, 0);
+		},
+		monthLabels() {
+			const months = ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月'];
+			const labels = [];
+
+			if (this.displayDays.length === 0) return labels;
+
+			// 计算每个格子的总宽度（包括间距）
+			const cellTotalWidth = 15 + 1.5 * 2; // width + margin * 2
+
+			let currentMonth = -1;
+			let monthStartWeek = 0;
+
+			// 遍历所有周
+			const totalWeeks = Math.ceil(this.displayDays.length / 7);
+
+			for (let week = 0; week < totalWeeks; week++) {
+				// 找到这一周的第一个有效日期
+				let weekMonth = -1;
+				for (let day = 0; day < 7; day++) {
+					const dayIndex = week * 7 + day;
+					if (dayIndex < this.displayDays.length && this.displayDays[dayIndex].date) {
+						weekMonth = this.displayDays[dayIndex].date.getMonth();
+						break;
+					}
+				}
+
+				// 如果找到了有效月份
+				if (weekMonth !== -1) {
+					// 如果是新的月份
+					if (weekMonth !== currentMonth) {
+						// 如果不是第一个月份，先计算前一个月份的宽度
+						if (currentMonth !== -1) {
+							const weeksInMonth = week - monthStartWeek;
+							const width = weeksInMonth * cellTotalWidth;
+							labels.push({
+								name: months[currentMonth],
+								width: width,
+								marginLeft: monthStartWeek === 0 ? 0 : 2,
+								index: currentMonth
+							});
+						}
+
+						currentMonth = weekMonth;
+						monthStartWeek = week;
+					}
+				}
+			}
+
+			// 处理最后一个月份
+			if (currentMonth !== -1) {
+				const weeksInMonth = totalWeeks - monthStartWeek;
+				const width = weeksInMonth * cellTotalWidth;
+				labels.push({
+					name: months[currentMonth],
+					width: width,
+					marginLeft: monthStartWeek === 0 ? 0 : 2,
+					index: currentMonth
+				});
+			}
+
+			return labels;
+		}
+	},
+	watch: {
+		year: {
+			immediate: true,
+			handler(newYear) {
+				this.generateDisplayData(newYear);
+			}
+		},
+		chartData: {
+			deep: true,
+			handler(newData) {
+				this.mergeContributionData(newData);
+			}
+		}
+	},
+	created() {
+		this.initYearList()
+		this.filterAndSetCurrentYearData(this.year);
+	},
+	methods: {
+		initYearList(){
+			for (var index = 1900; index < 2099; index++) {
+				 this.yearList.push(index)
+			}
+			this.yearList = this.yearList.reverse();
+		},
+		filterAndSetCurrentYearData(year) {
+			this.currentYear = year;
+			this.currentYearData = this.chartData.filter((x) => x.name.includes(this.currentYear));
+			this.generateDisplayData(year);
+		},
+		generateDisplayData(year) {
+			const startDate = new Date(year, 0, 1);
+			const endDate = new Date(year, 11, 31);
+			const days = [];
+
+			// 计算第一周的偏移量（确保周一开始）
+			let firstDay = startDate.getDay();
+			firstDay = firstDay === 0 ? 6 : firstDay - 1; // 将周日(0)转换为6，周一(1)转换为0
+
+			// 添加空白填充，使第一周从周一开始
+			for (let i = 0; i < firstDay; i++) {
+				days.push({ date: null, count: 0 });
+			}
+
+			// 生成一年的日期
+			let currentDate = new Date(startDate);
+			while (currentDate <= endDate) {
+				// 默认无贡献
+				days.push({
+					date: new Date(currentDate),
+					count: 0
+				});
+				currentDate.setDate(currentDate.getDate() + 1);
+			}
+
+			this.displayDays = days;
+			this.mergeContributionData(this.currentYearData);
+		},
+		mergeContributionData(contributionData) {
+			if (!contributionData || contributionData.length === 0) return;
+
+			// 将传入的数据合并到显示数据中
+			const dataMap = new Map();
+			contributionData.forEach((item) => {
+				const dateStr = this.formatDate(item.date);
+				dataMap.set(dateStr, item.total);
+			});
+
+			this.displayDays.forEach((day) => {
+				if (day.date) {
+					const dateStr = this.formatDate(day.date);
+					if (dataMap.has(dateStr)) {
+						day.count = dataMap.get(dateStr);
+					}
+				}
+			});
+		},
+		formatDate(date) {
+			date = new Date(date);
+			// 将日期格式化为 YYYY-MM-DD
+			const year = date.getFullYear();
+			const month = String(date.getMonth() + 1).padStart(2, '0');
+			const day = String(date.getDate()).padStart(2, '0');
+			return `${year}-${month}-${day}`;
+		},
+		formatDisplayDate(date) {
+			// 将日期格式化为中文显示格式
+			const year = date.getFullYear();
+			const month = date.getMonth() + 1;
+			const day = date.getDate();
+			return `${year}年${month}月${day}日`;
+		},
+		getDayColor(day) {
+			if (day.count === 0) return this.intensityColors[0];
+			if (day.count <= 2) return this.intensityColors[1];
+			if (day.count <= 4) return this.intensityColors[2];
+			if (day.count <= 6) return this.intensityColors[3];
+			return this.intensityColors[4];
+		},
+		getTooltipText(day) {
+			if (!day.date) return '无数据';
+
+			const dateStr = this.formatDisplayDate(day.date);
+			if (day.count === 0) {
+				return `${dateStr}: 发布 0 篇文章`;
+			} else {
+				return `${dateStr}: 发布 ${day.count} 篇文章`;
+			}
+		},
+		handleDayClick(day, index) {
+			uni.showToast({
+				icon: 'none',
+				title: this.getTooltipText(day)
+			});
+		},
+		changeYear(value) {
+			this.filterAndSetCurrentYearData(value);
+			this.$emit('year-change', value);
+		}
+	}
+};
+</script>
+
+<style scoped>
+.contribution-heatmap {
+	box-sizing: border-box;
+	width: 100%;
+	background-color: #fff;
+	border-radius: 12rpx;
+	box-shadow: 0 2rpx 6rpx rgba(0, 0, 0, 0.12), 0 2rpx 4rpx rgba(0, 0, 0, 0.24);
+}
+
+.header {
+	display: flex;
+	justify-content: space-between;
+	align-items: center;
+	margin-bottom: 30rpx;
+}
+
+.title {
+	font-size: 24rpx;
+	font-weight: 500;
+	color: #000;
+	border: 2rpx solid #ebedf0;
+	border-radius: 10rpx;
+	padding: 8rpx 12rpx;
+}
+
+.controls {
+	display: flex;
+	align-items: center;
+	gap: 30rpx;
+}
+
+.year-selector {
+	display: flex;
+	align-items: center;
+	gap: 16rpx;
+}
+
+.year-btn {
+	background: none;
+	border: none;
+	cursor: pointer;
+	color: #0969da;
+	font-size: 28rpx;
+	padding: 8rpx 16rpx;
+	border-radius: 6rpx;
+}
+
+.year-btn:hover {
+	background-color: #f6f8fa;
+}
+
+.year-display {
+	font-size: 28rpx;
+	font-weight: 600;
+	min-width: 120rpx;
+	text-align: center;
+}
+
+.legend {
+	display: flex;
+	align-items: center;
+	gap: 2rpx;
+	font-size: 24rpx;
+	border: 2rpx solid #ebedf0;
+	border-radius: 10rpx;
+	padding: 8rpx 3rpx;
+}
+
+.legend-text {
+	margin: 0 10rpx;
+}
+.legend-day-cell {
+	width: 24rpx!important;
+	height: 24rpx!important; 
+}
+.heatmap-container {
+	width: 100%;
+	display: flex;
+	padding-bottom: 20rpx;
+}
+
+.weeks {
+	margin-top: -2rpx;
+	flex-shrink: 0;
+	display: flex;
+	flex-direction: column;
+	margin-right: 10rpx;
+	padding-top: 48rpx;
+}
+
+.week-label {
+	font-size: 24rpx;
+	color: #7e7e7f;
+	height: 30rpx;
+	line-height: 30rpx;
+	margin-bottom: 6rpx;
+	text-align: right;
+}
+
+.months {
+	width: 100%;
+	display: flex;
+	margin-bottom: 10rpx;
+}
+
+.month-label {
+	flex: 1;
+	flex-shrink: 0;
+	font-size: 24rpx;
+	color: #7e7e7f;
+	text-align: center;
+}
+
+.heatmap-content {
+	width: 100%;
+	display: flex;
+	flex-direction: column;
+	overflow: hidden;
+	overflow-x: auto;
+}
+
+.days-container {
+	display: flex;
+	flex-direction: column;
+	flex-wrap: wrap;
+	height: 252rpx; /* 7行 * 30rpx + 7行 * 6rpx间距 */
+}
+
+.day-cell {
+	width: 32rpx;
+	height: 32rpx;
+	border-radius: 4rpx;
+	margin: 3rpx;
+	background-color: #ebedf0;
+	position: relative;
+}
+
+.footer {
+	margin-top: 12rpx;
+	font-size: 24rpx;
+	color: #586069;
+	display: flex;
+	justify-content: space-between;
+	align-items: center;
+}
+.releases-count{
+	display: flex;
+	gap: 0 6rpx;
+	box-sizing: border-box;
+	border: 2rpx solid #ebedf0;
+	border-radius: 10rpx;
+	padding: 8rpx 12rpx;
+	font-size: 24rpx;
+}
+</style>
@@ -0,0 +1,93 @@
+<template>
+    <tm-poup v-model="isShow" width="80vw" height="800rpx" position="center" :round="6" @change="fnOnChange">
+        <view class="fulled pa-4">
+            <view class="mt-24 fulled text-weight-b text-size-sm text-align-center text-overflow-2 pb-24">{{ title }}</view>
+            <view class="fulled mt-2">
+                <scroll-view class="fulled" scroll-y :style="{
+                    height: url? '600rpx': '680rpx'
+                }">
+                    <mp-html class="evan-markdown" lazy-load :domain="markdownConfig.domain"
+                             :loading-img="markdownConfig.loadingGif" :scroll-table="true" :selectable="true"
+                             :tag-style="markdownConfig.tagStyle" :container-style="markdownConfig.containStyle"
+                             :content="content" :markdown="true" :showLineNumber="true" :showLanguageName="true"
+                             :copyByLongPress="true"/>
+                </scroll-view>
+            </view>
+            <view v-if="url" class="fulled mt-12 flex flex-center">
+                <tm-button theme="bg-gradient-light-blue-accent" size="m" @click="fnToWebview()">
+                    点击跳转内容链接
+                </tm-button>
+            </view>
+        </view>
+    </tm-poup>
+</template>
+
+
+<script>
+import tmPoup from '@/tm-vuetify/components/tm-poup/tm-poup.vue';
+import tmButton from '@/tm-vuetify/components/tm-button/tm-button.vue';
+import mpHtml from '@/components/mp-html/components/mp-html/mp-html.vue';
+
+import MarkdownConfig from '@/common/markdown/markdown.config.js';
+
+export default {
+    name: 'notify-dialog',
+    components: {
+        tmPoup,
+        tmButton,
+        mpHtml
+    },
+    props: {
+        show: {
+            type: Boolean,
+            default: false
+        },
+        title: {
+            type: String,
+            default: ''
+        },
+        content: {
+            type: String,
+            default: ''
+        },
+        url: {
+            type: String,
+            default: ''
+        }
+    },
+    data() {
+        return {
+            isShow: false,
+            markdownConfig: MarkdownConfig,
+        };
+    },
+    created() {
+        this.isShow = this.show;
+    },
+    methods: {
+        fnToWebview() {
+            if (this.$utils.checkIsUrl(this.url)) {
+                uni.navigateTo({
+                    url: '/pagesC/website/website?data=' +
+                        JSON.stringify({
+                            title: this.title,
+                            url: encodeURIComponent(this.url)
+                        }),
+                    success: () => {
+                        this.fnOnChange(false)
+                    }
+                });
+            }
+        },
+        fnOnChange(e) {
+            this.isShow = false;
+            this.$emit('on-change', e);
+        }
+    }
+}
+</script>
+
+
+<style scoped lang="scss">
+
+</style>
@@ -0,0 +1,200 @@
+<template>
+	<view v-if="pluginInfo" class="plugin-unavailable flex flex-col flex-center"
+		:class="{border:useBorder,'decoration':useDecoration}" :style="[calcCustomStyle]">
+		<!-- 图标 -->
+		<image class="plugin-logo" :src="pluginInfo.logo" mode="scaleToFill"></image>
+		<!-- 名称 -->
+		<view class="plugin-name">
+			{{ pluginInfo.name }}
+		</view>
+		<view class="plugin-error">
+			未安装/启用插件
+		</view>
+		<!-- 描述 -->
+		<view class="plugin-desc">
+			{{ pluginInfo.desc }}
+		</view>
+		<view v-if="errorText" class="plugin-tip">
+			{{errorText}}
+		</view>
+		<!-- 插件地址 -->
+		<view class="plugin-url">
+			插件地址：{{ pluginInfo.url }}
+		</view>
+		<!-- 反馈按钮/复制地址 -->
+		<view class="plugin-btns w-full flex-center">
+			<!-- #ifndef MP-WEIXIN -->
+			<tm-button theme="light-blue" :block="true" class="w-full" :height="70" @click="copy">复制地址</tm-button>
+			<!-- #endif -->
+			<!-- #ifdef MP-WEIXIN -->
+			<tm-button theme="light-blue" plan text :height="70" @click="copy">复制地址</tm-button>
+			<tm-button theme="light-blue" open-type="contact" :height="70">提交反馈</tm-button>
+			<!-- #endif -->
+		</view>
+
+		<view class="plugin-copyright">
+			提示：请确保 Halo 博客已安装相关插件
+		</view>
+	</view>
+</template>
+
+<script>
+	import {
+		NeedPluginIds,
+		NeedPlugins,
+		CheckNeedPluginAvailable
+	} from "@/utils/plugin.js"
+	import utils from '@/utils/index.js'
+
+	import tmButton from '@/tm-vuetify/components/tm-button/tm-button.vue';
+
+	export default {
+		name: "plugin-unavailable",
+		components: {
+			tmButton
+		},
+		props: {
+			pluginId: {
+				type: String,
+				default: ""
+			},
+			errorText: {
+				type: String,
+				default: ""
+			},
+			useDecoration: {
+				type: Boolean,
+				default: true
+			},
+			useBorder: {
+				type: Boolean,
+				default: true
+			},
+			customStyle: {
+				type: Object,
+				default: () => ({})
+			}
+		},
+		data() {
+			return {
+				NeedPluginIds,
+				NeedPlugins,
+				pluginInfo: null,
+				defaultStyle: {
+					width: "80vw",
+					borderRadius: "24rpx"
+				}
+			};
+		},
+		computed: {
+			calcCustomStyle() {
+				const style = this.customStyle ?? {}
+				return {
+					...this.defaultStyle,
+					...style
+				}
+			}
+		},
+		watch: {
+			pluginId: {
+				deep: true,
+				immediate: true,
+				handler(newVal, oldVal) {
+					this.pluginInfo = NeedPlugins.get(newVal)
+				}
+			}
+		},
+		methods: {
+			copy() {
+				utils.copyText(this.pluginInfo.url, "插件地址已复制")
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.plugin-unavailable {
+		box-sizing: border-box;
+		margin: auto;
+		padding: 100rpx 36rpx;
+		gap: 24rpx;
+		font-size: 28rpx;
+
+		&.border {
+			// border: 2rpx solid #E2E8F0;
+			border: 2rpx solid #eee;
+		}
+
+		&.decoration {
+			background-color: rgba(255, 255, 255, 0.95);
+			box-shadow: 0 0 12rpx rgba(226, 232, 240, 0.35);
+			backdrop-filter: blur(6rpx);
+			border-top: 12rpx solid rgba(3, 169, 244, 1);
+		}
+
+	}
+
+	.plugin-logo {
+		box-sizing: border-box;
+		width: 120rpx;
+		height: 120rpx;
+		border-radius: 24rpx;
+	}
+
+	.plugin-name {
+		box-sizing: border-box;
+		font-weight: bold;
+		color: #333;
+		font-size: 32rpx;
+	}
+
+	.plugin-error {
+		box-sizing: border-box;
+		padding: 6rpx 16rpx;
+		border-radius: 36rpx;
+		background-color: rgba(255, 61, 49, 0.075);
+		color: rgba(255, 61, 49, 1);
+		font-size: 24rpx;
+		font-weight: bold;
+	}
+
+	.plugin-tip {
+		box-sizing: border-box;
+		padding: 10rpx 20rpx;
+		border-radius: 12rpx;
+		border: 2rpx dashed #f2c97d;
+		color: #f0a020;
+		font-size: 24rpx;
+	}
+
+	.plugin-desc {
+		box-sizing: border-box;
+		width: 60vw;
+		font-size: 24rpx;
+		text-align: center;
+		color: #64748b;
+	}
+
+	.plugin-url {
+		width: 100%;
+		box-sizing: border-box;
+		padding: 16rpx 24rpx;
+		border-radius: 12rpx;
+		background-color: #F1F5F9;
+		color: #666;
+		font-size: 24rpx;
+		white-space: nowrap;
+		overflow: hidden;
+		text-overflow: ellipsis;
+	}
+
+	.plugin-btns {
+		box-sizing: border-box;
+	}
+
+	.plugin-copyright {
+		font-size: 20rpx;
+		color: #999;
+		transform: scale(0.9) translateY(20px);
+	}
+</style>
@@ -1,735 +0,0 @@
-export default{
-	data(){
-		return{
-			system_info:{}, //system info
-			canvas_width:0, //canvas width px
-			canvas_height:0, //canvas height px
-			ctx:null, //canvas object
-			canvas_id:null, //canvas id
-			hidden:false,//Whether to hide canvas
-			scale:1,//canvas scale
-			r_canvas_scale:1,
-			if_ctx:true
-		}
-	},
-	methods:{
-		/**
-		 * save r-canvas.vue object
-		 * @param {Object} that
-		 */
-		// saveThis(that){
-		// 	rCanvasThis = that
-		// },
-		/**
-		 * Draw round rect text
-		 * @param {Object} config
-		 * @param {Number} config.x x坐标
-		 * @param {Number} config.y y坐标
-		 * @param {Number} config.w 宽度
-		 * @param {Number} config.h 高度
-		 * @param {Number} config.radius 圆角弧度
-		 * @param {String} config.fill_color 矩形颜色
-		 */
-		fillRoundRect(config) {
-			return new Promise((resolve,reject)=>{
-				let x = this.compatibilitySize(parseFloat(config.x)*this.scale)
-				let y = this.compatibilitySize(parseFloat(config.y)*this.scale)
-				let w = this.compatibilitySize(parseFloat(config.w)*this.scale)
-				let h = this.compatibilitySize(parseFloat(config.h)*this.scale)
-				let radius = config.radius?parseFloat(config.radius)*this.scale:10*this.scale
-				
-				let fill_color = config.fill_color || "black"
-				// The diameter of the circle must be less than the width and height of the rectangle
-				if (2 * radius > w || 2 * radius > h) { 
-					reject("The diameter of the circle must be less than the width and height of the rectangle")
-					return false; 
-				}
-				this.ctx.save();
-				this.ctx.translate(x, y);
-				//  
-				this.drawRoundRectPath({
-					w: w, 
-					h: h, 
-					radius: radius
-				});
-				this.ctx.fillStyle = fill_color
-				this.ctx.fill();
-				this.ctx.restore();
-				resolve()
-			})
-		},
-		/**
-		 * Draws the sides of a rounded rectangle
-		 * @param {Object} config
-		 * @param {Number} config.w 宽度
-		 * @param {Number} config.h 高度
-		 * @param {Number} config.radius 圆角弧度
-		 */
-		drawRoundRectPath(config) {
-			this.ctx.beginPath(0);
-			this.ctx.arc(config.w - config.radius, config.h - config.radius, config.radius, 0, Math.PI / 2);
-			this.ctx.lineTo(config.radius, config.h);
-			this.ctx.arc(config.radius, config.h - config.radius, config.radius, Math.PI / 2, Math.PI);
-			this.ctx.lineTo(0, config.radius);
-			this.ctx.arc(config.radius, config.radius, config.radius, Math.PI, Math.PI * 3 / 2);
-			this.ctx.lineTo(config.w - config.radius, 0);
-			this.ctx.arc(config.w - config.radius, config.radius, config.radius, Math.PI * 3 / 2, Math.PI * 2);
-			this.ctx.lineTo(config.w, config.h - config.radius);
-			this.ctx.closePath();
-		},
-		/**
-		 * Draw special Text,line wrapping is not supported
-		 * @param {Object} config
-		 * @param {String} config.text 文字
-		 * @param {Number} config.x x坐标
-		 * @param {Number} config.y y坐标
-		 * @param {String} config.font_color 文字颜色
-		 * @param {String} config.font_family 文字字体
-		 * @param {Number} config.font_size 文字大小（px）
-		 */
-		drawSpecialText(params){
-			let general = params.general
-			let list = params.list
-			return new Promise(async (resolve,reject)=>{
-				if(!general){
-					reject("general cannot be empty:101")
-					return;
-				}else if(list && list.length>0){
-					for(let i in list){
-						if(i != 0){
-							let font_size = list[i-1].font_size?parseFloat(list[i-1].font_size):20
-							this.ctx.setFontSize(font_size)
-							general.x = parseFloat(general.x) + this.ctx.measureText(list[i-1].text).width
-						}
-						list[i].x = general.x
-						list[i].y = general.y + (list[i].margin_top?parseFloat(list[i].margin_top):0)
-						await this.drawText(list[i])
-					}
-					resolve()
-				}else{
-					reject("The length of config arr is less than 0")
-					return;
-				}
-				
-			})
-		},
-		/**
-		 * array delete empty
-		 * @param {Object} arr
-		 */
-		arrDeleteEmpty(arr){
-			let newArr = []
-			for(let i in arr){
-				if(arr[i]){
-					newArr.push(arr[i])
-				}
-			}
-			return newArr
-		},
-		/**
-		 * Draw Text,support line
-		 * @param {Object} config
-		 * @param {String} config.text 文字
-		 * @param {Number} config.max_width 文字最大宽度（大于宽度自动换行）
-		 * @param {Number} config.line_height 文字上下行间距
-		 * @param {Number} config.x x坐标
-		 * @param {Number} config.y y坐标
-		 * @param {String} config.font_color 文字颜色
-		 * @param {String} config.font_family 文字字体 默认值：Arial
-		 * @param {String} config.text_align 文字对齐方式（left/center/right）
-		 * @param {Number} config.font_size 文字大小（px）
-		 * @param {Boolean} config.line_through_height 中划线大小
-		 * @param {Boolean} config.line_through_color 中划线颜色
-		 * @param {String} config.font_style 规定文字样式
-		 * @param {String} config.font_variant 规定字体变体
-		 * @param {String} config.font_weight 规定字体粗细
-		 * @param {String} config.line_through_cap 线末端类型
-		 * @param {String} config.line_clamp 最大行数
-		 * @param {String} config.line_clamp_hint 超过line_clamp后，尾部显示的自定义标识 如 ...
-		 * @param {String} config.is_line_break 是否开启换行符换行
-		 * 
-		 */
-		drawText(config,configuration = {}){
-			
-			configuration['line_num'] = configuration.line_num?configuration.line_num:0
-			configuration['text_width'] = configuration.text_width?configuration.text_width:0
-			
-			return new Promise(async (resolve,reject)=>{
-				
-				if(config.text){
-					
-					let draw_width = 0,draw_height = 0,draw_x = config.x,draw_y = config.y
-					let font_size = config.font_size?(parseFloat(config.font_size)*this.scale):(20*this.scale)
-					let font_color = config.font_color || "#000"
-					let font_family = config.font_family || "Arial"
-					let line_height = config.line_height || config.font_size || 20
-					let text_align = config.text_align || "left"
-					let font_weight = config.font_weight || "normal"
-					let font_variant = config.font_variant || "normal"
-					let font_style = config.font_style || "normal"
-					let line_clamp_hint = config.line_clamp_hint || '...'
-					let lineBreakJoinText = ""
-					let max_width = config.max_width?parseFloat(config.max_width)*this.scale:0
-					// checkout is line break
-					if(config.is_line_break){
-						let splitTextArr = config.text.split(/[\n]/g)
-						if(splitTextArr && splitTextArr.length > 0){
-							let newSplitTextArr = this.arrDeleteEmpty(splitTextArr)
-							if(newSplitTextArr && newSplitTextArr.length > 0){
-								lineBreakJoinText = newSplitTextArr.slice(1).join("\n")
-								config.text = newSplitTextArr[0]
-							}else{
-								reject("Text cannot be empty:103")
-								return
-							}
-						}else{
-							reject("Text cannot be empty:102")
-							return
-						}
-					}
-					
-					this.ctx.setFillStyle(font_color) // color
-					this.ctx.textAlign = text_align;
-					this.ctx.font = `${font_style} ${font_variant} ${font_weight} ${parseInt(font_size)}px ${font_family}`
-					if(configuration.text_width >= this.ctx.measureText(config.text).width){
-						draw_width = configuration.text_width
-					}else if(max_width > 0){
-						draw_width = max_width < this.ctx.measureText(config.text).width ? this.resetCompatibilitySize(max_width) : this.resetCompatibilitySize(this.ctx.measureText(config.text).width)
-					}else{
-						draw_width = this.ctx.measureText(config.text).width
-					}
-					configuration.text_width = draw_width / this.scale
-					if( max_width && this.compatibilitySize(this.ctx.measureText(config.text).width) > this.compatibilitySize(max_width)){
-						let current_text = ""
-						let text_arr = config.text.split("")
-						for(let i in text_arr){
-							if( this.compatibilitySize(this.ctx.measureText(current_text+text_arr[i]).width) > this.compatibilitySize(max_width) ){
-								// Hyphenation that is greater than the drawable width continues to draw
-								if(config.line_clamp && parseInt(config.line_clamp) == 1){
-									// Subtracting the current_text tail width from the line_clamp_hint width
-									let current_text_arr = current_text.split('')
-									let json_current_text = ''
-									while(true){
-										current_text_arr = current_text_arr.slice(1)
-										json_current_text = current_text_arr.join('')
-										if(this.compatibilitySize(this.ctx.measureText(json_current_text).width) <= this.compatibilitySize(this.ctx.measureText(line_clamp_hint).width)){
-											current_text = current_text.replace(json_current_text,'')
-											break;
-										}
-									}
-									configuration.line_num += 1
-									this.ctx.setFontSize(parseInt(this.compatibilitySize(font_size))) // font size
-									this.ctx.fillText(current_text + line_clamp_hint, this.compatibilitySize(parseFloat(config.x)*this.scale), this.compatibilitySize(parseFloat(config.y)*this.scale));
-								}else{
-									configuration.line_num += 1
-									this.ctx.setFontSize(parseInt(this.compatibilitySize(font_size))) // font size
-									this.ctx.fillText(current_text, this.compatibilitySize(parseFloat(config.x)*this.scale), this.compatibilitySize(parseFloat(config.y)*this.scale));
-									config.text = text_arr.slice(i).join("")
-									config.y = config.y + line_height
-									if(config.line_clamp){
-										config.line_clamp = parseInt(config.line_clamp) - 1
-									}
-									await this.drawText(config,configuration)
-								}
-								
-								break;
-							}else{
-								current_text = current_text+text_arr[i]
-							}
-						}
-					}else{
-						if(config.line_through_height){
-							let x = parseFloat(config.x)*this.scale
-							let w
-							let y = parseFloat(config.y)*this.scale - (font_size / 2.6) 
-							if(text_align == "left"){
-								w = this.ctx.measureText(config.text).width/1.1 + parseFloat(config.x)*this.scale
-							}else if(text_align == "right"){
-								w = parseFloat(config.x)*this.scale - this.ctx.measureText(config.text).width/1.1
-							}else if(text_align == "center"){
-								x = parseFloat(config.x)*this.scale - this.ctx.measureText(config.text).width / 1.1 / 2
-								w = parseFloat(config.x)*this.scale + this.ctx.measureText(config.text).width / 1.1 / 2
-							}
-							this.drawLineTo({
-								x:x,
-								y:y,
-								w:w,
-								h:y,
-								line_width:config.line_through_height,
-								line_color:config.line_through_color,
-								line_cap:config.line_through_cap
-							})
-						}
-						configuration.line_num += 1
-						this.ctx.setFontSize(parseInt(this.compatibilitySize(font_size))) // font size
-						this.ctx.fillText(config.text, this.compatibilitySize(parseFloat(config.x)*this.scale), this.compatibilitySize(parseFloat(config.y)*this.scale));
-						if(config.line_clamp){
-							config.line_clamp = parseInt(config.line_clamp) - 1
-						}
-					}
-					if(lineBreakJoinText){
-						await this.drawText({...config,text:lineBreakJoinText,y:config.y + line_height},configuration)
-					}
-					draw_height = config.font_size * configuration.line_num
-					draw_width = configuration.text_width
-					resolve({draw_width,draw_height,draw_x,draw_y})
-				}else{
-					reject("Text cannot be empty:101")
-				}
-			})
-		},
-		/**
-		 * Draw Line
-		 * @param {Object} config
-		 * @param {Object} config.x x坐标
-		 * @param {Object} config.y y坐标
-		 * @param {Object} config.w 线的宽度
-		 * @param {Object} config.h 线的高度
-		 * @param {Object} config.line_width 线的宽度
-		 * @param {Object} config.line_color 线条颜色
-		 */
-		drawLineTo(config){
-			let x = this.compatibilitySize(config.x)
-			let y = this.compatibilitySize(config.y)
-			let w = this.compatibilitySize(config.w)
-			let h = this.compatibilitySize(config.h)
-			let line_width = config.line_width?parseFloat(config.line_width)*this.scale:1*this.scale
-			let line_color = config.line_color || "black"
-			let line_cap = config.line_cap || "butt"
-			this.ctx.beginPath()
-			this.ctx.lineCap = line_cap
-			this.ctx.lineWidth = line_width
-			this.ctx.strokeStyle = line_color
-			this.ctx.moveTo(x,y)
-			this.ctx.lineTo(w,h)
-			this.ctx.stroke()
-		},
-		/** 
-		 * Compatibility px
-		 * @param {Object} size
-		 */
-		compatibilitySize(size) {
-		  let canvasSize = (parseFloat(size) / 750) * this.system_info.windowWidth
-		  canvasSize = parseFloat(canvasSize * 2)
-		  return canvasSize
-		},
-		/**
-		 * Restore compatibility px
-		 * @param {Object} size
-		 */
-		resetCompatibilitySize(size) {
-		  let canvasSize = (parseFloat(size/2)/this.system_info.windowWidth) * 750
-		  return canvasSize
-		},
-		/**
-		 * Init canvas
-		 */
-		init(config){
-			return new Promise(async (resolve,reject)=>{
-				if(!config.canvas_id){
-					reject("Canvas ID cannot be empty, please refer to the usage example")
-					return;
-				}
-				this.hidden = config.hidden
-				this.canvas_id = config.canvas_id
-				let system_info = await uni.getSystemInfoSync()
-				this.system_info = system_info
-				this.scale = config.scale&&parseFloat(config.scale)>0?parseInt(config.scale):1
-				this.canvas_width = (config.canvas_width ? this.compatibilitySize(config.canvas_width) : system_info.windowWidth) * this.scale
-				this.canvas_height = (config.canvas_height ? this.compatibilitySize(config.canvas_height) : system_info.windowHeight) * this.scale,
-				this.r_canvas_scale = 1/this.scale
-				this.ctx = uni.createCanvasContext(this.canvas_id,this)
-				this.setCanvasConfig({
-					global_alpha:config.global_alpha?parseFloat(config.global_alpha):1,
-					backgroundColor:config.background_color?config.background_color:"#fff"
-				})
-				resolve()
-			})
-		},
-		/**
-		 * clear canvas all path
-		 */
-		clearCanvas(){
-			return new Promise(async (resolve,reject)=>{
-				if(!this.ctx){
-					reject("canvas is not initialized:101")
-					return
-				}else{
-					this.ctx.clearRect(0,0,parseFloat(this.canvas_width)*this.scale,parseFloat(this.canvas_height)*this.scale)
-					await this.draw()
-					resolve()
-				}
-			})
-		},
-		/**
-		 * Set canvas config
-		 * @param {Object} config
-		 */
-		setCanvasConfig(config){
-			this.ctx.globalAlpha = config.global_alpha
-			this.ctx.fillStyle = config.backgroundColor
-			this.ctx.fillRect(0, 0, parseFloat(this.canvas_width)*this.scale, parseFloat(this.canvas_height)*this.scale)
-		},
-		/**
-		 * set canvas width
-		 * @param {Object} width
-		 */
-		setCanvasWidth(width){
-			if(!width){
-				uni.showToast({
-					title:'setCanvasWidth：width error',
-					icon:'none'
-				})
-			}
-			this.canvas_width = this.compatibilitySize(parseFloat(width)) * this.scale
-			this.ctx.width = this.canvas_width
-		},
-		/**
-		 * set canvas height
-		 * @param {Object} height
-		 */
-		setCanvasHeight(height){
-			if(!height){
-				uni.showToast({
-					title:'setCanvasWidth：height error',
-					icon:'none'
-				})
-			}
-			this.canvas_height = this.compatibilitySize(parseFloat(height)) * this.scale
-			this.ctx.height = this.canvas_height
-		},
-		/**
-		 * Draw to filepath
-		 */
-		draw(callback){
-			return new Promise((resolve,reject)=>{
-				let stop = setTimeout(()=>{
-					this.ctx.draw(false,setTimeout(()=>{
-					    uni.canvasToTempFilePath({
-					    	canvasId: this.canvas_id,
-					    	quality: 1,
-					    	success: (res)=>{
-					    		console.log('res',res)
-					    		resolve(res)
-					    		callback && callback(res)
-					    	},
-					    	fail:(err)=>{
-					    		reject(JSON.stringify(err)|| "Failed to generate poster:101")
-					    	}
-					    },this)
-					},300))
-					clearTimeout(stop)
-				},300)
-			})
-		},
-		/**
-		 * draw rect
-		 * @param {Number} config.x x坐标
-		 * @param {Number} config.y y坐标
-		 * @param {Number} config.w 图形宽度(px)
-		 * @param {Number} config.h 图形高度(px)
-		 * @param {Number} config.color 图形颜色
-		 * @param {Number} config.is_radius 是否开启圆图（1.1.6及以下版本废弃，请使用border_radius）
-		 * @param {Number} config.border_width 边框大小
-		 * @param {Number} config.border_color 边框颜色
-		 * 
-		 */
-		drawRect(config){
-			return new Promise(async (resolve,reject)=>{
-				if(!config.border_width || config.border_width <=0){
-					config.border_width = 0
-				}else{
-					config.border_width = parseFloat(config.border_width)
-				}
-				if(parseFloat(config.border_width) > 0){
-					let sub_config = JSON.parse(JSON.stringify(config))
-					sub_config.border_width = 0
-					sub_config.w = config.w + config.border_width
-					sub_config.h = config.h + config.border_width
-					sub_config.color = config.border_color || 'black'
-					if(sub_config.border_radius){
-						sub_config.border_radius = parseFloat(sub_config.border_radius) + parseFloat(config.border_width) / 2
-					} 
-					await this.drawRect(sub_config)
-				}
-				
-				let color = config.color || 'white'
-				config.x =  (parseFloat(config.x) + config.border_width / 2)
-				config.y = (parseFloat(config.y) + config.border_width / 2)
-				config['color'] = color
-				this.ctx.fillStyle = color;
-				if(config.is_radius || config.border_radius){
-					this.setNativeBorderRadius(config)
-					this.ctx.fill()
-				}else{
-					console.log('config.border_width',config.border_width)
-					this.ctx.fillRect(this.compatibilitySize(config.x*this.scale),this.compatibilitySize(config.y*this.scale),this.compatibilitySize(parseFloat(config.w)*this.scale),this.compatibilitySize(parseFloat(config.h)*this.scale))
-				}
-				resolve()
-			})
-		},
-		/**
-		 * Draw image
-		 * @param {Object} config
-		 * @param {String} config.url 图片链接
-		 * @param {Number} config.x x坐标
-		 * @param {Number} config.y y坐标
-		 * @param {Number} config.w 图片宽度(px)
-		 * @param {Number} config.h 图片高度(px)
-		 * @param {Number} config.border_width 边大小
-		 * @param {Number} config.border_color 边颜色
-		 * @param {Number} config.is_radius 是否开启圆图（1.1.6及以下版本废弃，请使用border_radius）
-		 * @param {Number} config.border_radius 圆角弧度
-		 */
-		drawImage(config){
-			return new Promise(async (resolve,reject)=>{
-				if(config.url){
-					let type = 0 // 1、network image  2、native image  3、base64 image
-					let image_url
-					let reg = /^https?/ig;
-					if(reg.test(config.url)){
-						type = 1
-					}else{
-						if((config.url.indexOf("data:image/png;base64") != -1) || config.url.indexOf("data:image/jpeg;base64") != -1 || config.url.indexOf("data:image/gif;base64") != -1){
-							type = 3
-						}else{
-							type = 2
-						}
-					}
-					if(type == 1){
-						// network image
-						await this.downLoadNetworkFile(config.url).then(res=>{ // two function
-							image_url = res
-						}).catch(err=>{
-							reject(err)
-							return;
-						})
-					}else if(type == 2){
-						// native image
-						const imageInfoResult = await uni.getImageInfo({
-							src: config.url
-						});
-						try{
-							if(imageInfoResult.length <= 1){
-								reject(imageInfoResult[0].errMsg + ':404')
-								return
-							}
-						}catch(e){
-							reject(e+':500')
-							return
-						}
-						let base64 = await this.urlToBase64({url:imageInfoResult[1].path})
-						// #ifdef MP-WEIXIN
-						await this.base64ToNative({url:base64}).then(res=>{
-							image_url = res
-						}).catch(err=>{
-							reject(JSON.stringify(err)+":501")
-							return;
-						})
-						// #endif
-						// #ifndef MP-WEIXIN
-						image_url = base64
-						// #endif
-						
-					}else if(type == 3){
-						// #ifdef MP-WEIXIN
-						await this.base64ToNative({url:config.url}).then(res=>{
-							image_url = res
-						}).catch(err=>{
-							reject(JSON.stringify(err)+":500")
-							return;
-						})
-						// #endif
-						// #ifndef MP-WEIXIN
-						image_url = config.url
-						// #endif
-					}else{
-						reject("Other Type Errors:101")
-						return
-					}
-					if(config.border_width){
-						let border_radius = 0
-						if(config.border_radius){
-							let multiple = config.w / config.border_radius
-							border_radius = (parseFloat(config.w) + parseFloat(config.border_width)) / multiple
-						}
-						// drawRect
-						await this.drawRect({
-							x:parseFloat(config.x) - parseFloat(config.border_width)/2,
-							y:parseFloat(config.y) - parseFloat(config.border_width)/2,
-							w:parseFloat(config.w) + parseFloat(config.border_width),
-							h:parseFloat(config.h) + parseFloat(config.border_width),
-							color:config.border_color,
-							border_radius:border_radius,
-							border_width:config.border_width,
-							is_radius:config.is_radius
-						})
-					}
-					
-					
-
-					if(config.border_radius){
-						config.color =  config.color?config.color:'rgba(0,0,0,0)'
-						
-						// 圆角有白边,+0.5的误差
-						config.w = config.w + 0.3
-						config.h = config.h + 0.3
-						
-						this.setNativeBorderRadius(config)
-					}else if(config.is_radius){
-						//已废弃 is_radius
-						this.ctx.setStrokeStyle("rgba(0,0,0,0)")
-						this.ctx.save()
-						this.ctx.beginPath()
-						this.ctx.arc(this.compatibilitySize(parseFloat(config.x)*this.scale+parseFloat(config.w)*this.scale/2), this.compatibilitySize(parseFloat(config.y)*this.scale+parseFloat(config.h)*this.scale/2), this.compatibilitySize(parseFloat(config.w)*this.scale/2), 0, 2 * Math.PI, false)
-						this.ctx.stroke();
-						this.ctx.clip()
-					}
-					
-					await this.ctx.drawImage(image_url,this.compatibilitySize(parseFloat(config.x)*this.scale),this.compatibilitySize(parseFloat(config.y)*this.scale),this.compatibilitySize(parseFloat(config.w)*this.scale),this.compatibilitySize(parseFloat(config.h)*this.scale))
-					this.ctx.restore() //Restore previously saved drawing context
-					resolve()
-				}else{
-					let err_msg = "Links cannot be empty:101"
-					reject(err_msg)
-				}
-			})
-		},
-		/**
-		 * base64 to native available path
-		 * @param {Object} config
-		 */
-		base64ToNative(config){
-			return new Promise((resolve,reject)=>{
-				let fileName = new Date().getTime()
-				var filePath = `${wx.env.USER_DATA_PATH}/${fileName}_rCanvas.png`
-				wx.getFileSystemManager().writeFile({
-					filePath: filePath,
-					data: config.url.replace(/^data:\S+\/\S+;base64,/, ''),
-					encoding: 'base64',
-					success: function() {
-						resolve(filePath)
-					},
-					fail: function(error) {
-						reject(error)
-					}
-				})
-			})
-		},
-		/**
-		 * native url to base64
-		 * @param {Object} config
-		 */
-		urlToBase64(config){
-			return new Promise(async (resolve,reject)=>{
-				if (typeof window != 'undefined') {
-					await this.downLoadNetworkFile(config.url).then(res=>{ // two function
-						resolve(res)
-					}).catch(err=>{
-						reject(err)
-					})
-				}else if (typeof plus != 'undefined') {
-					plus.io.resolveLocalFileSystemURL(config.url,(obj)=>{
-						obj.file((file)=>{
-							let fileReader = new plus.io.FileReader()
-							fileReader.onload = (res)=>{
-								resolve(res.target.result)
-							}
-							fileReader.onerror = (err)=>{
-								reject(err)
-							}
-							fileReader.readAsDataURL(file)
-						}, (err)=>{
-							reject(err)
-						})
-					},(err)=>{
-						reject(err)
-					})
-				}else if(typeof wx != 'undefined'){
-					wx.getFileSystemManager().readFile({
-						filePath: config.url,
-						encoding: 'base64',
-						success: function(res) {
-							resolve('data:image/png;base64,' + res.data)
-						},
-						fail: function(error) {
-							reject(error)
-						}
-					})
-				}
-			})
-		},
-		setNativeBorderRadius(config){
-			let border_radius = config.border_radius?(parseFloat(config.border_radius)*this.scale):(20*this.scale)
-			if ((parseFloat(config.w)*this.scale) < 2 * border_radius) border_radius = (parseFloat(config.w)*this.scale) / 2;
-			if ((parseFloat(config.h)*this.scale) < 2 * border_radius) border_radius = (parseFloat(config.h)*this.scale) / 2;
-			this.ctx.beginPath();
-			this.ctx.moveTo(this.compatibilitySize((parseFloat(config.x)*this.scale) + border_radius), this.compatibilitySize((parseFloat(config.y)*this.scale)));
-			this.ctx.arcTo(this.compatibilitySize((parseFloat(config.x)*this.scale) + (parseFloat(config.w)*this.scale)), this.compatibilitySize((parseFloat(config.y)*this.scale)), this.compatibilitySize((parseFloat(config.x)*this.scale) + (parseFloat(config.w)*this.scale)), this.compatibilitySize((parseFloat(config.y)*this.scale) + (parseFloat(config.h)*this.scale)), this.compatibilitySize(border_radius));
-			this.ctx.arcTo(this.compatibilitySize((parseFloat(config.x)*this.scale) + (parseFloat(config.w)*this.scale)), this.compatibilitySize((parseFloat(config.y)*this.scale) + (parseFloat(config.h)*this.scale)), this.compatibilitySize((parseFloat(config.x)*this.scale)), this.compatibilitySize((parseFloat(config.y)*this.scale) + (parseFloat(config.h)*this.scale)), this.compatibilitySize(border_radius));
-			this.ctx.arcTo((this.compatibilitySize(parseFloat(config.x)*this.scale)), this.compatibilitySize((parseFloat(config.y)*this.scale) + (parseFloat(config.h)*this.scale)), this.compatibilitySize((parseFloat(config.x)*this.scale)), this.compatibilitySize((parseFloat(config.y)*this.scale)), this.compatibilitySize(border_radius));
-			this.ctx.arcTo(this.compatibilitySize((parseFloat(config.x)*this.scale)), this.compatibilitySize((parseFloat(config.y)*this.scale)), this.compatibilitySize((parseFloat(config.x)*this.scale) + (parseFloat(config.w)*this.scale)), this.compatibilitySize((parseFloat(config.y)*this.scale)), this.compatibilitySize(border_radius));
-			this.ctx.closePath();
-			this.ctx.strokeStyle = config.color || config.border_color || 'rgba(0,0,0,0)'; // 设置绘制边框的颜色
-			this.ctx.stroke();
-			this.ctx.save()
-			this.ctx.clip();
-			
-		},
-		/**
-		 * Download network file
-		 * @param {Object} url : download url
-		 */
-		downLoadNetworkFile(url){
-			return new Promise((resolve,reject)=>{
-				uni.downloadFile({
-					url,
-					success:(res)=>{
-						if(res.statusCode == 200){
-							resolve(res.tempFilePath)
-						}else{
-							reject("Download Image Fail:102")
-						}
-					},
-					fail:(err)=>{
-						reject("Download Image Fail:101")
-					}
-				})
-			})
-		},
-		/**
-		 * Save image to natice
-		 * @param {Object} filePath ： native imageUrl
-		 */
-		saveImage(filePath){
-			return new Promise((resolve,reject)=>{
-				if(!filePath){
-					reject("FilePath cannot be null:101")
-					return;
-				}
-				
-				// #ifdef H5
-					var createA = document.createElement("a");
-					createA.download = filePath;
-					createA.href = filePath;
-					document.body.appendChild(createA);
-					createA.click();
-					createA.remove();
-					resolve()
-				// #endif
-				
-				// #ifndef H5
-				uni.saveImageToPhotosAlbum({
-					filePath: filePath,
-					success:(res)=>{
-						resolve(res)
-					}, 
-					fail:(err)=>{
-						reject(err)
-					}
-				})
-				// #endif
-			})
-		}
-	}
-}
@@ -1,26 +0,0 @@
-<template>
-	<view>
-		<view class="r-canvas-component" :style="{width:canvas_width/scale+'px',height:canvas_height/scale+'px'}" :class="{'hidden':hidden}">
-			<canvas class="r-canvas" v-if="canvas_id" :canvas-id="canvas_id" :id="canvas_id" :style="{width:canvas_width+'px',height:canvas_height+'px','transform': `scale(${r_canvas_scale})`}"></canvas>
-		</view>
-	</view>
-</template>
-
-<script>
-	import rCanvasJS from "./r-canvas.js"
-	export default {
-		mixins:[rCanvasJS]
-	}
-</script>
-<style>
-.r-canvas{
-	transform-origin: 0 0;
-}
-.r-canvas-component{
-	overflow: hidden;
-}
-.r-canvas-component.hidden{
-	position: fixed;
-	top:-5000upx;
-}
-</style>
@@ -0,0 +1,243 @@
+<script>
+export default {
+  name: 'restrict-read-skeleton',
+  props: {
+    loading: {
+      type: Boolean,
+      default: true
+    },
+    hover: {
+      type: Boolean,
+      default: false
+    },
+    buttonText: {
+      type: String,
+      default: '刷新'
+    },
+    buttonColor: {
+      type: String,
+      default: '#07c160'
+    },
+    buttonSize: {
+      type: String,
+      default: 'normal', // 'small', 'normal', 'large'
+      validator: value => ['small', 'normal', 'large'].includes(value)
+    },
+    lines: {
+      type: Number,
+      default: 4,
+      validator: value => value >= 1 && value <= 6
+    },
+    skeletonColor: {
+      type: String,
+      default: '#f5f5f5'
+    },
+    skeletonHighlight: {
+      type: String,
+      default: '#e8e8e8'
+    },
+    animationDuration: {
+      type: Number,
+      default: 1.5
+    },
+    showButton: {
+      type: Boolean,
+      default: true
+    },
+    tipText: {
+      type: String,
+      default: '' // 默认不显示提示文字
+    },
+    tipColor: {
+      type: String,
+      default: '#666666' // 提示文字颜色
+    },
+    tipSize: {
+      type: Number,
+      default: 24 // 提示文字大小，单位rpx
+    }
+  },
+  methods: {
+    handleRefresh() {
+      this.$emit('refresh');
+    },
+    onTouchStart() {
+      this.$emit('touchstart');
+    },
+    onTouchEnd() {
+      this.$emit('touchend');
+    }
+  }
+};
+</script>
+
+<template>
+  <!-- 骨架屏容器 -->
+  <view class="container">
+    <!-- 骨架屏内容 -->
+    <view class="skeleton" v-if="loading">
+      <!-- 内容区域 -->
+      <view class="skeleton-body">
+        <view
+            v-for="(item, index) in Array(lines).fill(0)"
+            :key="index"
+            class="skeleton-line"
+            :class="{
+            'short': index === lines - 2,
+            'shorter': index === lines - 1
+          }"
+          :style="{
+            background: `linear-gradient(90deg, ${skeletonColor} 25%, ${skeletonHighlight} 50%, ${skeletonColor} 75%)`,
+            animationDuration: `${animationDuration}s`
+          }">
+        </view>
+      </view>
+    </view>
+
+    <!-- 实际内容 -->
+    <view v-else>
+      <slot></slot>
+    </view>
+
+    <!-- 提示文字和按钮容器 -->
+    <view v-if="showButton" class="button-container">
+      <!-- 提示文字 -->
+      <text 
+        v-if="tipText" 
+        class="tip-text"
+        :style="{
+          color: tipColor,
+          fontSize: tipSize + 'rpx'
+        }"
+      >{{ tipText }}</text>
+      
+      <!-- 按钮 -->
+      <button
+        class="overlay-button"
+        :class="[buttonSize, { 'button-hover': hover }]"
+        hover-class="none"
+        @touchstart="onTouchStart"
+        @touchend="onTouchEnd"
+        @click="handleRefresh"
+        :style="{ backgroundColor: buttonColor }"
+      >
+        {{ buttonText }}
+      </button>
+    </view>
+  </view>
+</template>
+
+<style scoped lang="scss">
+/* 容器样式 */
+.container {
+  position: relative;
+  width: 100%;
+  min-height: 200rpx;
+  background-color: #ffffff;
+  border-radius: 16rpx;
+  overflow: hidden;
+  box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.05);
+  transition: all 0.3s ease;
+
+  &:hover {
+    box-shadow: 0 8rpx 24rpx rgba(0, 0, 0, 0.08);
+  }
+}
+
+/* 骨架屏样式 */
+.skeleton {
+  width: 100%;
+  height: 100%;
+  padding: 30rpx;
+
+  &-body {
+    margin: 20rpx 0;
+  }
+
+  &-line {
+    height: 32rpx;
+    background-size: 400% 100%;
+    border-radius: 8rpx;
+    margin-bottom: 20rpx;
+    animation: skeleton-loading 1.5s ease infinite;
+
+    &.short {
+      width: 70%;
+    }
+
+    &.shorter {
+      width: 50%;
+    }
+  }
+}
+
+/* 按钮容器样式 */
+.button-container {
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  z-index: 2;
+}
+
+/* 提示文字样式 */
+.tip-text {
+  margin-bottom: 20rpx;
+  text-align: center;
+  line-height: 1.4;
+}
+
+/* 按钮样式 */
+.overlay-button {
+  position: relative; // 改为相对定位
+  transform: none; // 移除transform
+  color: white;
+  border-radius: 50rpx;
+  padding: 0 40rpx;
+  height: 80rpx;
+  line-height: 80rpx;
+  font-size: 28rpx;
+  box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.1);
+  transition: all 0.3s ease;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+
+  &:active {
+    transform: scale(0.95); // 简化active状态的transform
+  }
+
+  &.small {
+    height: 60rpx;
+    line-height: 60rpx;
+    font-size: 24rpx;
+    padding: 0 30rpx;
+  }
+
+  &.large {
+    height: 100rpx;
+    line-height: 100rpx;
+    font-size: 32rpx;
+    padding: 0 50rpx;
+  }
+}
+
+.button-hover {
+  transform: translateY(-4rpx); // 简化hover状态的transform
+  box-shadow: 0 8rpx 16rpx rgba(0, 0, 0, 0.15);
+}
+
+/* 骨架屏动画 */
+@keyframes skeleton-loading {
+  0% {
+    background-position: 100% 50%;
+  }
+  100% {
+    background-position: 0 50%;
+  }
+}
+</style>
@@ -1,784 +0,0 @@
-<template>
-	<view v-show="show" class="t-wrapper" @touchmove.stop.prevent="moveHandle">
-		<view class="t-mask" :class="{active:active}" @click.stop="close"></view>
-		<view class="t-box" :class="{active:active}">
-			<view class="t-header">
-				<view class="t-header-button" @click="close">取消</view>
-				<view class="t-header-button" @click="confirm">确认</view>
-			</view>
-			<view class="t-color__box" :style="{ background: 'rgb(' + bgcolor.r + ',' + bgcolor.g + ',' + bgcolor.b + ')'}">
-				<view class="t-background boxs" @touchstart="touchstart($event, 0)" @touchmove="touchmove($event, 0)" @touchend="touchend($event, 0)">
-					<view class="t-color-mask"></view>
-					<view class="t-pointer" :style="{ top: site[0].top - 8 + 'px', left: site[0].left - 8 + 'px' }"></view>
-				</view>
-			</view>
-			<view class="t-control__box">
-				<view class="t-control__color">
-					<view class="t-control__color-content" :style="{ background: 'rgba(' + rgba.r + ',' + rgba.g + ',' + rgba.b + ',' + rgba.a + ')' }"></view>
-				</view>
-				<view class="t-control-box__item">
-					<view class="t-controller boxs" @touchstart="touchstart($event, 1)" @touchmove="touchmove($event, 1)" @touchend="touchend($event, 1)">
-						<view class="t-hue">
-							<view class="t-circle" :style="{ left: site[1].left - 12 + 'px' }"></view>
-						</view>
-					</view>
-					<view class="t-controller boxs" @touchstart="touchstart($event, 2)" @touchmove="touchmove($event, 2)" @touchend="touchend($event, 2)">
-						<view class="t-transparency">
-							<view class="t-circle" :style="{ left: site[2].left - 12 + 'px' }"></view>
-						</view>
-					</view>
-				</view>
-			</view>
-			<view class="t-result__box">
-				<view v-if="mode" class="t-result__item">
-					<view class="t-result__box-input">{{hex}}</view>
-					<view class="t-result__box-text">HEX</view>
-				</view>
-				<template v-else>
-					<view class="t-result__item">
-						<view class="t-result__box-input">{{rgba.r}}</view>
-						<view class="t-result__box-text">R</view>
-					</view>
-					<view class="t-result__item">
-						<view class="t-result__box-input">{{rgba.g}}</view>
-						<view class="t-result__box-text">G</view>
-					</view>
-					<view class="t-result__item">
-						<view class="t-result__box-input">{{rgba.b}}</view>
-						<view class="t-result__box-text">B</view>
-					</view>
-					<view class="t-result__item">
-						<view class="t-result__box-input">{{rgba.a}}</view>
-						<view class="t-result__box-text">A</view>
-					</view>
-				</template>
-
-				<view class="t-result__item t-select" @click="select">
-					<view class="t-result__box-input">
-						<view>切换</view>
-						<view>模式</view>
-					</view>
-				</view>
-			</view>
-			<view class="t-alternative">
-				<view class="t-alternative__item" v-for="(item,index) in colorList" :key="index">
-					<view class="t-alternative__item-content" :style="{ background: 'rgba(' + item.r + ',' + item.g + ',' + item.b + ',' + item.a + ')' }"
-					 @click="selectColor(item)">
-					</view>
-				</view>
-			</view>
-		</view>
-	</view>
-</template>
-
-<script>
-	export default {
-		props: {
-			color: {
-				type: Object,
-				default () {
-					return {
-						r: 0,
-						g: 0,
-						b: 0,
-						a: 0
-					}
-				}
-			},
-			spareColor: {
-				type: Array,
-				default () {
-					return []
-				}
-			}
-		},
-		data() {
-			return {
-				show: false,
-				active: false,
-				// rgba 颜色
-				rgba: {
-					r: 0,
-					g: 0,
-					b: 0,
-					a: 1
-				},
-				// hsb 颜色
-				hsb: {
-					h: 0,
-					s: 0,
-					b: 0
-				},
-				site: [{
-					top: 0,
-					left: 0
-				}, {
-					left: 0
-				}, {
-					left: 0
-				}],
-				index: 0,
-				bgcolor: {
-					r: 255,
-					g: 0,
-					b: 0,
-					a: 1
-				},
-				hex: '#000000',
-				mode: true,
-				colorList: [{
-					r: 244,
-					g: 67,
-					b: 54,
-					a: 1
-				}, {
-					r: 233,
-					g: 30,
-					b: 99,
-					a: 1
-				}, {
-					r: 156,
-					g: 39,
-					b: 176,
-					a: 1
-				}, {
-					r: 103,
-					g: 58,
-					b: 183,
-					a: 1
-				}, {
-					r: 63,
-					g: 81,
-					b: 181,
-					a: 1
-				}, {
-					r: 33,
-					g: 150,
-					b: 243,
-					a: 1
-				}, {
-					r: 3,
-					g: 169,
-					b: 244,
-					a: 1
-				}, {
-					r: 0,
-					g: 188,
-					b: 212,
-					a: 1
-				}, {
-					r: 0,
-					g: 150,
-					b: 136,
-					a: 1
-				}, {
-					r: 76,
-					g: 175,
-					b: 80,
-					a: 1
-				}, {
-					r: 139,
-					g: 195,
-					b: 74,
-					a: 1
-				}, {
-					r: 205,
-					g: 220,
-					b: 57,
-					a: 1
-				}, {
-					r: 255,
-					g: 235,
-					b: 59,
-					a: 1
-				}, {
-					r: 255,
-					g: 193,
-					b: 7,
-					a: 1
-				}, {
-					r: 255,
-					g: 152,
-					b: 0,
-					a: 1
-				}, {
-					r: 255,
-					g: 87,
-					b: 34,
-					a: 1
-				}, {
-					r: 121,
-					g: 85,
-					b: 72,
-					a: 1
-				}, {
-					r: 158,
-					g: 158,
-					b: 158,
-					a: 1
-				}, {
-					r: 0,
-					g: 0,
-					b: 0,
-					a: 0.5
-				}, {
-					r: 0,
-					g: 0,
-					b: 0,
-					a: 0
-				}, ]
-			};
-		},
-		created() {
-			this.rgba = this.color;
-			if (this.spareColor.length !== 0) {
-				this.colorList = this.spareColor;
-			}
-		},
-		methods: {
-			/**
-			 * 初始化
-			 */
-			init() {
-				// hsb 颜色
-				this.hsb = this.rgbToHex(this.rgba);
-				// this.setColor();
-				this.setValue(this.rgba);
-			},
-			moveHandle() {},
-			open() {
-				this.show = true;
-				this.$nextTick(() => {
-					this.init();
-					setTimeout(() => {
-						this.active = true;
-						setTimeout(() => {
-							this.getSelectorQuery();
-						}, 350)
-					}, 50)
-				})
-
-			},
-			close() {
-				this.active = false;
-				this.$nextTick(() => {
-					setTimeout(() => {
-						this.show = false;
-					}, 500)
-				})
-			},
-			confirm() {
-				this.close();
-				this.$emit('confirm', {
-					rgba: this.rgba,
-					hex: this.hex
-				})
-			},
-			// 选择模式
-			select() {
-				this.mode = !this.mode
-			},
-			// 常用颜色选择
-			selectColor(item) {
-				this.setColorBySelect(item)
-			},
-			touchstart(e, index) {
-				const {
-					pageX,
-					pageY
-				} = e.touches[0];
-				this.pageX = pageX;
-				this.pageY = pageY;
-				this.setPosition(pageX, pageY, index);
-			},
-			touchmove(e, index) {
-				const {
-					pageX,
-					pageY
-				} = e.touches[0];
-				this.moveX = pageX;
-				this.moveY = pageY;
-				this.setPosition(pageX, pageY, index);
-			},
-			touchend(e, index) {},
-			/**
-			 * 设置位置
-			 */
-			setPosition(x, y, index) {
-				this.index = index;
-				const {
-					top,
-					left,
-					width,
-					height
-				} = this.position[index];
-				// 设置最大最小值
-
-				this.site[index].left = Math.max(0, Math.min(parseInt(x - left), width));
-				if (index === 0) {
-					this.site[index].top = Math.max(0, Math.min(parseInt(y - top), height));
-					// 设置颜色
-					this.hsb.s = parseInt((100 * this.site[index].left) / width);
-					this.hsb.b = parseInt(100 - (100 * this.site[index].top) / height);
-					this.setColor();
-					this.setValue(this.rgba);
-				} else {
-					this.setControl(index, this.site[index].left);
-				}
-			},
-			/**
-			 * 设置 rgb 颜色
-			 */
-			setColor() {
-				const rgb = this.HSBToRGB(this.hsb);
-				this.rgba.r = rgb.r;
-				this.rgba.g = rgb.g;
-				this.rgba.b = rgb.b;
-			},
-			/**
-			 * 设置二进制颜色
-			 * @param {Object} rgb
-			 */
-			setValue(rgb) {
-				this.hex = '#' + this.rgbToHex(rgb);
-			},
-			setControl(index, x) {
-				const {
-					top,
-					left,
-					width,
-					height
-				} = this.position[index];
-
-				if (index === 1) {
-					this.hsb.h = parseInt((360 * x) / width);
-					this.bgcolor = this.HSBToRGB({
-						h: this.hsb.h,
-						s: 100,
-						b: 100
-					});
-					this.setColor()
-				} else {
-					this.rgba.a = (x / width).toFixed(1);
-				}
-				this.setValue(this.rgba);
-			},
-			/**
-			 * rgb 转 二进制 hex
-			 * @param {Object} rgb
-			 */
-			rgbToHex(rgb) {
-				let hex = [rgb.r.toString(16), rgb.g.toString(16), rgb.b.toString(16)];
-				hex.map(function(str, i) {
-					if (str.length == 1) {
-						hex[i] = '0' + str;
-					}
-				});
-				return hex.join('');
-			},
-			setColorBySelect(getrgb) {
-				const {
-					r,
-					g,
-					b,
-					a
-				} = getrgb;
-				let rgb = {}
-				rgb = {
-					r: r ? parseInt(r) : 0,
-					g: g ? parseInt(g) : 0,
-					b: b ? parseInt(b) : 0,
-					a: a ? a : 0,
-				};
-				this.rgba = rgb;
-				this.hsb = this.rgbToHsb(rgb);
-				this.changeViewByHsb();
-			},
-			changeViewByHsb() {
-				const [a, b, c] = this.position;
-				this.site[0].left = parseInt(this.hsb.s * a.width / 100);
-				this.site[0].top = parseInt((100 - this.hsb.b) * a.height / 100);
-				this.setColor(this.hsb.h);
-				this.setValue(this.rgba);
-				this.bgcolor = this.HSBToRGB({
-					h: this.hsb.h,
-					s: 100,
-					b: 100
-				});
-
-				this.site[1].left = this.hsb.h / 360 * b.width;
-				this.site[2].left = this.rgba.a * c.width;
-
-			},
-			/**
-			 * hsb 转 rgb
-			 * @param {Object} 颜色模式  H(hues)表示色相，S(saturation)表示饱和度，B（brightness）表示亮度
-			 */
-			HSBToRGB(hsb) {
-				let rgb = {};
-				let h = Math.round(hsb.h);
-				let s = Math.round((hsb.s * 255) / 100);
-				let v = Math.round((hsb.b * 255) / 100);
-				if (s == 0) {
-					rgb.r = rgb.g = rgb.b = v;
-				} else {
-					let t1 = v;
-					let t2 = ((255 - s) * v) / 255;
-					let t3 = ((t1 - t2) * (h % 60)) / 60;
-					if (h == 360) h = 0;
-					if (h < 60) {
-						rgb.r = t1;
-						rgb.b = t2;
-						rgb.g = t2 + t3;
-					} else if (h < 120) {
-						rgb.g = t1;
-						rgb.b = t2;
-						rgb.r = t1 - t3;
-					} else if (h < 180) {
-						rgb.g = t1;
-						rgb.r = t2;
-						rgb.b = t2 + t3;
-					} else if (h < 240) {
-						rgb.b = t1;
-						rgb.r = t2;
-						rgb.g = t1 - t3;
-					} else if (h < 300) {
-						rgb.b = t1;
-						rgb.g = t2;
-						rgb.r = t2 + t3;
-					} else if (h < 360) {
-						rgb.r = t1;
-						rgb.g = t2;
-						rgb.b = t1 - t3;
-					} else {
-						rgb.r = 0;
-						rgb.g = 0;
-						rgb.b = 0;
-					}
-				}
-				return {
-					r: Math.round(rgb.r),
-					g: Math.round(rgb.g),
-					b: Math.round(rgb.b)
-				};
-			},
-			rgbToHsb(rgb) {
-				let hsb = {
-					h: 0,
-					s: 0,
-					b: 0
-				};
-				let min = Math.min(rgb.r, rgb.g, rgb.b);
-				let max = Math.max(rgb.r, rgb.g, rgb.b);
-				let delta = max - min;
-				hsb.b = max;
-				hsb.s = max != 0 ? 255 * delta / max : 0;
-				if (hsb.s != 0) {
-					if (rgb.r == max) hsb.h = (rgb.g - rgb.b) / delta;
-					else if (rgb.g == max) hsb.h = 2 + (rgb.b - rgb.r) / delta;
-					else hsb.h = 4 + (rgb.r - rgb.g) / delta;
-				} else hsb.h = -1;
-				hsb.h *= 60;
-				if (hsb.h < 0) hsb.h = 0;
-				hsb.s *= 100 / 255;
-				hsb.b *= 100 / 255;
-				return hsb;
-			},
-			getSelectorQuery() {
-				const views = uni.createSelectorQuery().in(this);
-				views
-					.selectAll('.boxs')
-					.boundingClientRect(data => {
-						if (!data || data.length === 0) {
-							setTimeout(() => this.getSelectorQuery(), 20)
-							return
-						}
-						this.position = data;
-						// this.site[0].top = data[0].height;
-						// this.site[0].left = 0;
-						// this.site[1].left = data[1].width;
-						// this.site[2].left = data[2].width;
-						this.setColorBySelect(this.rgba);
-					})
-					.exec();
-			}
-		},
-		watch: {
-			spareColor(newVal) {
-				this.colorList = newVal;
-			}
-		}
-	};
-</script>
-
-<style>
-	.t-wrapper {
-		position: fixed;
-		top: 0;
-		bottom: 0;
-		left: 0;
-		width: 100%;
-		box-sizing: border-box;
-		z-index: 9999;
-	}
-
-	.t-box {
-		width: 100%;
-		position: absolute;
-		bottom: 0;
-		padding: 30upx 0;
-		padding-top: 0;
-		background: #fff;
-		transition: all 0.3s;
-		transform: translateY(100%);
-	}
-
-	.t-box.active {
-		transform: translateY(0%);
-	}
-
-	.t-header {
-		display: flex;
-		justify-content: space-between;
-		width: 100%;
-		height: 100upx;
-		border-bottom: 1px #eee solid;
-		box-shadow: 1px 0 2px rgba(0, 0, 0, 0.1);
-		background: #fff;
-	}
-
-	.t-header-button {
-		display: flex;
-		align-items: center;
-		width: 150upx;
-		height: 100upx;
-		font-size: 30upx;
-		color: #666;
-		padding-left: 20upx;
-	}
-
-	.t-header-button:last-child {
-		justify-content: flex-end;
-		padding-right: 20upx;
-	}
-
-	.t-mask {
-		position: absolute;
-		top: 0;
-		left: 0;
-		right: 0;
-		bottom: 0;
-		background: rgba(0, 0, 0, 0.6);
-		z-index: -1;
-		transition: all 0.3s;
-		opacity: 0;
-	}
-
-	.t-mask.active {
-		opacity: 1;
-	}
-
-	.t-color__box {
-		position: relative;
-		height: 400upx;
-		background: rgb(255, 0, 0);
-		overflow: hidden;
-		box-sizing: border-box;
-		margin: 0 20upx;
-		margin-top: 20upx;
-		box-sizing: border-box;
-	}
-
-	.t-background {
-		position: absolute;
-		top: 0;
-		left: 0;
-		right: 0;
-		bottom: 0;
-		background: linear-gradient(to right, #fff, rgba(255, 255, 255, 0));
-	}
-
-	.t-color-mask {
-		position: absolute;
-		top: 0;
-		left: 0;
-		right: 0;
-		bottom: 0;
-		width: 100%;
-		height: 400upx;
-		background: linear-gradient(to top, #000, rgba(0, 0, 0, 0));
-	}
-
-	.t-pointer {
-		position: absolute;
-		bottom: -8px;
-		left: -8px;
-		z-index: 2;
-		width: 15px;
-		height: 15px;
-		border: 1px #fff solid;
-		border-radius: 50%;
-	}
-
-	.t-show-color {
-		width: 100upx;
-		height: 50upx;
-	}
-
-	.t-control__box {
-		margin-top: 50upx;
-		width: 100%;
-		display: flex;
-		padding-left: 20upx;
-		box-sizing: border-box;
-	}
-
-	.t-control__color {
-		flex-shrink: 0;
-		width: 100upx;
-		height: 100upx;
-		border-radius: 50%;
-		background-color: #fff;
-		background-image: linear-gradient(45deg, #eee 25%, transparent 25%, transparent 75%, #eee 75%, #eee),
-			linear-gradient(45deg, #eee 25%, transparent 25%, transparent 75%, #eee 75%, #eee);
-		background-size: 36upx 36upx;
-		background-position: 0 0, 18upx 18upx;
-		border: 1px #eee solid;
-		overflow: hidden;
-	}
-
-	.t-control__color-content {
-		width: 100%;
-		height: 100%;
-	}
-
-	.t-control-box__item {
-		display: flex;
-		flex-direction: column;
-		justify-content: space-between;
-		width: 100%;
-		padding: 0 30upx;
-	}
-
-	.t-controller {
-		position: relative;
-		width: 100%;
-		height: 16px;
-		background-color: #fff;
-		background-image: linear-gradient(45deg, #eee 25%, transparent 25%, transparent 75%, #eee 75%, #eee),
-			linear-gradient(45deg, #eee 25%, transparent 25%, transparent 75%, #eee 75%, #eee);
-		background-size: 32upx 32upx;
-		background-position: 0 0, 16upx 16upx;
-	}
-
-	.t-hue {
-		width: 100%;
-		height: 100%;
-		background: linear-gradient(to right, #f00 0%, #ff0 17%, #0f0 33%, #0ff 50%, #00f 67%, #f0f 83%, #f00 100%);
-	}
-
-	.t-transparency {
-		width: 100%;
-		height: 100%;
-		background: linear-gradient(to right, rgba(0, 0, 0, 0) 0%, rgb(0, 0, 0));
-	}
-
-	.t-circle {
-		position: absolute;
-		/* right: -10px; */
-		top: -2px;
-		width: 20px;
-		height: 20px;
-		box-sizing: border-box;
-		border-radius: 50%;
-		background: #fff;
-		box-shadow: 0 0 2px 1px rgba(0, 0, 0, 0.1);
-	}
-
-	.t-result__box {
-		margin-top: 20upx;
-		padding: 10upx;
-		width: 100%;
-		display: flex;
-		box-sizing: border-box;
-	}
-
-	.t-result__item {
-		display: flex;
-		flex-direction: column;
-		align-items: center;
-		justify-content: center;
-		padding: 10upx;
-		width: 100%;
-		box-sizing: border-box;
-	}
-
-	.t-result__box-input {
-		padding: 10upx 0;
-		width: 100%;
-		font-size: 28upx;
-		box-shadow: 0 0 1px 1px rgba(0, 0, 0, 0.1);
-		color: #999;
-		text-align: center;
-		background: #fff;
-	}
-
-	.t-result__box-text {
-		margin-top: 10upx;
-		font-size: 28upx;
-		line-height: 2;
-	}
-
-	.t-select {
-		flex-shrink: 0;
-		width: 150upx;
-		padding: 0 30upx;
-	}
-
-	.t-select .t-result__box-input {
-		border-radius: 10upx;
-		border: none;
-		color: #999;
-		box-shadow: 1px 1px 2px 1px rgba(0, 0, 0, 0.1);
-		background: #fff;
-	}
-
-	.t-select .t-result__box-input:active {
-		box-shadow: 0px 0px 1px 0px rgba(0, 0, 0, 0.1);
-	}
-
-	.t-alternative {
-		display: flex;
-		flex-wrap: wrap;
-		/* justify-content: space-between; */
-		width: 100%;
-		padding-right: 10upx;
-		box-sizing: border-box;
-	}
-
-	.t-alternative__item {
-		margin-left: 12upx;
-		margin-top: 10upx;
-		width: 50upx;
-		height: 50upx;
-		border-radius: 10upx;
-		background-color: #fff;
-		background-image: linear-gradient(45deg, #eee 25%, transparent 25%, transparent 75%, #eee 75%, #eee),
-			linear-gradient(45deg, #eee 25%, transparent 25%, transparent 75%, #eee 75%, #eee);
-		background-size: 36upx 36upx;
-		background-position: 0 0, 18upx 18upx;
-		border: 1px #eee solid;
-		overflow: hidden;
-	}
-
-	.t-alternative__item-content {
-		width: 50upx;
-		height: 50upx;
-		background: rgba(255, 0, 0, 0.5);
-	}
-
-	.t-alternative__item:active {
-		transition: all 0.3s;
-		transform: scale(1.1);
-	}
-</style>
@@ -0,0 +1,252 @@
+<template>
+	<view class="vote-card" @click="$emit('on-click',vote)">
+		<view class="vote-card-head flex">
+			<view class="left flex flex-center w-full">
+				<view class="flex-shrink">
+					<tm-tags color="light-blue" :shadow="0" rounded size="s" model="fill">{{ vote.spec._uh_type}}</tm-tags>
+				</view>
+				<view class="title text-overflow">
+					{{ vote.spec.title }}
+				</view>
+			</view>
+		</view>
+		<view class="vote-card-body w-full">
+			<view v-if="vote.spec.remark" class="remark text-overflow-2 text-size-s">
+				{{vote.spec.remark}}
+			</view>
+		</view>
+		<view class="vote-card-foot flex flex-between">
+			<view class="left flex">
+				<tm-tags :color="vote.spec._uh_state.color" size="s" rounded :shadow="0"
+					model="text">{{vote.spec._uh_state.state}}</tm-tags>
+
+				<tm-tags v-if="vote.spec.isVoted" color="blue" rounded size="s" model="text">已投票</tm-tags>
+
+				<tm-tags v-if="vote.spec.timeLimit==='permanent'" color="grey-darken-2" rounded size="s"
+					model="text">结束时间：永久有效 </tm-tags>
+				<tm-tags v-else color="grey-darken-2" rounded size="s" model="text">
+					<template
+						v-if="vote.spec._uh_state.state=='未开始'">开始时间：{{ {d: vote.spec.startDate, f: 'yyyy-MM-dd HH:mm'} | formatTime }}
+					</template>
+					<template v-else>结束时间：{{ {d: vote.spec.endDate, f: 'yyyy-MM-dd HH:mm'} | formatTime }}
+					</template>
+				</tm-tags>
+			</view>
+
+			<view v-if="false" class="right flex flex-end">
+				<tm-tags v-if="false" color="grey-darken-2" rounded size="s" model="text">{{ vote.stats.voteCount }}
+					人已参与</tm-tags>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	import tmGroupradio from '@/tm-vuetify/components/tm-groupradio/tm-groupradio.vue';
+	import tmRadio from '@/tm-vuetify/components/tm-radio/tm-radio.vue';
+	import tmGroupcheckbox from '@/tm-vuetify/components/tm-groupcheckbox/tm-groupcheckbox.vue';
+	import tmCheckbox from '@/tm-vuetify/components/tm-checkbox/tm-checkbox.vue';
+	import tmButton from '@/tm-vuetify/components/tm-button/tm-button.vue';
+	import tmTags from '@/tm-vuetify/components/tm-tags/tm-tags.vue';
+
+	export default {
+		name: "VoteCard",
+		options: {
+			virtualHost: true,
+			styleIsolation: 'shared'
+		},
+		components: {
+			tmGroupradio,
+			tmRadio,
+			tmGroupcheckbox,
+			tmCheckbox,
+			tmButton,
+			tmTags
+		},
+		props: {
+			vote: {
+				type: Object,
+				default: () => ({})
+			},
+			index: {
+				type: Number,
+				default: 0
+			},
+			showOptions: {
+				type: Boolean,
+				default: false
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.w-full {
+		width: 100%;
+	}
+
+	.wp-50 {
+		width: 50%;
+	}
+
+	.vote-card {
+		display: flex;
+		flex-direction: column;
+		box-sizing: border-box;
+		margin: 0 24rpx;
+		padding: 24rpx;
+		border-radius: 12rpx;
+		background-color: #ffff;
+		box-shadow: 0rpx 2rpx 12rpx rgba(0, 0, 0, 0.035);
+		overflow: hidden;
+		margin-bottom: 24rpx;
+		// border: 1px solid #eee;
+	}
+
+	.vote-card-head {
+		margin-bottom: 12rpx;
+		display: flex;
+		align-items: center;
+		justify-content: space-between;
+
+		.left {
+			.title {
+				font-size: 28rpx;
+				font-weight: bold;
+			}
+		}
+	}
+
+	.vote-card-body {
+
+		.remark {
+			box-sizing: border-box;
+			padding-top: 0;
+			color: rgba(0, 0, 0, 0.75);
+			margin-bottom: 12rpx;
+		}
+	}
+
+	.vote-card-foot {
+		box-sizing: border-box;
+		padding-top: 6px;
+		margin-top: 6px;
+		border-top: 2rpx solid #F7F7F7;
+
+		.left {}
+	}
+
+
+	.single {
+		::v-deep {
+			.tm-groupradio {
+				width: 100%;
+				box-sizing: border-box;
+				display: flex;
+				flex-wrap: wrap;
+				gap: 12rpx 0;
+			}
+
+			.tm-checkbox {
+				box-sizing: border-box;
+				display: block;
+				padding: 0 12rpx;
+				width: 50%;
+			}
+
+			.tm-button-label {
+				width: 100%;
+			}
+		}
+	}
+
+	.multiple {
+		::v-deep {
+			.tm-groupcheckbox {
+				width: 100%;
+				box-sizing: border-box;
+				display: flex;
+				flex-wrap: wrap;
+				gap: 12rpx 0;
+			}
+
+			.tm-checkbox {
+				box-sizing: border-box;
+				display: block;
+				padding: 0 12rpx;
+				width: 50%;
+			}
+
+			.tm-button-label {
+				width: 100%;
+			}
+		}
+	}
+
+	.pk {
+		box-sizing: border-box;
+		width: 100%;
+		padding: 0 12rpx;
+
+		::v-deep {
+			.tm-groupradio {
+				display: flex;
+				width: 100%;
+			}
+
+			.tm-checkbox {
+				flex-grow: 1;
+				min-width: 30% !important;
+				max-width: 70% !important;
+			}
+
+			.radio-item {
+				position: relative;
+
+				.selected {
+					z-index: 10;
+				}
+			}
+
+			.radio-left {}
+
+			.radio-right {}
+
+			.option-item {
+				width: 100%;
+				padding: 12rpx 24rpx;
+				border-radius: 12rpx;
+			}
+
+			.option-item-left {
+				background: linear-gradient(90deg, #3B82F6, #60A5FA);
+				color: white;
+				clip-path: polygon(0 0, calc(100% - 40rpx) 0, 100% 100%, 0 100%);
+			}
+
+			.option-item-right {
+				background: linear-gradient(90deg, #F87171, #EF4444);
+				color: white;
+				clip-path: polygon(0 0, 100% 0, 100% 100%, 40rpx 100%);
+				text-align: right;
+			}
+
+			.option-foot {
+				width: 100%;
+				margin-top: 6rpx;
+				font-size: 24rpx;
+				color: #666;
+
+				.left {
+					box-sizing: border-box;
+					padding-right: 24rpx;
+				}
+
+				.right {
+					box-sizing: border-box;
+					padding-left: 24rpx;
+				}
+			}
+		}
+	}
+</style>
@@ -1,14 +1,55 @@
 // 应用设置存储key值
 export const _AppConfigKey = 'APP_GLOBAL_CONFIGS';
+export const _AppMockJsonKey = 'APP_GLOBAL_MOCK_JSON';

 // 默认的应用设置
 export const DefaultAppConfigs = {
+	basicConfig: {
+		tokenConfig: {
+			personalToken: "",
+		}
+	},
 	loveConfig: {},
 	imagesConfig: {},
 	authorConfig: {},
 	appConfig: {},
-	pluginConfig: {},
-	pageConfig:{}
+	pluginConfig: {
+		votePlugin: {},
+		toolsPlugin: {},
+		linksPlugin:{},
+		linksSubmitPlugin: {},
+		doubanPlugin: {
+			position: 'bottom'
+		},
+	},
+	pageConfig: {
+		homeConfig: {
+			pageTitle: "首页",
+			useCategory: true,
+			bannerConfig: {
+				enabled: true,
+				showTitle: true,
+				showIndicator: true,
+				height: "400rpx",
+				dotPosition: "right",
+				type: "post",
+				list: []
+			}
+		},
+		categoryConfig: {
+			type: "list"
+		},
+		momentConfig: {
+			useTagRandomColor: true
+		}
+	},
+	auditConfig: {
+		auditModeEnabled: false,
+		auditModeData: {
+			jsonUrl: "",
+			jsonData: ""
+		}
+	}
 }

 /**
@@ -28,3 +69,22 @@ export const getAppConfigs = () => {
 export const setAppConfigs = (configs) => {
 	uni.setStorageSync(_AppConfigKey, JSON.stringify(configs))
 }
+
+
+/**
+ * 获取应用模拟数据
+ */
+export const getAppMockJson = () => {
+	let json = uni.getStorageSync(_AppMockJsonKey)
+	if (json) return JSON.parse(json)
+
+	uni.setStorageSync(_AppMockJsonKey, JSON.stringify({}))
+	return {};
+}
+
+/**
+ * 保存应用模拟数据
+ */
+export const setAppMockJson = (json) => {
+	uni.setStorageSync(_AppMockJsonKey, JSON.stringify(json))
+}
@@ -1,16 +0,0 @@
-/** 配置后台管理员token */
-const HaloTokenConfig = Object.freeze({
-	
-	/** 基础请求域名：你的Halo博客基础域名 */
-	BASE_API: "https://demo.halo.run",
-	// BASE_API: "https://blog.925i.cn",
-
-
-	/** 管理员token */
-	systemToken: ``,
-	/** 匿名用户token */
-	anonymousToken: ``
-})
-
-
-export default HaloTokenConfig;
@@ -0,0 +1,12 @@
+/** 应用基础配置 */
+const UHaloBaseConfig = Object.freeze({
+
+    /** 基础请求域名：你的Halo博客基础域名，注意，域名后面不能带有斜杠【/】  */
+    // BASE_API: "",
+    // 示例：
+    BASE_API: "http://localhost:8090",
+ 
+    // todo：可能有其他配置
+})
+
+export default UHaloBaseConfig;
@@ -0,0 +1,177 @@
+{
+  "home": {
+    "bannerList": [
+      {
+        "title": "uni-halo（2.0）开源啦！！！",
+        "desc": "uni-halo 2.0 已独立兼容 Halo2.x 应用，欢迎小伙伴们体验。",
+        "cover": "/upload/uni_halo_ad_cover.png",
+        "time": "2024-05-25 08:59:00"
+      },
+      {
+        "title": "uni-halo（2.0）开源啦！！！",
+        "desc": "uni-halo 2.0 已独立兼容 Halo2.x 应用，欢迎小伙伴们体验。",
+        "cover": "/upload/uni_halo_ad_cover.png",
+        "time": "2024-05-25 08:59:00"
+      },
+      {
+        "title": "uni-halo（2.0）开源啦！！！",
+        "desc": "uni-halo 2.0 已独立兼容 Halo2.x 应用，欢迎小伙伴们体验。",
+        "cover": "/upload/uni_halo_ad_cover.png",
+        "time": "2024-05-25 08:59:00"
+      },
+      {
+        "title": "uni-halo（2.0）开源啦！！！",
+        "desc": "uni-halo 2.0 已独立兼容 Halo2.x 应用，欢迎小伙伴们体验。",
+        "cover": "/upload/uni_halo_ad_cover.png",
+        "time": "2024-05-25 08:59:00"
+      },
+      {
+        "title": "uni-halo（2.0）开源啦！！！",
+        "desc": "uni-halo 2.0 已独立兼容 Halo2.x 应用，欢迎小伙伴们体验。",
+        "cover": "/upload/uni_halo_ad_cover.png",
+        "time": "2024-05-25 08:59:00"
+      }
+    ],
+    "categoryList": [
+      {
+        "title": "uni-halo",
+        "desc": "",
+        "cover": "/upload/uni_halo_ad_cover.png",
+        "time": ""
+      },
+      {
+        "title": "uni-halo",
+        "desc": "",
+        "cover": "/upload/uni_halo_ad_cover.png",
+        "time": ""
+      },
+      {
+        "title": "uni-halo",
+        "desc": "",
+        "cover": "/upload/uni_halo_ad_cover.png",
+        "time": ""
+      },
+      {
+        "title": "uni-halo",
+        "desc": "",
+        "cover": "/upload/uni_halo_ad_cover.png",
+        "time": ""
+      }
+    ],
+    "postList": [
+      {
+        "title": "uni-halo（2.0）开源啦！！！",
+        "desc": "uni-halo 2.0 已独立兼容 Halo2.x 应用，欢迎小伙伴们体验。",
+        "cover": "/upload/uni_halo_ad_cover.png",
+        "time": "2024-05-25 08:59:00"
+      },
+      {
+        "title": "uni-halo（2.0）开源啦！！！",
+        "desc": "uni-halo 2.0 已独立兼容 Halo2.x 应用，欢迎小伙伴们体验。",
+        "cover": "/upload/uni_halo_ad_cover.png",
+        "time": "2024-05-25 08:59:00"
+      },
+      {
+        "title": "uni-halo（2.0）开源啦！！！",
+        "desc": "uni-halo 2.0 已独立兼容 Halo2.x 应用，欢迎小伙伴们体验。",
+        "cover": "/upload/uni_halo_ad_cover.png",
+        "time": "2024-05-25 08:59:00"
+      },
+      {
+        "title": "uni-halo（2.0）开源啦！！！",
+        "desc": "uni-halo 2.0 已独立兼容 Halo2.x 应用，欢迎小伙伴们体验。",
+        "cover": "/upload/uni_halo_ad_cover.png",
+        "time": "2024-05-25 08:59:00"
+      },
+      {
+        "title": "uni-halo（2.0）开源啦！！！",
+        "desc": "uni-halo 2.0 已独立兼容 Halo2.x 应用，欢迎小伙伴们体验。",
+        "cover": "/upload/uni_halo_ad_cover.png",
+        "time": "2024-05-25 08:59:00"
+      }
+    ]
+  },
+  "category": {
+    "list": [
+      {
+        "title": "uni-halo",
+        "desc": "",
+        "cover": "/upload/uni_halo_ad_cover.png",
+        "time": ""
+      },
+      {
+        "title": "uni-halo",
+        "desc": "",
+        "cover": "/upload/uni_halo_ad_cover.png",
+        "time": ""
+      },
+      {
+        "title": "uni-halo",
+        "desc": "",
+        "cover": "/upload/uni_halo_ad_cover.png",
+        "time": ""
+      },
+      {
+        "title": "uni-halo",
+        "desc": "",
+        "cover": "/upload/uni_halo_ad_cover.png",
+        "time": ""
+      }
+    ]
+  },
+  "moments": {
+    "list": [
+      {
+        "content": "你好啊，这是我的一条生活记录",
+        "time": "2024-05-25 08:59:00",
+        "images": [
+          "/upload/uni_halo_ad_cover.png",
+          "/upload/uni_halo_ad_cover.png",
+          "/upload/uni_halo_ad_cover.png"
+        ]
+      }
+    ]
+  },
+  "gallery": {
+    "list": [
+      "/upload/uni_halo_ad_cover.png",
+      "/upload/uni_halo_ad_cover.png",
+      "/upload/uni_halo_ad_cover.png",
+      "/upload/uni_halo_ad_cover.png"
+    ]
+  },
+  "archives": {
+    "list": [
+      {
+        "title": "uni-halo（2.0）开源啦！！！",
+        "desc": "uni-halo 2.0 已独立兼容 Halo2.x 应用，欢迎小伙伴们体验。",
+        "cover": "/upload/uni_halo_ad_cover.png",
+        "time": "2024-05-25 08:59:00"
+      },
+      {
+        "title": "uni-halo（2.0）开源啦！！！",
+        "desc": "uni-halo 2.0 已独立兼容 Halo2.x 应用，欢迎小伙伴们体验。",
+        "cover": "/upload/uni_halo_ad_cover.png",
+        "time": "2024-05-25 08:59:00"
+      },
+      {
+        "title": "uni-halo（2.0）开源啦！！！",
+        "desc": "uni-halo 2.0 已独立兼容 Halo2.x 应用，欢迎小伙伴们体验。",
+        "cover": "/upload/uni_halo_ad_cover.png",
+        "time": "2024-05-25 08:59:00"
+      },
+      {
+        "title": "uni-halo（2.0）开源啦！！！",
+        "desc": "uni-halo 2.0 已独立兼容 Halo2.x 应用，欢迎小伙伴们体验。",
+        "cover": "/upload/uni_halo_ad_cover.png",
+        "time": "2024-05-25 08:59:00"
+      },
+      {
+        "title": "uni-halo（2.0）开源啦！！！",
+        "desc": "uni-halo 2.0 已独立兼容 Halo2.x 应用，欢迎小伙伴们体验。",
+        "cover": "/upload/uni_halo_ad_cover.png",
+        "time": "2024-05-25 08:59:00"
+      }
+    ]
+  }
+}
@@ -4,6 +4,7 @@ import Vue from "vue";
 // 挂载全局工具类
 import utils from "./utils/index.js";
 Vue.prototype.$utils = utils;
+uni.$utils = utils;

 // 全局统一样式的对话框
 import Fy from '@/js_sdk/fy-showModal/index.js'
@@ -25,28 +26,6 @@ for (let fKey in AppFilters) {
 import tmVuetify from "./tm-vuetify";
 Vue.use(tmVuetify);
 
-// i18n部分的配置
-// 引入语言包，注意路径
-import Chinese from "@/common/locales/zh.js";
-import English from "@/common/locales/en.js";
-
-// 引入并使用vue-i18n
-import VueI18n from "vue-i18n";
-Vue.use(VueI18n);
-
-// 构造i18n对象
-const i18n = new VueI18n({
-	// 默认语言，这里的local属性，对应message中的zh、en属性
-	locale: uni.getStorageSync("Default_Lang") || "zh",
-	// 引入语言文件
-	messages: {
-		// 这里的属性名是任意的，您也可以把zh设置为cn等，只是后续切换语言时
-		// 要标识这里的语言属性，如：this.$i18n.locale = zh|en|cn|xxx
-		zh: Chinese,
-		en: English,
-	},
-});
-
 // 引入请求库
 import {
 	http
@@ -57,16 +36,12 @@ Vue.prototype.$http = http;
 import ApiManager from '@/api/index.js'
 Vue.use(ApiManager);

-import HaloTokenConfig from '@/config/token.config.js'
+import HaloTokenConfig from '@/config/uhalo.config.js'
 Vue.prototype.$baseApiUrl = HaloTokenConfig.BASE_API

-// 由于微信小程序的运行机制问题，需声明如下一行，H5和APP非必填
-Vue.prototype._i18n = i18n;
-
 Vue.config.productionTip = false;
 App.mpType = "app";
 const app = new Vue({
-	i18n,
 	...App,
 });

@@ -2,8 +2,8 @@
    "name" : "uni-halo",
    "appid" : "__UNI__5748B6E",
    "description" : "uni-halo博客：基于halo开源博客系统API开发的多端博客。",
-    "versionName" : "1.0.0",
-    "versionCode" : 100,
+    "versionName" : "2.0.10",
+    "versionCode" : 210,
    "transformPx" : false,
    /* 5+App特有相关 */
    "app-plus" : {
@@ -112,7 +112,7 @@
            }
        },
        "uniStatistics" : {
-            "enable" : true
+            "enable" : false
        }
    },
    /* 快应用特有相关 */
@@ -126,29 +126,29 @@
        },
        "usingComponents" : true,
        "uniStatistics" : {
-            "enable" : true
+            "enable" : false
        }
    },
    "mp-alipay" : {
        "usingComponents" : true,
        "uniStatistics" : {
-            "enable" : true
+            "enable" : false
        }
    },
    "mp-baidu" : {
        "usingComponents" : true,
        "uniStatistics" : {
-            "enable" : true
+            "enable" : false
        }
    },
    "mp-toutiao" : {
        "usingComponents" : true,
        "uniStatistics" : {
-            "enable" : true
+            "enable" : false
        }
    },
    "uniStatistics" : {
-        "enable" : true,
+        "enable" : false,
        "version" : "2"
    },
    "vueVersion" : "2",
@@ -158,7 +158,7 @@
            "disableHostCheck" : true,
            "proxy" : {
                "/apis" : {
-                    "target" : "https://demo.halo.run",
+                    "target" : "https://blog.xiaoxiaomo.cn",
                    "changeOrigin" : true,
                    "secure" : false,
                    "pathRewrite" : {
@@ -174,7 +174,11 @@
            }
        },
        "uniStatistics" : {
-            "enable" : true
+            "enable" : false
+        },
+        "router" : {
+            "base" : "/uni-halo/",
+            "mode" : "history"
        }
    },
    "_spaceID" : "699a26a5-a6cd-4b54-b603-5155b312a5f5",
@@ -186,32 +190,47 @@
            "es6" : true
        },
        "uniStatistics" : {
-            "enable" : true
+            "enable" : false
        }
    },
    "mp-jd" : {
        "uniStatistics" : {
-            "enable" : true
+            "enable" : false
        }
    },
    "mp-kuaishou" : {
        "uniStatistics" : {
-            "enable" : true
+            "enable" : false
        }
    },
    "mp-lark" : {
        "uniStatistics" : {
-            "enable" : true
+            "enable" : false
        }
    },
    "quickapp-webview-huawei" : {
        "uniStatistics" : {
-            "enable" : true
+            "enable" : false
        }
    },
    "quickapp-webview-union" : {
        "uniStatistics" : {
-            "enable" : true
+            "enable" : false
+        }
+    },
+    "app-harmony" : {
+        "uniStatistics" : {
+            "enable" : false
+        }
+    },
+    "mp-harmony" : {
+        "uniStatistics" : {
+            "enable" : false
+        }
+    },
+    "mp-xhs" : {
+        "uniStatistics" : {
+            "enable" : false
        }
    }
 }
@@ -1,6 +1,6 @@
 {
  "name": "uni-halo",
-  "version": "1.0.0",
+  "version": "2.0.10",
  "description": "<p align=\"center\">\r     <img alt=\"logo\" src=\"https://b.925i.cn/uni_halo/uni_halo_logo.png\" width=\"120\" height=\"120\" style=\"margin-bottom: 10px;\">\r </p>\r <h3 align=\"center\" style=\"margin: 30px 0 30px;font-weight: bold;font-size:40px;\">uni-halo</h3>\r <h3 align=\"center\">uni-halo 基于Halo一款现代化的开源博客/CMS系统API开发的可多端编译应用</h3>",
  "repository": {
    "type": "git",
@@ -17,9 +17,6 @@
    "url": "https://gitee.com/ialley-workshop-open/uni-halo/issues"
  },
  "homepage": "https://uni-halo.925i.cn",
-  "devDependencies": {
-    "vue-i18n": "^9.1.10"
-  },
  "dependencies": {
    "qs": "^6.12.1"
  }
@@ -1,336 +1,375 @@
 {
-  "pages": [
-    {
-      "path": "pages/index/index",
-      "style": {
-        "navigationBarTitleText": "uni-halo",
-        "enablePullDownRefresh": false,
-        "navigationStyle": "custom"
-      }
-    },
-    {
-      "path": "pages/tabbar/home/home",
-      "style": {
-        "navigationBarTitleText": "首页",
-        "enablePullDownRefresh": true,
-        "navigationStyle": "custom",
-        "app-plus": {
-          "pullToRefresh": {
-            "color": "#03a9f4",
-            "style": "circle"
-          }
-        }
-      }
-    },
-    {
-      "path": "pages/tabbar/category/category",
-      "style": {
-        "navigationBarTitleText": "分类",
-        "enablePullDownRefresh": true,
-        "app-plus": {
-          "pullToRefresh": {
-            "color": "#03a9f4",
-            "style": "circle"
-          }
-        }
-      }
-    },
-    {
-      "path": "pages/tabbar/gallery/gallery",
-      "style": {
-        "navigationBarTitleText": "图库",
-        "enablePullDownRefresh": true,
-        "app-plus": {
-          "pullToRefresh": {
-            "color": "#03a9f4",
-            "style": "circle"
-          }
-        }
-      }
-    },
-    {
-      "path": "pages/tabbar/moments/moments",
-      "style": {
-        "navigationBarTitleText": "瞬间",
-        "enablePullDownRefresh": true,
-        "app-plus": {
-          "pullToRefresh": {
-            "color": "#03a9f4",
-            "style": "circle"
-          }
-        }
-      }
-    },
-    {
-      "path": "pages/tabbar/about/about",
-      "style": {
-        "navigationBarTitleText": "关于",
-        "navigationStyle": "custom",
-        "enablePullDownRefresh": true,
-        "app-plus": {
-          "pullToRefresh": {
-            "color": "#03a9f4",
-            "style": "circle"
-          }
-        }
-      }
-    },
-    {
-      "path": "uni_modules/uni-upgrade-center-app/pages/upgrade-popup",
-      "style": {
-        "disableScroll": true,
-        "app-plus": {
-          "backgroundColorTop": "transparent",
-          "background": "transparent",
-          "titleNView": false,
-          "scrollIndicator": false,
-          "popGesture": "none",
-          "animationType": "fade-in",
-          "animationDuration": 200
-        }
-      }
-    }
-  ],
-  //此配置为小程序的分包加载机制。在5+App里始终为整包。
-  "subPackages": [
-    {
-      "root": "pagesA",
-      "pages": [
-        {
-          "path": "start/start",
-          "style": {
-            "navigationBarTitleText": "uni-halo",
-            "enablePullDownRefresh": false,
-            "navigationStyle": "custom"
-          }
-        },
-        {
-          "path": "article-detail/article-detail",
-          "style": {
-            "navigationBarTitleText": "内容详情",
-            "enablePullDownRefresh": true,
-            "app-plus": {
-              "pullToRefresh": {
-                "color": "#03a9f4",
-                "style": "circle"
-              }
-            }
-          }
-        },
-        {
-          "path": "love/love",
-          "style": {
-            "navigationBarTitleText": "恋爱日记",
-            "navigationStyle": "custom",
-            "enablePullDownRefresh": false,
-            "app-plus": {
-              "pullToRefresh": {
-                "color": "#03a9f4",
-                "style": "circle"
-              }
-            }
-          }
-        },
-        {
-          "path": "love/list",
-          "style": {
-            "navigationBarTitleText": "恋爱清单",
-            "enablePullDownRefresh": false,
-            "navigationStyle": "custom"
-          }
-        },
-        {
-          "path": "love/album",
-          "style": {
-            "navigationBarTitleText": "恋爱相册",
-            "enablePullDownRefresh": true,
-            "app-plus": {
-              "pullToRefresh": {
-                "color": "#03a9f4",
-                "style": "circle"
-              }
-            }
-          }
-        },
-        {
-          "path": "love/journey",
-          "style": {
-            "navigationBarTitleText": "我们的故事",
-            "navigationStyle": "custom",
-            "enablePullDownRefresh": false
-          }
-        },
-        {
-          "path": "archives/archives",
-          "style": {
-            "navigationBarTitleText": "归档",
-            "enablePullDownRefresh": true,
-            "app-plus": {
-              "pullToRefresh": {
-                "color": "#03a9f4",
-                "style": "circle"
-              }
-            }
-          }
-        },
-        {
-          "path": "friend-links/friend-links",
-          "style": {
-            "navigationBarTitleText": "友情链接",
-            "enablePullDownRefresh": true,
-            "app-plus": {
-              "pullToRefresh": {
-                "color": "#03a9f4",
-                "style": "circle"
-              }
-            }
-          }
-        }, 
-        {
-          "path": "articles/articles",
-          "style": {
-            "navigationBarTitleText": "内容搜索",
-            "enablePullDownRefresh": true,
-            "app-plus": {
-              "pullToRefresh": {
-                "color": "#03a9f4",
-                "style": "circle"
-              }
-            }
-          }
-        },
-        {
-          "path": "category-detail/category-detail",
-          "style": {
-            "navigationBarTitleText": "分类详情",
-            "enablePullDownRefresh": true,
-            "app-plus": {
-              "pullToRefresh": {
-                "color": "#03a9f4",
-                "style": "circle"
-              }
-            }
-          }
-        },
-        {
-          "path": "disclaimers/disclaimers",
-          "style": {
-            "navigationBarTitleText": "免责声明",
-            "enablePullDownRefresh": false
-          }
-        },
-        {
-          "path": "contact/contact",
-          "style": {
-            "navigationBarTitleText": "联系博主",
-            "enablePullDownRefresh": false
-          }
-        },
-        {
-          "path": "about/about",
-          "style": {
-            "navigationBarTitleText": "关于博客",
-            "enablePullDownRefresh": false
-          }
-        },
-        {
-          "path": "setting/setting",
-          "style": {
-            "navigationBarTitleText": "设置",
-            "enablePullDownRefresh": false
-          }
-        },
-        {
-          "path": "tags/tags",
-          "style": {
-            "navigationBarTitleText": "",
-            "enablePullDownRefresh": false
-          }
-        },
-        {
-          "path": "tag-detail/tag-detail",
-          "style": {
-            "navigationBarTitleText": "标签详情",
-            "enablePullDownRefresh": true,
-            "app-plus": {
-              "pullToRefresh": {
-                "color": "#03a9f4",
-                "style": "circle"
-              }
-            }
-          }
-        }, 
-        {
-          "path": "advertise/advertise",
-          "style": {
-            "navigationBarTitleText": "广告页面",
-            "enablePullDownRefresh": false
-          }
-        },
-        {
-          "path": "submit-link/submit-link",
-          "style": {
-            "navigationBarTitleText": "友链提交",
-            "enablePullDownRefresh": false
-          }
-        }
-      ]
-    },
-    {
-      "root": "pagesC",
-      "pages": [
-        {
-          "path": "website/website",
-          "style": {
-            "navigationBarTitleText": "",
-            "enablePullDownRefresh": false
-          }
-        }
-      ]
-    }
-  ],
-  "globalStyle": {
-    "navigationBarTextStyle": "black",
-    "navigationBarTitleText": "uni-halo",
-    "navigationBarBackgroundColor": "#ffffff",
-    "backgroundColor": "#F8F8F8"
-  },
-  "tabBar": {
-    "backgroundColor": "#fff",
-    "borderStyle": "white",
-    "color": "#303133",
-    "selectedColor": "#03a9f4",
-    "list": [
-      {
-        "iconPath": "static/tabbar/select_home.png",
-        "selectedIconPath": "static/tabbar/select_home_active.png",
-        "pagePath": "pages/tabbar/home/home",
-        "text": "首页"
-      },
-      {
-        "iconPath": "static/tabbar/select_category.png",
-        "selectedIconPath": "static/tabbar/select_category_active.png",
-        "pagePath": "pages/tabbar/category/category",
-        "text": "分类"
-      },
-      {
-        "iconPath": "static/tabbar/select_gallery.png",
-        "selectedIconPath": "static/tabbar/select_gallery_active.png",
-        "pagePath": "pages/tabbar/gallery/gallery",
-        "text": "图库"
-      },
-      {
-        "iconPath": "static/tabbar/select_links.png",
-        "selectedIconPath": "static/tabbar/select_links_active.png",
-        "pagePath": "pages/tabbar/moments/moments",
-        "text": "瞬间"
-      },
-      {
-        "iconPath": "static/tabbar/select_mine.png",
-        "selectedIconPath": "static/tabbar/select_mine_active.png",
-        "pagePath": "pages/tabbar/about/about",
-        "text": "关于"
-      }
-    ]
-  }
+	"pages": [{
+			"path": "pages/index/index",
+			"style": {
+				"navigationBarTitleText": "uni-halo",
+				"enablePullDownRefresh": false,
+				"navigationStyle": "custom"
+			}
+		},
+		{
+			"path": "pages/tabbar/home/home",
+			"style": {
+				"navigationBarTitleText": "首页",
+				"enablePullDownRefresh": true,
+				"navigationStyle": "custom",
+				"app-plus": {
+					"pullToRefresh": {
+						"color": "#03a9f4",
+						"style": "circle"
+					}
+				}
+			}
+		},
+		{
+			"path": "pages/tabbar/category/category",
+			"style": {
+				"navigationBarTitleText": "分类",
+				"enablePullDownRefresh": true,
+				"app-plus": {
+					"pullToRefresh": {
+						"color": "#03a9f4",
+						"style": "circle"
+					}
+				}
+			}
+		},
+		{
+			"path": "pages/tabbar/gallery/gallery",
+			"style": {
+				"navigationBarTitleText": "图库",
+				"enablePullDownRefresh": true,
+				"app-plus": {
+					"pullToRefresh": {
+						"color": "#03a9f4",
+						"style": "circle"
+					}
+				}
+			}
+		},
+		{
+			"path": "pages/tabbar/moments/moments",
+			"style": {
+				"navigationBarTitleText": "瞬间",
+				"enablePullDownRefresh": true,
+				"app-plus": {
+					"pullToRefresh": {
+						"color": "#03a9f4",
+						"style": "circle"
+					}
+				}
+			}
+		},
+		{
+			"path": "pages/tabbar/about/about",
+			"style": {
+				"navigationBarTitleText": "关于",
+				"navigationStyle": "custom",
+				"enablePullDownRefresh": true,
+				"app-plus": {
+					"pullToRefresh": {
+						"color": "#03a9f4",
+						"style": "circle"
+					}
+				}
+			}
+		},
+		{
+			"path": "uni_modules/uni-upgrade-center-app/pages/upgrade-popup",
+			"style": {
+				"disableScroll": true,
+				"app-plus": {
+					"backgroundColorTop": "transparent",
+					"background": "transparent",
+					"titleNView": false,
+					"scrollIndicator": false,
+					"popGesture": "none",
+					"animationType": "fade-in",
+					"animationDuration": 200
+				}
+			}
+		}
+	],
+	//此配置为小程序的分包加载机制。在5+App里始终为整包。
+	"subPackages": [{
+			"root": "pagesA",
+			"pages": [{
+					"path": "start/start",
+					"style": {
+						"navigationBarTitleText": "uni-halo",
+						"enablePullDownRefresh": false,
+						"navigationStyle": "custom"
+					}
+				},
+				{
+					"path": "article-detail/article-detail",
+					"style": {
+						"navigationBarTitleText": "内容详情",
+						"enablePullDownRefresh": true,
+						"app-plus": {
+							"pullToRefresh": {
+								"color": "#03a9f4",
+								"style": "circle"
+							}
+						}
+					}
+				},
+				{
+					"path": "love/love",
+					"style": {
+						"navigationBarTitleText": "恋爱日记",
+						"navigationStyle": "custom",
+						"enablePullDownRefresh": false,
+						"app-plus": {
+							"pullToRefresh": {
+								"color": "#03a9f4",
+								"style": "circle"
+							}
+						}
+					}
+				},
+				{
+					"path": "love/list",
+					"style": {
+						"navigationBarTitleText": "恋爱清单",
+						"enablePullDownRefresh": false,
+						"navigationStyle": "custom"
+					}
+				},
+				{
+					"path": "love/album",
+					"style": {
+						"navigationBarTitleText": "恋爱相册",
+						"enablePullDownRefresh": true,
+						"app-plus": {
+							"pullToRefresh": {
+								"color": "#03a9f4",
+								"style": "circle"
+							}
+						}
+					}
+				},
+				{
+					"path": "love/journey",
+					"style": {
+						"navigationBarTitleText": "我们的故事",
+						"navigationStyle": "custom",
+						"enablePullDownRefresh": false
+					}
+				},
+				{
+					"path": "archives/archives",
+					"style": {
+						"navigationBarTitleText": "归档",
+						"enablePullDownRefresh": true,
+						"app-plus": {
+							"pullToRefresh": {
+								"color": "#03a9f4",
+								"style": "circle"
+							}
+						}
+					}
+				},
+				{
+					"path": "friend-links/friend-links",
+					"style": {
+						"navigationBarTitleText": "友情链接",
+						"enablePullDownRefresh": true,
+						"app-plus": {
+							"pullToRefresh": {
+								"color": "#03a9f4",
+								"style": "circle"
+							}
+						}
+					}
+				},
+				{
+					"path": "articles/articles",
+					"style": {
+						"navigationBarTitleText": "内容搜索",
+						"enablePullDownRefresh": true,
+						"app-plus": {
+							"pullToRefresh": {
+								"color": "#03a9f4",
+								"style": "circle"
+							}
+						}
+					}
+				},
+				{
+					"path": "category-detail/category-detail",
+					"style": {
+						"navigationBarTitleText": "分类详情",
+						"enablePullDownRefresh": true,
+						"app-plus": {
+							"pullToRefresh": {
+								"color": "#03a9f4",
+								"style": "circle"
+							}
+						}
+					}
+				},
+				{
+					"path": "disclaimers/disclaimers",
+					"style": {
+						"navigationBarTitleText": "免责声明",
+						"enablePullDownRefresh": false
+					}
+				},
+				{
+					"path": "contact/contact",
+					"style": {
+						"navigationBarTitleText": "联系博主",
+						"enablePullDownRefresh": false
+					}
+				},
+				{
+					"path": "about/about",
+					"style": {
+						"navigationBarTitleText": "关于博客",
+						"enablePullDownRefresh": false
+					}
+				},
+				{
+					"path": "setting/setting",
+					"style": {
+						"navigationBarTitleText": "设置",
+						"enablePullDownRefresh": false
+					}
+				},
+				{
+					"path": "tags/tags",
+					"style": {
+						"navigationBarTitleText": "",
+						"enablePullDownRefresh": false
+					}
+				},
+				{
+					"path": "tag-detail/tag-detail",
+					"style": {
+						"navigationBarTitleText": "标签详情",
+						"enablePullDownRefresh": true,
+						"app-plus": {
+							"pullToRefresh": {
+								"color": "#03a9f4",
+								"style": "circle"
+							}
+						}
+					}
+				},
+				{
+					"path": "submit-link/submit-link",
+					"style": {
+						"navigationBarTitleText": "友链提交",
+						"enablePullDownRefresh": false
+					}
+				},
+				{
+					"path": "moment-detail/moment-detail",
+					"style": {
+						"navigationBarTitleText": "瞬间详情",
+						"enablePullDownRefresh": true,
+						"app-plus": {
+							"pullToRefresh": {
+								"color": "#03a9f4",
+								"style": "circle"
+							}
+						}
+					}
+				},
+				{
+					"path": "votes/votes",
+					"style": {
+						"navigationBarTitleText": "投票列表",
+						"enablePullDownRefresh": true,
+						"app-plus": {
+							"pullToRefresh": {
+								"color": "#03a9f4",
+								"style": "circle"
+							}
+						}
+					}
+				},
+				{
+					"path": "vote-detail/vote-detail",
+					"style": {
+						"navigationBarTitleText": "投票详情",
+						"enablePullDownRefresh": true,
+						"app-plus": {
+							"pullToRefresh": {
+								"color": "#03a9f4",
+								"style": "circle"
+							}
+						}
+					}
+				},
+				{
+					"path": "data-visual/data-visual",
+					"style": {
+						"navigationBarTitleText": "数据看板",
+						"enablePullDownRefresh": true,
+						"app-plus": {
+							"pullToRefresh": {
+								"color": "#03a9f4",
+								"style": "circle"
+							}
+						}
+					}
+				}
+			]
+		},
+		{
+			"root": "pagesC",
+			"pages": [{
+				"path": "website/website",
+				"style": {
+					"navigationBarTitleText": "",
+					"enablePullDownRefresh": false
+				}
+			}]
+		}
+	],
+	"globalStyle": {
+		"navigationBarTextStyle": "black",
+		"navigationBarTitleText": "uni-halo",
+		"navigationBarBackgroundColor": "#ffffff",
+		"backgroundColor": "#F8F8F8"
+	},
+	"tabBar": {
+		"backgroundColor": "#fff",
+		"borderStyle": "white",
+		"color": "#303133",
+		"selectedColor": "#03a9f4",
+		"list": [{
+				"iconPath": "static/tabbar/select_home.png",
+				"selectedIconPath": "static/tabbar/select_home_active.png",
+				"pagePath": "pages/tabbar/home/home",
+				"text": "首页"
+			},
+			{
+				"iconPath": "static/tabbar/select_category.png",
+				"selectedIconPath": "static/tabbar/select_category_active.png",
+				"pagePath": "pages/tabbar/category/category",
+				"text": "分类"
+			},
+			{
+				"iconPath": "static/tabbar/select_gallery.png",
+				"selectedIconPath": "static/tabbar/select_gallery_active.png",
+				"pagePath": "pages/tabbar/gallery/gallery",
+				"text": "图库"
+			},
+			{
+				"iconPath": "static/tabbar/select_links.png",
+				"selectedIconPath": "static/tabbar/select_links_active.png",
+				"pagePath": "pages/tabbar/moments/moments",
+				"text": "瞬间"
+			},
+			{
+				"iconPath": "static/tabbar/select_mine.png",
+				"selectedIconPath": "static/tabbar/select_mine_active.png",
+				"pagePath": "pages/tabbar/about/about",
+				"text": "关于"
+			}
+		]
+	}
 }
@@ -1,79 +1,137 @@
 <template>
-    <view class="app-page"></view>
+	<view class="app-page flex flex-center">
+		<PluginUnavailable v-if="!uniHaloPluginAvailable" :pluginId="uniHaloPluginId" :error-text="uniHaloPluginAvailableError" :use-border="false" :use-decoration="false" />
+	</view>
 </template>

 <script>
-const homePagePath = '/pages/tabbar/home/home'
-const startPagePath = '/pagesA/start/start'
+import pluginAvailableMixin from '@/common/mixins/pluginAvailable.js';
+import PluginUnavailable from '@/components/plugin-unavailable/plugin-unavailable.vue';
+
+const homePagePath = '/pages/tabbar/home/home';
+const startPagePath = '/pagesA/start/start';
 const articleDetailPath = '/pagesA/article-detail/article-detail';
+
+const _DEV_ = false;
+const _DEV_TO_TYPE_ = 'page';
+const _DEV_TO_PATH_ = '/pagesA/data-visual/data-visual';
+
 export default {
-    computed: {
-        configs() {
-            return this.$tm.vx.getters().getConfigs;
-        }
-    },
-  onLoad: function (options) {
-    uni.$tm.vx.actions('config/fetchConfigs').then(async (res) => {
-      if (options.scene) {
-        if ('' !== options.scene) {
-          const postId = await this.getPostIdByQRCode(options.scene);
-          if (postId) {
-            uni.redirectTo({
-              url: articleDetailPath + `?name=${postId}`,
-              animationType: 'slide-in-right'
-            });
-          }
-        }
-      }
+	mixins: [pluginAvailableMixin],
+	components: {
+		PluginUnavailable
+	},
+	computed: {
+		configs() {
+			return this.$tm.vx.getters().getConfigs;
+		}
+	},
+	async onLoad(options) {
+		// 本地开发，快速跳转页面，发布请设置 _DEV_ = false
+		if (_DEV_ && _DEV_TO_PATH_) {
+			if (_DEV_TO_TYPE_ == 'tabbar') {
+				uni.switchTab({
+					url: _DEV_TO_PATH_
+				});
+			} else if (_DEV_TO_TYPE_ == 'page') {
+				uni.navigateTo({
+					url: _DEV_TO_PATH_
+				});
+			}
+			return;
+		}

-      // #ifdef MP-WEIXIN
-      // uni.$tm.vx.commit('setWxShare', res.shareConfig);
-      // #endif
-      this.fnCheckShowStarted();
-    }).catch((err) => {
-      uni.switchTab({
-        url: homePagePath
-      });
-    })
-  },
-    methods: {
-        fnCheckShowStarted() {
-            if (!this.configs.appConfig.startConfig.enabled) {
-                uni.switchTab({
-                    url: homePagePath
-                });
-                return;
-            }
+		// 检查插件
+		this.setPluginId(this.NeedPluginIds.PluginUniHalo);
+		this.setPluginError('阿偶，检测到当前插件没有安装或者启用，无法启动 uni-halo 哦，请联系管理员');
+		if (!(await this.checkPluginAvailable())) return;

-            // 是否每次都显示启动页
-            if (this.configs.appConfig.startConfig.alwaysShow) {
-                uni.removeStorageSync('APP_HAS_STARTED')
-                uni.redirectTo({
-                    url: startPagePath
-                });
-                return;
-            }
+		// 获取配置
+		uni.$tm.vx
+			.actions('config/fetchConfigs')
+			.then(async (res) => {
+				if (options.scene) {
+					if ('' !== options.scene) {
+						const postId = await this.getPostIdByQRCode(options.scene);
+						if (postId) {
+							uni.redirectTo({
+								url: articleDetailPath + `?name=${postId}`,
+								animationType: 'slide-in-right'
+							});
+						}
+					}
+				}

-            // 只显示一次启动页
-            if (uni.getStorageSync('APP_HAS_STARTED')) {
-                uni.switchTab({
-                    url: homePagePath
-                });
-            } else {
-                uni.redirectTo({
-                    url: startPagePath
-                });
-            }
-        },
-        async getPostIdByQRCode(key) {
-          const response = await this.$httpApi.v2.getQRCodeInfo(key);
-          if (response) {
-            if(response && response.postId) {
-              return response.postId;
-            }
-          }
-          return null;
-        }
-    }
+				// #ifdef MP-WEIXIN
+				// uni.$tm.vx.commit('setWxShare', res.shareConfig);
+				// #endif
+
+				// 获取mockjson
+				if (res.auditConfig.auditModeEnabled) {
+					if (res.auditConfig.auditModeData.jsonUrl) {
+						await uni.$tm.vx.actions('config/fetchMockJson');
+					} else {
+						const mockJson = uni.$utils.checkJsonAndParse(res.auditConfig.auditModeData.jsonData);
+						if (mockJson.ok) {
+							uni.$tm.vx.commit('config/setMockJson', mockJson.jsonData);
+						}
+					}
+				}
+
+				// 进入检查
+				this.fnCheckShowStarted();
+			})
+			.catch((err) => {
+				uni.switchTab({
+					url: homePagePath
+				});
+			});
+	},
+	methods: {
+		fnCheckShowStarted() {
+			if (!this.configs.appConfig.startConfig.enabled) {
+				uni.switchTab({
+					url: homePagePath
+				});
+				return;
+			}
+
+			// 是否每次都显示启动页
+			if (this.configs.appConfig.startConfig.alwaysShow) {
+				uni.removeStorageSync('APP_HAS_STARTED');
+				uni.redirectTo({
+					url: startPagePath
+				});
+				return;
+			}
+
+			// 只显示一次启动页
+			if (uni.getStorageSync('APP_HAS_STARTED')) {
+				uni.switchTab({
+					url: homePagePath
+				});
+			} else {
+				uni.redirectTo({
+					url: startPagePath
+				});
+			}
+		},
+		async getPostIdByQRCode(key) {
+			const response = await this.$httpApi.v2.getQRCodeInfo(key);
+			if (response) {
+				if (response && response.postId) {
+					return response.postId;
+				}
+			}
+			return null;
+		}
+	}
 };
 </script>
+
+<style lang="scss" scoped>
+.app-page {
+	width: 100vw;
+	height: 100vh;
+}
+</style>
@@ -1,214 +1,472 @@
 <template>
-	<view class="app-page">
-		<view v-if="loading != 'success'" class="loading-wrap">
-			<tm-skeleton model="listAvatr"></tm-skeleton>
-			<tm-skeleton model="listAvatr"></tm-skeleton>
-			<tm-skeleton model="listAvatr"></tm-skeleton>
-		</view>
-		<!-- 内容区域 -->
-		<view v-else class="app-page-content">
-			<view v-if="dataList.length == 0" class="content-empty flex flex-center" style="height: 70vh;">
-				<!-- 空布局 -->
-				<tm-empty icon="icon-shiliangzhinengduixiang-" label="暂无数据"></tm-empty>
-			</view>
-			<block v-else>
-				<tm-translate v-for="(item, index) in dataList" :key="index"
-					style="box-sizing: border-box;width: 50%;padding: 0 8rpx;" animation-name="fadeUp"
-					:wait="calcAniWait(index)">
-					<view class="catgory-card" :style="{backgroundImage:`url(${item.spec.cover})`}">
-						<view class="content" @click="handleToCategory(item)">
-							<view style="font-size: 32rpx;color: #ffffff;">{{ item.spec.displayName }}</view>
-							<view style="font-size: 24rpx;color: #ffffff;margin-top: 6rpx;">共
-								{{ item.postCount }} 篇文章
-							</view>
-						</view>
-					</view>
-				</tm-translate>
-				<tm-flotbutton @click="fnToTopPage" size="m" color="light-blue" icon="icon-angle-up"></tm-flotbutton>
-				<view class="load-text">{{ loadMoreText }}</view>
-			</block>
-		</view>
-	</view>
+    <view class="app-page" :style="{
+		padding:calcShowType==='list-post'? 0 : '24rpx 0'
+	}">
+        <view v-if="loading !== 'success'" class="loading-wrap">
+            <tm-skeleton model="listAvatr"></tm-skeleton>
+            <tm-skeleton model="listAvatr"></tm-skeleton>
+            <tm-skeleton model="listAvatr"></tm-skeleton>
+        </view>
+        <!-- 内容区域 -->
+        <view v-else class="app-page-content" :class="[calcShowType==='list-post'?'list-post':'']">
+            <view v-if="dataList.length === 0" class="content-empty flex flex-center" style="height: 70vh;">
+                <!-- 空布局 -->
+                <tm-empty icon="icon-shiliangzhinengduixiang-" label="暂无数据"></tm-empty>
+            </view>
+            <block v-else>
+                <block v-if="calcAuditModeEnabled || calcShowType==='list'">
+                    <tm-translate v-for="(item, index) in dataList" :key="index"
+                                  style="box-sizing: border-box;width: 50%;padding: 0 8rpx;" animation-name="fadeUp"
+                                  :wait="calcAniWait(index)">
+                        <view class="catgory-card" :style="{backgroundImage:`url(${item.spec.cover})`}">
+                            <view class="content" @click="handleToCategory(item)">
+                                <view style="font-size: 32rpx;color: #ffffff;">{{ item.spec.displayName }}</view>
+                                <view v-if="!calcAuditModeEnabled"
+                                      style="font-size: 24rpx;color: #ffffff;margin-top: 6rpx;">
+                                    共 {{ item.postCount }} 篇文章
+                                </view>
+                            </view>
+                        </view>
+                    </tm-translate>
+                    <view class="load-text">{{ loadMoreText }}</view>
+                </block>
+                <view v-else-if="calcShowType==='list-post'" class="fulled flex" style="min-height:100vh">
+                    <view class="bg-white" :style="{height: '100%'}">
+                        <tm-sliderNav :list="categoryList" bg-color="white" color="light-blue" rang-key="displayName"
+                                      @change="fnOnCategoryChange"></tm-sliderNav>
+                    </view>
+                    <scroll-view class="right-content pt-12 pb-12" :scroll-y="true" :scroll-top="scrollTop"
+                                 :scroll-with-animation="true" :refresher-enabled="true" :refresher-triggered="triggered"
+                                 :refresher-threshold="60" refresher-background="#fafafa"
+                                 @refresherrefresh="fnGetPostByCategory(true)" @scrolltolower="fnGetPostByCategory(false)"
+                                 @scroll="fnOnScroll" @touchmove.stop @touchstart="fnOnTouchStart" @touchend="fnOnTouchEnd"
+                                 @touchcancel="fnOnTouchEnd">
+                        <view v-if="postList.length === 0" class="article-empty flex flex-center">
+                            <tm-empty :size="120" icon="icon-shiliangzhinengduixiang-" label="该分类下暂无文章~"></tm-empty>
+                        </view>
+                        <block v-else>
+                            <block v-for="(post, index) in postList" :key="post.spec.publishTime">
+                                <tm-translate animation-name="fadeUp" :wait="calcAniWait(index)">
+                                    <article-min-card :article="post" @on-click="fnToArticleDetail"></article-min-card>
+                                </tm-translate>
+                            </block>
+                            <view class="load-text">{{ loadMoreText }}</view>
+                        </block>
+                    </scroll-view>
+                </view>
+
+                <view class="flot-buttons">
+                    <tm-button @click="fnScrollTop" size="m" :fab="true" theme="light-blue"
+                               icon="icon-angle-up"></tm-button>
+                    <tm-button v-if="!calcAuditModeEnabled" @click="fnChangeShowType" size="m" :fab="true" theme="light-blue"
+                               :icon="calcShowType==='list'?'icon-align-left':'icon-all'"></tm-button>
+                </view>
+            </block>
+        </view>
+
+    </view>
 </template>

 <script>
-	import tmSkeleton from '@/tm-vuetify/components/tm-skeleton/tm-skeleton.vue';
-	import tmFlotbutton from '@/tm-vuetify/components/tm-flotbutton/tm-flotbutton.vue';
-	import tmTranslate from '@/tm-vuetify/components/tm-translate/tm-translate.vue';
-	import tmEmpty from '@/tm-vuetify/components/tm-empty/tm-empty.vue';
+import tmSkeleton from '@/tm-vuetify/components/tm-skeleton/tm-skeleton.vue';
+import tmButton from '@/tm-vuetify/components/tm-button/tm-button.vue';
+import tmTranslate from '@/tm-vuetify/components/tm-translate/tm-translate.vue';
+import tmEmpty from '@/tm-vuetify/components/tm-empty/tm-empty.vue';

-	import MarkdownConfig from '@/common/markdown/markdown.config.js';
-	import mpHtml from '@/components/mp-html/components/mp-html/mp-html.vue';
+import MarkdownConfig from '@/common/markdown/markdown.config.js';
+import mpHtml from '@/components/mp-html/components/mp-html/mp-html.vue';
+import tmFlowLayout from '@/tm-vuetify/components/tm-flowLayout/tm-flowLayout.vue';
+import tmSliderNav from '@/tm-vuetify/components/tm-sliderNav/tm-sliderNav.vue';
+import ArticleMinCard from '@/components/article-min-card/article-min-card.vue';

-	export default {
-		components: {
-			tmSkeleton,
-			tmFlotbutton,
-			tmTranslate,
-			tmEmpty,
-			mpHtml
-		},
-		data() {
-			return {
-				markdownConfig: MarkdownConfig,
-				loading: 'loading',
-				queryParams: {
-					size: 20,
-					page: 1
-				},
-				hasNext: false,
-				dataList: [],
-				isLoadMore: false,
-				loadMoreText: '加载中...'
-			};
-		},
-    computed: {
-      haloConfigs() {
-        return this.$tm.vx.getters().getConfigs;
-      },
+
+export default {
+    components: {
+        tmSkeleton,
+        tmButton,
+        tmTranslate,
+        tmEmpty,
+        mpHtml,
+        tmFlowLayout,
+        tmSliderNav,
+        ArticleMinCard
    },
-		onLoad() {
-			this.fnGetData();
-		},
-		onPullDownRefresh() {
-			this.isLoadMore = false;
-			this.queryParams.page = 0;
-			this.fnGetData();
-		},
-
-		onReachBottom(e) {
-			if (this.hasNext) {
-				this.queryParams.page += 1;
-				this.isLoadMore = true;
-				this.fnGetData();
-			} else {
-				uni.showToast({
-					icon: 'none',
-					title: '没有更多数据了'
-				});
-			}
-		},
-		methods: {
-			fnGetData() {
-        if (this.haloConfigs.basicConfig.auditModeEnabled) {
-          return;
+    data() {
+        return {
+            markdownConfig: MarkdownConfig,
+            loading: 'loading',
+            queryParams: {
+                size: 20,
+                page: 1,
+                fieldSelector: ['spec.hideFromList=false']
+            },
+            hasNext: false,
+            dataList: [],
+            categoryList: [],
+            isLoadMore: false,
+            loadMoreText: '加载中...',
+            currentCategoryConfig: {
+                type: "list"
+            },
+            currentCategoryName: "",
+            postQueryParams: {
+                size: 10,
+                page: 0,
+            },
+            postList: [],
+            triggered: false,
+            scrollTop: 0,
+            tempScrollTop: 0,
+            scrollTimeout: null,
+        };
+    },
+    computed: {
+        haloConfigs() {
+            return this.$tm.vx.getters().getConfigs;
+        },
+        calcAuditModeEnabled() {
+            return this.haloConfigs.auditConfig.auditModeEnabled
+        },
+        mockJson() {
+            return this.$tm.vx.getters().getMockJson;
+        },
+        categoryConfig() {
+            return this.haloConfigs.pageConfig.categoryConfig
+        },
+        calcShowType() {
+            return this.currentCategoryConfig.type
        }
-				uni.showLoading({
-					mask: true,
-					title: '加载中...'
-				});
-				// 设置状态为加载中
-				if (!this.isLoadMore) {
-					this.loading = 'loading';
-				}
-				this.loadMoreText = '加载中...';
-				this.$httpApi.v2
-					.getCategoryList(this.queryParams)
-					.then(res => {
-						console.log('请求结果：');
-						console.log(res);
+    },
+    watch: {
+        categoryConfig: {
+            deep: true,
+            immediate: true,
+            handler(newVal) {
+                console.log("执行了", newVal)
+                if (!newVal) return;
+                this.currentCategoryConfig = newVal
+                this.handleInitPage()
+            },
+        }
+    },
+    onPullDownRefresh() {
+        this.isLoadMore = false;
+        this.queryParams.page = 0;
+        this.fnGetData();
+    },
+    onReachBottom(e) {
+        if (this.calcAuditModeEnabled) {
+            uni.showToast({
+                icon: 'none',
+                title: '没有更多数据了'
+            });
+            return
+        }
+        if (this.hasNext) {
+            if (this.calcShowType === 'list') {

-						this.loading = 'success';
-						this.loadMoreText = res.hasNext ? '上拉加载更多' : '呜呜，没有更多数据啦~';
-						// 处理数据
-						this.hasNext = res.hasNext;
+                this.queryParams.page += 1;
+            } else {
+                this.postQueryParams.page += 1;
+            }
+            this.isLoadMore = true;
+            this.fnGetData();
+        } else {
+            uni.showToast({
+                icon: 'none',
+                title: '没有更多数据了'
+            });
+        }
+    },
+    methods: {
+        fnChangeShowType() {
+            if (this.calcShowType === 'list-post') {
+                this.currentCategoryConfig.type = 'list'
+            } else {
+                this.currentCategoryConfig.type = 'list-post'
+            }
+            this.handleInitPage();
+        },
+        handleResetInit() {
+            this.postList = []
+            this.dataList = []
+            this.categoryList = []
+            this.queryParams.page = 0;
+            this.postQueryParams.page = 0;
+            this.hasNext = false
+            this.isLoadMore = false
+            this.loadMoreText = '加载中...'
+            this.currentCategoryName = ""
+            this.triggered = false
+            this.fnResetSetAniWaitIndex()
+        },
+        handleInitPage() {
+            this.handleResetInit()
+            if (this.calcShowType === 'list-post') {
+                this.queryParams.size = 99999
+            }
+            this.fnGetData();
+        },
+        fnGetData() {
+            if (this.calcAuditModeEnabled) {
+                this.categoryConfig.type = "list"
+                this.dataList = this.mockJson.category.list.map((item) => {
+                    return {
+                        metadata: {
+                            name: Date.now() * Math.random(),
+                        },
+                        spec: {
+                            displayName: item.title,
+                            cover: this.$utils.checkImageUrl(item.cover)
+                        },
+                        postCount: 0
+                    }
+                });
+                this.loading = 'success';
+                this.loadMoreText = '呜呜，没有更多数据啦~';
+                uni.hideLoading();
+                uni.stopPullDownRefresh();
+                return;
+            }
+            uni.showLoading({
+                mask: true,
+                title: '加载中...'
+            });
+            // 设置状态为加载中
+            if (!this.isLoadMore) {
+                this.loading = 'loading';
+            }
+            this.loadMoreText = '加载中...';
+            this.$httpApi.v2
+                .getCategoryList(this.queryParams)
+                .then(res => {
+                    if (this.calcShowType === 'list') {
+                        this.loading = 'success';
+                        this.loadMoreText = res.hasNext ? '上拉加载更多' : '呜呜，没有更多数据啦~';
+                        // 处理数据
+                        this.hasNext = res.hasNext;

-						const tempItems = res.items.map(item => {
-							item.spec.cover = this.$utils.checkThumbnailUrl(item.spec.cover, true)
-							return item;
-						})
+                        const tempItems = res.items.map(item => {
+							item.postCount = item.postCount ?? 0
+                            item.spec.cover = this.$utils.checkThumbnailUrl(item.spec.cover, true)
+                            return item;
+                        })

-						if (this.isLoadMore) {
-							this.dataList = this.dataList.concat(tempItems);
-						} else {
-							this.dataList = tempItems;
-						}
-					})
-					.catch(err => {
-						console.error(err);
-						this.loading = 'error';
-						this.loadMoreText = '加载失败，请下拉刷新！';
-					})
-					.finally(() => {
-						setTimeout(() => {
-							uni.hideLoading();
-							uni.stopPullDownRefresh();
-						}, 500);
-					});
-			},
-			handlePreview(index, list) {
-				uni.previewImage({
-					current: index,
-					urls: list.map(item => item.url)
-				})
-			},
-			handleToCategory(data) {
-				uni.navigateTo({
-					url: `/pagesA/category-detail/category-detail?name=${data.metadata.name}&title=${data.spec.displayName}`
-				})
-			}
-		}
-	};
+                        if (this.isLoadMore) {
+                            this.dataList = this.dataList.concat(tempItems);
+                        } else {
+                            this.dataList = tempItems;
+                        }
+                    } else {
+                        this.dataList = res.items
+                        this.categoryList = res.items.map(item => {
+                            return {
+								...item,
+                                displayName: item.spec.displayName,
+                                name: item.metadata.name,
+								postCount: item.postCount ?? 0
+                            }
+                        })
+                        this.triggered = false;
+                        this.loading = 'success';
+                        if (this.dataList.length !== 0) {
+                            this.currentCategoryName = this.dataList[0].metadata.name;
+                            this.fnGetPostByCategory()
+                        }
+                    }
+                })
+                .catch(err => {
+                    console.error(err);
+                    this.loading = 'error';
+                    this.loadMoreText = '加载失败，请下拉刷新！';
+                })
+                .finally(() => {
+                    setTimeout(() => {
+                        uni.hideLoading();
+                        uni.stopPullDownRefresh();
+                    }, 500);
+                });
+        },
+        handlePreview(index, list) {
+            uni.previewImage({
+                current: index,
+                urls: list.map(item => item.url)
+            })
+        },
+        handleToCategory(data) {
+            if (this.calcAuditModeEnabled) {
+                return;
+            }
+            uni.navigateTo({
+                url: `/pagesA/category-detail/category-detail?name=${data.metadata.name}&title=${data.spec.displayName}`
+            })
+        },
+        fnGetPostByCategory(isPulldownRefresh = true, triggered = true) {
+            if (!isPulldownRefresh) {
+                if (this.hasNext) {
+                    this.postQueryParams.page += 1;
+                } else {
+                    return uni.showToast({
+                        icon: 'none',
+                        title: '没有更多数据了'
+                    });
+                }
+            } else {
+                this.postQueryParams.page = 0;
+                if (triggered) {
+                    this.triggered = true;
+                }
+            }
+
+            this.$httpApi.v2
+                .getCategoryPostList(this.currentCategoryName, this.postQueryParams)
+                .then(res => {
+                    this.hasNext = res.hasNext;
+
+                    if (!isPulldownRefresh) {
+                        this.postList = this.postList.concat(res.items);
+                    } else {
+                        this.postList = res.items;
+                    }
+                    this.loadMoreText = res.hasNext ? '上拉加载更多' : '呜呜，没有更多数据啦~';
+                })
+                .catch(err => {
+                    this.loadMoreText = '加载失败！';
+                })
+                .finally(() => {
+                    this.triggered = false;
+                });
+        },
+
+        fnOnCategoryChange(e) {
+            this.fnResetSetAniWaitIndex();
+            this.currentCategoryName = this.dataList[e].metadata.name;
+            this.fnToTopScroll();
+            this.postList = [];
+            this.fnGetPostByCategory();
+        },
+
+        fnOnScroll(e) {
+            this.tempScrollTop = e.detail.scrollTop;
+        },
+        fnToTopScroll() {
+            uni.pageScrollTo({
+                scrollTop: 0,
+                duration: 500
+            });
+            this.scrollTop = 0;
+            this.tempScrollTop = 0;
+        },
+        fnOnTouchStart() {
+            clearTimeout(this.scrollTimeout);
+        },
+        fnOnTouchEnd() {
+            this.scrollTimeout = setTimeout(() => {
+                this.scrollTop = this.tempScrollTop;
+            }, 500);
+        },
+        //跳转文章详情
+        fnToArticleDetail(post) {
+            uni.navigateTo({
+                url: '/pagesA/article-detail/article-detail?name=' + post.metadata.name,
+                animationType: 'slide-in-right'
+            });
+        },
+        fnScrollTop() {
+            if (this.calcShowType === 'list') {
+                this.fnToTopPage()
+            } else {
+                this.fnToTopScroll()
+            }
+        }
+    }
+};
 </script>

 <style lang="scss" scoped>
-	.app-page {
-		width: 100vw;
-		display: flex;
-		flex-direction: column;
-		padding: 24rpx 0;
-	}
+.app-page {
+    width: 100vw;
+    display: flex;
+    flex-direction: column;
+    padding: 24rpx 0;
+}

-	.loading-wrap {
-		padding: 24rpx;
-	}
+.auditModeEnabled {
+    width: 100%;
+    height: 80vh;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+}

-	.app-page-content {
-		display: flex;
-		flex-wrap: wrap;
-		padding: 0 12rpx;
-		gap: 20rpx 0;
-	}
+.loading-wrap {
+    padding: 24rpx;
+}

-	.catgory-card {
-		width: 100%;
-		height: 200rpx;
-		position: relative;
-		display: flex;
-		flex-direction: column;
-		box-sizing: border-box;
-		border-radius: 12rpx;
-		background-color: #ffff;
-		box-shadow: 0rpx 2rpx 24rpx rgba(0, 0, 0, 0.03);
-		overflow: hidden;
-		background-repeat: no-repeat;
-		background-size: cover;
+.app-page-content {
+    display: flex;
+    flex-wrap: wrap;
+    padding: 0 12rpx;
+    gap: 20rpx 0;

-		&:before {
-			content: '';
-			position: absolute;
-			left: 0;
-			top: 0;
-			right: 0;
-			bottom: 0;
-			background-color: rgba(0, 0, 0, 0.15);
-			z-index: 1;
-		}
-	}
+    &.list-post {
+        padding: 0;
+        gap: 0;
+    }
+}

-	.content {
-		width: 100%;
-		height: 100%;
-		position: relative;
-		z-index: 2;
-		display: flex;
-		flex-direction: column;
-		align-items: center;
-		justify-content: center;
-	}

-	.load-text {
-		width: 100%;
-		text-align: center;
-	}
+.catgory-card {
+    width: 100%;
+    height: 200rpx;
+    position: relative;
+    display: flex;
+    flex-direction: column;
+    box-sizing: border-box;
+    border-radius: 12rpx;
+    background-color: #ffff;
+    box-shadow: 0rpx 2rpx 24rpx rgba(0, 0, 0, 0.03);
+    overflow: hidden;
+    background-repeat: no-repeat;
+    background-size: cover;
+
+    &:before {
+        content: '';
+        position: absolute;
+        left: 0;
+        top: 0;
+        right: 0;
+        bottom: 0;
+        background-color: rgba(0, 0, 0, 0.15);
+		backdrop-filter: blur(3rpx);
+        z-index: 1;
+    }
+}
+
+.content {
+    width: 100%;
+    height: 100%;
+    position: relative;
+    z-index: 2;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+}
+
+.load-text {
+    width: 100%;
+    text-align: center;
+}
+
+.flot-buttons {
+    position: fixed;
+    bottom: 100rpx;
+    right: 32rpx;
+    flex-direction: column;
+    display: flex;
+    gap: 6rpx;
+    z-index: 999;
+}
 </style>
@@ -1,249 +1,397 @@
 <template>
-    <view class="app-page">
-        <!-- 顶部切换 -->
-        <view class="e-fixed" v-if="category.list.length > 0">
-            <tm-tabs color="light-blue" v-model="category.activeIndex" range-key="displayName" :list="category.list"
-                     align="left" @change="fnOnCategoryChange"></tm-tabs>
-        </view>
-        <!-- 占位区域 -->
-        <view v-if="category.list.length > 0" style="width: 100vw;height: 90rpx;"></view>
-        <!-- 加载区域 -->
-        <view v-if="loading !== 'success'" class="loading-wrap">
-            <tm-skeleton model="card"></tm-skeleton>
-            <tm-skeleton model="card"></tm-skeleton>
-            <tm-skeleton model="card"></tm-skeleton>
-            <tm-skeleton model="card"></tm-skeleton>
-        </view>
-        <!-- 内容区域 -->
-        <view class="content" v-else>
-            <view v-if="dataList.length === 0" class="content-empty">
-                <!-- 空布局 -->
-                <tm-empty icon="icon-shiliangzhinengduixiang-" label="博主还没有分享图片~"></tm-empty>
-            </view>
-            <block v-else>
-                <block v-if="galleryConfig.useWaterfall">
-                    <!--瀑布流-->
-                    <tm-flowLayout-custom ref="wafll" style="width: 100%;" @click="fnOnFlowClick"></tm-flowLayout-custom>
-                </block>
-                <!--   列表   -->
-                <block v-else>
-                    <tm-translate v-for="(item, index) in dataList" :key="index"
-                                  style="box-sizing: border-box;padding: 6rpx;width: 50%;height: 250rpx;"
-                                  animation-name="fadeUp" :wait="calcAniWait(index)">
-                        <view style="border-radius: 12rpx;overflow: hidden;width: 100%;height: 250rpx;">
-                            <image style="width: 100%;height: 100%;" mode="aspectFill" :src="item.spec.url"
-                                   @click="fnPreview(item)"/>
-                        </view>
-                    </tm-translate>
-                </block>
+	<view class="app-page" :class="[uniHaloPluginPageClass]">
+		<PluginUnavailable v-if="!uniHaloPluginAvailable" :pluginId="uniHaloPluginId"
+			:error-text="uniHaloPluginAvailableError" />
+		<template v-else>
+			<!-- 顶部切换 -->
+			<view class="e-fixed" v-if="category.list.length > 0">
+				<tm-tabs color="light-blue" :shadow="0" v-model="category.activeIndex" range-key="displayName"
+					:list="category.list" align="left" @change="fnOnCategoryChange($event, false)"></tm-tabs>
+			</view>
+			<!-- 占位区域 -->
+			<view v-if="category.list.length > 0" style="width: 100vw;height: 90rpx;"></view>
+			<!-- 加载区域 -->
+			<view v-if="loading == 'loading'" class="loading-wrap">
+				<tm-skeleton model="card"></tm-skeleton>
+				<tm-skeleton model="card"></tm-skeleton>
+				<tm-skeleton model="card"></tm-skeleton>
+				<tm-skeleton model="card"></tm-skeleton>
+			</view>
+			<view v-else-if="loading == 'error'" class="flex flex-col flex-center" style="width:100%;height:60vh;">
+				<tm-empty icon="icon-wind-cry" label="阿偶，获取数据失败了~">
+					<tm-button theme="light-blue" size="m" :shadow="0" @click="fnGetData(true)">刷新试试</tm-button>
+				</tm-empty>
+			</view>
+			<!-- 内容区域 -->
+			<view v-else class="content">
+				<k-touch-listen class="touch-listen-content" @touchLeft="touchLeft" @touchRight="touchRight">
+					<view v-if="dataList.length === 0" class="content-empty">
+						<!-- 空布局 -->
+						<tm-empty icon="icon-shiliangzhinengduixiang-" label="博主还没有分享图片~"></tm-empty>
+					</view>
+					<block v-else>
+						<block v-if="galleryConfig.useWaterfall">
+							<!--瀑布流-->
+							<tm-flowLayout-custom ref="wafll" style="width: 100%;"
+								@click="fnOnFlowClick"></tm-flowLayout-custom>
+						</block>
+						<!--   列表   -->
+						<block v-else>
+							<tm-translate v-for="(item, index) in dataList" :key="index"
+								style="box-sizing: border-box;padding: 6rpx;width: 50%;height: 250rpx;"
+								animation-name="fadeUp" :wait="calcAniWait(index)">
+								<view style="border-radius: 12rpx;overflow: hidden;width: 100%;height: 250rpx;">
+									<image style="width: 100%;height: 100%;" mode="aspectFill" :src="item.spec.url"
+										@click="fnPreview(item)" />
+								</view>
+							</tm-translate>
+						</block>

-                <tm-flotbutton @click="fnToTopPage" color="light-blue" size="m" icon="icon-angle-up"></tm-flotbutton>
-                <view class="load-text">{{ loadMoreText }}</view>
-            </block>
+						<view class="load-text">{{ loadMoreText }}</view>
+					</block>
+				</k-touch-listen>
+			</view>

-        </view>
-    </view>
+			<view v-if="!calcAuditModeEnabled" class="flot-buttons">
+				<tm-button v-if="loading == 'error'" @click="fnGetCategory" size="m" :fab="true" theme="light-blue"
+					icon="icon-sync-alt"></tm-button>
+				<tm-button @click="fnToTopPage" size="m" :fab="true" theme="light-blue"
+					icon="icon-angle-up"></tm-button>
+			</view>
+		</template>
+	</view>
 </template>

 <script>
-import tmSkeleton from '@/tm-vuetify/components/tm-skeleton/tm-skeleton.vue';
-import tmTranslate from '@/tm-vuetify/components/tm-translate/tm-translate.vue';
-import tmFlotbutton from '@/tm-vuetify/components/tm-flotbutton/tm-flotbutton.vue';
-import tmTags from '@/tm-vuetify/components/tm-tags/tm-tags.vue';
-import tmEmpty from '@/tm-vuetify/components/tm-empty/tm-empty.vue';
-import tmIcons from '@/tm-vuetify/components/tm-icons/tm-icons.vue';
-import tmImages from '@/tm-vuetify/components/tm-images/tm-images.vue';
-import tmFlowLayoutCustom from '@/tm-vuetify/components/tm-flowLayout-custom/tm-flowLayout-custom.vue';
-import tmTabs from '@/tm-vuetify/components/tm-tabs/tm-tabs.vue';
+	import tmSkeleton from '@/tm-vuetify/components/tm-skeleton/tm-skeleton.vue';
+	import tmTranslate from '@/tm-vuetify/components/tm-translate/tm-translate.vue';
+	import tmFlotbutton from '@/tm-vuetify/components/tm-flotbutton/tm-flotbutton.vue';
+	import tmTags from '@/tm-vuetify/components/tm-tags/tm-tags.vue';
+	import tmEmpty from '@/tm-vuetify/components/tm-empty/tm-empty.vue';
+	import tmIcons from '@/tm-vuetify/components/tm-icons/tm-icons.vue';
+	import tmImages from '@/tm-vuetify/components/tm-images/tm-images.vue';
+	import tmFlowLayoutCustom from '@/tm-vuetify/components/tm-flowLayout-custom/tm-flowLayout-custom.vue';
+	import tmTabs from '@/tm-vuetify/components/tm-tabs/tm-tabs.vue';
+	import tmButton from '@/tm-vuetify/components/tm-button/tm-button.vue';

-export default {
-    options: {
-        multipleSlots: true
-    },
-    components: {
-        tmSkeleton,
-        tmTranslate,
-        tmFlotbutton,
-        tmTags,
-        tmEmpty,
-        tmIcons,
-        tmImages,
-        tmFlowLayoutCustom,
-        tmTabs
-    },
-    data() {
-        return {
-            isBlackTheme: false,
-            loading: 'loading',
-            category: {
-                activeIndex: 0,
-                activeValue: '',
-                list: []
-            },
-            queryParams: {
-                size: 10,
-                page: 1,
-                group: ""
-            },
-            isLoadMore: false,
-            loadMoreText: '',
-            hasNext: false,
-            dataList: []
-        };
-    },
-    computed: {
-        galleryConfig() {
-            return this.$tm.vx.getters().getConfigs.pageConfig.galleryConfig;
-        }
-    },
-    watch: {
-        galleryConfig: {
-            handler(newValue, oldValue) {
-                if (!newValue) return;
-                this.fnSetPageTitle(newValue.pageTitle);
-                this.fnGetCategory();
-            },
-            deep: true,
-            immediate: true
-        }
-    },
-    onPullDownRefresh() {
-        this.dataList = []
-        this.isLoadMore = false;
-        this.queryParams.page = 1;
-        this.fnGetData(true);
-    },
-    onReachBottom(e) {
-        if (this.hasNext) {
-            this.queryParams.page += 1;
-            this.isLoadMore = true;
-            this.fnGetData(false);
-        } else {
-            uni.showToast({
-                icon: 'none',
-                title: '没有更多数据了'
-            });
-        }
-    },
-    methods: {
-        fnOnCategoryChange(index) {
-            this.fnResetSetAniWaitIndex();
-            this.queryParams.group = this.category.list[index].name;
-            this.queryParams.page = 1;
-            this.fnToTopPage(); 
-            this.dataList = [];
-            this.fnGetData(true); 
-        },
-        fnGetCategory() {
-            this.$httpApi.v2.getPhotoGroupList({
-                page: 1,
-                size: 0
-            }).then(res => {
-                this.category.list = res.items.map(item => {
-                    return {
-                        name: item.metadata.name,
-                        displayName: item.spec.displayName
-                    }
-                });
-                if (this.category.list.length !== 0) {
-                    this.queryParams.group = this.category.list[0].name;
-                    this.fnGetData(true);
-                }
-            });
-        },
-        fnGetData(isClearWallfull = false) {
-            // 设置状态为加载中
-            if (!this.isLoadMore) {
-                this.loading = 'loading';
-            }
-            this.loadMoreText = '';
-            this.$httpApi.v2
-                .getPhotoListByGroupName(this.queryParams)
-                .then(res => {
-                    this.hasNext = res.hasNext;
-                    this.loading = 'success';
-                    if (res.items.length !== 0) {
-                        const _list = res.items.map((item, index) => {
-                            item.spec.url = this.$utils.checkImageUrl(item.spec.url || item.spec.cover);
-                            return item;
-                        });
-                        if (this.isLoadMore) {
-                            this.dataList = this.dataList.concat(_list);
-                        } else {
-                            this.dataList = _list;
-                        }
-                        if (this.galleryConfig.useWaterfall) {
-                            this.$nextTick(() => {
-								if(isClearWallfull){
-									this.$refs.wafll.clear()
-								}
-                                this.$refs.wafll.pushData(_list)
-                            })
-                        }
-                    }
-                    this.loadMoreText = res.hasNext ? '上拉加载更多' : '呜呜，没有更多数据啦~';
-                })
-                .catch(err => {
-                    console.error(err);
-                    this.loading = 'error';
-                    this.loadMoreText = '加载失败，请下拉刷新！';
-                })
-                .finally(() => {
-                    setTimeout(() => {
-                        uni.hideLoading();
-                        uni.stopPullDownRefresh();
-                    }, 500);
-                });
-        },
-        fnOnFlowClick({item}) {
-            this.fnPreview(item)
-        },
-        // 预览
-        fnPreview(data) {
-            uni.previewImage({
-                current: this.dataList.findIndex(x => x.metadata.name === data.metadata.name),
-                urls: this.dataList.map(x => x.spec.url),
-                indicator: 'number',
-                loop: true
-            });
-        }
-    }
-};
+	import pluginAvailable from "@/common/mixins/pluginAvailable.js"
+	import PluginUnavailable from '@/components/plugin-unavailable/plugin-unavailable.vue'
+	export default {
+		options: {
+			multipleSlots: true
+		},
+		mixins: [pluginAvailable],
+		components: {
+			tmSkeleton,
+			tmTranslate,
+			tmFlotbutton,
+			tmTags,
+			tmEmpty,
+			tmIcons,
+			tmImages,
+			tmFlowLayoutCustom,
+			tmTabs,
+			tmButton,
+			PluginUnavailable
+		},
+		data() {
+			return {
+				isBlackTheme: false,
+				loading: 'loading',
+				category: {
+					activeIndex: 0,
+					activeValue: '',
+					list: []
+				},
+				queryParams: {
+					size: 10,
+					page: 1,
+					group: ""
+				},
+				isLoadMore: false,
+				loadMoreText: '',
+				hasNext: false,
+				dataList: [],
+				lock: false
+			};
+		},
+		computed: {
+			galleryConfig() {
+				return this.$tm.vx.getters().getConfigs.pageConfig.galleryConfig;
+			},
+			haloConfigs() {
+				return this.$tm.vx.getters().getConfigs;
+			},
+			mockJson() {
+				return this.$tm.vx.getters().getMockJson;
+			},
+			calcAuditModeEnabled() {
+				return this.haloConfigs.auditConfig.auditModeEnabled
+			},
+		},
+		watch: {
+			galleryConfig: {
+				async handler(newValue, oldValue) {
+					if (!newValue) return;
+					this.fnSetPageTitle(newValue.pageTitle);
+					this.fnGetCategory();
+				},
+				deep: true,
+				immediate: true
+			}
+		},
+		async onLoad() {
+			// 检查插件
+			this.setPluginId(this.NeedPluginIds.PluginPhotos)
+			this.setPluginError("阿偶，检测到当前插件没有安装或者启用，无法使用图库功能哦，请联系管理员")
+			await this.checkPluginAvailable()
+		},
+		onPullDownRefresh() {
+			if (!this.uniHaloPluginAvailable) {
+				uni.hideLoading();
+				uni.stopPullDownRefresh();
+				return
+			}
+			this.dataList = []
+			this.isLoadMore = false;
+			this.queryParams.page = 1;
+			this.fnGetData(true);
+		},
+		onReachBottom(e) {
+			if (!this.uniHaloPluginAvailable) return;
+			if (this.calcAuditModeEnabled) {
+				uni.showToast({
+					icon: 'none',
+					title: '没有更多数据了'
+				});
+				return;
+			}
+
+			if (this.hasNext) {
+				this.queryParams.page += 1;
+				this.isLoadMore = true;
+				this.fnGetData(false);
+			} else {
+				uni.showToast({
+					icon: 'none',
+					title: '没有更多数据了'
+				});
+			}
+		},
+		methods: {
+			fnGetDataByCategory(index) {
+				this.fnResetSetAniWaitIndex();
+				this.queryParams.group = this.category.list[index].name;
+				this.queryParams.page = 1;
+				this.fnToTopPage();
+				this.dataList = [];
+				this.fnGetData(true);
+			},
+			fnOnCategoryChange(index) {
+				if (this.lock) {
+					// uni.showToast({
+					// 	title: "上一个请求进行中...",
+					// 	icon: "none"
+					// })
+					return;
+				}
+				this.fnGetDataByCategory(index)
+			},
+			fnGetCategory() {
+				if (this.calcAuditModeEnabled) {
+					this.fnGetData(true);
+					return
+				}
+				this.$httpApi.v2.getPhotoGroupList({
+					page: 1,
+					size: 0
+				}).then(res => {
+					this.category.list = res.map(item => {
+						return {
+							name: item.metadata.name,
+							displayName: item.spec.displayName,
+							priority: item.spec.priority
+						}
+					}).sort((a, b) => a.priority - b.priority)
+					this.category.list.unshift({
+						name: undefined,
+						displayName: '全部',
+						priority: 0
+					});
+					if (this.category.list.length !== 0) {
+						this.queryParams.group = this.category.list[0].name;
+						this.fnGetData(true);
+					}
+				}).catch(e => {
+					this.loading = 'error'
+					this.category.list = []
+					this.category.activeIndex = 0
+					this.category.activeValue = ""
+				});
+			},
+			fnGetData(isClearWaterfall = false) {
+				if (this.calcAuditModeEnabled) {
+					this.dataList = this.mockJson.gallery.list.map(item => {
+						return {
+							metadata: {
+								name: Date.now() * Math.random(),
+							},
+							spec: {
+								url: this.$utils.checkImageUrl(item)
+							}
+						}
+					})
+
+					this.loading = 'success';
+
+					if (this.galleryConfig.useWaterfall) {
+						this.$nextTick(() => {
+							if (isClearWaterfall) {
+								this.$refs.wafll.clear()
+							}
+							setTimeout(() => {
+								this.$refs.wafll.pushData(this.dataList)
+							}, 50)
+						})
+					}
+					this.loadMoreText = '呜呜，没有更多数据啦~';
+					uni.hideLoading();
+					uni.stopPullDownRefresh();
+					this.lock = false;
+					return;
+				}
+
+				// 设置状态为加载中
+				if (!this.isLoadMore) {
+					this.loading = 'loading';
+				}
+				this.loadMoreText = '';
+				this.$httpApi.v2
+					.getPhotoListByGroupName(this.queryParams)
+					.then(res => {
+						this.hasNext = res.hasNext;
+						this.loading = 'success';
+						if (res.items.length !== 0) {
+							const _list = res.items.map((item, index) => {
+								item.spec.url = this.$utils.checkImageUrl(item.spec.url || item.spec.cover);
+								return item;
+							});
+							if (this.isLoadMore) {
+								this.dataList = this.dataList.concat(_list);
+							} else {
+								this.dataList = _list;
+							}
+							if (this.galleryConfig.useWaterfall) {
+								this.$nextTick(() => {
+									if (isClearWaterfall) {
+										this.$refs.wafll.clear()
+									}
+									this.$refs.wafll.pushData(_list)
+								})
+							}
+						}
+						this.loadMoreText = res.hasNext ? '上拉加载更多' : '呜呜，没有更多数据啦~';
+					})
+					.catch(err => {
+						console.error(err);
+						this.loading = 'error';
+						this.loadMoreText = '加载失败，请下拉刷新！';
+					})
+					.finally(() => {
+						setTimeout(() => {
+							uni.hideLoading();
+							uni.stopPullDownRefresh();
+							this.lock = false;
+						}, 500);
+					});
+			},
+			fnOnFlowClick({
+				item
+			}) {
+				this.fnPreview(item)
+			},
+			// 预览
+			fnPreview(data) {
+				uni.previewImage({
+					current: this.dataList.findIndex(x => x.metadata.name === data.metadata.name),
+					urls: this.dataList.map(x => x.spec.url),
+					indicator: 'number',
+					loop: true
+				});
+			},
+			touchLeft() {
+				if (this.loading != "success") return;
+				this.category.activeIndex += 1
+				if (this.category.activeIndex >= this.category.list.length) {
+					this.category.activeIndex = 0
+				}
+				this.lock = true
+				this.fnGetDataByCategory(this.category.activeIndex)
+			},
+			touchRight() {
+				if (this.loading != "success") return;
+				this.category.activeIndex -= 1
+				if (this.category.activeIndex < 0) {
+					this.category.activeIndex = 0
+				}
+				this.lock = true
+				this.fnGetDataByCategory(this.category.activeIndex)
+			}
+		}
+	};
 </script>

 <style lang="scss" scoped>
-.app-page {
-    width: 100vw;
-    min-height: 100vh;
-    display: flex;
-    flex-direction: column;
-    padding-bottom: 24rpx;
-    background-color: #fafafa;
-}
+	.app-page {
+		width: 100vw;
+		min-height: 100vh;
+		display: flex;
+		flex-direction: column;
+		padding-bottom: 24rpx;
+		background-color: #fafafa;
+	}

-.content {
-    display: flex;
-    flex-wrap: wrap;
-    box-sizing: border-box;
-    padding: 24rpx 24rpx 0;
-    gap: 12rpx 0;
+	.content {
+		width: 100%;
+		display: flex;
+		flex-wrap: wrap;
+		box-sizing: border-box;

-    .content-empty {
-        width: 100%;
-        height: 70vh;
-        display: flex;
-        align-items: center;
-        justify-content: center;
-    }
-}
+		.content-empty {
+			width: 100%;
+			height: 70vh;
+			display: flex;
+			align-items: center;
+			justify-content: center;
+		}
+	}

-.loading-wrap {
-    box-sizing: border-box;
-    padding: 24rpx;
-}
+	.touch-listen-content {
+		width: 100%;
+		display: flex;
+		flex-wrap: wrap;
+		box-sizing: border-box;
+		padding: 24rpx 24rpx 0;
+		gap: 12rpx 0;
+	}

-.load-text {
-    width: 100%;
-    text-align: center;
-}
+	.loading-wrap {
+		box-sizing: border-box;
+		padding: 24rpx;
+	}
+
+	.load-text {
+		width: 100%;
+		text-align: center;
+	}
+
+	.flot-buttons {
+		position: fixed;
+		bottom: 100rpx;
+		right: 32rpx;
+		flex-direction: column;
+		display: flex;
+		gap: 6rpx;
+		z-index: 999;
+	}
 </style>
@@ -1,240 +1,410 @@
 <template>
-    <view class="app-page">
-        <view v-if="loading != 'success'" class="loading-wrap">
-            <tm-skeleton model="listAvatr"></tm-skeleton>
-            <tm-skeleton model="listAvatr"></tm-skeleton>
-            <tm-skeleton model="listAvatr"></tm-skeleton>
-        </view>
-        <!-- 内容区域 -->
-        <view v-else class="app-page-content">
-            <view v-if="dataList.length == 0" class="content-empty flex flex-center" style="min-height: 70vh;">
-                <!-- 空布局 -->
-                <tm-empty icon="icon-shiliangzhinengduixiang-" label="暂无数据"></tm-empty>
-            </view>
-            <block v-else>
-                <block v-for="(moment, index) in dataList" :key="index">
-                    <!--  卡片 -->
-                    <tm-translate animation-name="fadeUp" :wait="calcAniWait()">
-                        <view class="moment-card">
-                            <view class="head" style="display: flex;align-items: center;">
-                                <view class="avatar" style="flex-shrink: 0;">
-                                    <image style="width: 66rpx;height: 66rpx;border-radius: 50%;"
-                                           :src="moment.spec.user.avatar"/>
-                                </view>
-                                <view class="nickname" style="margin-left: 12rpx;">
-                                    <view style="font-size: 30rpx;font-weight: bold;color: #333333;">
-                                        {{ moment.spec.user.displayName }}
-                                    </view>
-                                    <view style="margin-top: 6rpx;font-size: 24rpx;color: #666;">
-                                        {{ {d: moment.spec.releaseTime, f: 'yyyy年MM月dd日 星期w'} | formatTime }}
-                                    </view>
-                                </view>
-                            </view>
-                            <view class="content">
-                                <mp-html class="evan-markdown" lazy-load :domain="markdownConfig.domain"
-                                         :loading-img="markdownConfig.loadingGif" :scroll-table="true" :selectable="true"
-                                         :tag-style="markdownConfig.tagStyle" :container-style="markdownConfig.containStyle"
-                                         :content="moment.spec.content.html" :markdown="true" :showLineNumber="true"
-                                         :showLanguageName="true" :copyByLongPress="true"/>
-                            </view>
-                            <view v-if="moment.spec.content.medium.length!==0" class="images"
-                                  :class="['images-'+moment.spec.content.medium.length]">
-                                <view class="image-item" v-for="(image,mediumIndex) in moment.spec.content.medium"
-                                      :key="mediumIndex">
-                                    <image mode="aspectFill" style="width: 100%;height: 100%;border-radius: 6rpx;"
-                                           :src="image.url"
-                                           @click="handlePreview(mediumIndex,moment.spec.content.medium)"/>
-                                </view>
-                            </view>
-                        </view>
-                    </tm-translate>
-                </block>
-                <tm-flotbutton @click="fnToTopPage" size="m" color="light-blue" icon="icon-angle-up"></tm-flotbutton>
-                <view class="load-text">{{ loadMoreText }}</view>
-            </block>
-        </view>
-    </view>
+	<view class="app-page" :class="[uniHaloPluginPageClass]">
+		<PluginUnavailable v-if="!uniHaloPluginAvailable" :pluginId="uniHaloPluginId"
+			:error-text="uniHaloPluginAvailableError" />
+		<template v-else>
+			<view v-if="loading !== 'success'" class="loading-wrap">
+				<tm-skeleton model="listAvatr"></tm-skeleton>
+				<tm-skeleton model="listAvatr"></tm-skeleton>
+				<tm-skeleton model="listAvatr"></tm-skeleton>
+			</view>
+			<!-- 内容区域 -->
+			<view v-else class="app-page-content">
+				<view v-if="dataList.length === 0" class="content-empty flex flex-center" style="min-height: 70vh;">
+					<!-- 空布局 -->
+					<tm-empty icon="icon-shiliangzhinengduixiang-" label="暂无数据"></tm-empty>
+				</view>
+				<block v-else>
+					<!-- 卡片 -->
+					<tm-translate v-for="(moment, index) in dataList" :key="moment.metadata.name"
+						animation-name="fadeUp" :wait="calcAniWait(index)">
+						<view class="moment-card">
+							<view class="head" style="display: flex;align-items: center;">
+								<view class="avatar" style="flex-shrink: 0;">
+									<image style="width: 66rpx;height: 66rpx;border-radius: 50%;"
+										:src="moment.spec.user.avatar" />
+								</view>
+								<view class="nickname" style="margin-left: 12rpx;">
+									<view style="font-size: 30rpx;font-weight: bold;color: #333333;">
+										{{ moment.spec.user.displayName }}
+									</view>
+									<view style="margin-top: 6rpx;font-size: 24rpx;color: #666;">
+										{{ {d: moment.spec.releaseTime, f: 'yyyy年MM月dd日 星期w'} | formatTime }}
+									</view>
+								</view>
+							</view>
+							<view class="content" @click.stop="handleToMomentDetail(moment)">
+								<mp-html class="evan-markdown" lazy-load :domain="markdownConfig.domain"
+									:loading-img="markdownConfig.loadingGif" :scroll-table="true" :selectable="true"
+									:tag-style="markdownConfig.tagStyle" :container-style="markdownConfig.containStyle"
+									:content="moment.spec.newHtml" :markdown="true" :showLineNumber="true"
+									:showLanguageName="true" :copyByLongPress="true" />
+							</view>
+							<view v-if="moment.images && moment.images.length!==0" class="images"
+								:class="['images-'+moment.images.length]">
+								<view class="image-item" v-for="(image,mediumIndex) in moment.images"
+									:key="mediumIndex">
+									<image mode="aspectFill" style="width: 100%;height: 100%;border-radius: 6rpx;"
+										:src="image.url" @click="handlePreview(mediumIndex,moment.images)" />
+								</view>
+							</view>
+							<view v-if="moment.audios && moment.audios.length!==0" class="mb-12"
+								style="display: flex; flex-direction: column; gap: 12rpx 0;padding: 0 24rpx;padding-right:28rpx;">
+								<audio v-for="(audio,index) in moment.audios" :controls="true" :key="index"
+									:id="audio.url" :poster="bloggerInfo.avatar"
+									:name="'来自' + (startConfig.title||bloggerInfo.nickname) + '的声音'"
+									:author="bloggerInfo.nickname" :src="audio.url"></audio>
+							</view>
+							<view v-if="moment.videos && moment.videos.length!==0" class="mb-12"
+								style="display: flex; flex-direction: column; gap: 12rpx 0;padding: 0 24rpx; ">
+								<video style="width:100%;height: 400rpx;border-radius: 12rpx;"
+									v-for="(video,index) in moment.videos" :key="index" :src="video.url"
+									:id="'video_' + video.id" :show-mute-btn="true" :controls="true"
+									:show-center-play-btn="true" :enable-progress-gesture="true"
+									@play="onVideoPlay(video.id)" @pause="onVideoPause(video.id)"
+									@ended="onVideoEnded(video.id)"></video>
+							</view>
+							<view v-if="moment.spec.tags && moment.spec.tags.length!==0"
+								class="mt-12 px-16 pb-24 flex flex-wrap">
+								<tm-tags v-for="(tag,tagIndex) in moment.spec.tags" :key="tagIndex"
+									:color="randomTagColor()" size="m" model="text">
+									{{ tag }}
+								</tm-tags>
+							</view>
+						</view>
+					</tm-translate>
+					<tm-flotbutton @click="fnToTopPage" :width="90" size="xs" color="light-blue" :icon-size="24"
+						icon="icon-angle-up"></tm-flotbutton>
+					<view class="load-text">{{ loadMoreText }}</view>
+				</block>
+			</view>
+		</template>
+	</view>
 </template>

 <script>
-import tmSkeleton from '@/tm-vuetify/components/tm-skeleton/tm-skeleton.vue';
-import tmFlotbutton from '@/tm-vuetify/components/tm-flotbutton/tm-flotbutton.vue';
-import tmTranslate from '@/tm-vuetify/components/tm-translate/tm-translate.vue';
-import tmEmpty from '@/tm-vuetify/components/tm-empty/tm-empty.vue';
+	import tmSkeleton from '@/tm-vuetify/components/tm-skeleton/tm-skeleton.vue';
+	import tmFlotbutton from '@/tm-vuetify/components/tm-flotbutton/tm-flotbutton.vue';
+	import tmTranslate from '@/tm-vuetify/components/tm-translate/tm-translate.vue';
+	import tmEmpty from '@/tm-vuetify/components/tm-empty/tm-empty.vue';
+	import tmTags from '@/tm-vuetify/components/tm-tags/tm-tags.vue';

-import MarkdownConfig from '@/common/markdown/markdown.config.js';
-import mpHtml from '@/components/mp-html/components/mp-html/mp-html.vue';
+	import MarkdownConfig from '@/common/markdown/markdown.config.js';
+	import mpHtml from '@/components/mp-html/components/mp-html/mp-html.vue';
+	import {
+		getRandomNumberByRange
+	} from "@/utils/random.js";
+	import {
+		generateUUID
+	} from '@/utils/uuid.js';

-export default {
-    components: {
-        tmSkeleton,
-        tmFlotbutton,
-        tmTranslate,
-        tmEmpty,
-        mpHtml
-    },
-    data() {
-        return {
-            markdownConfig: MarkdownConfig,
-            loading: 'loading',
-            queryParams: {
-                size: 10,
-                page: 1
-            },
-            hasNext: false,
-            dataList: [],
-            isLoadMore: false,
-            loadMoreText: '加载中...'
-        };
-    },
+	import pluginAvailableMixin from "@/common/mixins/pluginAvailable.js"
+	import PluginUnavailable from '@/components/plugin-unavailable/plugin-unavailable.vue'
 	
-    computed: {
-        bloggerInfo() {
-            let blogger = this.$tm.vx.getters().getConfigs.authorConfig.blogger;
-            blogger.avatar = this.$utils.checkAvatarUrl(blogger.avatar, true);
-            return blogger;
-        }
-    },
+	export default {
+		mixins: [pluginAvailableMixin],
+		components: {
+			tmSkeleton,
+			tmFlotbutton,
+			tmTranslate,
+			tmEmpty,
+			tmTags,
+			mpHtml,
+			PluginUnavailable
+		},
+		data() {
+			return {
+				markdownConfig: MarkdownConfig,
+				loading: 'loading',
+				queryParams: {
+					size: 10,
+					page: 1
+				},
+				hasNext: false,
+				dataList: [],
+				isLoadMore: false,
+				loadMoreText: '加载中...',
+				tagColors: ['orange', 'green', 'red', 'blue'],
+				videoContexts: {},
+				currentVideoId: null
+			};
+		},

-    onLoad() {
-        this.fnGetData();
-    },
-    onPullDownRefresh() {
-        this.isLoadMore = false;
-        this.queryParams.page = 0;
-        this.fnGetData();
-    },
+		computed: {
+			bloggerInfo() {
+				let blogger = this.$tm.vx.getters().getConfigs.authorConfig.blogger;
+				blogger.avatar = this.$utils.checkAvatarUrl(blogger.avatar, true);
+				return blogger;
+			},
+			haloConfigs() {
+				return this.$tm.vx.getters().getConfigs;
+			},
+			mockJson() {
+				return this.$tm.vx.getters().getMockJson;
+			},
+			calcAuditModeEnabled() {
+				return this.haloConfigs.auditConfig.auditModeEnabled
+			},
+			calcUseTagRandomColor() {
+				return this.haloConfigs.pageConfig.momentConfig.useTagRandomColor
+			},
+			startConfig() {
+				return this.haloConfigs.appConfig.startConfig;
+			}
+		},
+		async onLoad() { 
+			// 检查插件
+			this.setPluginId(this.NeedPluginIds.PluginMoments)
+			this.setPluginError("阿偶，检测到当前插件没有安装或者启用，无法使用瞬间功能哦，请联系管理员")
+			if (!await this.checkPluginAvailable()) return
 			
-    onReachBottom(e) {
-        if (this.hasNext) {
-            this.queryParams.page += 1;
-            this.isLoadMore = true;
-            this.fnGetData();
-        } else {
-            uni.showToast({
-                icon: 'none',
-                title: '没有更多数据了'
-            });
-        }
-    },
-    methods: {
-        fnGetData() {
-            uni.showLoading({
-                mask: true,
-                title: '加载中...'
-            });
-            // 设置状态为加载中
-            if (!this.isLoadMore) {
-                this.loading = 'loading';
-            }
-            this.loadMoreText = '加载中...';
-            this.$httpApi.v2
-                .getMomentList(this.queryParams)
-                .then(res => {
-                    console.log('请求结果：');
-                    console.log(res);
+			this.fnGetData();
+		},
+		onPullDownRefresh() {
+			if (!this.uniHaloPluginAvailable) {
+				uni.hideLoading();
+				uni.stopPullDownRefresh();
+				return
+			}
+			this.isLoadMore = false;
+			this.queryParams.page = 0;
+			this.videoContexts = {};
+			this.currentVideoId = null;
+			this.fnGetData();
+		},
+		onReachBottom(e) {
+			if (!this.uniHaloPluginAvailable) return;
+			if (this.calcAuditModeEnabled) {
+				uni.showToast({
+					icon: 'none',
+					title: '没有更多数据了'
+				});
+				return
+			}
+			if (this.hasNext) {
+				this.queryParams.page += 1;
+				this.isLoadMore = true;
+				this.fnGetData();
+			} else {
+				uni.showToast({
+					icon: 'none',
+					title: '没有更多数据了'
+				});
+			}
+		},
+		methods: {
+			fnGetData() {
+				if (this.calcAuditModeEnabled) {
+					this.dataList = this.mockJson.moments.list.map((item) => {
+						return {
+							metadata: {
+								name: Date.now() * Math.random(),
+							},
+							spec: {
+								user: {
+									displayName: this.bloggerInfo.nickname,
+									avatar: this.$utils.checkAvatarUrl(this.bloggerInfo.avatar),
+								},
+								content: {
+									html: item.content
+								},
+								releaseTime: item.time,
+								visible: "PUBLIC"
+							},
+							images: item.images.map((img) => {
+								return {
+									type: "PHOTO",
+									url: this.$utils.checkThumbnailUrl(img),
+								}
+							}),
+							videos: []
+						}
+					});
+					this.loading = 'success';
+					this.loadMoreText = '呜呜，没有更多数据啦~';
+					uni.hideLoading();
+					uni.stopPullDownRefresh();
+					return;
+				}
+				uni.showLoading({
+					mask: true,
+					title: '加载中...'
+				});
+				// 设置状态为加载中
+				if (!this.isLoadMore) {
+					this.loading = 'loading';
+				}
+				this.loadMoreText = '加载中...';
+				this.$httpApi.v2
+					.getMomentList(this.queryParams)
+					.then(res => {
+						this.loading = 'success';
+						this.loadMoreText = res.hasNext ? '上拉加载更多' : '呜呜，没有更多数据啦~';
+						this.hasNext = res.hasNext;

-                    this.loading = 'success';
-                    this.loadMoreText = res.hasNext ? '上拉加载更多' : '呜呜，没有更多数据啦~';
-                    this.hasNext = res.hasNext;
+						const tempItems = res.items.filter(x => x.spec.visible === 'PUBLIC').map(item => {
+							item.spec.user = {
+								displayName: this.bloggerInfo.nickname,
+								avatar: this.$utils.checkAvatarUrl(this.bloggerInfo.avatar)
+							}
+							item.spec.content.medium.map(medium => {
+								medium.url = this.$utils.checkThumbnailUrl(medium.url, true)
+							})

-                    const tempItems = res.items.map(item => {
-                        item.spec.user = {
-                            displayName: this.bloggerInfo.nickname,
-                            avatar: this.$utils.checkAvatarUrl(this.bloggerInfo.avatar)
-                        }
-                        item.spec.content.medium
-                            .filter(x => x.type === 'PHOTO')
-                            .map(medium => {
-                                medium.url = this.$utils.checkThumbnailUrl(medium.url, true)
-                            })
-                        return item;
-                    })
+							item.spec.newHtml = this.removeTagLinksCompletely(item.spec.content.html, '')
+							item['images'] = item.spec.content.medium
+								.filter(x => x.type === 'PHOTO')

-                    if (this.isLoadMore) {
-                        this.dataList = this.dataList.concat(tempItems);
-                    } else {
-                        this.dataList = tempItems;
-                    }
-                })
-                .catch(err => {
-                    console.error(err);
-                    this.loading = 'error';
-                    this.loadMoreText = '加载失败，请下拉刷新！';
-                })
-                .finally(() => {
-                    setTimeout(() => {
-                        uni.hideLoading();
-                        uni.stopPullDownRefresh();
-                    }, 500);
-                });
-        },
-        handlePreview(index, list) {
-            uni.previewImage({
-                current: index,
-                urls: list.map(item => item.url)
-            })
-        }
-    }
-};
+							item['videos'] = item.spec.content.medium
+								.filter(x => x.type === 'VIDEO').map(item => {
+									item.id = generateUUID()
+									return item;
+								})
+
+							item['audios'] = item.spec.content.medium
+								.filter(x => x.type === 'AUDIO')
+							return item;
+						})
+
+						if (this.isLoadMore) {
+							this.dataList = this.dataList.concat(tempItems);
+						} else {
+							this.dataList = tempItems;
+						}
+
+						this.$nextTick(() => {
+							this.createVideoContexts(tempItems);
+						})
+
+					})
+					.catch(err => {
+						console.error(err);
+						this.loading = 'error';
+						this.loadMoreText = '加载失败，请下拉刷新！';
+					})
+					.finally(() => {
+						setTimeout(() => {
+							uni.hideLoading();
+							uni.stopPullDownRefresh();
+						}, 500);
+					});
+			},
+			handlePreview(index, list) {
+				uni.previewImage({
+					current: index,
+					urls: list.map(item => item.url)
+				})
+			},
+			removeTagLinksCompletely(htmlString) {
+				const regex = /<a\s+(?:[^>]*?\s+)?class=(['"])[^'"]*?\btag\b[^'"]*?\1[^>]*?>.*?<\/a>/gi;
+				const newHtml = htmlString.replace(regex, '');
+				return newHtml
+			},
+			randomTagColor() {
+				if (!this.calcUseTagRandomColor) return "blue";
+				const randomIndex = getRandomNumberByRange(0, this.tagColors.length);
+				return this.tagColors[randomIndex];
+			},
+			createVideoContexts(list) {
+				this.stopAllVideos()
+				list.map(item => item.videos).flat().forEach(item => {
+					this.videoContexts[item.id] = uni.createVideoContext(`video_${item.id}`, this);
+				})
+			},
+			onVideoPlay(videoId) {
+				this.currentVideoId = videoId;
+				this.stopAllVideos(videoId)
+			},
+			onVideoPause(videoId) {
+				if (this.currentVideoId == videoId) {
+					this.currentVideoId = null;
+				}
+			},
+			onVideoEnded(videoId) {
+				this.currentVideoId = null;
+			},
+			stopAllVideos(excludesVideoId = null) {
+				Object.keys(this.videoContexts).forEach(videoId => {
+					if (!excludesVideoId || excludesVideoId != videoId) {
+						const videoContext = this.videoContexts[videoId]
+						videoContext?.pause();
+					}
+				});
+			},
+			handleToMomentDetail(moment) {
+				if (this.calcAuditModeEnabled) return;
+				uni.navigateTo({
+					url: '/pagesA/moment-detail/moment-detail?name=' + moment.metadata.name,
+					animationType: 'slide-in-right'
+				});
+			}
+		}
+	};
 </script>

 <style lang="scss" scoped>
-.app-page {
-    width: 100vw;
-    display: flex;
-    flex-direction: column;
-    padding: 24rpx 0;
-}
+	.app-page {
+		box-sizing: border-box;
+		width: 100vw;
+		min-height: 100vh;
+		display: flex;
+		flex-direction: column;
+		padding: 24rpx 0;
+	}

-.loading-wrap {
-    padding: 24rpx;
-}
+	.loading-wrap {
+		padding: 24rpx;
+	}

-.moment-card {
-    display: flex;
-    flex-direction: column;
-    box-sizing: border-box;
-    margin: 0 24rpx;
-    border-radius: 12rpx;
-    background-color: #ffff;
-    box-shadow: 0rpx 2rpx 24rpx rgba(0, 0, 0, 0.03);
-    overflow: hidden;
-    margin-bottom: 24rpx;
-}
+	.moment-card {
+		display: flex;
+		flex-direction: column;
+		box-sizing: border-box;
+		margin: 0 24rpx;
+		border-radius: 12rpx;
+		background-color: #ffff;
+		box-shadow: 0rpx 2rpx 24rpx rgba(0, 0, 0, 0.03);
+		overflow: hidden;
+		margin-bottom: 24rpx;
+	}

-.head {
-    padding: 24rpx;
-    padding-bottom: 0;
-}
+	.head {
+		padding: 24rpx;
+		padding-bottom: 0;
+	}

-.images {
-    display: flex;
-    flex-wrap: wrap;
-    align-items: flex-start;
-    padding: 24rpx;
-    padding-top: 0;
+	.images {
+		display: flex;
+		flex-wrap: wrap;
+		align-items: flex-start;
+		padding: 24rpx;
+		padding-top: 0;

-    .image-item {
-        box-sizing: border-box;
-        border-radius: 24rpx;
-        padding: 6rpx;
-        width: 33%;
-        height: 200rpx
-    }
+		.image-item {
+			box-sizing: border-box;
+			border-radius: 24rpx;
+			padding: 6rpx;
+			width: 33%;
+			height: 200rpx
+		}

-    &-1 {
-        > .image-item {
-            width: 100%;
-            height: 350rpx
-        }
-    }
+		&-1 {
+			>.image-item {
+				width: 100%;
+				height: 350rpx
+			}
+		}

-    &-2 {
-        > .image-item {
-            width: 50%;
-            height: 250rpx
-        }
-    }
-}
+		&-2 {
+			>.image-item {
+				width: 50%;
+				height: 250rpx
+			}
+		}
+	}
+
+	::v-deep .uni-audio-default {
+		width: 100%;
+		border-radius: 12rpx;
+	}
 </style>
@@ -10,11 +10,11 @@
                <tm-listitem title="开源组织" :font-size="28" @click="$utils.copyText('https://www.ialley.cn', '巷子工坊官网已复制成功！')">
                    <text class="text-size-s" slot="rightValue">巷子工坊</text>
                </tm-listitem>
-                <tm-listitem title="开源作者" :font-size="28" @click="$utils.copyText('https://b.925i.cn', '作者博客地址已复制')">
+                <tm-listitem title="开源作者" :font-size="28" @click="$utils.copyText('https://www.xiaoxiaomo.cn', '作者主页地址已复制')">
                    <text class="text-size-s" slot="rightValue">小莫唐尼</text>
                </tm-listitem>
-                <tm-listitem title="作者博客" :font-size="28" @click="$utils.copyText('https://b.925i.cn', '作者博客地址已复制')">
-                    <text class="text-size-s text-overflow" slot="rightValue">https://b.925i.cn</text>
+                <tm-listitem title="作者博客" :font-size="28" @click="$utils.copyText('https://blog.xiaoxiaomo.cn', '作者博客地址已复制')">
+                    <text class="text-size-s text-overflow" slot="rightValue">https://blog.xiaoxiaomo.cn</text>
                </tm-listitem>
                <tm-listitem title="文档地址" :font-size="28" @click="$utils.copyText('https://uni-halo.925i.cn', '项目码云仓库已复制')">
                    <text class="text-size-s text-overflow" slot="rightValue">https://uni-halo.925i.cn</text>
@@ -1,145 +0,0 @@
-<template>
-    <tm-fullView>
-        <tm-sheet :shadow="24">
-            <tm-alerts label="观看视频即可获取注册码" close></tm-alerts>
-            <tm-divider color="red" model="dashed" :text="codeDataShow?'请复制下方注册码':'请点击“获取注册码”'"></tm-divider>
-            <view class="ma-20" v-show="!codeDataShow">
-                <tm-button theme="bg-gradient-orange-accent" :round="24" block @click="openVideoAd">获取注册码</tm-button>
-            </view>
-            <view class="ma-20" v-show="codeDataShow">
-                <tm-coupon :hdata="codeData" color="orange" @click="fnCopyCode"></tm-coupon>
-            </view>
-        </tm-sheet>
-        <!-- 		<tm-sheet :shadow="24">
-            <tm-images @load="loadimg" src="https://picsum.photos/300?id=7"></tm-images>
-        </tm-sheet> -->
-    </tm-fullView>
-
-</template>
-
-<script>
-let videoAd = null;
-import tmFullView from "@/tm-vuetify/components/tm-fullView/tm-fullView.vue"
-import tmMenubars from "@/tm-vuetify/components/tm-menubars/tm-menubars.vue"
-import tmSheet from "@/tm-vuetify/components/tm-sheet/tm-sheet.vue"
-import tmAlerts from "@/tm-vuetify/components/tm-alerts/tm-alerts.vue"
-import tmDivider from "@/tm-vuetify/components/tm-divider/tm-divider.vue"
-import tmCoupon from '@/tm-vuetify/components/tm-coupon/tm-coupon.vue'
-import tmButton from "@/tm-vuetify/components/tm-button/tm-button.vue"
-import tmImages from "@/tm-vuetify/components/tm-images/tm-images.vue"
-
-export default {
-    components: {
-        tmFullView,
-        tmMenubars,
-        tmSheet,
-        tmAlerts,
-        tmDivider,
-        tmCoupon,
-        tmButton,
-        tmImages
-    },
-    data() {
-        return {
-            adUnitId: '',
-            codeDataShow: false,
-            codeData: {
-                // img: 'https://lywq.muyin.site/logo.png',
-                title: "请获取",
-                btnText: '复制',
-                time: '有效期5分钟',
-                sale: '',
-                saleLable: '注册码',
-                saleSplit: ''
-            }
-        }
-    },
-    computed: {
-        toolsPluginConfigs() {
-            return this.$tm.vx.getters().getConfigs?.pluginConfig?.toolsPlugin || {};
-        }
-    },
-    onLoad(options) {
-        // #ifdef MP-WEIXIN
-        wx.hideShareMenu();
-        this.adLoad();
-        // #endif
-        uni.onCopyUrl((result) => {
-            setTimeout(() => {
-                uni.setClipboardData({
-                    data: "禁止复制哦",
-                })
-            }, 1000);
-        })
-    },
-    methods: {
-        adLoad() {
-            if (wx.createRewardedVideoAd) {
-                videoAd = wx.createRewardedVideoAd({
-                    adUnitId: this.toolsPluginConfigs.rewardedVideoAdId //你的广告key
-                })
-                videoAd.onError(err => {
-                })
-                videoAd.onClose((status) => {
-                    if (status && status.isEnded || status === undefined) {
-                        //这里写广告播放完成后的事件
-                        this.getRegistrationCode();
-                    } else {
-                        // 广告播放未完成
-                    }
-                })
-            }
-        },
-        openVideoAd: function () {
-            if (videoAd && this.toolsPluginConfigs.rewardedVideoAdId !== '') {
-                videoAd.show().catch(err => {
-                    // 失败重试
-                    console.log("广告拉取失败")
-                    videoAd.load().then(() => videoAd.show())
-                })
-            } else {
-                this.getRegistrationCode();
-            }
-        },
-        getRegistrationCode() {
-            uni.showLoading({
-                title: '正在获取...'
-            });
-            this.$httpApi.v2.getPostVerifyCode()
-                .then(res => {
-                    if (res.code === 200) {
-                        uni.$tm.toast('获取成功！');
-                        this.codeData.title = res.data;
-                        this.codeDataShow = true;
-                    } else {
-                        uni.$tm.toast('操作失败，请重试！');
-                    }
-                })
-                .catch(err => {
-                    uni.$tm.toast(err.message);
-                });
-        },
-        fnCopyCode() {
-            uni.setClipboardData({
-                data: this.codeData.title,
-                showToast: false,
-                success: () => {
-                    uni.showToast({
-                        icon: 'none',
-                        title: '复制成功！'
-                    });
-                    setTimeout(() => {
-                        uni.navigateBack()
-                    }, 500);
-                },
-                fail: () => {
-                    uni.showToast({
-                        icon: 'none',
-                        title: '复制失败！'
-                    });
-                }
-            });
-        }
-    }
-}
-</script>
@@ -1,13 +1,15 @@
 <template>
    <view class="app-page">
+
        <view class="e-fixed">
-            <tm-tabs color="light-blue" v-model="tab.activeIndex" :list="tab.list" align="center" @change="fnOnTabChange"></tm-tabs>
+            <tm-tabs color="light-blue" v-model="tab.activeIndex" :list="tab.list" align="center"
+                     @change="fnOnTabChange"></tm-tabs>
        </view>
        <!-- 占位区域 -->
        <view style="width: 100vw;height: 90rpx;"></view>

        <!-- 骨架屏：加载区域 -->
-        <view v-if="loading != 'success'" class="loading-wrap">
+        <view v-if="loading !== 'success'" class="loading-wrap">
            <tm-skeleton model="listAvatr"></tm-skeleton>
            <tm-skeleton model="listAvatr"></tm-skeleton>
            <tm-skeleton model="listAvatr"></tm-skeleton>
@@ -15,46 +17,55 @@

        <!-- 加载完成区域 -->
        <block v-else>
-            <view v-if="dataList.length == 0" class="list-empty flex flex-center">
-                <tm-empty icon="icon-shiliangzhinengduixiang-" label="暂无归档的文章"></tm-empty>
+            <view v-if="dataList.length === 0" class="list-empty flex flex-center">
+                <tm-empty v-if="calcAuditModeEnabled" icon="icon-shiliangzhinengduixiang-" label="暂无归档的内容"></tm-empty>
+                <tm-empty v-else icon="icon-shiliangzhinengduixiang-" label="暂无归档的文章"></tm-empty>
            </view>
            <view v-else class="e-timeline tm-timeline mt-24">
                <block v-for="(item, index) in dataList" :key="index">
                    <view class="tm-timeline-item tm-timeline-item--leftDir">
                        <view style="width: 160rpx;">
                            <view :style="{ width: '24rpx', height: '24rpx' }" :class="[black_tmeme ? 'bk' : '']"
-                                  class="flex-center rounded tm-timeline-jidian border-white-a-2 grey-lighten-2 light-blue shadow-primary-4"></view>
+                                  class="flex-center rounded tm-timeline-jidian border-white-a-2 grey-lighten-2 light-blue shadow-primary-4">
+                            </view>
                            <view :style="{ marginTop: '-24rpx' }"
                                  :class="[index !== dataList.length - 1 ? 'tm-timeline-item-boder' : '', black_tmeme ? 'bk' : '']"
                                  class="grey-lighten-2"></view>
                        </view>
                        <view class="tm-timeline-item-content relative">
                            <view class="tm-timeline-item-left">
-                                <view class="time text-weight-b mb-24">
-                                    {{ item.year }}年
-                                    <block v-if="tab.activeIndex == 0">{{ item.month }}月</block>
-                                    <text class="text-size-s text-grey-darken-1 ml-24">（共发布 {{ item.posts.length }} 篇文章）</text>
+                                <view class="flex time text-weight-b mb-24">
+                                    <text>{{ item.year }}年</text>
+                                    <text v-if="tab.activeIndex === 0">{{ item.month }}月</text>
+                                    <view v-if="calcAuditModeEnabled" class="text-size-s text-grey-darken-1 ml-12">
+                                        （共 {{ item.posts.length }} 篇内容）
+                                    </view>
+                                    <view v-else class="text-size-s text-grey-darken-1 ml-12">
+                                        （共 {{ item.posts.length }} 篇文章）
+                                    </view>
                                </view>
-                                <block v-if="item.posts.length != 0">
-                                    <block v-for="(post, postIndex) in item.posts" :key="post.id">
-                                        <tm-translate animation-name="fadeUp" :wait="calcAniWait(postIndex)">
-                                            <view class="flex post shadow-3 pa-24 mb-24" :class="[globalAppSettings.layout.cardType]"
-                                                  @click="fnToArticleDetail(post)">
-                                                <image class="post-thumbnail" :src="$utils.checkThumbnailUrl(post.thumbnail)"
-                                                       mode="aspectFill"></image>
-                                                <view class="post-info pl-20">
-                                                    <view class="post-info_title text-overflow">{{ post.title }}</view>
-                                                    <view class="post-info_summary text-overflow-2 mt-12 text-size-s text-grey-darken-1">
-                                                        {{ post.summary }}
-                                                    </view>
-                                                    <view class="post-info_time mt-12  text-size-s text-grey-darken-1">
-                                                        <text class="iconfont icon-clock text-size-s mr-6"></text>
-                                                        <text class="time-label">发布时间：</text>
-                                                        {{ {d: post.createTime, f: 'yyyy年MM月dd日 星期w'} | formatTime }}
-                                                    </view>
+                                <block v-if="item.posts.length !== 0">
+                                    <block v-for="(post, postIndex) in item.posts" :key="post.metadata.name">
+                                        <view class="flex post shadow-3 pa-24 mb-24"
+                                              :class="[globalAppSettings.layout.cardType]"
+                                              @click="fnToArticleDetail(post)">
+                                            <image class="post-thumbnail"
+                                                   :src="$utils.checkThumbnailUrl(post.spec.cover)" mode="aspectFill">
+                                            </image>
+                                            <view class="post-info pl-20">
+                                                <view class="post-info_title text-overflow">{{ post.spec.title }}
+                                                </view>
+                                                <view
+                                                    class="post-info_summary text-overflow-2 mt-12 text-size-s text-grey-darken-1">
+                                                    {{ post.status.excerpt }}
+                                                </view>
+                                                <view class="post-info_time mt-12  text-size-s text-grey-darken-1">
+                                                    <text class="iconfont icon-clock text-size-s mr-6"></text>
+                                                    <text class="time-label">发布时间：</text>
+                                                    {{ {d: post.spec.publishTime, f: 'yyyy年MM月dd日 星期w'} | formatTime }}
                                                </view>
                                            </view>
-                                        </tm-translate>
+                                        </view>
                                    </block>
                                </block>
                                <view v-else class="post-empty text-size-m text-grey-darken-1">该日期下暂无归档文章！</view>
@@ -63,8 +74,10 @@
                    </view>
                </block>
            </view>
+            <view class="load-text mt-12">{{ loadMoreText }}</view>
            <!-- 返回顶部 -->
-            <tm-flotbutton @click="fnToTopPage" size="m" color="bg-gradient-light-blue-accent" icon="icon-angle-up"></tm-flotbutton>
+            <tm-flotbutton @click="fnToTopPage" size="m" color="bg-gradient-light-blue-accent"
+                           icon="icon-angle-up"></tm-flotbutton>
        </block>
    </view>
 </template>
@@ -75,6 +88,7 @@ import tmTranslate from '@/tm-vuetify/components/tm-translate/tm-translate.vue';
 import tmFlotbutton from '@/tm-vuetify/components/tm-flotbutton/tm-flotbutton.vue';
 import tmTabs from '@/tm-vuetify/components/tm-tabs/tm-tabs.vue';
 import tmEmpty from '@/tm-vuetify/components/tm-empty/tm-empty.vue';
+import qs from 'qs'

 export default {
    components: {
@@ -93,11 +107,13 @@ export default {
            },
            queryParams: {
                size: 10,
-                page: 0
+                page: 1
            },
-            result: null,
-            dataList: [],
-            api: 'getMonthArchives'
+            result: {},
+            cacheDataList: [], // 所有请求的缓存数据
+            dataList: [], // 显示的数据
+            isLoadMore: false,
+            loadMoreText: "加载中..."
        };
    },
    computed: {
@@ -106,53 +122,245 @@ export default {
        },
        color_tmeme: function () {
            return this.$tm.vx.state().tmVuetify.color;
-        }
+        },
+        haloConfigs() {
+            return this.$tm.vx.getters().getConfigs;
+        },
+        mockJson() {
+            return this.$tm.vx.getters().getMockJson;
+        },
+        calcAuditModeEnabled() {
+            return this.haloConfigs.auditConfig.auditModeEnabled
+        },
    },
    created() {
        this.fnGetData();
    },
    onPullDownRefresh() {
+        this.isLoadMore = false;
+        this.queryParams.page = 1;
        this.fnGetData();
-        this.queryParams.page = 0;
    },
-
+    onReachBottom(e) {
+        if (this.calcAuditModeEnabled) {
+            uni.showToast({
+                icon: 'none',
+                title: '没有更多数据了'
+            });
+            return
+        }
+        if (this.result.hasNext) {
+            this.queryParams.page += 1;
+            this.isLoadMore = true;
+            this.fnGetData();
+        } else {
+            uni.showToast({
+                icon: 'none',
+                title: '没有更多数据了'
+            });
+        }
+    },
    methods: {
        fnOnTabChange(index) {
            this.fnResetSetAniWaitIndex();
-            const _api = ['getMonthArchives', 'getYearArchives'];
-            this.api = _api[index];
            this.queryParams.page = 0;
-            this.fnGetData();
+            this.dataList = this.handleGetShowDataList(this.handleGetPosts(this.cacheDataList))
+            this.fnToTopPage();
        },
        fnGetData() {
-            this.loading = 'loading';
-            // uni.showLoading({
-            // 	mask: true,
-            // 	title: '加载中...'
-            // });
-            this.$httpApi[this.api](this.queryParams)
-                .then(res => {
-                    this.result = res.data;
-                    this.dataList = res.data;
-                    setTimeout(() => {
-                        this.loading = 'success';
-                    }, 500);
-                })
-                .catch(err => {
-                    console.error(err);
-                    this.loading = 'error';
-                })
-                .finally(() => {
-                    setTimeout(() => {
-                        uni.hideLoading();
-                        uni.stopPullDownRefresh();
-                    }, 500);
+            if (this.calcAuditModeEnabled) {
+                const dataList = this.mockJson.archives.list.map(item => {
+                    const date = new Date(item.time)
+                    const year = date.getFullYear()
+                    const month = date.getMonth() + 1
+                    return {
+                        metadata: {
+                            name: Date.now() * Math.random(),
+                            labels: {
+                                "content.halo.run/archive-year": year,
+                                "content.halo.run/archive-month": month
+                            }
+                        },
+                        spec: {
+                            pinned: false,
+                            cover: item.cover,
+                            title: item.title,
+                            publishTime: item.time
+                        },
+                        status: {
+                            excerpt: item.desc
+                        },
+                        stats: {
+                            visit: 0
+                        }
+                    }
                });
+                const posts = this.handleGetPosts(dataList)
+                this.dataList = []
+                this.cacheDataList = dataList;
+                this.dataList = this.handleGetShowDataList(posts)
+                this.loading = 'success';
+                this.loadMoreText = '呜呜，没有更多数据啦~';
+                uni.hideLoading();
+                uni.stopPullDownRefresh();
+                return;
+            }
+            if (this.isLoadMore) {
+                uni.showLoading({
+                    title: "加载中..."
+                })
+            } else {
+                this.loading = 'loading';
+            }
+            this.loadMoreText = "加载中...";
+            const paramsStr = qs.stringify(this.queryParams, {
+                allowDots: true,
+                encodeValuesOnly: true,
+                skipNulls: true,
+                encode: true,
+                arrayFormat: 'repeat'
+            })
+            uni.request({
+                url: this.$baseApiUrl + '/apis/api.content.halo.run/v1alpha1/posts?' + paramsStr,
+                method: 'GET',
+                success: (res) => {
+                    const data = res.data;
+                    this.result = data;
+                    const posts = this.handleGetPosts(data.items)
+                    const showDataList = this.handleGetShowDataList(posts)
+                    if (this.isLoadMore) {
+                        this.cacheDataList = this.handleUniqueCacheDatalist([
+                            ...this.cacheDataList, ...data.items
+                        ]);
+                        this.handleMergeDataList2(showDataList)
+                    } else {
+                        this.dataList = []
+                        this.cacheDataList = data.items;
+                        this.dataList = showDataList
+                    }
+
+                    this.loading = 'success';
+                    this.loadMoreText = data.hasNext ? '上拉加载更多' : '呜呜，没有更多数据啦~';
+                    uni.hideLoading();
+                    uni.stopPullDownRefresh();
+
+                },
+                fail: (err) => {
+                    this.loading = 'error';
+                    this.loadMoreText = '加载失败，请下拉刷新！';
+                    uni.$tm.toast(err.message || '数据加载失败！');
+                    uni.hideLoading();
+                    uni.stopPullDownRefresh();
+                }
+            })
+        },
+        // 处理数据分类
+        handleGetPosts(dataList) {
+            const posts = {}
+            const postLabelYearKey = "content.halo.run/archive-year"
+            const postLabelMonthKey = "content.halo.run/archive-month"
+            dataList.forEach(item => {
+                let postItemKey = ""
+                if (this.tab.activeIndex === 0) {
+                    postItemKey =
+                        `${item.metadata.labels[postLabelYearKey]}-${item.metadata.labels[postLabelMonthKey]}`
+                } else {
+                    postItemKey = `${item.metadata.labels[postLabelYearKey]}`
+                }
+                if (posts[postItemKey]) {
+                    posts[postItemKey].push(item)
+                } else {
+                    posts[postItemKey] = [item]
+                }
+            })
+            return posts;
+        },
+        // 根据分类的数据，处理成显示的数据
+        handleGetShowDataList(posts) {
+            const dataListResult = []
+            Object.keys(posts).forEach((key) => {
+                const postData = {
+                    sort: 0,
+                    key: key,
+                    year: key,
+                    month: "",
+                    posts: posts[key]
+                }
+                if (this.tab.activeIndex == 0) {
+                    const splitDate = key.split("-")
+                    postData.year = splitDate[0]
+                    postData.month = splitDate[1]
+                    postData.sort = Number(key.replace("-", ""))
+                } else {
+                    postData.sort = Number(key)
+                }
+                dataListResult.push(postData)
+            })
+
+            dataListResult.sort((a, b) => {
+                return Number(b.sort) - Number(a.sort)
+            })
+
+            return dataListResult;
+        },
+        handleMergeDataList(list1, list2) {
+            // 将list1转换为以key为键的对象
+            let merged = list1.reduce((acc, item) => {
+                acc[item.key] = {
+                    ...item
+                };
+                return acc;
+            }, {});
+
+            // 遍历list2，合并posts数组或添加新对象
+            list2.forEach(item => {
+                if (merged[item.key]) {
+                    // 如果key已存在，合并posts数组
+                    merged[item.key].posts = [...merged[item.key].posts, ...item.posts];
+                } else {
+                    // 如果key不存在，添加新对象
+                    merged[item.key] = {
+                        ...item
+                    };
+                }
+            });
+
+            // 将对象转换回数组
+            return Object.values(merged);
+        },
+        handleMergeDataList2(list) {
+            list.forEach((item, index) => {
+                const find = this.dataList.find(x => x.key == item.key)
+                if (find) {
+                    item.posts.forEach(post => {
+                        if (!find.posts.find(x => x.metadata.name == post.metadata.name)) {
+                            find.posts.push(post)
+                        }
+                    })
+                }
+            })
+            list.forEach(post => {
+                if (!this.dataList.find(x => x.key === post.key)) {
+                    this.dataList.push(post)
+                }
+            })
+
+            this.dataList.sort((a, b) => {
+                return Number(b.sort) - Number(a.sort)
+            })
+        },
+        handleUniqueCacheDatalist(dataList) {
+            const seen = new Set();
+            return dataList.filter(item => {
+                return seen.has(item.metadata.name) ? false : seen.add(item.metadata.name);
+            });
        },
-        //跳转文章详情
        fnToArticleDetail(article) {
+            if (this.calcAuditModeEnabled) {
+                return;
+            }
            uni.navigateTo({
-                url: '/pagesA/article-detail/article-detail?articleId=' + article.id,
+                url: '/pagesA/article-detail/article-detail?name=' + article.metadata.name,
                animationType: 'slide-in-right'
            });
        }
@@ -169,6 +377,15 @@ export default {
    background-color: #fafafd;
 }

+.auditModeEnabled {
+    width: 100%;
+    height: 80vh;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+}
+
 .loading-wrap {
    padding: 24rpx;
 }
@@ -376,4 +593,8 @@ export default {
        }
    }
 }
+
+.time {
+    align-items: center;
+}
 </style>
@@ -1,201 +1,245 @@
 <template>
-    <view class="app-page" :class="{ 'is-balck grey-darken-6': isBlackTheme }">
-        <!-- 顶部切换 -->
-        <view class="e-fixed shadow-2">
-            <tm-search v-model="queryParams.keyword" :round="24" :shadow="0" color="light-blue"
-                       insert-color="light-blue" :clear="true" @input="fnOnSearch" @confirm="fnOnSearch"></tm-search>
-            <tm-tabs v-if="false" color="light-blue" :shadow="0" v-model="tab.activeIndex" :list="tab.list"
-                     align="center" @change="fnOnTabChange"></tm-tabs>
-        </view>
-        <!-- 占位区域 -->
-        <view style="width: 100vw;height: 100rpx;"></view>
-        <!-- 加载区域 -->
-        <view v-if="loading != 'success'" class="loading-wrap pa-24">
-            <tm-skeleton model="listAvatr"></tm-skeleton>
-            <tm-skeleton model="listAvatr"></tm-skeleton>
-            <tm-skeleton model="listAvatr"></tm-skeleton>
-            <tm-skeleton model="listAvatr"></tm-skeleton>
-        </view>
-        <!-- 内容区域 -->
-        <view v-else class="content">
-            <view v-if="dataList.length == 0" class="content-empty flex flex-center">
-                <!-- 空布局 -->
-                <tm-empty v-if="!queryParams.keyword" icon="icon-shiliangzhinengduixiang-" label="请输入关键词搜索"></tm-empty>
-                <tm-empty v-else icon="icon-shiliangzhinengduixiang-"
-                          :label="`未搜到 ${queryParams.keyword} 相关内容`"></tm-empty>
-            </view>
-            <block v-else>
-                <!-- 文章卡片 -->
-                <tm-translate v-for="(article, index) in dataList" :key="article.metadataName" animation-name="fadeUp"
-                              :wait="calcAniWait(index)">
-                    <view class="article-card" @click="fnToArticleDetail(article)">
-                        <rich-text style="font-size: 32rpx;font-weight: bold;color: #333;"
-                                   :nodes="article.title"></rich-text>
-                        <rich-text style="font-size: 28rpx;margin-top: 16rpx;color: #555;"
-                                   :nodes="article.content"></rich-text>
-                        <text style="font-size: 24rpx;margin-top: 24rpx;color:#888">
-                            最近更新：{{ {d: article.updateTimestamp, f: 'yyyy年MM月dd日 HH点mm分ss秒'} | formatTime }}
-                        </text>
-                    </view>
-                </tm-translate>
+	<view class="app-page" :class="[uniHaloPluginPageClass]">
+		<PluginUnavailable v-if="!uniHaloPluginAvailable" :pluginId="uniHaloPluginId"
+			:error-text="uniHaloPluginAvailableError" />
+		<template v-else>

-                <tm-flotbutton @click="fnToTopPage" size="m" color="light-blue" icon="icon-angle-up"></tm-flotbutton>
+			<!-- 顶部切换 -->
+			<view class="e-fixed shadow-1">
+				<tm-search v-model="queryParams.keyword" :round="24" :shadow="0" color="light-blue"
+					insert-color="light-blue" :clear="true" @input="fnOnSearch" @confirm="fnOnSearch"></tm-search>
+				<tm-tabs v-if="false" color="light-blue" :shadow="0" v-model="tab.activeIndex" :list="tab.list"
+					align="center" @change="fnOnTabChange"></tm-tabs>
+			</view>
+			<!-- 占位区域 -->
+			<view style="width: 100vw;height: 100rpx;"></view>
+			<!-- 加载区域 -->
+			<view v-if="loading == 'loading'" class="loading-wrap pa-24">
+				<tm-skeleton model="listAvatr"></tm-skeleton>
+				<tm-skeleton model="listAvatr"></tm-skeleton>
+				<tm-skeleton model="listAvatr"></tm-skeleton>
+				<tm-skeleton model="listAvatr"></tm-skeleton>
+			</view>
+			<view v-else-if="loading == 'error'" class="content-empty flex flex-center">
+				<tm-empty icon="icon-wind-cry" label="搜索异常"></tm-empty>
+			</view>
+			<!-- 内容区域 -->
+			<view v-else class="content">
+				<view v-if="dataList.length == 0" class="content-empty flex flex-center">
+					<!-- 空布局 -->
+					<tm-empty v-if="!queryParams.keyword" icon="icon-shiliangzhinengduixiang-"
+						label="请输入关键词搜索"></tm-empty>
+					<tm-empty v-else icon="icon-shiliangzhinengduixiang-"
+						:label="`未搜到 ${queryParams.keyword} 相关内容`"></tm-empty>
+				</view>
+				<block v-else>
+					<tm-translate v-for="(item, index) in dataList" :key="item.metadataName" animation-name="fadeUp"
+						:wait="calcAniWait(index)">
+						<view class="article-card" @click="fnToDetail(item)">
+							<view class="mb-12 flex flex-start">
+								<view class="flex-shrink ml--12">
+									<tm-tags v-if="isArticle(item)" color="blue" size="n" model="text">文章</tm-tags>
+									<tm-tags v-else color="green" size="n" model="text">瞬间</tm-tags>
+								</view>
+								<text class="ml-2 text-overflow text-size-n text-weight-b"
+									style="color: #333;">{{ item.title }}</text>
+							</view>
+							<mp-html class="evan-markdown" lazy-load :domain="markdownConfig.domain"
+								:loading-img="markdownConfig.loadingGif" :scroll-table="true" :selectable="true"
+								:tag-style="markdownConfig.tagStyle" :content="item.description || item.content"
+								:markdown="true" :showLineNumber="true" :showLanguageName="true"
+								:copyByLongPress="true" />
+							<view class="mt-12 flex flex-center flex-between">
+								<text style="font-size: 24rpx;color:#888">
+									最近更新时间：{{ {d: item.updateTimestamp, f: 'yyyy年MM月dd日 HH点mm分ss秒'} | formatTime }}
+								</text>
+								<!-- <tm-tags v-if="isArticle(item)" color="blue" size="n" model="text">文章</tm-tags>
+							<tm-tags v-else color="green" size="n" model="text">瞬间</tm-tags> -->
+							</view>
+						</view>
+					</tm-translate>

-            </block>
-        </view>
-    </view>
+					<tm-flotbutton @click="fnToTopPage" size="m" color="light-blue"
+						icon="icon-angle-up"></tm-flotbutton>
+
+				</block>
+			</view>
+		</template>
+	</view>
 </template>

 <script>
-import tmSkeleton from '@/tm-vuetify/components/tm-skeleton/tm-skeleton.vue';
-import tmSearch from '@/tm-vuetify/components/tm-search/tm-search.vue';
-import tmTranslate from '@/tm-vuetify/components/tm-translate/tm-translate.vue';
-import tmTabs from '@/tm-vuetify/components/tm-tabs/tm-tabs.vue';
-import tmFlotbutton from '@/tm-vuetify/components/tm-flotbutton/tm-flotbutton.vue';
-import tmEmpty from '@/tm-vuetify/components/tm-empty/tm-empty.vue';
+	import tmSkeleton from '@/tm-vuetify/components/tm-skeleton/tm-skeleton.vue';
+	import tmSearch from '@/tm-vuetify/components/tm-search/tm-search.vue';
+	import tmTranslate from '@/tm-vuetify/components/tm-translate/tm-translate.vue';
+	import tmTabs from '@/tm-vuetify/components/tm-tabs/tm-tabs.vue';
+	import tmFlotbutton from '@/tm-vuetify/components/tm-flotbutton/tm-flotbutton.vue';
+	import tmEmpty from '@/tm-vuetify/components/tm-empty/tm-empty.vue';
+	import tmTags from '@/tm-vuetify/components/tm-tags/tm-tags.vue';

-export default {
-    components: {
-        tmSkeleton,
-        tmSearch,
-        tmTranslate,
-        tmTabs,
-        tmFlotbutton,
-        tmEmpty
-    },
-    data() {
-        return {
-            isBlackTheme: false,
-            loading: 'loading',
-            tab: {
-                activeIndex: 0,
-                list: ['全部', '最新文章', '热门文章', '最近更新', '最多点赞']
-            },
-            queryParams: {
-                keyword: "",
-                limit: 5,
-                highlightPreTag: "<text>",
-                highlightPostTag: "</text>"
-            },
-            cache: {
-                dataList: [],
-                total: 0
-            },
-            dataList: []
-        };
-    },
-    computed: {
-      haloConfigs() {
-        return this.$tm.vx.getters().getConfigs;
-      },
-    },
-    onLoad() {
-        this.fnSetPageTitle('内容搜索');
-    },
-    created() {
-        if (!this.queryParams.keyword) {
-            this.loading = 'success'
-        } else {
-            this.fnGetData();
-        }
-    },
-    onPullDownRefresh() {
-        this.fnResetSetAniWaitIndex();
-        this.fnGetData();
-    },
+	import MarkdownConfig from '@/common/markdown/markdown.config.js';
+	import mpHtml from '@/components/mp-html/components/mp-html/mp-html.vue';

-    methods: {
-        fnOnTabChange(index) {
-            this.fnResetSetAniWaitIndex();
-            this.dataList = [];
-            const _sorts = {
-                0: '',
-                1: 'topPriority,createTime,desc',
-                2: 'topPriority,visits,desc',
-                3: 'topPriority,updateTime,desc',
-                4: 'topPriority,likes,desc'
-            };
-            this.queryParams.sort = _sorts[index];
-            this.dataList = [];
-            this.fnToTopPage();
-            this.fnGetData();
-        },
-        fnOnSearch() {
-            this.fnResetSetAniWaitIndex();
+	import pluginAvailableMixin from "@/common/mixins/pluginAvailable.js"
+	import PluginUnavailable from '@/components/plugin-unavailable/plugin-unavailable.vue'

-            if (!this.queryParams.keyword) {
-                this.dataList = []
-            } else {
-                this.fnGetData();
-            }
-        },
-        fnGetData() {
-            if (this.haloConfigs.basicConfig.auditModeEnabled) {
-              return;
-            }
-            // 设置状态为加载中
-			      this.loading = 'loading';
-            this.$httpApi.v2
-                .getPostListByKeyword(this.queryParams)
-                .then(res => {
-                    this.loading = 'success';
-                    this.dataList = res.hits;
-                })
-                .catch(err => {
-                    console.error(err);
-                    this.loading = 'error';
-                })
-                .finally(() => {
-                    setTimeout(() => {
-                        uni.hideLoading();
-                        uni.stopPullDownRefresh();
-                    }, 800);
-                });
-        },
+	export default {
+		mixins: [pluginAvailableMixin],
+		components: {
+			tmSkeleton,
+			tmSearch,
+			tmTranslate,
+			tmTabs,
+			tmFlotbutton,
+			tmEmpty,
+			tmTags,
+			mpHtml,
+			PluginUnavailable
+		},
+		data() {
+			return {
+				markdownConfig: MarkdownConfig,
+				loading: 'loading',
+				tab: {
+					activeIndex: 0,
+					list: ['全部', '最新文章', '热门文章', '最近更新', '最多点赞']
+				},
+				queryParams: {
+					keyword: "",
+					limit: 50,
+					highlightPreTag: "",
+					highlightPostTag: ""
+				},
+				cache: {
+					dataList: [],
+					total: 0
+				},
+				dataList: []
+			};
+		},
+		computed: {
+			haloConfigs() {
+				return this.$tm.vx.getters().getConfigs;
+			},
+			calcAuditModeEnabled() {
+				return this.haloConfigs.auditConfig.auditModeEnabled
+			},
+		},
+		async onLoad() {
+			this.fnSetPageTitle('内容搜索');
+			// 检查插件
+			this.setPluginId(this.NeedPluginIds.PluginSearchWidget)
+			this.setPluginError("阿偶，检测到当前插件没有安装或者启用，无法使用搜索功能哦，请联系管理员")
+			if (!await this.checkPluginAvailable()) return
+			if (!this.queryParams.keyword) {
+				this.loading = 'success'
+			} else {
+				this.fnGetData();
+			}
+		},

-        //跳转文章详情
-        fnToArticleDetail(article) {
-            uni.navigateTo({
-                url: '/pagesA/article-detail/article-detail?name=' + article.metadataName,
-                animationType: 'slide-in-right'
-            });
-        }
-    }
-};
+		onPullDownRefresh() {
+			if (!this.uniHaloPluginAvailable) {
+				uni.hideLoading();
+				uni.stopPullDownRefresh();
+				return
+			}
+			this.fnOnSearch()
+		},
+
+		methods: {
+			fnOnTabChange(index) {
+				this.fnResetSetAniWaitIndex();
+				this.dataList = [];
+				this.fnToTopPage();
+				this.fnGetData();
+			},
+			fnOnSearch() {
+				this.fnResetSetAniWaitIndex();
+				if (!this.queryParams.keyword) {
+					this.dataList = []
+				} else {
+					this.fnGetData();
+				}
+			},
+			fnGetData() {
+				if (this.calcAuditModeEnabled) {
+					return;
+				}
+				// 设置状态为加载中
+				this.loading = 'loading';
+				this.$httpApi.v2
+					.getPostListByKeyword(this.queryParams)
+					.then(res => {
+						this.loading = 'success';
+						this.dataList = res.hits;
+					})
+					.catch(err => {
+						console.error(err);
+						this.loading = 'error';
+					})
+					.finally(() => {
+						setTimeout(() => {
+							uni.hideLoading();
+							uni.stopPullDownRefresh();
+						}, 800);
+					});
+			},
+			isArticle(item) {
+				return item.type == 'post.content.halo.run'
+			},
+			//跳转详情
+			fnToDetail(item) {
+				if (this.calcAuditModeEnabled) return;
+				if (this.isArticle(item)) {
+					uni.navigateTo({
+						url: '/pagesA/article-detail/article-detail?name=' + item.metadataName,
+						animationType: 'slide-in-right'
+					});
+				} else {
+					uni.navigateTo({
+						url: '/pagesA/moment-detail/moment-detail?name=' + item.metadataName,
+						animationType: 'slide-in-right'
+					});
+				}
+
+			}
+		}
+	};
 </script>

 <style lang="scss" scoped>
-.app-page {
-    width: 100vw;
-    min-height: 100vh;
-    display: flex;
-    flex-direction: column;
-    padding-bottom: 24rpx;
-    background-color: #fafafd;
+	.app-page {
+		width: 100vw;
+		min-height: 100vh;
+		display: flex;
+		flex-direction: column;
+		padding-bottom: 24rpx;
+		background-color: #fafafd;

-    &.is-balck {
-        background-color: #212121;
-    }
-}
+		&.is-balck {
+			background-color: #212121;
+		}
+	}

-.content {
-    padding-top: 24rpx;
+	.content {
+		padding-top: 24rpx;
+	}

-    .content-empty {
-        height: 60vh;
-    }
-}
+	.content-empty {
+		height: 60vh;
+	}

-.article-card {
-    display: flex;
-    flex-direction: column;
-    box-sizing: border-box;
-    margin: 0 24rpx;
-    padding: 24rpx;
-    border-radius: 12rpx;
-    background-color: #ffff;
-    box-shadow: 0rpx 2rpx 24rpx rgba(0, 0, 0, 0.03);
-    overflow: hidden;
-    margin-bottom: 24rpx;
-}
+	.article-card {
+		display: flex;
+		flex-direction: column;
+		box-sizing: border-box;
+		margin: 0 24rpx;
+		padding: 24rpx;
+		border-radius: 12rpx;
+		background-color: #ffff;
+		box-shadow: 0rpx 2rpx 24rpx rgba(0, 0, 0, 0.03);
+		overflow: hidden;
+		margin-bottom: 24rpx;
+	}
 </style>
@@ -68,6 +68,18 @@ export default {
        this.queryParams.page = 0;
        this.fnGetData();
    },
+    onShareAppMessage() {
+        return {
+            title: this.pageTitle,
+            path: `/pagesA/category-detail/category-detail?name=${this.name}&title=${this.pageTitle}`
+        }
+    },
+    onShareTimeline() {
+        return {
+            title: this.pageTitle,
+            path: `/pagesA/category-detail/category-detail?name=${this.name}&title=${this.pageTitle}`
+        }
+    },
    onReachBottom(e) {
        if (this.hasNext) {
            this.queryParams.page += 1;
@@ -0,0 +1,549 @@
+<template>
+	<view class="app-page flex flex-col pa-24" :class="[uniHaloPluginPageClass]">
+		<PluginUnavailable v-if="!uniHaloPluginAvailable" :pluginId="uniHaloPluginId" :error-text="uniHaloPluginAvailableError" />
+		<template v-else>
+			<!-- 加载区域 -->
+			<view v-if="loading == 'loading'" class="loading-wrap pa-24">
+				<tm-skeleton model="listAvatr"></tm-skeleton>
+				<tm-skeleton model="listAvatr"></tm-skeleton>
+				<tm-skeleton model="listAvatr"></tm-skeleton>
+				<tm-skeleton model="listAvatr"></tm-skeleton>
+			</view>
+			<view v-else-if="loading == 'error'" class="content-empty flex flex-center">
+				<tm-empty icon="icon-wind-cry" label="加载异常"></tm-empty>
+			</view>
+			<!-- 内容区域 -->
+			<view v-else class="content flex flex-col uh-gap-y-12">
+				<!-- 标签统计 -->
+				<view class="card bg-white pa-24 round-4">
+					<view class="card-head flex items-center justify-between">
+						<view class="card-head_title flex items-end uh-gap-x-4">
+							<text class="card-head_text">标签统计</text>
+							<text class="card-head_subtext">(全部标签的文章数量占比)</text>
+						</view>
+						<view @click="tagChart.isExpand = !tagChart.isExpand">
+							<tm-icons v-if="tagChart.isExpand" :size="24" name="icon-angle-down" color="gray"></tm-icons>
+							<tm-icons v-else :size="24" name="icon-angle-up" color="gray"></tm-icons>
+						</view>
+					</view>
+					<view v-show="tagChart.isExpand" class="card-body flex">
+						<view class="chart-box">
+							<qiun-data-charts :type="tagChart.type" :opts="tagChart.opts" :chartData="tagChart.data" :tooltipFormat="tagChart.tooltipFormat" />
+						</view>
+					</view>
+				</view>
+				<!-- 分类统计 -->
+				<view class="card bg-white pa-24 round-4">
+					<view class="card-head flex items-center justify-between">
+						<view class="card-head_title flex items-end uh-gap-x-4">
+							<text class="card-head_text">分类统计</text>
+							<text class="card-head_subtext">(全部分类的文章数量占比)</text>
+						</view>
+						<view @click="categoryChart.isExpand = !categoryChart.isExpand">
+							<tm-icons v-if="categoryChart.isExpand" :size="24" name="icon-angle-down" color="gray"></tm-icons>
+							<tm-icons v-else :size="24" name="icon-angle-up" color="gray"></tm-icons>
+						</view>
+					</view>
+					<view v-show="categoryChart.isExpand" class="card-body flex">
+						<view class="chart-box">
+							<qiun-data-charts
+								:canvasId="categoryChart.id"
+								:canvas2d="true"
+								:ontouch="true"
+								:type="categoryChart.type"
+								:opts="categoryChart.opts"
+								:chartData="categoryChart.data"
+								:tooltipFormat="categoryChart.tooltipFormat"
+							/>
+						</view>
+					</view>
+				</view>
+				<!-- 文章发布趋势 -->
+				<view class="card bg-white pa-24 round-4">
+					<view class="card-head flex items-center justify-between">
+						<view class="card-head_title flex items-end uh-gap-x-4">
+							<text class="card-head_text">文章发布趋势</text>
+							<text class="card-head_subtext">(按日期统计文章发布数量)</text>
+						</view>
+						<view @click="trandArticleChart.isExpand = !trandArticleChart.isExpand">
+							<tm-icons v-if="trandArticleChart.isExpand" :size="24" name="icon-angle-down" color="gray"></tm-icons>
+							<tm-icons v-else :size="24" name="icon-angle-up" color="gray"></tm-icons>
+						</view>
+					</view>
+					<view v-show="trandArticleChart.isExpand" class="card-body flex">
+						<heatmap style="width: 100%" :chartData="trandArticleChart.data"></heatmap>
+					</view>
+				</view>
+				<!-- 评论活跃用户 -->
+				<view class="card bg-white pa-24 round-4">
+					<view class="card-head flex items-center justify-between">
+						<view class="card-head_title flex items-end uh-gap-x-4">
+							<text class="card-head_text">评论活跃用户</text>
+							<text class="card-head_subtext">(按评论作者统计评论数量)</text>
+						</view>
+						<view @click="userCommentsChart.isExpand = !userCommentsChart.isExpand">
+							<tm-icons v-if="userCommentsChart.isExpand" :size="24" name="icon-angle-down" color="gray"></tm-icons>
+							<tm-icons v-else :size="24" name="icon-angle-up" color="gray"></tm-icons>
+						</view>
+					</view>
+					<view v-show="userCommentsChart.isExpand" class="card-body flex">
+						<view class="chart-box">
+							<qiun-data-charts
+								:canvasId="userCommentsChart.id"
+								:canvas2d="true"
+								:ontouch="true"
+								:type="userCommentsChart.type"
+								:opts="userCommentsChart.opts"
+								:chartData="userCommentsChart.data"
+								:tooltipFormat="userCommentsChart.tooltipFormat"
+							/>
+						</view>
+					</view>
+				</view>
+				<!-- 热门文章 Top10 -->
+				<view class="card bg-white pa-24 round-4">
+					<view class="card-head flex items-center justify-between">
+						<view class="card-head_title flex items-end uh-gap-x-4">
+							<text class="card-head_text">热门文章前10</text>
+							<text class="card-head_subtext">(按访问量排序的热门文章)</text>
+						</view>
+						<view @click="top10ArticlesChart.isExpand = !top10ArticlesChart.isExpand">
+							<tm-icons v-if="top10ArticlesChart.isExpand" :size="24" name="icon-angle-down" color="gray"></tm-icons>
+							<tm-icons v-else :size="24" name="icon-angle-up" color="gray"></tm-icons>
+						</view>
+					</view>
+					<view class="card-body flex">
+						<view class="chart-box">
+							<qiun-data-charts
+								:canvasId="top10ArticlesChart.id"
+								:canvas2d="true"
+								:ontouch="true"
+								:type="top10ArticlesChart.type"
+								:opts="top10ArticlesChart.opts"
+								:chartData="top10ArticlesChart.data"
+								:tooltipFormat="top10ArticlesChart.tooltipFormat"
+							/>
+						</view>
+					</view>
+				</view>
+			</view>
+		</template>
+	</view>
+</template>
+
+<script>
+import dataStatisticsApi from '@/api/v2/plugin.data-statistics.js';
+import { NeedPluginIds, NeedPlugins, checkNeedPluginAvailable } from '@/utils/plugin.js';
+import tmSkeleton from '@/tm-vuetify/components/tm-skeleton/tm-skeleton.vue';
+import tmTranslate from '@/tm-vuetify/components/tm-translate/tm-translate.vue';
+import tmEmpty from '@/tm-vuetify/components/tm-empty/tm-empty.vue';
+import tmButton from '@/tm-vuetify/components/tm-button/tm-button.vue';
+import tmIcons from '@/tm-vuetify/components/tm-icons/tm-icons.vue';
+
+import pluginAvailableMixin from '@/common/mixins/pluginAvailable.js';
+import PluginUnavailable from '@/components/plugin-unavailable/plugin-unavailable.vue';
+
+import heatmap from '@/components/heatmap/heatmap.vue';
+
+export default {
+	mixins: [pluginAvailableMixin],
+	name: 'DataVisual',
+	components: {
+		tmSkeleton,
+		tmTranslate,
+		tmEmpty,
+		tmButton,
+		tmIcons,
+		heatmap,
+		PluginUnavailable
+	},
+	data() {
+		return {
+			loading: 'loading',
+			statistics: null,
+			tagChart: {
+				id: 'tagChart',
+				isExpand: true,
+				type: 'ring',
+				data: {},
+				tooltipFormat: 'tooltipTag',
+				opts: {
+					rotate: false,
+					rotateLock: false,
+					color: ['#3B82F6', '#10B981', '#F59E0B', '#EF4444', '#8B5CF6', '#EC4899', '#14B8A6', '#F97316', '#ea7ccc', '#0EA5E9'],
+					padding: [5, 5, 5, 5],
+					dataLabel: false,
+					legend: {
+						show: false,
+						position: 'right',
+						lineHeight: 18,
+						fontSize: 12
+					},
+					title: {
+						name: '',
+						fontSize: 16,
+						color: '#666666'
+					},
+					subtitle: {
+						name: '',
+						fontSize: 12,
+						color: '#eee'
+					},
+					extra: {
+						ring: {
+							ringWidth: 36,
+							activeOpacity: 0.5,
+							activeRadius: 10,
+							offsetAngle: -90,
+							labelWidth: 15,
+							border: true,
+							borderWidth: 1,
+							borderColor: '#FFFFFF'
+						},
+						tooltip: {
+							legendShape: 'circle',
+							fontSize: 11
+						}
+					}
+				}
+			},
+			categoryChart: {
+				id: 'categoryChart',
+				isExpand: true,
+				type: 'line',
+				data: {},
+				tooltipFormat: 'tooltipCategory',
+				opts: {
+					color: ['#3B82F6', '#10B981', '#F59E0B', '#EF4444', '#8B5CF6', '#EC4899', '#14B8A6', '#F97316', '#ea7ccc', '#0EA5E9'],
+					padding: [20, 15, 10, 15],
+					touchMoveLimit: 24,
+					enableScroll: true,
+					legend: {
+						show: false
+					},
+					xAxis: {
+						disableGrid: true,
+						fontSize: 11,
+						scrollShow: true,
+						itemCount: 6,
+						boundaryGap: 'center',
+						format: 'xAxisCategory'
+					},
+					yAxis: {
+						gridType: 'dash',
+						dashLength: 4,
+						data: [
+							{
+								fontSize: 11
+							}
+						]
+					},
+					extra: {
+						line: {
+							type: 'curve',
+							width: 2,
+							activeType: 'hollow'
+						},
+						tooltip: {
+							legendShape: 'circle',
+							fontSize: 11
+						}
+					}
+				}
+			},
+			trandArticleChart: {
+				isExpand: true,
+				type: 'hotmap',
+				data: [],
+				opts: {}
+			},
+			userCommentsChart: {
+				id: 'userCommentsChart',
+				isExpand: true,
+				loading: true,
+				type: 'column',
+				data: {},
+				tooltipFormat: 'tooltipUserComments',
+				opts: {
+					color: ['#EF4444', '#F59E0B', '#14B8A6', '#3B82F6', '#10B981', '#8B5CF6', '#EC4899', '#F97316', '#ea7ccc', '#0EA5E9'],
+					padding: [20, 15, 10, 10],
+					touchMoveLimit: 24,
+					enableScroll: true,
+					legend: {
+						show: false
+					},
+					xAxis: {
+						disableGrid: true,
+						boundaryGap: 'justify',
+						fontSize: 10,
+						scrollShow: true,
+						itemCount: 5,
+						format: 'xAxisUserComments'
+					},
+					yAxis: {
+						gridType: 'dash',
+						dashLength: 4,
+						data: [
+							{
+								min: 0,
+								fontSize: 11
+							}
+						]
+					},
+					extra: {
+						column: {
+							type: 'group',
+							width: 22,
+							activeBgColor: '#000000',
+							activeBgOpacity: 0.08,
+							linearType: 'custom',
+							seriesGap: 5,
+							linearOpacity: 0.7,
+							barBorderCircle: true,
+							customColor: ['#F59E0B']
+						},
+						tooltip: {
+							legendShape: 'circle',
+							fontSize: 11
+						}
+					}
+				}
+			},
+			top10ArticlesChart: {
+				id: 'top10ArticlesChart',
+				isExpand: true,
+				type: 'column',
+				data: {},
+				tooltipFormat: 'tooltipTop10Articles',
+				opts: {
+					color: ['#EF4444', '#F59E0B', '#14B8A6', '#3B82F6', '#10B981', '#8B5CF6', '#EC4899', '#F97316', '#ea7ccc', '#0EA5E9'],
+					padding: [20, 15, 10, 10],
+					touchMoveLimit: 24,
+					enableScroll: true,
+					legend: {
+						show: false
+					},
+					xAxis: {
+						disableGrid: true,
+						boundaryGap: 'justify',
+						fontSize: 10,
+						scrollShow: true,
+						itemCount: 5,
+						format: 'xAxisTop10Article'
+					},
+					yAxis: {
+						gridType: 'dash',
+						dashLength: 4,
+						data: [
+							{
+								min: 0,
+								fontSize: 11
+							}
+						]
+					},
+					extra: {
+						column: {
+							type: 'group',
+							width: 22,
+							activeBgColor: '#000000',
+							activeBgOpacity: 0.08,
+							linearType: 'custom',
+							seriesGap: 5,
+							linearOpacity: 0.7,
+							barBorderCircle: true,
+							customColor: ['#F59E0B']
+						},
+						tooltip: {
+							legendShape: 'circle',
+							fontSize: 11
+						}
+					}
+				}
+			}
+		};
+	},
+	async onReady() {
+		// 检查插件
+		this.setPluginId(this.NeedPluginIds.PluginDataStatistics);
+		this.setPluginError('阿偶，检测到当前插件没有安装或者启用，无法使用功能哦，请联系管理员');
+		if (!(await this.checkPluginAvailable())) return;
+		this.fnGetData();
+	},
+	onPullDownRefresh() {
+		if (!this.uniHaloPluginAvailable) {
+			uni.hideLoading();
+			uni.stopPullDownRefresh();
+			return;
+		}
+		this.fnGetData();
+	},
+	methods: {
+		fnGetData() {
+			uni.showLoading({
+				mask: true,
+				title: '加载中...'
+			});
+			// 设置状态为加载中
+			if (!this.isLoadMore) {
+				this.loading = 'loading';
+			}
+			this.loadMoreText = '加载中...';
+			dataStatisticsApi
+				.getChartData()
+				.then((res) => {
+					console.log('获取到统计数据：', res);
+					this.statistics = res;
+					this.handleTagChart();
+					this.handleCategoriesChart();
+					this.handleTrendArticlesChart();
+					this.handleUserCommentsChart();
+					this.handleTop10ArticlesChart();
+					this.loading = 'success';
+				})
+				.catch((err) => {
+					console.error(err);
+					this.loading = 'error';
+					this.loadMoreText = '加载失败，请下拉刷新！';
+				})
+				.finally(() => {
+					setTimeout(() => {
+						uni.hideLoading();
+						uni.stopPullDownRefresh();
+					}, 100);
+				});
+		},
+		// 处理标签统计
+		handleTagChart() {
+			const data = this.statistics.tags.sort((a, b) => b.count - a.count);
+			this.tagChart.data = {
+				series: [
+					{
+						data: data.map((item) => {
+							return {
+								name: item.name,
+								value: item.count
+							};
+						})
+					}
+				]
+			};
+		},
+		// 处理分类统计
+		handleCategoriesChart() {
+			const data = this.statistics.categories.sort((a, b) => b.total - a.total);
+			const seriesItemData = data.map((item) => item.total);
+			if (Math.max(...seriesItemData) < 10) {
+				this.categoryChart.opts.yAxis.data[0].max = 10;
+			}
+			this.categoryChart.data = {
+				categories: data.map((item) => item.name),
+				series: [
+					{
+						name: '分类',
+						data: seriesItemData
+					}
+				]
+			};
+		},
+		// 处理文章趋势
+		handleTrendArticlesChart() {
+			this.trandArticleChart.data = this.statistics.articles;
+		},
+		// 处理评论活跃用户
+		handleUserCommentsChart() {
+			this.userCommentsChart.loading = true;
+			const data = this.statistics.comments.sort((a, b) => b.count - a.count).slice(0, 10);
+			const seriesItemData = data.map((item) => item.count);
+			if (Math.max(...seriesItemData) < 10) {
+				this.userCommentsChart.opts.yAxis.data[0].max = 10;
+			}
+			this.userCommentsChart.data = {
+				categories: data.map((item) => item.username),
+				series: [
+					{
+						name: '评论',
+						data: seriesItemData
+					}
+				]
+			};
+			this.userCommentsChart.loading = false;
+		},
+		// 处理热门文章TOP10
+		handleTop10ArticlesChart() {
+			const data = this.statistics.top10Articles.sort((a, b) => b.views - a.views).slice(0, 10);
+			const seriesItemData = data.map((item) => item.views);
+			if (Math.max(...seriesItemData) < 10) {
+				this.top10ArticlesChart.opts.yAxis.data[0].max = 10;
+			}
+			this.top10ArticlesChart.data = {
+				categories: data.map((item) => item.name),
+				series: [
+					{
+						name: '评论',
+						data: seriesItemData
+					}
+				]
+			};
+		}
+	}
+};
+</script>
+
+<style lang="scss" scoped>
+.app-page {
+	box-sizing: border-box;
+	width: 100vw;
+	min-height: 100vh;
+	color: #353437;
+}
+.card {
+	box-sizing: border-box;
+	background-color: rgba(255, 255, 255, 0.95);
+	box-shadow: 0 0 12rpx rgba(226, 232, 240, 0.35);
+	backdrop-filter: blur(6rpx);
+	// border: 2rpx solid #e8edf4;
+}
+.card-head {
+	font-size: 32rpx;
+	font-weight: bold;
+
+	&_title {
+	}
+	&_text {
+		box-sizing: border-box;
+		position: relative;
+		padding-left: 24rpx;
+		font-size: 30rpx;
+		&:before {
+			content: '';
+			position: absolute;
+			left: 0;
+			top: 50%;
+			transform: translateY(-50%);
+			width: 8rpx;
+			height: 70%;
+			background-color: #03a9f4;
+			border-radius: 12rpx;
+		}
+	}
+	&_subtext {
+		font-size: 26rpx;
+		font-weight: normal;
+		color: #6b7280;
+	}
+}
+
+.card-body {
+	box-sizing: border-box;
+	margin-top: 24rpx;
+	width: 100%;
+	overflow: hidden;
+	background-color: #fcfdfe;
+	border: 2rpx solid #e9eef3;
+	border-radius: 12rpx;
+}
+.chart-box {
+	width: 100%;
+	height: 320rpx;
+}
+</style>
@@ -7,12 +7,12 @@
        <block v-else>
            <view class="text-weight-b text-size-lg text-align-center">《 本博客免责声明 》</view>
            <view v-if="false" class="text-size-s text-align-center mt-12 text-grey-darken-1">—— 博主：{{ bloggerInfo.nickname }} ——</view>
-            <view class="mt-32">1、本博客属于个人非赢利性质的网站，所有转载的文章都以遵循原作者的版权声明注明了文章来源。</view>
+            <view class="mt-32">1、本博客属于个人非盈利性质的网站，所有转载的文章都以遵循原作者的版权声明注明了文章来源。</view>
            <view class="mt-24">2、如果原文没有版权声明，按照目前互联网开放的原则，本博客将在不通知作者的情况下转载文章。</view>
            <view class="mt-24">3、如果原文明确注明“禁止转载”，本博客将不会转载。</view>
            <view class="mt-24">
                4、如果本博客转载的文章不符合作者的版权声明或者作者不想让本博客转载您的文章，请邮件告知
-                <text class="text-bg-gradient-light-blue-accent ml-12 mr-12 ">
+                <text class="text-bg-gradient-light-blue-accent ml-12 mr-12 " @click="$utils.copyText(bloggerInfo.email, '电子邮箱已复制到剪贴板！')">
                    <text class="iconfont icon-mail-fill text-size-m mr-6"></text>
                    {{ bloggerInfo.email }}
                </text>
@@ -1,428 +1,457 @@
 <template>
-    <view class="app-page card-shadow">
-        <view v-if="loading != 'success'" class="loading-wrap">
-            <tm-skeleton model="listAvatr"></tm-skeleton>
-            <tm-skeleton model="listAvatr"></tm-skeleton>
-            <tm-skeleton model="listAvatr"></tm-skeleton>
-            <tm-skeleton model="listAvatr"></tm-skeleton>
-            <tm-skeleton model="listAvatr"></tm-skeleton>
-        </view>
-        <view v-else class="content" :class="{ 'bg-white': dataList.length !== 0 }">
-            <!-- 空数据 -->
-            <view v-if="dataList.length == 0" class="content-empty flex flex-center">
-                <tm-empty icon="icon-shiliangzhinengduixiang-" label="啊偶,博主还没有朋友呢~"></tm-empty>
-            </view>
+	<view class="app-page card-shadow" :class="[uniHaloPluginPageClass]">
+		<PluginUnavailable v-if="!uniHaloPluginAvailable" :pluginId="uniHaloPluginId"
+			:error-text="uniHaloPluginAvailableError" />
+		<template v-else>
+			<view v-if="loading != 'success'" class="loading-wrap">
+				<tm-skeleton model="listAvatr"></tm-skeleton>
+				<tm-skeleton model="listAvatr"></tm-skeleton>
+				<tm-skeleton model="listAvatr"></tm-skeleton>
+				<tm-skeleton model="listAvatr"></tm-skeleton>
+				<tm-skeleton model="listAvatr"></tm-skeleton>
+			</view>
+			<view v-else class="content" :class="{ 'bg-white': dataList.length !== 0 }">
+				<!-- 空数据 -->
+				<view v-if="dataList.length == 0" class="content-empty flex flex-center">
+					<tm-empty icon="icon-shiliangzhinengduixiang-" label="啊偶,博主还没有朋友呢~"></tm-empty>
+				</view>

-            <!-- 如果只有一个分组：使用列表的形式 dataList.length == 1 -->
-            <view v-else class="flex flex-col pb-24">
-                <block v-for="(link, index) in dataList" :key="index">
-                    <tm-translate animation-name="fadeUp" :wait="calcAniWait(index)">
-                        <!-- 色彩版本 -->
-                        <view v-if="!globalAppSettings.links.useSimple" class="info flex pt-24 pb-24 pl-12 pr-12"
-                              :class="{ 'border-b-1': index !== dataList.length - 1 }" @click="fnOnLinkEvent(link)">
-                            <view class="link-logo">
-                                <cache-image class="link-logo_img" radius="12rpx" :url="link.spec.logo"
-                                             :fileMd5="link.spec.logo" mode="aspectFill"></cache-image>
-                            </view>
-                            <view class="flex flex-col pl-30 info-detail">
-                                <view class="link-card_name text-size-l text-weight-b text-red">
-                                    <tm-tags style="margin-right: 12rpx;margin-left: -2rpx;"
-                                             color="bg-gradient-light-blue-lighten" :shadow="0" size="s" model="fill">
-                                        {{ link.spec.groupName || '暂未分组' }}
-                                    </tm-tags>
-                                    {{ link.spec.displayName }}
-                                </view>
-                                <view class="poup-tag mt-6" style="font-size: 28rpx;">
-                                    站点地址：{{ link.spec.url }}
-                                    <!-- <tm-tags color="bg-gradient-amber-accent" :shadow="0" size="s" model="fill">
+				<!-- 如果只有一个分组：使用列表的形式 dataList.length == 1 -->
+				<view v-else class="flex flex-col pb-24">
+					<block v-for="(link, index) in dataList" :key="index">
+						<tm-translate animation-name="fadeUp" :wait="calcAniWait(index)">
+							<!-- 色彩版本 -->
+							<view v-if="!globalAppSettings.links.useSimple" class="info flex pt-24 pb-24 pl-12 pr-12"
+								:class="{ 'border-b-1': index !== dataList.length - 1 }" @click="fnOnLinkEvent(link)">
+								<view class="link-logo">
+									<cache-image class="link-logo_img" radius="12rpx" :url="link.spec.logo"
+										:fileMd5="link.spec.logo" mode="aspectFill"></cache-image>
+								</view>
+								<view class="flex flex-col pl-30 info-detail">
+									<view class="link-card_name text-size-l text-weight-b text-red">
+										<tm-tags style="margin-right: 12rpx;margin-left: -2rpx;"
+											color="bg-gradient-light-blue-lighten" :shadow="0" size="s" model="fill">
+											{{ link.spec.groupName || '暂未分组' }}
+										</tm-tags>
+										{{ link.spec.displayName }}
+									</view>
+									<view class="poup-tag mt-6" style="font-size: 28rpx;">
+										站点地址：{{ link.spec.url }}
+										<!-- <tm-tags color="bg-gradient-amber-accent" :shadow="0" size="s" model="fill">
                                        URL：{{ link.spec.url }}
                                    </tm-tags>
                                    <tm-tags color=" bg-gradient-light-blue-lighten" :shadow="0" size="s" model="fill">
                                        {{ link.spec.groupName || '暂未分组' }}
                                    </tm-tags> -->
-                                </view>
-                                <view class="link-card_desc text-overflow mt-4" style="font-size: 28rpx;">
-                                    博客简介：{{ link.spec.description || '这个博主很懒，没写简介~' }}
-                                </view>
-                            </view>
-                        </view>
-                        <!-- 简洁版本 -->
-                        <view v-else class="link-card flex ml-24 mr-24 pt-24 pb-24" @click="fnOnLinkEvent(link)">
-                            <image class="logo shadow-6" :src="link.spec.logo" mode="aspectFill"></image>
-                            <view class="info pl-24">
-                                <view class="name text-size-g">{{ link.spec.displayName }}</view>
-                                <view class="desc mt-12 text-size-s text-grey-darken-1">{{ link.spec.description }}
-                                </view>
-                                <view v-if="false" class="link mt-12 text-size-m text-grey-darken-1">
-                                    <text class="iconfont icon-link mr-6 text-size-s"></text>
-                                    {{ link.spec.url }}
-                                </view>
-                            </view>
-                        </view>
-                    </tm-translate>
-                </block>
-            </view>
+									</view>
+									<view class="link-card_desc text-overflow mt-4" style="font-size: 28rpx;">
+										博客简介：{{ link.spec.description || '这个博主很懒，没写简介~' }}
+									</view>
+								</view>
+							</view>
+							<!-- 简洁版本 -->
+							<view v-else class="link-card flex ml-24 mr-24 pt-24 pb-24" @click="fnOnLinkEvent(link)">
+								<image class="logo shadow-6" :src="link.spec.logo" mode="aspectFill"></image>
+								<view class="info pl-24">
+									<view class="name text-size-g">{{ link.spec.displayName }}</view>
+									<view class="desc mt-12 text-size-s text-grey-darken-1">{{ link.spec.description }}
+									</view>
+									<view v-if="false" class="link mt-12 text-size-m text-grey-darken-1">
+										<text class="iconfont icon-link mr-6 text-size-s"></text>
+										{{ link.spec.url }}
+									</view>
+								</view>
+							</view>
+						</tm-translate>
+					</block>
+				</view>

-            <!-- 返回顶部 -->
-            <tm-flotbutton color="light-blue" @click="fnToTopPage" size="m" icon="icon-angle-up"></tm-flotbutton>
-            <tm-flotbutton v-if="haloPluginConfigs.submitLink.enabled" :offset="[16,80]" label="申请"
-                           actions-pos="left" :show-text="true" color="bg-gradient-orange-accent"
-                           @click="toSubmitLinkPage"></tm-flotbutton>
-            <!-- 详情弹窗 -->
-            <tm-poup v-model="detail.show" :width="640" height="auto" position="center" :round="6">
-                <view class="poup pa-36" v-if="detail.data">
-                    <view class="info flex">
-                        <view class="poup-logo bg-gradient-amber-accent pa-4 shadow-24">
-                            <image class="poup-logo_img" :src="$utils.checkImageUrl(detail.data.spec.logo)" mode="aspectFill"></image>
-                        </view>
-                        <view class="pl-24 info-detail">
-                            <view class="poup-name text-size-lg text-weight-b">{{ detail.data.spec.displayName }}</view>
-                            <view class="poup-tag ml--10">
-                                <tm-tags color="bg-gradient-light-blue-lighten" size="n" model="fill">
-                                    {{ detail.data.spec.groupName }}
-                                </tm-tags>
-                            </view>
-                            <view class="poup-link text-size-m" @click="fnCopyLink(detail.data)">
-                                <text class="text-orange">{{ detail.data.spec.url }}</text>
-                                <text class="iconfont icon-copy text-size-s ml-6 text-grey"></text>
-                            </view>
-                        </view>
-                    </view>
+				<!-- 返回顶部 -->
+				<tm-flotbutton color="light-blue" @click="fnToTopPage" size="m" icon="icon-angle-up"></tm-flotbutton>
+				<tm-flotbutton v-if="haloPluginConfigs.linksSubmitPlugin.enabled" :offset="[16,80]" label="申请"
+					actions-pos="left" :show-text="true" color="bg-gradient-orange-accent"
+					@click="toSubmitLinkPage"></tm-flotbutton>
+				<!-- 详情弹窗 -->
+				<tm-poup v-model="detail.show" :width="640" height="auto" position="center" :round="6">
+					<view class="poup pa-36" v-if="detail.data">
+						<view class="info flex">
+							<view class="poup-logo bg-gradient-amber-accent pa-4 shadow-24">
+								<image class="poup-logo_img" :src="$utils.checkImageUrl(detail.data.spec.logo)"
+									mode="aspectFill"></image>
+							</view>
+							<view class="pl-24 info-detail">
+								<view class="poup-name text-size-lg text-weight-b">{{ detail.data.spec.displayName }}
+								</view>
+								<view class="poup-tag ml--10">
+									<tm-tags color="bg-gradient-light-blue-lighten" size="n" model="fill">
+										{{ detail.data.spec.groupName }}
+									</tm-tags>
+								</view>
+								<view class="poup-link text-size-m" @click="fnCopyLink(detail.data)">
+									<text class="text-orange">{{ detail.data.spec.url }}</text>
+									<text class="iconfont icon-copy text-size-s ml-6 text-grey"></text>
+								</view>
+							</view>
+						</view>

-                    <view class="poup-desc mt-20">
-                        博客简介：{{ detail.data.spec.description || '这个博主很懒，没写简介~' }}
-                    </view>
+						<view class="poup-desc mt-20">
+							博客简介：{{ detail.data.spec.description || '这个博主很懒，没写简介~' }}
+						</view>

-                    <!-- 博客预览图 -->
-                    <view class="mt-24">
-                        <tm-images :width="568" :round="2" :src="calcSiteThumbnail(detail.data.spec.url)"
-                                   mode="aspectFill"></tm-images>
-                    </view>
-                </view>
-            </tm-poup>
+						<!-- 博客预览图 -->
+						<view class="mt-24">
+							<tm-images :width="568" :round="2" :src="calcSiteThumbnail(detail.data.spec.url)"
+								mode="aspectFill"></tm-images>
+						</view>
+					</view>
+				</tm-poup>

-            <view class="load-text">{{ loadMoreText }}</view>
-        </view>
-    </view>
+				<view class="load-text">{{ loadMoreText }}</view>
+			</view>
+		</template>
+	</view>
 </template>

 <script>
-import tmSkeleton from '@/tm-vuetify/components/tm-skeleton/tm-skeleton.vue';
-import tmTranslate from '@/tm-vuetify/components/tm-translate/tm-translate.vue';
-import tmFlotbutton from '@/tm-vuetify/components/tm-flotbutton/tm-flotbutton.vue';
-import tmTags from '@/tm-vuetify/components/tm-tags/tm-tags.vue';
-import tmEmpty from '@/tm-vuetify/components/tm-empty/tm-empty.vue';
-import tmImages from '@/tm-vuetify/components/tm-images/tm-images.vue';
-import tmPoup from '@/tm-vuetify/components/tm-poup/tm-poup.vue';
+	import tmSkeleton from '@/tm-vuetify/components/tm-skeleton/tm-skeleton.vue';
+	import tmTranslate from '@/tm-vuetify/components/tm-translate/tm-translate.vue';
+	import tmFlotbutton from '@/tm-vuetify/components/tm-flotbutton/tm-flotbutton.vue';
+	import tmTags from '@/tm-vuetify/components/tm-tags/tm-tags.vue';
+	import tmEmpty from '@/tm-vuetify/components/tm-empty/tm-empty.vue';
+	import tmImages from '@/tm-vuetify/components/tm-images/tm-images.vue';
+	import tmPoup from '@/tm-vuetify/components/tm-poup/tm-poup.vue';

-export default {
-    components: {
-        tmSkeleton,
-        tmTranslate,
-        tmFlotbutton,
-        tmTags,
-        tmEmpty,
-        tmImages,
-        tmPoup
-    },
-    data() {
-        return {
-            loading: 'loading',
-            queryParams: {
-                size: 10,
-                page: 1
-            },
-            detail: {
-                show: false,
-                data: null
-            },
-            hasNext: false,
-            isLoadMore: false,
-            loadMoreText: '',
-            linkGroupList: [],
-            dataList: [],
-            colors: [
-                '#39B449',
-                '#E44C41',
-                '#8698A2',
-                '#0080FE',
-                '#1CBCB4',
-                '#6638B5'
-            ]
-        };
-    },
-    computed: {
-        haloConfigs() {
-            return this.$tm.vx.getters().getConfigs;
-        },
-        haloPluginConfigs() {
-            return this.$tm.vx.getters().getConfigs.pluginConfig;
-        },
-        calcSiteThumbnail(val) {
-            return val => {
-                if (!val) return '';
-                if (val.charAt(val.length - 1) !== '/') {
-                    val = val + '/';
-                }
-                return 'https://image.thum.io/get/width/1000/crop/800/' + val;
-            };
-        }
-    },
-    onLoad() {
-        this.fnSetPageTitle('友情链接');
-        this.fnGetLinkGroupData();
-    },
-    onPullDownRefresh() {
-        this.isLoadMore = false;
-        this.queryParams.page = 1;
-        this.dataList = []
-        this.fnGetData();
-    },
-    onReachBottom(e) {
-        if (this.hasNext) {
-            this.queryParams.page += 1;
-            this.isLoadMore = true;
-            this.fnGetData();
-        } else {
-            uni.showToast({
-                icon: 'none',
-                title: '没有更多数据了'
-            });
-        }
-    },
-    methods: {
-        fnGetLinkGroupData() {
-            this.$httpApi.v2
-                .getFriendLinkGroupList({
-                    page: 1,
-                    size: 0
-                })
-                .then(res => {
-                    this.linkGroupList = res.items;
-                    this.fnGetData()
-                })
-                .catch(err => {
-                    console.error(err);
-                });
-        },
-        findLinkGroupDisplayNameByGroupMetadataName(groupName) {
-            if (this.linkGroupList.length === 0) return groupName || "未分组"
-            return this.linkGroupList.find(item => item.metadata.name === groupName)?.spec?.displayName || groupName || "未分组"
-        },
-        fnGetData() {
-            if (this.haloConfigs.basicConfig.auditModeEnabled) {
-              return;
-            }
-            if (!this.isLoadMore) {
-                this.loading = 'loading';
-            }
-            this.loadMoreText = '';
-            this.$httpApi.v2
-                .getFriendLinkList(this.queryParams)
-                .then(res => {
-                    console.log('请求结果：');
-                    console.log(res);
-                    this.hasNext = res.hasNext;
-                    const list = res.items.map(item => {
-                        item.spec.logo = this.$utils.checkAvatarUrl(item.spec?.logo)
-                        item.spec.groupName = this.findLinkGroupDisplayNameByGroupMetadataName(item.spec?.groupName)
-                        return item;
-                    })
-                    this.dataList = this.dataList.concat(list);
-                    setTimeout(() => {
-                        this.loading = 'success';
-                        this.loadMoreText = res.hasNext ? '上拉加载更多' : '呜呜，没有更多数据啦~';
-                    }, 500);
+	import pluginAvailableMixin from "@/common/mixins/pluginAvailable.js"
+	import PluginUnavailable from '@/components/plugin-unavailable/plugin-unavailable.vue'

-                })
-                .catch(err => {
-                    console.error(err);
-                    this.loading = 'error';
-                    this.loadMoreText = '加载失败，请下拉刷新！';
-                })
-                .finally(() => {
-                    setTimeout(() => {
-                        uni.hideLoading();
-                        uni.stopPullDownRefresh();
-                    }, 500);
-                });
-        },
+	export default {
+		mixins: [pluginAvailableMixin],
+		components: {
+			tmSkeleton,
+			tmTranslate,
+			tmFlotbutton,
+			tmTags,
+			tmEmpty,
+			tmImages,
+			tmPoup,
+			PluginUnavailable
+		},
+		data() {
+			return {
+				loading: 'loading',
+				queryParams: {
+					size: 10,
+					page: 1
+				},
+				detail: {
+					show: false,
+					data: null
+				},
+				hasNext: false,
+				isLoadMore: false,
+				loadMoreText: '',
+				linkGroupList: [],
+				dataList: [],
+				colors: [
+					'#39B449',
+					'#E44C41',
+					'#8698A2',
+					'#0080FE',
+					'#1CBCB4',
+					'#6638B5'
+				]
+			};
+		},
+		computed: {
+			haloConfigs() {
+				return this.$tm.vx.getters().getConfigs;
+			},
+			haloPluginConfigs() {
+				return this.$tm.vx.getters().getConfigs.pluginConfig;
+			},
+			calcSiteThumbnail(val) {
+				return val => {
+					if (!val) return '';
+					if (val.charAt(val.length - 1) !== '/') {
+						val = val + '/';
+					}
+					return 'https://image.thum.io/get/width/1000/crop/800/' + val;
+				};
+			},
+			calcAuditModeEnabled() {
+				return this.haloConfigs.auditConfig.auditModeEnabled
+			},
+		},
+		async onLoad() {
+			this.fnSetPageTitle('友情链接');
+			// 检查插件
+			this.setPluginId(this.NeedPluginIds.PluginLinks)
+			this.setPluginError("阿偶，检测到当前插件没有安装或者启用，无法使用友情链接功能哦，请联系管理员")
+			if (!await this.checkPluginAvailable()) return
+			this.fnGetLinkGroupData();
+		},
+		onPullDownRefresh() {
+			if (!this.uniHaloPluginAvailable) {
+				uni.hideLoading();
+				uni.stopPullDownRefresh();
+				return
+			}
+			this.isLoadMore = false;
+			this.queryParams.page = 1;
+			this.dataList = []
+			this.fnGetData();
+		},
+		onReachBottom(e) {
+			if (!this.uniHaloPluginAvailable) return;
+			if (this.hasNext) {
+				this.queryParams.page += 1;
+				this.isLoadMore = true;
+				this.fnGetData();
+			} else {
+				uni.showToast({
+					icon: 'none',
+					title: '没有更多数据了'
+				});
+			}
+		},
+		methods: {
+			fnGetLinkGroupData() {
+				this.$httpApi.v2
+					.getFriendLinkGroupList({
+						page: 1,
+						size: 0
+					})
+					.then(res => {
+						console.log("友情链接分组数据：", res);
+						this.linkGroupList = res;
+						this.fnGetData()
+					})
+					.catch(err => {
+						console.error(err);
+						this.loading = 'error';
+						this.loadMoreText = err;
+					});
+			},
+			findLinkGroupDisplayNameByGroupMetadataName(groupName) {
+				if (this.linkGroupList.length === 0) return groupName || "未分组"
+				return this.linkGroupList.find(item => item.metadata.name === groupName)?.spec?.displayName || groupName ||
+					"未分组"
+			},
+			fnGetData() {
+				if (this.calcAuditModeEnabled) {
+					return;
+				}
+				if (!this.isLoadMore) {
+					this.loading = 'loading';
+				}
+				this.loadMoreText = '';
+				this.$httpApi.v2
+					.getFriendLinkList(this.queryParams)
+					.then(res => {
+						console.log('请求结果：');
+						console.log(res);
+						this.hasNext = res.hasNext;
+						const list = res.items.map(item => {
+							item.spec.logo = this.$utils.checkAvatarUrl(item.spec?.logo)
+							item.spec.groupName = this.findLinkGroupDisplayNameByGroupMetadataName(item.spec
+								?.groupName)
+							return item;
+						})
+						this.dataList = this.dataList.concat(list);
+						setTimeout(() => {
+							this.loading = 'success';
+							this.loadMoreText = res.hasNext ? '上拉加载更多' : '呜呜，没有更多数据啦~';
+						}, 500);

-        handleGroup(list) {
-            const group = {}
-            list.forEach(item => {
-                if (group[item.spec.groupName]) {
-                    group[item.spec.groupName].children.push(item)
-                } else {
-                    group[item.spec.groupName] = {
-                        title: item.spec.groupName,
-                        children: [item]
-                    }
-                }
-            })
+					})
+					.catch(err => {
+						console.error(err);
+						this.loading = 'error';
+						this.loadMoreText = '加载失败，请下拉刷新！';
+					})
+					.finally(() => {
+						setTimeout(() => {
+							uni.hideLoading();
+							uni.stopPullDownRefresh();
+						}, 500);
+					});
+			},

-            return Object.keys(group).map(key => {
-                const {
-                    title,
-                    children = []
-                } = group[key]
-                return {
-                    title,
-                    children
-                }
-            })
-        },
-        fnOnLinkEvent(link) {
-            this.detail.data = link;
-            this.detail.show = true;
-        },
+			handleGroup(list) {
+				const group = {}
+				list.forEach(item => {
+					if (group[item.spec.groupName]) {
+						group[item.spec.groupName].children.push(item)
+					} else {
+						group[item.spec.groupName] = {
+							title: item.spec.groupName,
+							children: [item]
+						}
+					}
+				})

-        fnCopyLink(link) {
-            uni.setClipboardData({
-                data: `${link.spec.displayName}:${link.spec.url}`,
-                showToast: false,
-                success: () => {
-                    uni.showToast({
-                        icon: 'none',
-                        title: '链接复制成功！'
-                    });
-                },
-                fail: () => {
-                    uni.showToast({
-                        icon: 'none',
-                        title: '复制失败！'
-                    });
-                }
-            });
-        },
-        toSubmitLinkPage() {
-            uni.navigateTo({
-                url: '/pagesA/submit-link/submit-link'
-            })
-        }
-    }
-};
+				return Object.keys(group).map(key => {
+					const {
+						title,
+						children = []
+					} = group[key]
+					return {
+						title,
+						children
+					}
+				})
+			},
+			fnOnLinkEvent(link) {
+				this.detail.data = link;
+				this.detail.show = true;
+			},
+
+			fnCopyLink(link) {
+				uni.setClipboardData({
+					data: `${link.spec.displayName}:${link.spec.url}`,
+					showToast: false,
+					success: () => {
+						uni.showToast({
+							icon: 'none',
+							title: '链接复制成功！'
+						});
+					},
+					fail: () => {
+						uni.showToast({
+							icon: 'none',
+							title: '复制失败！'
+						});
+					}
+				});
+			},
+			toSubmitLinkPage() {
+				uni.navigateTo({
+					url: '/pagesA/submit-link/submit-link'
+				})
+			}
+		}
+	};
 </script>

 <style lang="scss" scoped>
-.app-page {
-    width: 100vw;
-    min-height: 100vh;
-    display: flex;
-    flex-direction: column;
-    background-color: #fafafd;
-}
+	.app-page {
+		width: 100vw;
+		min-height: 100vh;
+		display: flex;
+		flex-direction: column;
+		background-color: #fafafd;
+	}

-.loading-wrap {
-    padding: 24rpx;
-    min-height: 100vh;
-}
+	.loading-wrap {
+		padding: 24rpx;
+		min-height: 100vh;
+	}

-.content {
-    padding: 0 24rpx;
-    padding-top: 24rpx;
+	.content {
+		padding: 0 24rpx;
+		padding-top: 24rpx;

-    .content-empty {
-        height: 60vh;
-        display: flex;
-        align-items: center;
-        justify-content: center;
-    }
-}
+		.content-empty {
+			height: 60vh;
+			display: flex;
+			align-items: center;
+			justify-content: center;
+		}
+	}

-.link-card {
-    border-bottom: 2rpx solid #f5f5f5;
-    background-color: #ffffff;
+	.link-card {
+		border-bottom: 2rpx solid #f5f5f5;
+		background-color: #ffffff;

-    &.one {
-        border: 0;
-        box-shadow: 0rpx 2rpx 24rpx 0rpx rgba(0, 0, 0, 0.03);
+		&.one {
+			border: 0;
+			box-shadow: 0rpx 2rpx 24rpx 0rpx rgba(0, 0, 0, 0.03);

-        .logo {
-            box-shadow: 0rpx 2rpx 12rpx rgba(0, 0, 0, 0.1);
-        }
-    }
+			.logo {
+				box-shadow: 0rpx 2rpx 12rpx rgba(0, 0, 0, 0.1);
+			}
+		}

-    .logo {
-        // width: 126rpx;
-        // height: 126rpx;
-        width: 80rpx;
-        height: 80rpx;
-        border-radius: 12rpx;
-        border: 6rpx solid #ffffff;
-        box-shadow: none;
-    }
+		.logo {
+			// width: 126rpx;
+			// height: 126rpx;
+			width: 80rpx;
+			height: 80rpx;
+			border-radius: 12rpx;
+			border: 6rpx solid #ffffff;
+			box-shadow: none;
+		}

-    .info {
-        width: 0;
-        flex-grow: 1;
+		.info {
+			width: 0;
+			flex-grow: 1;

-        .name {
-            white-space: nowrap;
-            overflow: hidden;
-            text-overflow: ellipsis;
-            color: #303133;
-            font-size: 30rpx;
-            font-weight: bold;
-        }
+			.name {
+				white-space: nowrap;
+				overflow: hidden;
+				text-overflow: ellipsis;
+				color: #303133;
+				font-size: 30rpx;
+				font-weight: bold;
+			}

-        .desc {
-            white-space: nowrap;
-            overflow: hidden;
-            text-overflow: ellipsis;
-            color: #303133;
-            font-size: 28rpx;
-        }
-    }
-}
+			.desc {
+				white-space: nowrap;
+				overflow: hidden;
+				text-overflow: ellipsis;
+				color: #303133;
+				font-size: 28rpx;
+			}
+		}
+	}

-.link-card_name {
-    // color: #303133;
-    // color: #0080fe;
-}
+	.link-card_name {
+		// color: #303133;
+		// color: #0080fe;
+	}

-.link-card_desc {
-    font-size: 24rpx;
-    line-height: 1.6;
-    color: #303133;
-}
+	.link-card_desc {
+		font-size: 24rpx;
+		line-height: 1.6;
+		color: #303133;
+	}

-.link-logo {
-    width: 140rpx;
-    height: 140rpx;
+	.link-logo {
+		width: 140rpx;
+		height: 140rpx;

-    &_img {
-        width: 100%;
-        height: 100%;
-    }
-}
+		&_img {
+			width: 100%;
+			height: 100%;
+		}
+	}

-.poup-logo {
-    width: 140rpx;
-    height: 140rpx;
-    border-radius: 50%;
+	.poup-logo {
+		width: 140rpx;
+		height: 140rpx;
+		border-radius: 50%;

-    &_img {
-        width: 100%;
-        height: 100%;
-        border-radius: 50%;
-    }
-}
+		&_img {
+			width: 100%;
+			height: 100%;
+			border-radius: 50%;
+		}
+	}

-.info-detail {
-    width: 0;
-    flex-grow: 1;
-    justify-content: center;
-}
+	.info-detail {
+		width: 0;
+		flex-grow: 1;
+		justify-content: center;
+	}

-.poup-desc {
-    font-size: 28rpx;
-    line-height: 1.6;
-    color: #555 !important;
-}
+	.poup-desc {
+		font-size: 28rpx;
+		line-height: 1.6;
+		color: #555 !important;
+	}

-.preview-site {
-    width: 100%;
-    height: 300rpx;
-}
+	.preview-site {
+		width: 100%;
+		height: 300rpx;
+	}
 </style>
@@ -7,7 +7,7 @@
                    <image class="avatar" :src="$utils.checkAvatarUrl(loveConfig.loveInfo.boyAvatar)" mode="aspectFit"></image>
                    <view class="name">{{ loveConfig.loveInfo.boyNickname }}</view>
                </view>
-                <image class="like" :src="$utils.checkImageUrl(loveConfig.loveImageUrl)" mode="scaleToFill"></image>
+                <image class="like" :src="$utils.checkImageUrl(loveConfig.pageImages.heartImageUrl)" mode="scaleToFill"></image>
                <view class="girl">
                    <image class="avatar" :src="$utils.checkAvatarUrl(loveConfig.loveInfo.girlAvatar)" mode="aspectFit"></image>
                    <view class="name">{{ loveConfig.loveInfo.girlNickname }}</view>
@@ -43,7 +43,7 @@
            <block v-for="(nav, index) in navList" :key="index">
                <view v-if="nav.use" class="list-item" @click="fnToPage(nav.key)">
                    <view class="left">
-                        <image class="icon" :src="nav.iconImageUrl" mode="aspectFit"></image>
+                        <image class="icon" :src="$utils.checkImageUrl(nav.iconImageUrl)" mode="aspectFit"></image>
                    </view>
                    <view class="right">
                        <view class="name">{{ nav.title }}</view>
@@ -100,21 +100,21 @@ export default {
                {
                    key: 'journey',
                    use: configs.ourStory.enabled,
-                    iconImageUrl: 'https://b.925i.cn/uni_halo_love/diandian.png',
+                    iconImageUrl: configs.ourStory.iconUrl,
                    title: '关于我们',
                    desc: '我们一起度过的那些经历'
                },
                {
                    key: 'album',
                    use: configs.lovePhoto.enabled,
-                    iconImageUrl: 'https://b.925i.cn/uni_halo_love/diandian.png',
+                    iconImageUrl: configs.lovePhoto.iconUrl,
                    title: '恋爱相册',
                    desc: '定格了我们的那些小美好'
                },
                {
                    key: 'list',
                    use: configs.loveDaily.enabled,
-                    iconImageUrl: 'https://b.925i.cn/uni_halo_love/diandian.png',
+                    iconImageUrl: configs.loveDaily.iconUrl,
                    title: '恋爱清单',
                    desc: '你我之间的约定我们都在努力实现'
                },
@@ -0,0 +1,357 @@
+<template>
+	<view class="app-page">
+		<view v-if="loading !== 'success'" class="loading-wrap">
+			<tm-skeleton model="card"></tm-skeleton>
+			<tm-skeleton model="card"></tm-skeleton>
+			<tm-skeleton model="card"></tm-skeleton>
+		</view>
+		<block v-else>
+			<view class="moment-card">
+				<view class="card flex flex-start">
+					<view class="avatar" style="flex-shrink: 0;">
+						<image style="width: 80rpx;height: 80rpx;border-radius: 50%;" :src="moment.spec.user.avatar" />
+					</view>
+					<view class="nickname" style="margin-left: 12rpx;">
+						<view style="font-size: 30rpx;font-weight: bold;color: #333333;">
+							{{ moment.spec.user.displayName }}
+						</view>
+						<view style="margin-top: 6rpx;font-size: 24rpx;color: #666;">
+							{{ {d: moment.spec.releaseTime, f: 'yyyy年MM月dd日 星期w'} | formatTime }}
+						</view>
+					</view>
+				</view>
+
+				<view v-if="moment.spec.tags && moment.spec.tags.length!==0" class="card flex flex-wrap flex-start"
+					style="padding-top:12rpx;padding-bottom:12rpx;">
+					<text class="text-size-m">标签列表：</text>
+					<tm-tags v-for="(tag,tagIndex) in moment.spec.tags" :key="tagIndex" :color="randomTagColor()"
+						size="m" model="text">
+						{{ tag }}
+					</tm-tags>
+				</view>
+
+				<view class="card" style="padding:0">
+					<mp-html class="evan-markdown" lazy-load :domain="markdownConfig.domain"
+						:loading-img="markdownConfig.loadingGif" :scroll-table="true" :selectable="true"
+						:tag-style="markdownConfig.tagStyle" :container-style="markdownConfig.containStyle"
+						:content="moment.spec.newHtml" :markdown="true" :showLineNumber="true" :showLanguageName="true"
+						:copyByLongPress="true" />
+				</view>
+				<view v-if="moment.images && moment.images.length!==0" class="card">
+					<view class="card-head text-size-m">
+						图片附件：
+					</view>
+					<view class="images" :class="['images-'+moment.images.length]">
+						<view class="image-item" v-for="(image,mediumIndex) in moment.images" :key="mediumIndex">
+							<image mode="aspectFill" style="width: 100%;height: 100%;border-radius: 6rpx;"
+								:src="image.url" @click="handlePreview(mediumIndex,moment.images)" />
+						</view>
+					</view>
+				</view>
+
+				<view v-if="moment.audios && moment.audios.length!==0" class="card">
+					<view class="card-head text-size-m">
+						音频附件：
+					</view>
+					<view
+						style="display: flex; flex-direction: column; gap: 12rpx 0;padding: 0 24rpx;padding-right:28rpx;">
+						<audio v-for="(audio,index) in moment.audios" :controls="true" :key="index" :id="audio.url"
+							:poster="bloggerInfo.avatar"
+							:name="'来自' + (startConfig.title||bloggerInfo.nickname) + '的声音'"
+							:author="bloggerInfo.nickname" :src="audio.url"></audio>
+					</view>
+				</view>
+				<view v-if="moment.videos && moment.videos.length!==0" class="card">
+					<view class="card-head text-size-m">
+						视频附件：
+					</view>
+					<view style="margin-top:24rpx;width:100%;display: flex; flex-direction: column; gap: 12rpx 0;">
+						<video style="width:100%;height: 400rpx;border-radius: 12rpx;"
+							v-for="(video,index) in moment.videos" :key="index" :src="video.url"
+							:id="'video_' + video.id" :show-mute-btn="true" :controls="true"
+							:show-center-play-btn="true" :enable-progress-gesture="true" @play="onVideoPlay(video.id)"
+							@pause="onVideoPause(video.id)" @ended="onVideoEnded(video.id)"></video>
+					</view>
+				</view>
+
+			</view>
+
+			<!-- 返回顶部 -->
+			<tm-flotbutton :width="90" :offset="[16, 80]" icon="icon-angle-up" color="bg-gradient-light-blue-accent"
+				@click="fnToTopPage()"></tm-flotbutton>
+		</block>
+	</view>
+</template>
+
+<script>
+	import MarkdownConfig from '@/common/markdown/markdown.config.js';
+
+	import tmSkeleton from '@/tm-vuetify/components/tm-skeleton/tm-skeleton.vue';
+	import tmFlotbutton from '@/tm-vuetify/components/tm-flotbutton/tm-flotbutton.vue';
+	import tmButton from '@/tm-vuetify/components/tm-button/tm-button.vue';
+	import tmEmpty from '@/tm-vuetify/components/tm-empty/tm-empty.vue';
+	import tmTags from '@/tm-vuetify/components/tm-tags/tm-tags.vue';
+
+	import mpHtml from '@/components/mp-html/components/mp-html/mp-html.vue';
+	import {
+		getAppConfigs
+	} from '@/config/index.js'
+	import HaloTokenConfig from "@/config/uhalo.config";
+	import {
+		getRandomNumberByRange
+	} from "@/utils/random.js";
+	import {
+		generateUUID
+	} from '@/utils/uuid.js';
+
+	export default {
+		components: {
+			tmSkeleton,
+			tmFlotbutton,
+			tmButton,
+			tmEmpty,
+			mpHtml,
+			tmTags
+		},
+		data() {
+			return {
+				loading: 'loading',
+				markdownConfig: MarkdownConfig,
+				queryParams: {
+					name: null
+				},
+				moment: null,
+				tagColors: ['orange', 'green', 'red', 'blue'],
+				videoContexts: {},
+				currentVideoId: null
+			};
+		},
+		computed: {
+			haloConfigs() {
+				return this.$tm.vx.getters().getConfigs;
+			},
+			calcUrl() {
+				return url => {
+					if (this.$utils.checkIsUrl(url)) {
+						return url;
+					}
+					return getApp().globalData.baseApiUrl + url;
+				};
+			},
+			// 获取博主信息
+			bloggerInfo() {
+				const blogger = this.haloConfigs.authorConfig.blogger;
+				blogger.avatar = this.$utils.checkAvatarUrl(blogger.avatar, true);
+				return blogger;
+			},
+			calcUseTagRandomColor() {
+				return this.haloConfigs.pageConfig.momentConfig.useTagRandomColor;
+			},
+		},
+		onLoad(e) {
+			this.fnSetPageTitle('瞬间加载中...');
+			this.queryParams.name = e.name;
+			this.fnGetData();
+		},
+		onPullDownRefresh() {
+			this.videoContexts = {};
+			this.currentVideoId = null;
+			this.fnGetData();
+		},
+		onShareAppMessage() {
+			return {
+				path: '/pagesA/moment-detail/moment-detail?name=' + this.moment.metadata.name,
+				title: this.moment.spec.title,
+			}
+		},
+		onShareTimeline() {
+			return {
+				title: this.moment.spec.title,
+				query: {
+					name: this.moment.metadata.name
+				}
+			}
+		},
+		methods: {
+			fnGetData() {
+				this.loading = 'loading';
+				this.$httpApi.v2
+					.getMomentByName(this.queryParams.name)
+					.then(res => {
+						console.log('获取详情', res);
+						let _tempResult = res;
+						this.fnSetPageTitle('瞬间详情');
+
+						_tempResult.spec.user = {
+							displayName: this.bloggerInfo.nickname,
+							avatar: this.$utils.checkAvatarUrl(this.bloggerInfo.avatar)
+						}
+						_tempResult.spec.content.medium.map(medium => {
+							medium.url = this.$utils.checkThumbnailUrl(medium.url, true)
+						})
+
+						_tempResult.spec.newHtml = this.removeTagLinksCompletely(_tempResult.spec.content.html, '')
+						_tempResult['images'] = _tempResult.spec.content.medium
+							.filter(x => x.type === 'PHOTO')
+
+						_tempResult['videos'] = _tempResult.spec.content.medium
+							.filter(x => x.type === 'VIDEO').map(_tempResult => {
+								_tempResult.id = generateUUID()
+								return _tempResult;
+							})
+
+						_tempResult['audios'] = _tempResult.spec.content.medium
+							.filter(x => x.type === 'AUDIO')
+
+						this.moment = _tempResult;
+						this.loading = 'success';
+
+						this.$nextTick(() => {
+							this.createVideoContexts(_tempResult.videos);
+						})
+					})
+					.catch(err => {
+						console.log("错误", err)
+						this.loading = 'error';
+					})
+					.finally(() => {
+						uni.hideLoading();
+						uni.stopPullDownRefresh();
+					});
+			},
+			handlePreview(index, list) {
+				uni.previewImage({
+					current: index,
+					urls: list.map(item => item.url)
+				})
+			},
+			removeTagLinksCompletely(htmlString) {
+				const regex = /<a\s+(?:[^>]*?\s+)?class=(['"])[^'"]*?\btag\b[^'"]*?\1[^>]*?>.*?<\/a>/gi;
+				const newHtml = htmlString.replace(regex, '');
+				return newHtml
+			},
+			randomTagColor() {
+				if (!this.calcUseTagRandomColor) return "blue";
+				const randomIndex = getRandomNumberByRange(0, this.tagColors.length);
+				return this.tagColors[randomIndex];
+			},
+			createVideoContexts(videos) {
+				this.stopAllVideos()
+				videos.forEach(item => {
+					this.videoContexts[item.id] = uni.createVideoContext(`video_${item.id}`, this);
+				})
+			},
+			onVideoPlay(videoId) {
+				this.currentVideoId = videoId;
+				this.stopAllVideos(videoId)
+			},
+			onVideoPause(videoId) {
+				if (this.currentVideoId == videoId) {
+					this.currentVideoId = null;
+				}
+			},
+			onVideoEnded(videoId) {
+				this.currentVideoId = null;
+			},
+			stopAllVideos(excludesVideoId = null) {
+				Object.keys(this.videoContexts).forEach(videoId => {
+					if (!excludesVideoId || excludesVideoId != videoId) {
+						const videoContext = this.videoContexts[videoId]
+						videoContext?.pause();
+					}
+				});
+			}
+		}
+	};
+</script>
+
+<style lang="scss" scoped>
+	.app-page {
+		width: 100vw;
+		min-height: 100vh;
+		display: flex;
+		flex-direction: column;
+		box-sizing: border-box;
+		background-color: #fafafd;
+		padding-bottom: 24rpx;
+	}
+
+	.loading-wrap {
+		padding: 0 24rpx;
+		height: inherit;
+		background-color: #fff;
+	}
+
+	.moment-card {
+		display: flex;
+		flex-direction: column;
+		box-sizing: border-box;
+		gap: 24rpx;
+		padding: 24rpx;
+	}
+
+	.card {
+		width: 100%;
+		box-sizing: border-box;
+		border-radius: 12rpx;
+		background-color: #ffff;
+		box-shadow: 0rpx 2rpx 24rpx rgba(0, 0, 0, 0.03);
+		overflow: hidden;
+		padding: 24rpx;
+
+		&-head {
+			position: relative;
+			// padding-left: 24rpx;
+			margin-bottom: 6rpx;
+
+			&:before {
+				display: none;
+				box-sizing: border-box;
+				content: "";
+				width: 6rpx;
+				height: 24rpx;
+				border-radius: 24rpx;
+				background: #2196F3;
+				position: absolute;
+				left: 0;
+				top: 6rpx;
+				overflow: hidden;
+			}
+		}
+	}
+
+
+	.images {
+		display: flex;
+		flex-wrap: wrap;
+		align-items: flex-start;
+		padding: 24rpx;
+
+		.image-item {
+			box-sizing: border-box;
+			border-radius: 24rpx;
+			padding: 6rpx;
+			width: 33%;
+			height: 200rpx
+		}
+
+		&-1 {
+			>.image-item {
+				width: 100%;
+				height: 350rpx
+			}
+		}
+
+		&-2 {
+			>.image-item {
+				width: 50%;
+				height: 250rpx
+			}
+		}
+	}
+
+	::v-deep .uni-audio-default {
+		width: 100%;
+		border-radius: 12rpx;
+	}
+</style>
@@ -1,508 +1,531 @@
 <template>
-    <view class="app-page bg-gradient-blue-lighten-b" :class="calcPageClass" :style="[calcPageStyle]">
-        <view v-if="calcBackgroundType!=='video'" class="tn-satr">
-            <view class="sky"></view>
-            <view class="stars">
-                <view class="falling-stars">
-                    <view class="star-fall"></view>
-                    <view class="star-fall"></view>
-                    <view class="star-fall"></view>
-                    <view class="star-fall"></view>
-                </view>
-                <view class="small-stars">
-                    <view class="star"></view>
-                    <view class="star"></view>
-                    <view class="star"></view>
-                    <view class="star"></view>
-                    <view class="star"></view>
-                    <view class="star"></view>
-                    <view class="star"></view>
-                    <view class="star"></view>
-                    <view class="star"></view>
-                    <view class="star"></view>
-                    <view class="star"></view>
-                    <view class="star"></view>
-                </view>
-                <view class="medium-stars">
-                    <view class="star"></view>
-                    <view class="star"></view>
-                    <view class="star"></view>
-                    <view class="star"></view>
-                    <view class="star"></view>
-                    <view class="star"></view>
-                    <view class="star"></view>
-                    <view class="star"></view>
-                    <view class="star"></view>
-                    <view class="star"></view>
-                    <view class="star"></view>
-                    <view class="star"></view>
-                </view>
-            </view>
-        </view>
+	<view class="app-page bg-gradient-blue-lighten-b" :class="calcPageClass" :style="[calcPageStyle]">
+		<view v-if="calcBackgroundType!=='video'" class="tn-satr">
+			<view class="sky"></view>
+			<view class="stars">
+				<view class="falling-stars">
+					<view class="star-fall"></view>
+					<view class="star-fall"></view>
+					<view class="star-fall"></view>
+					<view class="star-fall"></view>
+				</view>
+				<view class="small-stars">
+					<view class="star"></view>
+					<view class="star"></view>
+					<view class="star"></view>
+					<view class="star"></view>
+					<view class="star"></view>
+					<view class="star"></view>
+					<view class="star"></view>
+					<view class="star"></view>
+					<view class="star"></view>
+					<view class="star"></view>
+					<view class="star"></view>
+					<view class="star"></view>
+				</view>
+				<view class="medium-stars">
+					<view class="star"></view>
+					<view class="star"></view>
+					<view class="star"></view>
+					<view class="star"></view>
+					<view class="star"></view>
+					<view class="star"></view>
+					<view class="star"></view>
+					<view class="star"></view>
+					<view class="star"></view>
+					<view class="star"></view>
+					<view class="star"></view>
+					<view class="star"></view>
+				</view>
+			</view>
+		</view>

-        <video v-else class="video-bg" :object-fit="startConfig.bgVideoFit" :src="startConfig.bgVideo" :loop="true" :autoplay="true"
-               :muted="true" :controls="false" :show-fullscreen-btn="false" :show-play-btn="false"
-               :show-center-play-btn="false" :show-loading="false" :enable-progress-gesture="false"
-               :show-progress="false"></video>
+		<video v-else class="video-bg" :object-fit="startConfig.bgVideoFit" :src="$utils.checkUrl(startConfig.bgVideo)" :loop="true"
+			:autoplay="true" :muted="true" :controls="false" :show-fullscreen-btn="false" :show-play-btn="false"
+			:show-center-play-btn="false" :show-loading="false" :enable-progress-gesture="false"
+			:show-progress="false"></video>

-        <cover-view v-if="startConfig.title || startConfig.logo" class="title-container">
+		<cover-view v-if="startConfig.title || startConfig.logo" class="title-container">

-            <cover-view v-if="startConfig.logo" class="app-logo">
-                <cover-view class="app-logo-border">
-                    <cover-image class="app-logo-image" :src="$utils.checkImageUrl(startConfig.logo)"
-                                 mode="aspectFill"></cover-image>
-                </cover-view>
-            </cover-view>
+			<cover-view v-if="startConfig.logo" class="app-logo">
+				<cover-view class="app-logo-border">
+					<cover-image class="app-logo-image" :src="$utils.checkImageUrl(startConfig.logo)"
+						mode="aspectFill"></cover-image>
+				</cover-view>
+			</cover-view>

-            <cover-view v-if="startConfig.title" class="app-title" :style="startConfig.titleStyle">
-                「 {{ startConfig.title }} 」
-            </cover-view>
-        </cover-view>
+			<cover-view v-if="startConfig.title" class="app-title" :style="startConfig.titleStyle">
+				「 {{ startConfig.title }} 」
+			</cover-view>
+		</cover-view>

-        <cover-view v-if="startConfig.desc1 || startConfig.desc2" class="bottom-container">
-            <cover-view class="text-align-center" :style="startConfig.descStyle"
-                        style="color:white;padding: 60vh 0 0 0;">
-                <cover-view class="" style="font-size: 44rpx;" v-if="startConfig.desc1">{{ startConfig.desc1 }}
-                </cover-view>
-                <cover-view class="mt-30 text-size-m" v-if="startConfig.desc2">{{ startConfig.desc2 }}</cover-view>
-            </cover-view>
-
-            <cover-view class="" style="padding: 120rpx 200rpx;z-index: 999;position: relative;">
-                <cover-view class="start-btn" :class="[startConfig.btnClass]" @click="fnStart()"
-                            :style="startConfig.btnStyle">{{ startConfig.btnText || '开始体验' }}
-                </cover-view>
-            </cover-view>
-        </cover-view>
-        <!-- 波浪效果 -->
-        <wave v-if="startConfig.useWave"></wave>
-    </view>
+		<cover-view class="bottom-container">
+			<cover-view class="text-align-center" :style="startConfig.descStyle"
+				style="color:white;padding: 60vh 0 0 0;">
+				<cover-view style="font-size: 44rpx;" v-show="startConfig.desc1">
+					{{ startConfig.desc1 }}
+				</cover-view>
+				<cover-view class="mt-30 text-size-m" v-show="startConfig.desc2">
+					{{ startConfig.desc2 }}
+				</cover-view>
+			</cover-view>
+			<!-- #ifdef APP-PLUS -->
+			<cover-view class="start-btn-app" :style="[startConfig.btnStyle]" @click="fnStart()">
+				{{ startConfig.btnText || '开始体验' }}
+			</cover-view>
+			<!-- #endif -->
+			<!-- #ifndef APP-PLUS -->
+			<cover-view class="start-btn" :class="[startConfig.btnClass]" @click="fnStart()"
+				:style="[startConfig.btnStyle]">{{ startConfig.btnText || '开始体验' }}
+			</cover-view>
+			<!-- #endif -->
+		</cover-view>
+		<!-- 波浪效果 -->
+		<wave v-if="startConfig.useWave"></wave>
+	</view>
 </template>

 <script>
-import wave from '@/components/wave/wave.vue';
+	import wave from '@/components/wave/wave.vue';

-export default {
-    components: {
-        wave
-    },
-    computed: {
-        startConfig() {
-            return this.$tm.vx.getters().getConfigs.appConfig.startConfig;
-        },
-        calcBackgroundType() {
-            return this.startConfig.backgroundType;
-        },
-        calcPageClass() {
-            if (this.calcBackgroundType === 'color') {
-                return [this.startConfig.bg]
-            }
-            return []
-        },
-        calcPageStyle() {
-            if (this.calcBackgroundType === 'color') {
-                return {}
-            }
-            if (this.calcBackgroundType === 'image') {
-                return {
-                    backgroundImage: `url(${this.$utils.checkImageUrl(this.startConfig.bgImage)})!important`,
-                    backgroundSize: this.startConfig.bgImageFit
-                }
-            }
-            if (this.calcBackgroundType === 'video') {
-                return {
-                    background: '#ffffff'
-                }
-            }
-            return {};
-        }
-    },
-    methods: {
-        fnStart() {
-            uni.switchTab({
-                url: '/pages/tabbar/home/home',
-                success: () => {
-                    uni.setStorageSync('APP_HAS_STARTED', true);
-                }
-            });
-        }
-    }
-};
+	export default {
+		components: {
+			wave
+		},
+		computed: {
+			startConfig() {
+				return this.$tm.vx.getters().getConfigs.appConfig.startConfig;
+			},
+			calcBackgroundType() {
+				return this.startConfig.backgroundType;
+			},
+			calcPageClass() {
+				if (this.calcBackgroundType === 'color') {
+					return [this.startConfig.bg]
+				}
+				return []
+			},
+			calcPageStyle() {
+				if (this.calcBackgroundType === 'color') {
+					return {}
+				}
+				if (this.calcBackgroundType === 'image') {
+					return {
+						backgroundImage: `url(${this.$utils.checkImageUrl(this.startConfig.bgImage)})!important`,
+						backgroundSize: this.startConfig.bgImageFit
+					}
+				}
+				if (this.calcBackgroundType === 'video') {
+					return {
+						background: '#ffffff'
+					}
+				}
+				return {};
+			}
+		},
+		methods: {
+			fnStart() {
+				uni.switchTab({
+					url: '/pages/tabbar/home/home',
+					success: () => {
+						uni.setStorageSync('APP_HAS_STARTED', true);
+					}
+				});
+			}
+		}
+	};
 </script>

 <style lang="scss" scoped>
-.app-page {
-    position: relative;
-    width: 100vw;
-    height: 100vh;
-    background-size: cover;
-    background-repeat: no-repeat;
-}
+	.app-page {
+		position: relative;
+		width: 100vw;
+		height: 100vh;
+		background-size: cover;
+		background-repeat: no-repeat;
+	}

-.start-btn {
-    box-sizing: border-box;
-    background-color: transparent;
-    padding: 16rpx 50rpx;
-    border-radius: 50rpx;
-    border: 2rpx solid #ffffff;
-    color: #ffffff;
-    text-align: center;
-    font-size: 28rpx;
-}
+	.start-btn {
+		box-sizing: border-box;
+		background-color: transparent;
+		padding: 16rpx 50rpx;
+		border-radius: 50rpx;
+		border: 2rpx solid #ffffff;
+		color: #ffffff;
+		text-align: center;
+		font-size: 28rpx;
+		margin-top: 60rpx;
+		margin-bottom: 120rpx;
+	}

-.bottom-container {
-    position: absolute;
-    bottom: 50rpx;
-    left: 50%;
-    transform: translateX(-50%);
-    z-index: 999;
-}
+	.start-btn-app {
+		border-radius: 50rpx;
+		color: #ffffff;
+		text-align: center;
+		font-size: 28rpx;
+		margin: 60rpx auto 120rpx auto;
+		width: 40vw;
+		height: 60rpx;
+		line-height: 60rpx;
+		border: 2rpx solid #ffffff;
+	}

-.video-bg {
-    position: absolute;
-    left: 0;
-    top: 0;
-    width: 100vw;
-    height: 100vh;
-    z-index: 0;
-}
+	.bottom-container {
+		display: flex;
+		flex-direction: column;
+		position: absolute;
+		bottom: 50rpx;
+		left: 50%;
+		transform: translateX(-50%);
+		z-index: 999;
+	}

-.title-container {
-    width: 100vw;
-    position: absolute;
-    top: 20vh;
-    left: 0;
-    z-index: 999;
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    justify-content: center;
-}
+	.video-bg {
+		position: absolute;
+		left: 0;
+		top: 0;
+		width: 100vw;
+		height: 100vh;
+		z-index: 0;
+	}

-.app-logo {
-    width: 200rpx;
-    height: 200rpx;
+	.title-container {
+		width: 100vw;
+		position: absolute;
+		top: 20vh;
+		left: 0;
+		z-index: 999;
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+		justify-content: center;
+	}

-    &-border {
-        width: 100%;
-        height: 100%;
-        box-sizing: border-box;
-        border: 8rpx solid rgba(255, 255, 255, 0.35);
-        border-radius: 50%;
-        overflow: hidden;
-    }
+	.app-logo {
+		width: 200rpx;
+		height: 200rpx;

-    &-image {
-        width: 100%;
-        height: 100%;
-        border-radius: 50%;
-    }
-}
+		&-border {
+			width: 100%;
+			height: 100%;
+			box-sizing: border-box;
+			border: 8rpx solid rgba(255, 255, 255, 0.35);
+			border-radius: 50%;
+			overflow: hidden;
+		}

-.app-title {
-    color: #ffffff;
-    margin-top: 26rpx;
-    font-size: 36rpx;
-    font-weight: 600;
-    text-align: center;
-}
+		&-image {
+			width: 100%;
+			height: 100%;
+			border-radius: 50%;
+		}
+	}
+
+	.app-title {
+		color: #ffffff;
+		margin-top: 26rpx;
+		font-size: 36rpx;
+		font-weight: 600;
+		text-align: center;
+	}


-.tn-satr {
-    position: fixed;
-    width: 100%;
-    height: 600px;
-    overflow: hidden;
-    flex-shrink: 0;
-    z-index: 998;
-}
+	.tn-satr {
+		position: fixed;
+		width: 100%;
+		height: 600px;
+		overflow: hidden;
+		flex-shrink: 0;
+		z-index: 998;
+	}

-.stars {
-    position: absolute;
-    z-index: 1;
-    width: 100%;
-    height: 400px;
-}
+	.stars {
+		position: absolute;
+		z-index: 1;
+		width: 100%;
+		height: 400px;
+	}

-.star {
-    border-radius: 50%;
-    background: #ffffff;
-    box-shadow: 0 0 6px 0 rgba(255, 255, 255, 0.8);
-}
+	.star {
+		border-radius: 50%;
+		background: #ffffff;
+		box-shadow: 0 0 6px 0 rgba(255, 255, 255, 0.8);
+	}

-.small-stars .star {
-    position: absolute;
-    width: 3px;
-    height: 3px;
-}
+	.small-stars .star {
+		position: absolute;
+		width: 3px;
+		height: 3px;
+	}

-.small-stars .star:nth-child(2n) {
-    opacity: 0;
-    -webkit-animation: star-blink 1.2s linear infinite alternate;
-    animation: star-blink 1.2s linear infinite alternate;
-}
+	.small-stars .star:nth-child(2n) {
+		opacity: 0;
+		-webkit-animation: star-blink 1.2s linear infinite alternate;
+		animation: star-blink 1.2s linear infinite alternate;
+	}

-.small-stars .star:nth-child(1) {
-    left: 40px;
-    bottom: 50px;
-}
+	.small-stars .star:nth-child(1) {
+		left: 40px;
+		bottom: 50px;
+	}

-.small-stars .star:nth-child(2) {
-    left: 200px;
-    bottom: 40px;
-}
+	.small-stars .star:nth-child(2) {
+		left: 200px;
+		bottom: 40px;
+	}

-.small-stars .star:nth-child(3) {
-    left: 60px;
-    bottom: 120px;
-}
+	.small-stars .star:nth-child(3) {
+		left: 60px;
+		bottom: 120px;
+	}

-.small-stars .star:nth-child(4) {
-    left: 140px;
-    bottom: 250px;
-}
+	.small-stars .star:nth-child(4) {
+		left: 140px;
+		bottom: 250px;
+	}

-.small-stars .star:nth-child(5) {
-    left: 400px;
-    bottom: 300px;
-}
+	.small-stars .star:nth-child(5) {
+		left: 400px;
+		bottom: 300px;
+	}

-.small-stars .star:nth-child(6) {
-    left: 170px;
-    bottom: 80px;
-}
+	.small-stars .star:nth-child(6) {
+		left: 170px;
+		bottom: 80px;
+	}

-.small-stars .star:nth-child(7) {
-    left: 200px;
-    bottom: 360px;
-    -webkit-animation-delay: 0.2s;
-    animation-delay: 0.2s;
-}
+	.small-stars .star:nth-child(7) {
+		left: 200px;
+		bottom: 360px;
+		-webkit-animation-delay: 0.2s;
+		animation-delay: 0.2s;
+	}

-.small-stars .star:nth-child(8) {
-    left: 250px;
-    bottom: 320px;
-}
+	.small-stars .star:nth-child(8) {
+		left: 250px;
+		bottom: 320px;
+	}

-.small-stars .star:nth-child(9) {
-    left: 300px;
-    bottom: 340px;
-}
+	.small-stars .star:nth-child(9) {
+		left: 300px;
+		bottom: 340px;
+	}

-.small-stars .star:nth-child(10) {
-    left: 130px;
-    bottom: 320px;
-    -webkit-animation-delay: 0.5s;
-    animation-delay: 0.5s;
-}
+	.small-stars .star:nth-child(10) {
+		left: 130px;
+		bottom: 320px;
+		-webkit-animation-delay: 0.5s;
+		animation-delay: 0.5s;
+	}

-.small-stars .star:nth-child(11) {
-    left: 230px;
-    bottom: 330px;
-    -webkit-animation-delay: 7s;
-    animation-delay: 7s;
-}
+	.small-stars .star:nth-child(11) {
+		left: 230px;
+		bottom: 330px;
+		-webkit-animation-delay: 7s;
+		animation-delay: 7s;
+	}

-.small-stars .star:nth-child(12) {
-    left: 300px;
-    bottom: 360px;
-    -webkit-animation-delay: 0.3s;
-    animation-delay: 0.3s;
-}
+	.small-stars .star:nth-child(12) {
+		left: 300px;
+		bottom: 360px;
+		-webkit-animation-delay: 0.3s;
+		animation-delay: 0.3s;
+	}

-@-webkit-keyframes star-blink {
-    50% {
-        width: 3px;
-        height: 3px;
-        opacity: 1;
-    }
-}
+	@-webkit-keyframes star-blink {
+		50% {
+			width: 3px;
+			height: 3px;
+			opacity: 1;
+		}
+	}

-@keyframes star-blink {
-    50% {
-        width: 3px;
-        height: 3px;
-        opacity: 1;
-    }
-}
+	@keyframes star-blink {
+		50% {
+			width: 3px;
+			height: 3px;
+			opacity: 1;
+		}
+	}

-.medium-stars .star {
-    position: absolute;
-    width: 3px;
-    height: 3px;
-    opacity: 0;
-    -webkit-animation: star-blink 1.2s ease-in infinite alternate;
-    animation: star-blink 1.2s ease-in infinite alternate;
-}
+	.medium-stars .star {
+		position: absolute;
+		width: 3px;
+		height: 3px;
+		opacity: 0;
+		-webkit-animation: star-blink 1.2s ease-in infinite alternate;
+		animation: star-blink 1.2s ease-in infinite alternate;
+	}

-.medium-stars .star:nth-child(1) {
-    left: 300px;
-    bottom: 50px;
-}
+	.medium-stars .star:nth-child(1) {
+		left: 300px;
+		bottom: 50px;
+	}

-.medium-stars .star:nth-child(2) {
-    left: 400px;
-    bottom: 40px;
-    -webkit-animation-delay: 0.4s;
-    animation-delay: 0.4s;
-}
+	.medium-stars .star:nth-child(2) {
+		left: 400px;
+		bottom: 40px;
+		-webkit-animation-delay: 0.4s;
+		animation-delay: 0.4s;
+	}

-.medium-stars .star:nth-child(3) {
-    left: 330px;
-    bottom: 300px;
-    -webkit-animation-delay: 0.2s;
-    animation-delay: 0.2s;
-}
+	.medium-stars .star:nth-child(3) {
+		left: 330px;
+		bottom: 300px;
+		-webkit-animation-delay: 0.2s;
+		animation-delay: 0.2s;
+	}

-.medium-stars .star:nth-child(4) {
-    left: 460px;
-    bottom: 300px;
-    -webkit-animation-delay: 0.9s;
-    animation-delay: 0.9s;
-}
+	.medium-stars .star:nth-child(4) {
+		left: 460px;
+		bottom: 300px;
+		-webkit-animation-delay: 0.9s;
+		animation-delay: 0.9s;
+	}

-.medium-stars .star:nth-child(5) {
-    left: 300px;
-    bottom: 150px;
-    -webkit-animation-delay: 1.2s;
-    animation-delay: 1.2s;
-}
+	.medium-stars .star:nth-child(5) {
+		left: 300px;
+		bottom: 150px;
+		-webkit-animation-delay: 1.2s;
+		animation-delay: 1.2s;
+	}

-.medium-stars .star:nth-child(6) {
-    left: 440px;
-    bottom: 120px;
-    -webkit-animation-delay: 1s;
-    animation-delay: 1s;
-}
+	.medium-stars .star:nth-child(6) {
+		left: 440px;
+		bottom: 120px;
+		-webkit-animation-delay: 1s;
+		animation-delay: 1s;
+	}

-.medium-stars .star:nth-child(7) {
-    left: 200px;
-    bottom: 140px;
-    -webkit-animation-delay: 0.8s;
-    animation-delay: 0.8s;
-}
+	.medium-stars .star:nth-child(7) {
+		left: 200px;
+		bottom: 140px;
+		-webkit-animation-delay: 0.8s;
+		animation-delay: 0.8s;
+	}

-.medium-stars .star:nth-child(8) {
-    left: 30px;
-    bottom: 480px;
-    -webkit-animation-delay: 0.3s;
-    animation-delay: 0.3s;
-}
+	.medium-stars .star:nth-child(8) {
+		left: 30px;
+		bottom: 480px;
+		-webkit-animation-delay: 0.3s;
+		animation-delay: 0.3s;
+	}

-.medium-stars .star:nth-child(9) {
-    left: 460px;
-    bottom: 400px;
-    -webkit-animation-delay: 1.2s;
-    animation-delay: 1.2s;
-}
+	.medium-stars .star:nth-child(9) {
+		left: 460px;
+		bottom: 400px;
+		-webkit-animation-delay: 1.2s;
+		animation-delay: 1.2s;
+	}

-.medium-stars .star:nth-child(10) {
-    left: 150px;
-    bottom: 10px;
-    -webkit-animation-delay: 1s;
-    animation-delay: 1s;
-}
+	.medium-stars .star:nth-child(10) {
+		left: 150px;
+		bottom: 10px;
+		-webkit-animation-delay: 1s;
+		animation-delay: 1s;
+	}

-.medium-stars .star:nth-child(11) {
-    left: 420px;
-    bottom: 450px;
-    -webkit-animation-delay: 1.2s;
-    animation-delay: 1.2s;
-}
+	.medium-stars .star:nth-child(11) {
+		left: 420px;
+		bottom: 450px;
+		-webkit-animation-delay: 1.2s;
+		animation-delay: 1.2s;
+	}

-.medium-stars .star:nth-child(12) {
-    left: 340px;
-    bottom: 180px;
-    -webkit-animation-delay: 1.1s;
-    animation-delay: 1.1s;
-}
+	.medium-stars .star:nth-child(12) {
+		left: 340px;
+		bottom: 180px;
+		-webkit-animation-delay: 1.1s;
+		animation-delay: 1.1s;
+	}

-@keyframes star-blink {
-    50% {
-        width: 4px;
-        height: 4px;
-        opacity: 1;
-    }
-}
+	@keyframes star-blink {
+		50% {
+			width: 4px;
+			height: 4px;
+			opacity: 1;
+		}
+	}

-.star-fall {
-    position: relative;
-    border-radius: 2px;
-    width: 80px;
-    height: 2px;
-    overflow: hidden;
-    -webkit-transform: rotate(-20deg);
-    transform: rotate(-20deg);
-}
+	.star-fall {
+		position: relative;
+		border-radius: 2px;
+		width: 80px;
+		height: 2px;
+		overflow: hidden;
+		-webkit-transform: rotate(-20deg);
+		transform: rotate(-20deg);
+	}

-.star-fall:after {
-    content: '';
-    position: absolute;
-    width: 50px;
-    height: 2px;
-    background: -webkit-gradient(linear, right top, left top, from(rgba(0, 0, 0, 0)), to(rgba(255, 255, 255, 0.4)));
-    background: linear-gradient(to left, rgba(0, 0, 0, 0) 0%, rgba(255, 255, 255, 0.4) 100%);
-    left: 100%;
-    -webkit-animation: star-fall 3.6s linear infinite;
-    animation: star-fall 3.6s linear infinite;
-}
+	.star-fall:after {
+		content: '';
+		position: absolute;
+		width: 50px;
+		height: 2px;
+		background: -webkit-gradient(linear, right top, left top, from(rgba(0, 0, 0, 0)), to(rgba(255, 255, 255, 0.4)));
+		background: linear-gradient(to left, rgba(0, 0, 0, 0) 0%, rgba(255, 255, 255, 0.4) 100%);
+		left: 100%;
+		-webkit-animation: star-fall 3.6s linear infinite;
+		animation: star-fall 3.6s linear infinite;
+	}

-.star-fall:nth-child(1) {
-    left: 80px;
-    bottom: -100px;
-}
+	.star-fall:nth-child(1) {
+		left: 80px;
+		bottom: -100px;
+	}

-.star-fall:nth-child(1):after {
-    -webkit-animation-delay: 2.4s;
-    animation-delay: 2.4s;
-}
+	.star-fall:nth-child(1):after {
+		-webkit-animation-delay: 2.4s;
+		animation-delay: 2.4s;
+	}

-.star-fall:nth-child(2) {
-    left: 200px;
-    bottom: -200px;
-}
+	.star-fall:nth-child(2) {
+		left: 200px;
+		bottom: -200px;
+	}

-.star-fall:nth-child(2):after {
-    -webkit-animation-delay: 2s;
-    animation-delay: 2s;
-}
+	.star-fall:nth-child(2):after {
+		-webkit-animation-delay: 2s;
+		animation-delay: 2s;
+	}

-.star-fall:nth-child(3) {
-    left: 430px;
-    bottom: -50px;
-}
+	.star-fall:nth-child(3) {
+		left: 430px;
+		bottom: -50px;
+	}

-.star-fall:nth-child(3):after {
-    -webkit-animation-delay: 3.6s;
-    animation-delay: 3.6s;
-}
+	.star-fall:nth-child(3):after {
+		-webkit-animation-delay: 3.6s;
+		animation-delay: 3.6s;
+	}

-.star-fall:nth-child(4) {
-    left: 400px;
-    bottom: 100px;
-}
+	.star-fall:nth-child(4) {
+		left: 400px;
+		bottom: 100px;
+	}

-.star-fall:nth-child(4):after {
-    -webkit-animation-delay: 0.2s;
-    animation-delay: 0.2s;
-}
+	.star-fall:nth-child(4):after {
+		-webkit-animation-delay: 0.2s;
+		animation-delay: 0.2s;
+	}

-@-webkit-keyframes star-fall {
-    20% {
-        left: -100%;
-    }
+	@-webkit-keyframes star-fall {
+		20% {
+			left: -100%;
+		}

-    100% {
-        left: -100%;
-    }
-}
+		100% {
+			left: -100%;
+		}
+	}

-@keyframes star-fall {
-    20% {
-        left: -100%;
-    }
+	@keyframes star-fall {
+		20% {
+			left: -100%;
+		}

-    100% {
-        left: -100%;
-    }
-}
+		100% {
+			left: -100%;
+		}
+	}
 </style>
@@ -53,7 +53,7 @@
                <view class="poup pa-36" scroll-y="auto">
                    <view class="info flex">
                        <view class="poup-logo pa-4 shadow-24">
-                            <image :src="blogDetail.blogLogo" class="poup-logo_img" mode="aspectFill"></image>
+                            <image :src="$utils.checkAvatarUrl(blogDetail.blogLogo)" class="poup-logo_img" mode="aspectFill"></image>
                        </view>
                        <view class="pl-24 info-detail">
                            <view class="poup-name text-size-lg text-weight-b">{{ blogDetail.blogName }}</view>
@@ -97,6 +97,7 @@ import tmPoup from '@/tm-vuetify/components/tm-poup/tm-poup.vue'
 import tmImages from '@/tm-vuetify/components/tm-images/tm-images.vue'
 import tmTags from '@/tm-vuetify/components/tm-tags/tm-tags.vue'
 import tmCoupon from '@/tm-vuetify/components/tm-coupon/tm-coupon.vue'
+import $utils from "@/utils";

 export default {
    components: {
@@ -128,11 +129,14 @@ export default {
        };
    },
    computed: {
+      $utils() {
+        return $utils
+      },
        haloPluginConfigs(){
            return this.$tm.vx.getters().getConfigs.pluginConfig;
        },
        blogDetail() {
-            return this.haloPluginConfigs.submitLink;
+            return this.haloPluginConfigs.linksSubmitPlugin;
        },
        calcSiteThumbnail(val) {
            return val => {
@@ -147,13 +151,13 @@ export default {
            return `
 				   博客名称：${this.blogDetail.blogName}
 				   博客地址：${this.blogDetail.blogUrl}
-				   博客logo：${this.blogDetail.blogLogo}
+				   博客logo：${$utils.checkAvatarUrl(this.blogDetail.blogLogo)}
 				   博客简介：${this.blogDetail.blogDesc}
 				`
        },
        calcBlogCoupon() {
            return {
-                img: this.blogDetail.blogLogo,
+                img: $utils.checkAvatarUrl(this.blogDetail.blogLogo),
                title: this.blogDetail.blogName,
                time: this.blogDetail.blogDesc,
                btnText: '友链详情'
@@ -192,7 +196,7 @@ export default {
            this.$httpApi.v2.submitLink(this.form)
                .then(res => {
                    if (res.code === 200) {
-                        uni.$tm.toast('友链提交成功！');
+                        uni.$tm.toast(res.msg);
                        setTimeout(() => {
                            uni.navigateTo({
                                url: '/pagesA/friend-links/friend-links',
@@ -204,7 +208,7 @@ export default {
                            });
                        }, 1000);
                    } else {
-                        uni.$tm.toast('操作失败，请重试！');
+                        uni.$tm.toast(res.msg);
                    }
                })
                .catch(err => {
@@ -0,0 +1,729 @@
+<template>
+	<view class="app-page">
+		<view v-if="loading != 'success'" class="loading-wrap">
+			<tm-skeleton model="listAvatr"></tm-skeleton>
+			<tm-skeleton model="listAvatr"></tm-skeleton>
+			<tm-skeleton model="listAvatr"></tm-skeleton>
+			<tm-skeleton model="listAvatr"></tm-skeleton>
+		</view>
+		<block v-else>
+			<view v-if="!detail" class="empty">
+				<tm-empty icon="icon-shiliangzhinengduixiang-" label="未查询到数据"></tm-empty>
+			</view>
+			<block v-else>
+				<view class="vote-card vote-info-card">
+					<view class="sub-title"> 投票信息 </view>
+					<view class="vote-card-body flex flex-col uh-mt-8">
+						<view class="">
+							投票类型：<tm-tags color="light-blue" :shadow="0" size="xs" model="fill">
+								{{ vote.spec._uh_type }} </tm-tags>
+						</view>
+						<view class="">
+							投票状态：<tm-tags :color="vote.spec._uh_state.color" size="xs" :shadow="0"
+								model="fill">{{vote.spec._uh_state.state}}</tm-tags>
+						</view>
+						<view class="">
+							投票方式：<tm-tags v-if="vote.spec.canAnonymously" color="light-blue" size="xs" :shadow="0"
+								model="fill">匿名</tm-tags>
+							<tm-tags v-else color="red" size="xs" :shadow="0" model="fill">不匿名</tm-tags>
+						</view>
+						<view class="">
+							开始时间：{{ {d: vote.spec.startDate, f: 'yyyy-MM-dd HH:mm'} | formatTime }}
+						</view>
+						<view class="">
+							<text v-if="vote.spec.timeLimit==='permanent'">
+								结束时间：永久有效
+							</text>
+							<text v-else>
+								结束时间：{{ {d: vote.spec.endDate, f: 'yyyy-MM-dd HH:mm'} | formatTime }}
+							</text>
+						</view>
+					</view>
+				</view>
+
+				<view class="vote-card">
+					<view class="vote-card-head flex flex-col items-start mb-12">
+						<view class="sub-title"> 投票内容 </view>
+						<view class="sub-content">
+							{{ vote.spec.title }}
+						</view>
+						<view v-if="vote.spec.remark" class="sub-remark">
+							{{ vote.spec.remark  }}
+						</view>
+					</view>
+					<view class="vote-card-body uh-mt-8">
+						<view class="sub-title"> 投票选项 <text v-if="vote.spec.type==='multiple'"
+								class="sub-title-count">（最多选择 {{ vote.spec.maxVotes }} 项）</text> </view>
+						<view v-if="vote.spec.type==='single'" class="single">
+							<view class="w-full flex flex-col uh-gap-8">
+								<template v-if="vote.spec.isVoted || vote.spec.hasEnded">
+									<view v-for="(option,optionIndex) in vote.spec.options" :key="optionIndex"
+										class="is-voted-item" :class="[option.checked?'selected':'']" :style="{
+											'--percent':option._uh_percent + '%'
+										}">
+										<view class="is-voted-item-content flex w-full flex-between uh-gap-8">
+											<view class="flex-1 text-align-left text-break">
+												{{option.title }}
+											</view>
+											<view class="flex-shrink">
+												{{option._uh_percent }}%
+											</view>
+										</view>
+									</view>
+								</template>
+								<template v-else>
+									<view v-for="(option,optionIndex) in vote.spec.options" :key="optionIndex"
+										class="vote-select-option flex-1 w-full text-break"
+										:class="[option.checked?'light-blue':'grey-lighten-3']"
+										@click="handleSelectSingleOption(option)">
+										{{option.title }}
+									</view>
+								</template>
+							</view>
+						</view>
+
+						<view v-else-if="vote.spec.type==='multiple'" class="multiple">
+							<view class="w-full flex flex-col uh-gap-8">
+								<template v-if="vote.spec.isVoted || vote.spec.hasEnded">
+									<view v-for="(option,optionIndex) in vote.spec.options" :key="optionIndex"
+										class="is-voted-item" :class="[option.checked?'selected':'']" :style="{
+											'--percent':option._uh_percent + '%'
+										}">
+										<view class="is-voted-item-content flex w-full flex-between uh-gap-8">
+											<view class="flex-1 text-align-left text-break">
+												{{option.title }}
+											</view>
+											<view class="flex-shrink">
+												{{option._uh_percent }}%
+											</view>
+										</view>
+									</view>
+								</template>
+								<template v-else>
+									<view v-for="(option,optionIndex) in vote.spec.options" :key="optionIndex"
+										class="vote-select-option flex-1 w-full text-break"
+										:class="[option.checked?'light-blue':'grey-lighten-3']"
+										@click="handleSelectCheckboxOption(option)">
+										{{option.title }}
+									</view>
+								</template>
+							</view>
+						</view>
+
+						<view v-else-if="vote.spec.type==='pk'" class="pk">
+							<view class="pk-container">
+								<view class="radio-item" v-for="(option,optionIndex) in vote.spec.options"
+									:key="optionIndex" :class="[optionIndex==0?'radio-left':'radio-right']"
+									:style="{width: option._uh_percent + '%'}">
+									<view class="option-item"
+										:class="[optionIndex==0?'option-item-left':'option-item-right']">
+										{{option._uh_percent }}%
+									</view>
+								</view>
+							</view>
+							<view class="option-foot w-full flex flex-col uh-gap-8">
+								<template v-if="vote.spec.isVoted || vote.spec.hasEnded">
+									<view v-for="(option,optionIndex) in vote.spec.options" :key="optionIndex"
+										class="is-voted-item" :class="[option.checked?'selected':'']" :style="{
+											'--percent': option._uh_percent + '%'
+										}">
+										<view class="is-voted-item-content flex w-full flex-between uh-gap-8">
+											<view class="flex-1 text-align-left text-break">
+												选项{{ optionIndex+1}}：{{option.title }}
+											</view>
+											<view class="flex-shrink">
+												{{option._uh_percent }}%
+											</view>
+										</view>
+									</view>
+								</template>
+								<template v-else>
+									<view v-for="(option,optionIndex) in vote.spec.options" :key="optionIndex"
+										class="vote-select-option flex-1 w-full text-break"
+										:class="[option.checked?'light-blue':'grey-lighten-3']"
+										@click="handleSelectSingleOption(option)">
+										选项{{ optionIndex+1}}：{{option.title }}
+									</view>
+								</template>
+							</view>
+						</view>
+					</view>
+				</view>
+
+				<view class="vote-card">
+					<view class="vote-card-body">
+						<view class="sub-title"> 投票统计 </view>
+						<view class="">
+							<tm-tags color="grey-darken-4" size="s" model="text">{{ vote.stats.voteCount }}
+								人已参与</tm-tags>
+							<!-- <tm-tags v-if="vote.spec.isVoted" color="blue" rounded size="s" model="text">已投票</tm-tags> -->
+						</view>
+					</view>
+				</view>
+
+				<!-- 暂时不做,目前没有意义 -->
+				<!-- <view v-if="vote.spec.canSeeVoters" class="vote-card">
+					<view class="vote-card-body">
+						<view class="sub-title"> 投票用户 </view>
+						<view class="">
+							
+						</view>
+					</view>
+				</view> -->
+
+				<view class="vote-submit flex w-full flex-center" :style="{
+					paddingBottom:safeAreaBottom + 'rpx'
+				}">
+					<tm-button v-if="fnCalcIsVoted()" theme="white" text :block="true" class="w-full">您已参与投票</tm-button>
+					<tm-button v-else-if="vote.spec._uh_state.state==='未开始'" theme="orange" text class="w-full"
+						:block="true" @click="handleSubmitTip('投票未开始')">投票未开始</tm-button>
+					<tm-button v-else-if="vote.spec._uh_state.state==='已结束'" theme="red" text class="w-full"
+						:block="true" @click="handleSubmitTip('投票已结束')">投票已结束</tm-button>
+					<tm-button v-else-if="!vote.spec.canAnonymously" theme="red" :shadow="0" class="w-full" text
+						:block="true" @click="handleSubmit()">不支持匿名投票</tm-button>
+					<tm-button v-else-if="submitForm.voteData.length===0" theme="white" text class="w-full"
+						:block="true" @click="handleSubmitTip('请选择选项')">提交投票（请选择选项）</tm-button>
+					<tm-button v-else theme="light-blue" class="w-full" :block="true" :loading="submitLoading"
+						:disabled="submitLoading" @click="handleSubmit()">提交投票</tm-button>
+				</view>
+			</block>
+		</block>
+	</view>
+</template>
+
+<script>
+	import tmSkeleton from '@/tm-vuetify/components/tm-skeleton/tm-skeleton.vue';
+	import tmEmpty from '@/tm-vuetify/components/tm-empty/tm-empty.vue';
+	import tmButton from '@/tm-vuetify/components/tm-button/tm-button.vue';
+	import tmTags from '@/tm-vuetify/components/tm-tags/tm-tags.vue';
+
+	import {
+		VOTE_TYPES,
+		calcVoteState,
+		calcVotePercent,
+		voteCacheUtil
+	} from '@/utils/vote.js'
+
+	export default {
+		components: {
+			tmSkeleton,
+			tmEmpty,
+			tmButton,
+			tmTags,
+		},
+		data() {
+			return {
+				safeAreaBottom: 24,
+				loading: 'loading',
+				submitLoading: false,
+				pageTitle: '加载中...',
+
+				name: '',
+				detail: null,
+				vote: null,
+				submitForm: {
+					voteData: []
+				}
+			};
+		},
+
+		onLoad(e) {
+			this.name = e.name;
+			this.fnGetData();
+			// this.fnGetVoteUserList();
+			// #ifndef H5
+			const systemInfo = uni.getSystemInfoSync();
+			this.safeAreaBottom = systemInfo.safeAreaInsets.bottom + 12;
+			// #endif
+		},
+		onPullDownRefresh() {
+			this.fnGetData();
+			// this.fnGetVoteUserList();
+		},
+		onShareAppMessage() {
+			return {
+				path: '/pagesA/vote-detail/vote-detail?name=' + this.name,
+				title: this.vote?.spec?.title ?? "来投个票吧",
+				imageUrl: ""
+			}
+		},
+		onShareTimeline() {
+			return {
+				title: this.vote?.spec?.title ?? "来投个票吧",
+				query: {
+					name: this.name
+				},
+				imageUrl: ""
+			}
+		},
+		methods: {
+			fnGetData() {
+				// 设置状态为加载中 
+				this.loading = 'loading';
+				this.pageTitle = "加载中..."
+				this.$httpApi.v2
+					.getVoteDetail(this.name)
+					.then(res => {
+						this.pageTitle = "投票详情" + `（${VOTE_TYPES[res.vote.spec.type]}）`
+
+						const tempVoteRes = res;
+
+						tempVoteRes.vote.spec.isVoted = this.fnCalcIsVoted()
+						tempVoteRes.vote.spec.disabled = this.fnCalcIsVoted()
+						tempVoteRes.vote.spec._uh_state = calcVoteState(tempVoteRes.vote)
+						tempVoteRes.vote.spec._uh_type = VOTE_TYPES[tempVoteRes.vote.spec.type]
+
+						tempVoteRes.vote.spec.options.map((option, index) => {
+							option.value = option.id
+							option.label = option.title
+							option.isVoted = this.fnCalcIsVoted()
+							option.checked = this.fnCalcIsChecked(option)
+							option._uh_percent = calcVotePercent(tempVoteRes.vote, option);
+
+							option.dataStr = JSON.stringify(option)
+
+							return option
+						})
+
+						this.vote = tempVoteRes.vote
+						this.detail = tempVoteRes;
+
+						setTimeout(() => {
+							this.loading = 'success';
+						}, 200);
+					})
+					.catch(err => {
+						console.error(err);
+						this.loading = 'error';
+						this.pageTitle = "加载失败，请重试..."
+					})
+					.finally(() => {
+						setTimeout(() => {
+							uni.hideLoading();
+							uni.stopPullDownRefresh();
+							this.fnSetPageTitle(this.pageTitle);
+						}, 200);
+					});
+			},
+			fnGetVoteUserList() {
+				this.$httpApi.v2
+					.getVoteUserList(this.name)
+					.then(res => {
+						console.log("查询投票用户列表")
+					})
+					.catch(err => {
+						console.log("err")
+					})
+			},
+			fnCalcIsVoted() {
+				return voteCacheUtil.has(this.name)
+			},
+
+			fnCalcIsChecked(option) {
+				const data = voteCacheUtil.get(this.name)
+				if (!data) return false;
+				const checked = data.selected.includes(option.id)
+				return checked
+			},
+			onOptionRadioChange(e) {
+				this.submitForm.voteData = e.map(item => this.vote.spec.options[item.index]?.id);
+			},
+			onOptionCheckboxChange(e) {
+				this.submitForm.voteData = e.map(item => this.vote.spec.options[item.index]?.id);
+			},
+			onOptionPkChange(e) {
+				this.submitForm.voteData = e.map(item => this.vote.spec.options[item.index]?.id);
+			},
+			formatJsonStr(jsonStr) {
+				return jsonStr ? JSON.parse(jsonStr) : {}
+			},
+			handleSubmitTip(text) {
+				this.showToast(text)
+			},
+			handleSubmit() {
+				if (!this.vote.spec.canAnonymously) {
+					uni.showModal({
+						icon: "none",
+						title: "提示",
+						content: "该投票不支持匿名，请到博主的 网站端 进行投票！",
+						cancelColor: "#666666",
+						cancelText: "关闭",
+						confirmText: "复制地址",
+						success: (res) => {
+							if (res.confirm) {
+								this.$utils.copyText(this.$baseApiUrl, "复制成功")
+							}
+						}
+					})
+					return
+				}
+
+				this.submitLoading = true
+				uni.showLoading({
+					title: "正在保存..."
+				})
+
+				this.$httpApi.v2
+					.submitVote(this.name, this.submitForm, this.vote.spec.canAnonymously)
+					.then(res => {
+
+						this.showToast("提交成功")
+						voteCacheUtil.set(this.name, {
+							selected: [...this.submitForm.voteData],
+							data: this.vote
+						})
+
+						setTimeout(() => {
+							uni.startPullDownRefresh()
+							this.submitLoading = false
+						}, 1500);
+					})
+					.catch(err => {
+						console.error(err);
+						this.showToast("提交失败，请重试")
+						this.submitLoading = false
+					})
+			},
+
+			handleSelectSingleOption(option) {
+				if (this.vote.spec._uh_state.state == '未开始') {
+					this.showToast(`投票未开始`)
+					return
+				}
+				if (this.vote.spec.hasEnded) return
+				if (this.vote.spec.disabled) return
+				this.vote.spec.options.map(item => {
+					if (option.id == item.id) {
+						item.checked = true
+					} else {
+						item.checked = false
+					}
+				})
+
+				this.submitForm.voteData = this.vote.spec.options.filter(x => x.checked).map(item => item.id)
+			},
+
+			handleSelectCheckboxOption(option) {
+				if (this.vote.spec._uh_state.state == '未开始') {
+					this.showToast(`投票未开始`)
+					return
+				}
+				if (this.vote.spec.hasEnded) return
+				if (this.vote.spec.disabled) return
+
+				const checkedList = this.vote.spec.options.filter(x => x.checked && x.id != option.id)
+
+				if (this.vote.spec.type === 'multiple' && checkedList.length >= this.vote.spec.maxVotes) {
+					this.showToast(`最多选择 ${this.vote.spec.maxVotes} 项`)
+					return
+				}
+
+				this.vote.spec.options.map(item => {
+					if (option.id == item.id) {
+						item.checked = !item.checked
+					}
+				})
+
+				this.submitForm.voteData = this.vote.spec.options.filter(x => x.checked).map(item => item.id)
+			},
+			showToast(content) {
+				uni.showToast({
+					icon: "none",
+					title: content,
+					mask: true
+				})
+			}
+		}
+	};
+</script>
+
+<style lang="scss" scoped>
+	.app-page {
+		box-sizing: border-box;
+		width: 100vw;
+		min-height: 100vh;
+		display: flex;
+		flex-direction: column;
+		padding: 24rpx 0;
+		padding-bottom: 160rpx;
+		background-color: #fafafd;
+	}
+
+	.loading-wrap {
+		padding: 0 24rpx;
+		min-height: 100vh;
+	}
+
+	.empty {
+		height: 60vh;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+	}
+
+	.w-full {
+		width: 100%;
+	}
+
+	.wp-50 {
+		width: 50%;
+	}
+
+	.vote-card {
+		display: flex;
+		flex-direction: column;
+		box-sizing: border-box;
+		margin: 0 24rpx;
+		padding: 24rpx;
+		border-radius: 12rpx;
+		background-color: #ffff;
+		box-shadow: 0rpx 2rpx 24rpx rgba(0, 0, 0, 0.03);
+		overflow: hidden;
+		margin-bottom: 24rpx;
+	}
+
+	.vote-info-card {
+		.vote-card-body {
+			font-size: 28rpx;
+			gap: 12rpx 0;
+			background: #F3F4F6;
+			color: #3F3F3F;
+			padding: 24rpx;
+			border-radius: 12rpx;
+		}
+	}
+
+	.vote-card-head {
+		margin-bottom: 12rpx;
+		display: flex;
+		align-items: flex-satrt;
+		justify-content: space-between;
+
+		.left {
+			.title {
+				font-size: 28rpx;
+				font-weight: bold;
+			}
+		}
+	}
+
+	.vote-card-body {
+
+		.remark {
+			box-sizing: border-box;
+			padding: 12rpx 6rpx;
+			padding-top: 0;
+			color: rgba(0, 0, 0, 0.75);
+		}
+	}
+
+	.vote-card-foot {
+		box-sizing: border-box;
+		margin-top: 12px;
+		padding-top: 6px;
+		border-top: 2rpx solid #eee;
+	}
+
+	.is-voted-item {
+		min-height: 72rpx;
+		box-sizing: border-box;
+		position: relative;
+		border-radius: 12rpx;
+		background-color: rgba(229, 229, 229, 0.75);
+		font-size: 24rpx;
+		overflow: hidden;
+
+		&::before {
+			content: "";
+			width: var(--percent);
+			position: absolute;
+			left: 0;
+			top: 0;
+			bottom: 0;
+			background-color: rgba(208, 208, 208, 1);
+			z-index: 0;
+			border-radius: 6rpx;
+		}
+
+		&.selected {
+			background-color: rgba(3, 169, 244, 0.35);
+			color: #ffffff;
+
+			&::before {
+				background-color: rgba(3, 169, 244, 1);
+			}
+		}
+	}
+
+	.is-voted-item-content {
+		box-sizing: border-box;
+		min-height: 72rpx;
+		padding: 12rpx 24rpx;
+		position: relative;
+		z-index: 2;
+	}
+
+	.vote-select-option {
+		box-sizing: border-box;
+		padding: 20rpx 24rpx;
+		font-size: 24rpx;
+		border-radius: 12rpx;
+		transition: all 0.1s ease-in-out;
+	}
+
+
+	::v-deep {
+		.tm-button-label {
+			width: 100%;
+		}
+	}
+
+	.single {
+		::v-deep {}
+	}
+
+	.multiple {
+		::v-deep {}
+	}
+
+	.pk {
+		box-sizing: border-box;
+		width: 100%;
+
+		::v-deep {
+
+			.pk-container {
+				box-sizing: border-box;
+				width: 100%;
+				display: flex;
+			}
+
+			.radio-item {
+				flex-grow: 1;
+				min-width: 30% !important;
+				max-width: 70% !important;
+			}
+
+			.radio-left {}
+
+			.radio-right {}
+
+			.option-item {
+				box-sizing: border-box;
+				width: 100%;
+				padding: 24rpx;
+				border-radius: 12rpx;
+			}
+
+			.option-item-left {
+				background: linear-gradient(90deg, #3B82F6, #60A5FA);
+				color: white;
+				clip-path: polygon(0 0, calc(100% - 40rpx) 0, 100% 100%, 0 100%);
+			}
+
+			.option-item-right {
+				background: linear-gradient(90deg, #F87171, #EF4444);
+				color: white;
+				clip-path: polygon(0 0, 100% 0, 100% 100%, 40rpx 100%);
+				text-align: right;
+			}
+
+			.option-foot {
+				margin-top: 24rpx;
+				width: 100%;
+				font-size: 24rpx;
+				color: #666;
+
+				.tm-groupradio {
+					display: flex;
+					gap: 12rpx;
+				}
+
+				.tm-checkbox {
+					// width: 100%;
+					max-width: initial !important;
+				}
+
+				.tm-button {
+					width: 100%;
+				}
+
+				.left {
+					box-sizing: border-box;
+				}
+
+				.right {
+					box-sizing: border-box;
+
+					.flex-start.fulled {
+						justify-content: flex-end;
+					}
+				}
+			}
+		}
+	}
+
+	.sub-content {
+		margin-bottom: 12rpx;
+		padding: 12rpx 0;
+		font-weight: bold;
+		color: #2B2F33;
+		font-size: 30rpx;
+	}
+
+	.sub-remark {
+		margin-bottom: 36rpx;
+		padding-top: 12rpx;
+		color: #3F3F3F;
+		font-size: 28rpx;
+	}
+
+	.sub-title {
+		box-sizing: border-box;
+		position: relative;
+		margin-bottom: 12rpx;
+		padding-left: 24rpx;
+		// font-weight: bold;
+		font-size: 30rpx;
+
+		&:before {
+			content: "";
+			width: 8rpx;
+			height: 28rpx;
+			position: absolute;
+			left: 0;
+			top: 6rpx;
+			background: #03A9F4;
+			border-radius: 6rpx;
+		}
+
+		.sub-title-count {
+			font-size: 24rpx;
+			font-weight: normal;
+		}
+	}
+
+	.vote-submit {
+		box-sizing: border-box;
+		padding: 24rpx 36rpx;
+		position: fixed;
+		left: 0;
+		width: 100vw;
+		bottom: 0;
+		background-color: rgba(255, 255, 255, 0.98);
+		box-shadow: 0rpx 2rpx 24rpx rgba(0, 0, 0, 0.03);
+		border-top: 2rpx solid #eee;
+		z-index: 99;
+
+		::v-deep {
+			.tm-button {
+				text-align: center;
+			}
+
+			.tm-button-btn {
+				margin: 0;
+				width: 100%;
+			}
+		}
+	}
+</style>
@@ -0,0 +1,409 @@
+<template>
+	<view class="app-page" :class="[uniHaloPluginPageClass]">
+		<PluginUnavailable v-if="!uniHaloPluginAvailable" :pluginId="uniHaloPluginId"
+			:error-text="uniHaloPluginAvailableError" />
+		<template v-else>
+			<!-- 顶部切换 -->
+			<view class="e-fixed filter-box">
+				<tm-search v-model="queryParams.keyword" :round="24" :shadow="0" color="light-blue"
+					insert-color="light-blue" :clear="true" @input="fnOnSearch" @confirm="fnOnSearch"></tm-search>
+				<tm-dropDownMenu :shadow="0" color="light-blue" active-color="light-blue"
+					:default-selected="filterOption.selected" :list="filterOption.list"
+					@confirm="fnOnFilterConfirm"></tm-dropDownMenu>
+			</view>
+			<!-- 占位区域 -->
+			<view style="width: 100vw;height: 180rpx;"></view>
+			<!-- 加载区域 -->
+			<view v-if="loading == 'loading'" class="loading-wrap pa-24">
+				<tm-skeleton model="listAvatr"></tm-skeleton>
+				<tm-skeleton model="listAvatr"></tm-skeleton>
+				<tm-skeleton model="listAvatr"></tm-skeleton>
+				<tm-skeleton model="listAvatr"></tm-skeleton>
+			</view>
+			<view v-else-if="loading == 'error'" class="content-empty flex flex-center">
+				<tm-empty icon="icon-wind-cry" label="加载异常"></tm-empty>
+			</view>
+			<!-- 内容区域 -->
+			<view v-else class="content">
+				<view v-if="dataList.length == 0" class="content-empty flex flex-center">
+					<tm-empty icon="icon-shiliangzhinengduixiang-" label="暂无数据"></tm-empty>
+				</view>
+				<block v-else>
+					<tm-translate v-for="(item, index) in dataList" :key="item.metadata.name" animation-name="fadeUp"
+						:wait="calcAniWait(index)">
+						<VoteCard :vote="item" :index="index" @on-click="fnToDetail"></VoteCard>
+					</tm-translate>
+					<view class="load-text">{{ loadMoreText }}</view>
+					<tm-flotbutton @click="fnToTopPage" size="m" color="light-blue"
+						icon="icon-angle-up"></tm-flotbutton>
+
+				</block>
+			</view>
+		</template>
+	</view>
+</template>
+
+<script>
+	import tmSkeleton from '@/tm-vuetify/components/tm-skeleton/tm-skeleton.vue';
+	import tmSearch from '@/tm-vuetify/components/tm-search/tm-search.vue';
+	import tmTranslate from '@/tm-vuetify/components/tm-translate/tm-translate.vue';
+	import tmTabs from '@/tm-vuetify/components/tm-tabs/tm-tabs.vue';
+	import tmFlotbutton from '@/tm-vuetify/components/tm-flotbutton/tm-flotbutton.vue';
+	import tmEmpty from '@/tm-vuetify/components/tm-empty/tm-empty.vue';
+	import tmTags from '@/tm-vuetify/components/tm-tags/tm-tags.vue';
+	import tmDropDownMenu from '@/tm-vuetify/components/tm-dropDownMenu/tm-dropDownMenu.vue';
+
+	import VoteCard from '@/components/vote-card/vote-card.vue'
+
+	import {
+		VOTE_TYPES,
+		calcVoteState,
+		voteCacheUtil
+	} from '@/utils/vote.js'
+	import pluginAvailableMixin from "@/common/mixins/pluginAvailable.js"
+	import PluginUnavailable from '@/components/plugin-unavailable/plugin-unavailable.vue'
+
+	export default {
+		options: {
+			styleIsolation: 'shared'
+		},
+		mixins: [pluginAvailableMixin],
+		components: {
+			tmSkeleton,
+			tmSearch,
+			tmTranslate,
+			tmTabs,
+			tmFlotbutton,
+			tmEmpty,
+			tmTags,
+			tmDropDownMenu,
+			VoteCard,
+			PluginUnavailable
+		},
+		data() {
+			return {
+				loading: 'loading',
+				hasNext: false,
+				isLoadMore: false,
+				loadMoreText: '加载中...',
+				filterOption: {
+					selected: [],
+					list: [{
+						title: '类型',
+						children: [{
+							title: "",
+							model: "list",
+							name: "type",
+							children: [{
+									title: "全部",
+									id: undefined
+								},
+								{
+									title: "单选",
+									id: 'single'
+								},
+								{
+									title: "多选",
+									id: 'multiple'
+								},
+								{
+									title: "双选PK",
+									id: 'pk'
+								}
+							]
+						}]
+					}, {
+						title: '状态',
+						children: [{
+							title: "",
+							model: "list",
+							name: "hasEnded",
+							children: [{
+									title: "全部",
+									id: undefined
+								},
+								{
+									title: "进行中",
+									id: false
+								},
+								{
+									title: "已结束",
+									id: true
+								}
+							]
+						}]
+					}, {
+						title: '排序',
+						children: [{
+							title: "",
+							model: "list",
+							name: "sort",
+							children: [{
+									title: "默认排序",
+									id: undefined
+								},
+								{
+									title: "较近创建",
+									id: 'metadata.creationTimestamp,desc'
+								},
+								{
+									title: "较早创建",
+									id: 'metadata.creationTimestamp,asc'
+								}
+							]
+						}]
+					}, {
+						title: '是否已投',
+						children: [{
+							title: "",
+							model: "list",
+							name: "isVoted",
+							children: [{
+									title: "全部",
+									id: undefined
+								},
+								{
+									title: "未投票",
+									id: false
+								},
+								{
+									title: "已投票",
+									id: true
+								}
+							]
+						}]
+					}]
+				},
+				filterIsVoted: undefined,
+				queryParams: {
+					keyword: "",
+					page: 1,
+					size: 10,
+					sort: undefined,
+					type: undefined,
+					hasEnded: undefined
+				},
+				dataList: []
+			};
+		},
+		computed: {
+			haloConfigs() {
+				return this.$tm.vx.getters().getConfigs;
+			},
+			calcAuditModeEnabled() {
+				return this.haloConfigs.auditConfig.auditModeEnabled
+			},
+		},
+		async onLoad() {
+			this.fnSetPageTitle('投票列表');
+			// 检查插件
+			this.setPluginId(this.NeedPluginIds.PluginVote)
+			this.setPluginError("阿偶，检测到当前插件没有安装或者启用，无法使用投票功能哦，请联系管理员")
+			if (!await this.checkPluginAvailable()) return
+			this.fnGetData();
+		},
+		onPullDownRefresh() {
+			if (!this.uniHaloPluginAvailable) {
+				uni.hideLoading();
+				uni.stopPullDownRefresh();
+				return
+			}
+			this.fnResetSetAniWaitIndex();
+			this.isLoadMore = false;
+			this.queryParams.page = 0;
+			this.fnGetData();
+		},
+		onReachBottom(e) {
+			if (!this.uniHaloPluginAvailable) return;
+			if (this.calcAuditModeEnabled) {
+				uni.showToast({
+					icon: 'none',
+					title: '没有更多数据了'
+				});
+				return
+			}
+			if (this.hasNext) {
+				this.queryParams.page += 1;
+				this.isLoadMore = true;
+				this.fnGetData();
+			} else {
+				uni.showToast({
+					icon: 'none',
+					title: '没有更多数据了'
+				});
+			}
+		},
+		methods: {
+			fnOnSearch() {
+				this.fnResetSetAniWaitIndex();
+				this.fnToTopPage();
+				this.fnGetData();
+			},
+			fnGetData() {
+				if (this.calcAuditModeEnabled) {
+					return;
+				}
+				uni.showLoading({
+					mask: true,
+					title: '加载中...'
+				});
+				// 设置状态为加载中
+				if (!this.isLoadMore) {
+					this.loading = 'loading';
+				}
+				this.loadMoreText = '加载中...';
+				this.$httpApi.v2
+					.getVoteList(this.queryParams)
+					.then(res => {
+						this.loading = 'success';
+						this.loadMoreText = res.hasNext ? '上拉加载更多' : '呜呜，没有更多数据啦~';
+						this.hasNext = res.hasNext;
+
+						const tempItems = res.items.map(item => {
+							item.spec.disabled = true
+							item.spec.isVoted = this.fnCalcIsVoted(item.metadata.name)
+							item.spec._uh_state = calcVoteState(item)
+							item.spec._uh_type = VOTE_TYPES[item.spec.type]
+							item.spec.options.map((option, index) => {
+
+								option.checked = this.fnCalcIsChecked(item.metadata.name, option)
+								option.value = option.id
+								option.label = option.title
+
+								// 计算当前的选择占比
+								if (item.spec.type === 'single') {
+									option.percent = this.fnCalcPercent(option, item.stats);
+								} else if (item.spec.type === 'multiple') {
+									option.percent = this.fnCalcPercent(option, item.stats);
+								} else if (item.spec.type === 'pk') {
+									option.percent = this.fnCalcPercent(option, item.stats);
+								}
+
+								return option
+							})
+
+							return item;
+						})
+
+						if (this.isLoadMore) {
+							this.dataList = this.dataList.concat(tempItems);
+						} else {
+							this.dataList = tempItems;
+						}
+
+						this.dataList = this.dataList.sort((a, b) => {
+							return a.spec.isVoted - b.spec.isVoted
+						})
+
+						if (this.filterIsVoted != undefined) {
+							this.dataList = this.dataList.filter(x => x.spec.isVoted == this.filterIsVoted)
+						}
+					})
+					.catch(err => {
+						console.error(err);
+						this.loading = 'error';
+						this.loadMoreText = '加载失败，请下拉刷新！';
+					})
+					.finally(() => {
+						setTimeout(() => {
+							uni.hideLoading();
+							uni.stopPullDownRefresh();
+						}, 100);
+					});
+			},
+
+			fnCalcPercent(voteOption, stats) {
+				if (!stats?.voteDataList) return 0;
+				const option = stats.voteDataList.find(x => x.id == voteOption.id)
+				if (!option) return 0;
+				const percent = (option.voteCount / stats.voteCount) * 100
+				return Math.round(percent)
+			},
+
+			fnCalcIsVoted(name) {
+				return voteCacheUtil.has(name)
+			},
+			fnCalcIsChecked(name, option) {
+				const data = voteCacheUtil.get(name)
+				if (!data) return false;
+				const checked = data.selected.includes(option.id)
+				return checked
+			},
+		 
+			//跳转详情
+			fnToDetail(item) {
+				if (this.calcAuditModeEnabled) return;
+				uni.navigateTo({
+					url: '/pagesA/vote-detail/vote-detail?name=' + item.metadata.name,
+					animationType: 'slide-in-right'
+				});
+			},
+			fnOnFilterConfirm(e) {
+				// 类型
+				const type = e.find(x => x.name == 'type')
+				if (type.children.length == 0) {
+					this.queryParams.type = undefined
+				} else {
+					this.queryParams.type = type.children[0]?.id
+				}
+
+				// 状态
+				const hasEnded = e.find(x => x.name == 'hasEnded')
+				if (hasEnded.children.length == 0) {
+					this.queryParams.hasEnded = undefined
+				} else {
+					this.queryParams.hasEnded = hasEnded.children[0]?.id
+				}
+
+				// 排序
+				const sort = e.find(x => x.name == 'sort')
+				if (sort.children.length == 0) {
+					this.queryParams.sort = undefined
+				} else {
+					this.queryParams.sort = sort.children[0]?.id
+				}
+
+				// 是否已经投
+				const isVoted = e.find(x => x.name == 'isVoted')
+				if (isVoted.children.length == 0) {
+					this.filterIsVoted = undefined
+				} else {
+					this.filterIsVoted = isVoted.children[0]?.id
+				}
+
+				this.queryParams.page = 0;
+				this.isLoadMore = false;
+				this.fnResetSetAniWaitIndex();
+				this.fnToTopPage();
+				this.fnGetData();
+			}
+		}
+	};
+</script>
+
+<style lang="scss" scoped>
+	.app-page {
+		width: 100vw;
+		min-height: 100vh;
+		display: flex;
+		flex-direction: column;
+		padding-bottom: 24rpx;
+		background-color: #fafafd;
+
+		&.is-balck {
+			background-color: #212121;
+		}
+	}
+
+	.filter-box {
+		box-shadow: 0rpx 0rpx 12rpx rgba(0, 0, 0, 0.035);
+	}
+
+	.content {
+		padding-top: 24rpx;
+	}
+
+	.content-empty {
+		height: 60vh;
+	}
+</style>
@@ -13,9 +13,12 @@ export default {
        };
    },
    onLoad(e) {
-        const {title, url} = JSON.parse(e.query.data);
-        this.webUrl = url;
-        this.fnSetPageTitle(title);
+        const {title, url} = JSON.parse(e.data);
+        this.webUrl = decodeURIComponent(url);
+		console.log("webUrl" + this.webUrl)
+        if (title) {
+            this.fnSetPageTitle(title);
+        }
    }
 };
 </script>
@@ -5,33 +5,49 @@
 *  时间：2024年06月22日 12:00:44
 *  版本：v0.1.0
 */
-import {DefaultAppConfigs, getAppConfigs, setAppConfigs} from '@/config/index.js'
+import {DefaultAppConfigs, getAppConfigs, getAppMockJson, setAppConfigs, setAppMockJson} from '@/config/index.js'
 import v2Config from '@/api/v2/all.config.js'
+import utils from '@/utils/index.js'
+import {setTokens} from "@/utils/token";

 export default {
    namespaced: true,
    state: {
        configs: getAppConfigs(),
+        mockJson: getAppMockJson(),
    },
    getters: {
        getConfigs(state) {
            if (state.configs) return state.configs;
            return getAppConfigs()
        },
+        getMockJson(state) {
+            if (state.mockJson) return state.mockJson;
+            return getAppMockJson()
+        }
    },
    mutations: {
        setConfigs(state, data) {
            state.configs = data;
            setAppConfigs(data)
        },
+        setMockJson(state, data) {
+            setAppMockJson(data)
+            state.mockJson = data;
+        }
    },
    actions: {
-        fetchConfigs({commit, dispatch}) {
+        fetchConfigs({state, commit, dispatch}) {
            return new Promise(async (resolve, reject) => {
                try {
                    const res = await v2Config.getAppConfigs()
                    if (res) {
-                        commit('setConfigs', res)
+                        commit('setConfigs', utils.deepMerge(DefaultAppConfigs, res))
+
+                        // 存储token
+                        if (res?.basicConfig?.tokenConfig) {
+                            setTokens(res.basicConfig.tokenConfig)
+                        }
                        resolve(res)
                    } else {
                        dispatch("setDefaultAppSettings");
@@ -47,5 +63,28 @@ export default {
        setDefaultAppSettings({commit}) {
            commit('setConfigs', JSON.parse(JSON.stringify(DefaultAppConfigs)))
        },
+        // 请求模拟数据
+        fetchMockJson({state, commit, dispatch}) {
+            return new Promise(async (resolve, reject) => {
+                const mockJsonUrl = utils.checkUrl(state.configs.basicConfig.auditModeMockUrl)
+                uni.request({
+                    url: mockJsonUrl,
+                    method: "GET",
+                    success: (res) => {
+                        commit('setMockJson', res.data)
+                        resolve({
+                            ok: true,
+                            data: res.data
+                        })
+                    },
+                    fail: (err) => {
+                        resolve({
+                            ok: false,
+                            data: err
+                        })
+                    }
+                })
+            })
+        },
    }
 };
@@ -2,7 +2,7 @@
 	<view @click="onclick" class=" tm-checkbox " :class="[dense?'':'pa-20',inline?'d-inline-block':'']">
 		<view class=" flex-start">

-			<slot name="default" :checkData="{label:label,checked:changValue}" :on="onclick">
+			<slot name="default" :checkData="{label:label,checked:changValue,extendData}" :on="onclick">
 				<view :style="{width: sizes.wk,height: sizes.wk}" class="tm-checkbox-boey relative d-inline-block" 
 				:class="[black?'bk':'','flex-shrink mr-10',
 				changValue?'ani':'',
@@ -51,6 +51,10 @@
 	 */
 	import tmIcons from "@/tm-vuetify/components/tm-icons/tm-icons.vue"
 	export default {
+		options: {
+			virtualHost: true,
+			styleIsolation: 'shared'
+		},
 		components:{tmIcons},
 		name: 'tm-checkbox',
 		model: {
@@ -117,6 +121,10 @@
 			fllowTheme:{
 				type:Boolean|String,
 				default:true
+			},
+			extendData:{
+				type:Object,
+				default:()=>({})
 			}
 		},
 		data() {
@@ -100,8 +100,6 @@ export default {
        },
        //向列表添加数据
        pushData(list) {
-            console.log('添加图片数据----------',list)
-
            let prIdx_i = this.list2.length;
            if (!Array.isArray(list) || typeof list == 'undefined') {
                return false;
@@ -122,8 +120,6 @@ export default {
            return this.dataList;
        },
        async loadimg(event, isLoad, index) {
-            console.log('图片加载事件----------',event)
-
            this.isLoading = true;
            let ps = this.list2[index];
            ps.isLoad = true;
@@ -17,6 +17,10 @@
 	 * 
 	 */
 	export default {
+		options: {
+			virtualHost: true,
+			styleIsolation: 'shared'
+		},
 		name:'tm-groupcheckbox',
 		props:{
 			// 最大选择数量
@@ -2,7 +2,7 @@
 	<view @click="onclick" class=" tm-checkbox " :class="[dense?'':'pa-20',inline?'d-inline-block ':'fulled']">
 		<view class="flex-start fulled">
 			
-			<slot name="default" :checkData="{label:label,checked:changValue}" :on="onclick">
+			<slot name="default" :checkData="{label:label,checked:changValue,extendData}" :on="onclick">
 				<view :style="{width: sizes.wk,height: sizes.wk}" class="tm-checkbox-boey  relative d-inline-block"
 				:class="[black?'bk':'','flex-shrink mr-10 ',
 				changValue?'ani':'',
@@ -119,8 +119,11 @@
 			fllowTheme:{
 				type:Boolean|String,
 				default:true
-			}
-			
+			},
+			extendData:{
+				type:Object,
+				default:()=>({})
+			},
 		},
 		data() {
 			return {
@@ -19,7 +19,6 @@ class vuex {
 		let t = this;
 		const g = this.store.getters
 		let keys = Object.keys(g);
-		console.log(keys)
 		let k = keys.map((el,index)=>{
 			let f = el.split('/');
 			let tst = {}
@@ -0,0 +1,18 @@
+## 1.0.2（2023-09-14）
+更新使用文档：
+引入本插件 然后使用，手动滑稽，教程简单吗？
+<k-touch-listen @touchUp="touchUp" @touchDown="touchDown" @touchLeft="touchLeft" @touchRight="touchRight">
+  <view>
+   //您需要监听的区域的代码
+  </view>
+</k-touch-listen>
+## 1.0.1（2023-09-14）
+更新使用文档：
+引入本插件 然后使用，手动滑稽，教程简单吗？
+<k-touch-listen @touchUp="touchUp" @touchDown="touchDown" @touchLeft="touchLeft" @touchRight="touchRight">
+  <view>
+   //您需要监听的区域的代码
+  </view>
+</k-touch-listen>
+## 1.0.0（2023-09-14）
+首次提交
@@ -0,0 +1,113 @@
+<template>
+	<view class="touch-box" @touchstart="touchStart" @touchmove="touchMove" @touchend="touchEnd">
+		<slot></slot>
+	</view>
+</template>
+
+<script>
+	export default {
+		name: 'k-touch-listen',
+		data() {
+			return {
+				touchStartX: 0, // 触摸时的原点
+				touchStartY: 0, // 触摸时的原点
+				time: 0, // 时间记录，用于滑动时且时间小于1s则执行左右滑动
+				interval: '', // 记录/清理时间记录
+				touchMoveX: 0, // x轴方向移动的距离
+				touchMoveY: 0, // y轴方向移动的距离
+				touchMoveTag: false // 定义滑动状态
+			}
+		},
+		props: {
+			direction: {
+				type: String,
+				default: 'all'
+			},
+			distance: {
+				type: [String, Number],
+				default: 30
+			}
+		},
+		emits: ['touchUp', 'touchDown', 'touchLeft', 'touchRight'],
+		methods: {
+			// 触摸开始事件
+			touchStart(e) {
+				this.touchStartX = e.touches[0].pageX // 获取触摸时的原点
+				this.touchStartY = e.touches[0].pageY // 获取触摸时的原点
+				// 使用js计时器记录时间
+				this.interval = setInterval(() => {
+					this.time++
+				}, 100)
+			},
+			// 触摸移动事件
+			touchMove(e) {
+				this.touchMoveTag = true
+				this.touchMoveX = e.touches[0].pageX
+				this.touchMoveY = e.touches[0].pageY
+			},
+			ressetData() {
+				this.touchStartX = 0 // 触摸时的原点
+				this.touchStartY = 0 // 触摸时的原点
+				this.time = 0 // 时间记录，用于滑动时且时间小于1s则执行左右滑动
+				this.interval = '' // 记录/清理时间记录
+				this.touchMoveX = 0 // x轴方向移动的距离
+				this.touchMoveY = 0 // y轴方向移动的距离
+				this.touchMoveTag = false // 定义滑动状态
+			},
+			// 触摸结束事件
+			touchEnd(e) {
+				let moveX = this.touchMoveX - this.touchStartX
+				let moveY = this.touchMoveY - this.touchStartY
+				if (Math.sign(moveX) == -1) {
+					moveX *= -1
+				}
+				if (Math.sign(moveY) == -1) {
+					moveY *= -1
+				}
+				if (2 * moveX <= moveY && this.touchMoveTag) {
+					// 上下
+					if (this.direction != 'all' && this.direction != 'vertical') return
+					// 向上滑动
+					if (
+						this.touchMoveY - this.touchStartY <= -this.distance &&
+						this.time < 10
+					) {
+						this.$emit('touchUp')
+					}
+					// 向下滑动
+					if (
+						this.touchMoveY - this.touchStartY >= this.distance &&
+						this.time < 10
+					) {
+						this.$emit('touchDown')
+					}
+				} else if (moveX > 2 * moveY && this.touchMoveTag) {
+					// 左右
+					if (this.direction != 'all' && this.direction != 'horizontal') return
+					// 向左滑动
+					if (
+						this.touchMoveX - this.touchStartX <= -this.distance &&
+						this.time < 10
+					) {
+						this.$emit('touchLeft')
+					}
+					// 向右滑动
+					if (
+						this.touchMoveX - this.touchStartX >= this.distance &&
+						this.time < 10
+					) {
+						this.$emit('touchRight')
+					}
+				}
+				clearInterval(this.interval) // 清除setInterval
+				this.ressetData()
+			}
+		}
+	}
+</script>
+<style scoped>
+	.touch-box {
+		width: 100%;
+		height: 100%;
+	}
+</style>
@@ -0,0 +1,85 @@
+{
+	"id": "k-touch-listen",
+	"displayName": "k-touch-listen 手势监听  全面兼容小程序、vue2、vue3等多端",
+	"version": "1.0.2",
+	"description": "用于监听用户滑动手势，左滑右滑，上滑下滑等一系列手势监听",
+	"keywords": [
+        "touch",
+        "手势",
+        "手势监听",
+        "手势监听",
+        "vue3"
+    ],
+	"repository": "",
+	"engines": {
+		"HBuilderX": "^3.7.6"
+	},
+	"dcloudext": {
+		"type": "component-vue",
+		"sale": {
+			"regular": {
+				"price": "0.00"
+			},
+			"sourcecode": {
+				"price": "0.00"
+			}
+		},
+		"contact": {
+			"qq": ""
+		},
+		"declaration": {
+			"ads": "无",
+			"data": "插件不采集任何数据",
+			"permissions": "无"
+		},
+		"npmurl": ""
+	},
+	"uni_modules": {
+		"dependencies": [],
+		"encrypt": [],
+		"platforms": {
+			"cloud": {
+				"tcb": "y",
+				"aliyun": "y"
+			},
+			"client": {
+				"Vue": {
+					"vue2": "y",
+					"vue3": "y"
+				},
+				"App": {
+					"app-vue": "y",
+					"app-nvue": "y"
+				},
+				"H5-mobile": {
+					"Safari": "y",
+					"Android Browser": "y",
+					"微信浏览器(Android)": "y",
+					"QQ浏览器(Android)": "y"
+				},
+				"H5-pc": {
+					"Chrome": "y",
+					"IE": "y",
+					"Edge": "y",
+					"Firefox": "y",
+					"Safari": "y"
+				},
+				"小程序": {
+					"微信": "y",
+					"阿里": "y",
+					"百度": "y",
+					"字节跳动": "y",
+					"QQ": "y",
+					"钉钉": "u",
+					"快手": "u",
+					"飞书": "u",
+					"京东": "u"
+				},
+				"快应用": {
+					"华为": "u",
+					"联盟": "u"
+				}
+			}
+		}
+	}
+}
@@ -0,0 +1,22 @@
+## 1.1.0（2023-07-05）
+优化APP端生成逻辑
+## 1.0.9（2023-07-04）
+优化
+## 1.0.8（2023-07-04）
+增加注意事项
+## 1.0.7（2023-07-04）
+修改本地图片不显示问题
+## 1.0.6（2023-06-26）
+优化
+## 1.0.5（2023-06-09）
+增加子集绘制
+## 1.0.4（2023-06-09）
+增加子集绘制
+## 1.0.3（2023-06-08）
+增加预览二维码
+## 1.0.2（2023-05-31）
+增加license
+## 1.0.1（2023-05-30）
+增加示例
+## 1.0.0（2023-05-30）
+初始化发布
@@ -0,0 +1,377 @@
+<template>
+	<view class="canvas-main">
+		<canvas :style="'width:'+width+'rpx;height:'+height+'rpx;'" class="canvas-item" disable-scroll="true"
+			canvas-id="canvasId" @error="error"></canvas>
+	</view>
+</template>
+<script>
+	export default {
+		props: {
+			//画布宽度(rpx)
+			width: {
+				type: Number,
+				default: 750
+			},
+			//画布高度(rpx)
+			height: {
+				type: Number,
+				default: 750
+			},
+			//生成的图片格式(jpg或png)
+			fileType: {
+				type: String,
+				default: 'png'
+			},
+		},
+		data() {
+			return {
+				pixelRatio: 0,
+				context: null,
+				canvasList: []
+			}
+		},
+		methods: {
+			async init(list) {
+				uni.showLoading({
+					title: '正在绘制...'
+				})
+				if (this.context) {
+					await this.clear()
+					this.canvasList = []
+					this.context = null
+				}
+				this.canvasList = JSON.parse(JSON.stringify(list))
+				const systemInfo = uni.getSystemInfoSync()
+				this.pixelRatio = systemInfo.pixelRatio
+				this.context = uni.createCanvasContext('canvasId', this)
+				this.start()
+			},
+			clear() {
+				return new Promise(async (resolve, reject) => {
+					await this.context.clearRect(0, 0, this.width, this.height)
+					resolve()
+				})
+			},
+			async start() {
+				await Promise.all(this.canvasList.map(async res => {
+					if (res.type == 'color') {
+						await this.drawBg(res)
+					} else if (res.type == 'image') {
+						await this.drawImage(res)
+					} else if (res.type == 'text') {
+						await this.drawText(res)
+					} else if (res.type == 'line') {
+						await this.drawLine(res)
+					}
+				}))
+				this.save()
+			},
+			drawBg(item) {
+				return new Promise(async (resolve, reject) => {
+					item.width = uni.upx2px(item.width)
+					item.height = uni.upx2px(item.height)
+					item.x = uni.upx2px(item.x)
+					item.y = uni.upx2px(item.y)
+					item.radius = uni.upx2px(item.radius)
+					item.lineWidth = uni.upx2px(item.lineWidth)
+					let gradient = ''
+					if (item.colorObj && item.colorObj.colorList) {
+						if (item.colorObj.colorList.length == 1) {
+							this.context.fillStyle = item.colorObj.colorList[0]
+						} else {
+							if (item.colorObj.direction == 1) {
+								gradient = this.context.createLinearGradient(0, 0, item.height, 0)
+							} else if (item.colorObj.direction == 2) {
+								gradient = this.context.createLinearGradient(0, 0, 0, item.height)
+							} else if (item.colorObj.direction == 3) {
+								gradient = this.context.createLinearGradient(0, 0, item.width, item.height)
+							} else if (item.colorObj.direction == 4) {
+								gradient = this.context.createLinearGradient(item.width, 0, 0, item.height)
+							}
+							gradient.addColorStop(0, item.colorObj.colorList[0])
+							gradient.addColorStop(1, item.colorObj.colorList[1])
+							this.context.fillStyle = gradient
+						}
+					} else {
+						this.context.fillStyle = '#FFFFFF'
+					}
+					this.context.save()
+					if (item.radius > 0) {
+						this.context.beginPath()
+						this.context.moveTo(item.x + item.radius, item.y)
+						this.context.arcTo(item.x + item.width, item.y, item.x + item.width, item.y +
+							item.radius, item.radius)
+						this.context.lineTo(item.x + item.width, item.y + item.height - item.radius)
+						this.context.arcTo(item.x + item.width, item.y + item.height, item.x + item
+							.width - item.radius, item.y + item.height, item.radius)
+						this.context.lineTo(item.x + item.radius, item.y + item.height)
+						this.context.arcTo(item.x, item.y + item.height, item.x, item.y + item
+							.height - item.radius, item.radius)
+						this.context.lineTo(item.x, item.y + item.radius)
+						this.context.arcTo(item.x, item.y, item.x + item.radius, item.y, item.radius)
+						this.context.closePath()
+						this.context.clip()
+					}
+					this.context.fillRect(item.x, item.y, item.width, item.height)
+					if (item.lineWidth) {
+						this.context.setLineDash([])
+						this.context.lineWidth = item.lineWidth
+						this.context.strokeStyle = item.lineColor
+						this.context.beginPath()
+						this.context.moveTo(item.x + item.radius, item.y)
+						this.context.arcTo(item.x + item.width, item.y, item.x + item.width, item.y +
+							item.radius, item.radius)
+						this.context.lineTo(item.x + item.width, item.y + item.height - item.radius)
+						this.context.arcTo(item.x + item.width, item.y + item.height, item.x + item
+							.width - item.radius, item.y + item.height, item.radius)
+						this.context.lineTo(item.x + item.radius, item.y + item.height)
+						this.context.arcTo(item.x, item.y + item.height, item.x, item.y + item
+							.height - item.radius, item.radius)
+						this.context.lineTo(item.x, item.y + item.radius)
+						this.context.arcTo(item.x, item.y, item.x + item.radius, item.y, item.radius)
+						this.context.closePath()
+						this.context.stroke()
+					}
+					this.context.restore()
+					await this.context.draw(true)
+					if (item.childs && item.childs.length > 0) {
+						await Promise.all(item.childs.map(async res => {
+							if (res.type == 'color') {
+								await this.drawBg(res)
+							} else if (res.type == 'image') {
+								await this.drawImage(res)
+							} else if (res.type == 'text') {
+								await this.drawText(res)
+							} else if (res.type == 'line') {
+								await this.drawLine(res)
+							}
+						}))
+					}
+					resolve()
+				})
+			},
+			drawImage(item) {
+				return new Promise(async (resolve, reject) => {
+					item.width = uni.upx2px(item.width)
+					item.height = uni.upx2px(item.height)
+					item.x = uni.upx2px(item.x)
+					item.y = uni.upx2px(item.y)
+					item.radius = uni.upx2px(item.radius)
+					item.lineWidth = uni.upx2px(item.lineWidth)
+					await this.getImageInfo(item.path).then(async res => {
+						this.context.save()
+						if (item.radius > 0) {
+							this.context.beginPath()
+							this.context.moveTo(item.x + item.radius, item.y)
+							this.context.arcTo(item.x + item.width, item.y, item.x + item.width,
+								item.y +
+								item.radius, item.radius)
+							this.context.lineTo(item.x + item.width, item.y + item.height - item
+								.radius)
+							this.context.arcTo(item.x + item.width, item.y + item.height, item.x +
+								item
+								.width - item.radius, item.y + item.height, item.radius)
+							this.context.lineTo(item.x + item.radius, item.y + item.height)
+							this.context.arcTo(item.x, item.y + item.height, item.x, item.y + item
+								.height - item.radius, item.radius)
+							this.context.lineTo(item.x, item.y + item.radius)
+							this.context.arcTo(item.x, item.y, item.x + item.radius, item.y, item
+								.radius)
+							this.context.closePath()
+							this.context.clip()
+						}
+						await this.context.drawImage(res, item.x, item.y, item.width, item
+							.height)
+						if (item.lineWidth) {
+							this.context.setLineDash([])
+							this.context.lineWidth = item.lineWidth
+							this.context.strokeStyle = item.lineColor
+							this.context.beginPath()
+							this.context.moveTo(item.x + item.radius, item.y)
+							this.context.arcTo(item.x + item.width, item.y, item.x + item.width,
+								item.y +
+								item.radius, item.radius)
+							this.context.lineTo(item.x + item.width, item.y + item.height - item
+								.radius)
+							this.context.arcTo(item.x + item.width, item.y + item.height, item.x +
+								item
+								.width - item.radius, item.y + item.height, item.radius)
+							this.context.lineTo(item.x + item.radius, item.y + item.height)
+							this.context.arcTo(item.x, item.y + item.height, item.x, item.y + item
+								.height - item.radius, item.radius)
+							this.context.lineTo(item.x, item.y + item.radius)
+							this.context.arcTo(item.x, item.y, item.x + item.radius, item.y, item
+								.radius)
+							this.context.closePath()
+							this.context.stroke()
+						}
+						this.context.restore()
+						await this.context.draw(true)
+						if (item.childs && item.childs.length > 0) {
+							await Promise.all(item.childs.map(async res => {
+								if (res.type == 'color') {
+									await this.drawBg(res)
+								} else if (res.type == 'image') {
+									await this.drawImage(res)
+								} else if (res.type == 'text') {
+									await this.drawText(res)
+								} else if (res.type == 'line') {
+									await this.drawLine(res)
+								}
+							}))
+						}
+						resolve()
+					})
+				})
+			},
+			drawText(item) {
+				return new Promise(async (resolve, reject) => {
+					item.width = uni.upx2px(item.width)
+					item.height = uni.upx2px(item.height)
+					item.x = uni.upx2px(item.x)
+					item.y = uni.upx2px(item.y)
+					item.fontSize = uni.upx2px(item.fontSize)
+					item.lineHeight = uni.upx2px(item.lineHeight)
+					await this.drawTextInfo(item.content, item.x, item.y, item.fontSize, item.color, item
+						.width, item.height, item.lineHeight, item.bold, true)
+					resolve()
+				})
+			},
+			drawLine(item) {
+				return new Promise(async (resolve, reject) => {
+					item.width = uni.upx2px(item.width)
+					item.startX = uni.upx2px(item.startX)
+					item.startY = uni.upx2px(item.startY)
+					item.endX = uni.upx2px(item.endX)
+					item.endY = uni.upx2px(item.endY)
+					this.context.setStrokeStyle(item.color)
+					this.context.setLineWidth(item.width)
+					this.context.setLineCap('round')
+					if (item.lineType == 'dash') this.context.setLineDash([item.width * 5, item.width * 5], 0)
+					else this.context.setLineDash([])
+					this.context.beginPath()
+					this.context.moveTo(item.startX, item.startY)
+					this.context.lineTo(item.endX, item.endY)
+					this.context.stroke()
+					this.context.closePath()
+					resolve()
+				})
+			},
+			drawTextInfo(text, x, y, fontSize, color, width, height, lineHeight, bold, ellipsis) {
+				return new Promise(async (resolve, reject) => {
+					this.context.setFillStyle(color)
+					if (bold) this.context.font = 'bold ' + fontSize + 'px Arial'
+					else this.context.font = fontSize + 'px Arial'
+					this.context.setTextBaseline('bottom')
+					let textArray = text.split('')
+					let line = ''
+					let lines = []
+					for (let i = 0; i < textArray.length; i++) {
+						let testLine = line + textArray[i]
+						let testWidth = this.context.measureText(testLine).width
+						if (testWidth > width) {
+							lines.push(line)
+							line = textArray[i]
+						} else {
+							line = testLine
+						}
+					}
+					lines.push(line)
+					let firstWidth = this.context.measureText(lines[0]).width
+					if (height >= lineHeight * lines.length) {
+						await Promise.all(lines.map(async (res, i) => {
+							let lineText = res
+							let lineHeights = lineHeight * (i + 1)
+							await this.context.fillText(lineText, x, y + lineHeights)
+						}))
+					} else {
+						let sNum = parseInt(height / lineHeight)
+						lines = lines.slice(0, sNum)
+						await Promise.all(lines.map(async (res, i) => {
+							let lineText = res
+							let lineHeights = lineHeight * (i + 1)
+							if (i == lines.length - 1) {
+								if (this.context.measureText('...').width < fontSize) {
+									lineText = lineText.substring(0, lineText.length - 1)
+									lineText += '...'
+								} else {
+									lineText = lineText.substring(0, lineText.length - 2)
+									lineText += '...'
+								}
+							}
+							await this.context.fillText(lineText, x, y + lineHeights)
+						}))
+					}
+					resolve()
+				})
+			},
+			getImageInfo(src) {
+				return new Promise(async (resolve, reject) => {
+					if (src.indexOf('http') == -1) {
+						setTimeout(() => {
+							resolve(src)
+						})
+					} else {
+						// #ifdef APP-PLUS
+						uni.getImageInfo({
+							src: src,
+							success: (res) => {
+								resolve(res.path)
+							},
+							fail(err) {
+								resolve(src)
+							}
+						})
+						// #endif
+						// #ifndef APP-PLUS
+						uni.downloadFile({
+							url: src,
+							success: (res) => {
+								if (res.statusCode === 200) resolve(res.tempFilePath)
+							},
+							fail: (err) => {
+								resolve(src)
+							}
+						})
+						// #endif
+					}
+				})
+			},
+			save() {
+				let timer = setTimeout(async () => {
+					await this.context.draw(true, setTimeout(() => {
+						uni.canvasToTempFilePath({
+							canvasId: 'canvasId',
+							fileType: this.fileType,
+							quality: 1,
+							width: this.width,
+							height: this.height,
+							destWidth: this.width * this.pixelRatio,
+							destHeight: this.height * this.pixelRatio,
+							success: (res) => {
+								uni.hideLoading()
+								this.$emit('change', res.tempFilePath)
+							},
+							fail: (err) => {
+								console.log('生成图片失败:', err)
+							}
+						}, this)
+					}, 500))
+					clearTimeout(timer)
+				}, 500)
+			},
+			error(e) {
+				console.log('错误信息：', e)
+			}
+		}
+	}
+</script>
+</script>
+<style lang="scss" scoped>
+	.canvas-main {
+		position: fixed;
+		z-index: -999999 !important;
+		opacity: 0;
+		top: -5000rpx;
+	}
+</style>
@@ -0,0 +1,6 @@
+### 1、本插件可免费下载使用；
+### 2、未经许可，严禁复制本插件派生同类插件上传插件市场；
+### 3、未经许可，严禁在插件市场恶意复制抄袭本插件进行违规获利;
+### 4、对本软件的任何使用都必须遵守这些条款，违反这些条款的个人或组织将面临法律追究。
+
+
@@ -0,0 +1,100 @@
+{
+  "id": "liu-poster",
+  "displayName": "canvas海报画板、海报生成、海报图",
+  "version": "1.1.0",
+  "description": "canvas海报画板、海报生成、海报图组件，配置简单，支持绘制背景色、绘制图片、绘制文本、绘制线条，自由生成海报图片",
+  "keywords": [
+    "海报",
+    "生成海报",
+    "canvas",
+    "图片合成",
+    "图片处理"
+  ],
+  "repository": "",
+  "engines": {
+    "HBuilderX": "^3.1.0",
+    "uni-app": "^3.1.0",
+    "uni-app-x": "^3.1.0"
+  },
+  "dcloudext": {
+    "type": "component-vue",
+    "sale": {
+      "regular": {
+        "price": "0.00"
+      },
+      "sourcecode": {
+        "price": "0.00"
+      }
+    },
+    "contact": {
+      "qq": ""
+    },
+    "declaration": {
+      "ads": "无",
+      "data": "无",
+      "permissions": "无"
+    },
+    "npmurl": "",
+    "darkmode": "-",
+    "i18n": "-",
+    "widescreen": "-"
+  },
+  "uni_modules": {
+    "dependencies": [],
+    "encrypt": [],
+    "platforms": {
+      "cloud": {
+        "tcb": "√",
+        "aliyun": "√"
+      },
+      "client": {
+        "uni-app": {
+          "vue": {
+            "vue2": "-",
+            "vue3": "-"
+          },
+          "web": {
+            "safari": "-",
+            "chrome": "-"
+          },
+          "app": {
+            "vue": "-",
+            "nvue": "-",
+            "android": "-",
+            "ios": "-",
+            "harmony": "-"
+          },
+          "mp": {
+            "weixin": "-",
+            "alipay": "-",
+            "toutiao": "-",
+            "baidu": "-",
+            "kuaishou": "-",
+            "jd": "-",
+            "harmony": "-",
+            "qq": "-",
+            "lark": "-"
+          },
+          "quickapp": {
+            "huawei": "-",
+            "union": "-"
+          }
+        },
+        "uni-app-x": {
+          "web": {
+            "safari": "-",
+            "chrome": "-"
+          },
+          "app": {
+            "android": "-",
+            "ios": "-",
+            "harmony": "-"
+          },
+          "mp": {
+            "weixin": "-"
+          }
+        }
+      }
+    }
+  }
+}
@@ -0,0 +1,260 @@
+# liu-poster适用于uni-app项目的canvas海报画板、海报生成、海报图组件
+### 本组件目前兼容微信小程序、H5
+### 本组件是canvas海报画板、海报生成、海报图组件，配置简单，支持绘制背景色、绘制图片、绘制文本、绘制线条，自由生成海报图片
+# --- 扫码预览、关注我们 ---
+
+## 扫码关注公众号，查看更多插件信息，预览插件效果！ 
+
+![](https://uni.ckapi.pro/uniapp/publicize.png)
+
+### 属性说明
+| 名称                         | 类型           | 默认值                | 描述            |
+| ----------------------------|--------------- | -------------------- | ---------------|
+| width                       | Number         | 750                  | 画布宽度(rpx)
+| height                      | Number         | 750                  | 画布高度(rpx)
+| fileType                    | String         | png                  | 生成的图片格式(jpg或png)
+| @change                     | Function       |                      | 海报绘制成功回调事件
+
+### 使用示例
+``` 
+<template>
+	<view class="tab-box">
+		<view class="btn-complete" @click="open">一键生成海报</view>
+		<liu-poster ref="liuPoster" :width="750" :height="1300" @change="change"></liu-poster>
+		<image class="success-img" :src="url" @click="previewImg(url)"></image>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				canvasList: [{
+					type: 'color', //绘制类型(color:背景色;image:图片;text:文字;line:线条),
+					width: 750, //宽度(rpx)
+					height: 1300, //高度(rpx)
+					x: 0, //x轴位置(离左边的距离rpx)
+					y: 0, //y轴位置(离上边的距离rpx)
+					radius: 100, //圆角(rpx)
+					lineWidth: 40, //边框宽度(rpx)
+					lineColor: '#000000', //边框颜色
+					colorObj: {
+						colorList: ['#6900FF', '#FFFFFF'], //传入1个值为纯色，2个值为渐变色
+						direction: 2 //渐变色绘制方向(1:从左到右;2:从上到下;3:左上角到右下角;4:右上角到左下角)
+					}, //type为color时必填
+				}, {
+					type: 'image', //绘制类型(color:背景色;image:图片;text:文字;line:线条),
+					width: 132, //宽度(rpx)
+					height: 132, //高度(rpx)
+					x: 40, //x轴位置(离左边的距离rpx)
+					y: 120, //y轴位置(离上边的距离rpx)
+					radius: 66, //圆角(rpx)
+					lineWidth: 6, //边框宽度(rpx)
+					lineColor: '#FFFFFF', //边框颜色
+					path: 'https://img1.baidu.com/it/u=1471990434,2209509794&fm=253&fmt=auto&app=138&f=JPEG?w=400&h=400', //图片地址(type为image时必填)
+				}, {
+					type: 'text', //绘制类型(color:背景色;image:图片;text:文字;line:线条),
+					width: 400, //文本宽度(rpx)
+					height: 40, //文本高度(rpx)
+					x: 200, //x轴位置(离左边的距离rpx)
+					y: 145, //y轴位置(离上边的距离rpx)
+					color: '#FFFFFF', //文本颜色
+					fontSize: 36, //文字大小(rpx)
+					lineHeight: 36, //文字行高(rpx)
+					bold: true, //文字是否加粗
+					content: '好物分享猫猫虫', //文本内容(type为text时必填)
+				}, {
+					type: 'text', //绘制类型(color:背景色;image:图片;text:文字;line:线条),
+					width: 400, //文本宽度(rpx)
+					height: 40, //文本高度(rpx)
+					x: 200, //x轴位置(离左边的距离rpx)
+					y: 195, //y轴位置(离上边的距离rpx)
+					color: '#FFFFFF', //文本颜色
+					fontSize: 28, //文字大小(rpx)
+					lineHeight: 28, //文字行高(rpx)
+					bold: false, //文字是否加粗
+					content: '猫猫虫给你分享了一张美图', //文本内容(type为text时必填)
+				}, {
+					type: 'image', //绘制类型(color:背景色;image:图片;text:文字;line:线条),
+					width: 670, //宽度(rpx)
+					height: 670, //高度(rpx)
+					x: 40, //x轴位置(离左边的距离rpx)
+					y: 300, //y轴位置(离上边的距离rpx)
+					radius: 20, //圆角(rpx)
+					lineWidth: 12, //边框宽度(rpx)
+					lineColor: '#FFFFFF', //边框颜色
+					path: 'https://img1.baidu.com/it/u=1471990434,2209509794&fm=253&fmt=auto&app=138&f=JPEG?w=400&h=400', //图片地址(type为image时必填)
+					childs: [{
+						type: 'text', //绘制类型(color:背景色;image:图片;text:文字;line:线条),
+						width: 400, //文本宽度(rpx)
+						height: 40, //文本高度(rpx)
+						x: 100, //x轴位置(离左边的距离rpx)
+						y: 400, //y轴位置(离上边的距离rpx)
+						color: '#FFFFFF', //文本颜色
+						fontSize: 36, //文字大小(rpx)
+						lineHeight: 36, //文字行高(rpx)
+						bold: true, //文字是否加粗
+						content: '好物分享猫猫虫', //文本内容(type为text时必填)
+					}]
+				}, {
+					type: 'line', //绘制类型(color:背景色;image:图片;text:文字;line:线条),
+					width: 4, //线条宽度(rpx)
+					color: '#FFFFFF', //线条颜色
+					startX: 20, //起点x轴位置(离左边的距离rpx)
+					startY: 270, //起点y轴位置(离上边的距离rpx)
+					endX: 730, //终点x轴位置(离左边的距离rpx)
+					endY: 270, //终点y轴位置(离上边的距离rpx)
+					lineType: 'dash', //线条类型(solid:实线;dash:虚线)
+				}, {
+					type: 'line', //绘制类型(color:背景色;image:图片;text:文字;line:线条),
+					width: 4, //线条宽度(rpx)
+					color: '#FFFFFF', //线条颜色
+					startX: 20, //起点x轴位置(离左边的距离rpx)
+					startY: 1000, //起点y轴位置(离上边的距离rpx)
+					endX: 730, //终点x轴位置(离左边的距离rpx)
+					endY: 1000, //终点y轴位置(离上边的距离rpx)
+					lineType: 'dash', //线条类型(solid:实线;dash:虚线)
+				}, {
+					type: 'text', //绘制类型(color:背景色;image:图片;text:文字;line:线条),
+					width: 500, //文本宽度(rpx)
+					height: 150, //文本高度(rpx)
+					x: 40, //x轴位置(离左边的距离rpx)
+					y: 1050, //y轴位置(离上边的距离rpx)
+					color: '#9043FD', //文本颜色
+					fontSize: 32, //文字大小(rpx)
+					lineHeight: 45, //文字行高(rpx)
+					bold: true, //文字是否加粗
+					content: '这个是一段测试文字，这个是一段测试文字，这个是一段测试文字，这个是一段测试文字，这个是一段测试文字。', //文本内容(type为text时必填)
+				}, {
+					type: 'image', //绘制类型(color:背景色;image:图片;text:文字;line:线条),
+					width: 150, //宽度(rpx)
+					height: 150, //高度(rpx)
+					x: 550, //x轴位置(离左边的距离rpx)
+					y: 1050, //y轴位置(离上边的距离rpx)
+					radius: 4, //圆角(rpx)
+					lineWidth: 6, //边框宽度(rpx)
+					lineColor: '#FFFFFF', //边框颜色
+					path: 'https://img1.baidu.com/it/u=1471990434,2209509794&fm=253&fmt=auto&app=138&f=JPEG?w=400&h=400', //图片地址(type为image时必填)
+				}],
+				url: ''
+			};
+		},
+		methods: {
+			//开始绘制
+			open() {
+				this.$nextTick(() => {
+					this.$refs.liuPoster.init(this.canvasList)
+				})
+			},
+			//绘制成功返回生成的海报图片地址
+			change(e) {
+				this.url = e
+			},
+			//预览生成的海报图片
+			previewImg(url) {
+				if (!url) return
+				uni.previewImage({
+					urls: [url]
+				})
+			}
+		}
+	};
+</script>
+
+<style lang="scss" scoped>
+	.tab-box {
+		width: 100%;
+		height: 100vh;
+		box-sizing: border-box;
+		background-color: #f0f0f0;
+		padding-top: 20rpx;
+
+		.btn-reset {
+			width: 100%;
+			height: 72rpx;
+			background: #FFFFFF;
+			border-radius: 40rpx;
+			border: 2rpx solid #FD430E;
+			font-size: 30rpx;
+			color: #3E3E3E;
+			display: flex;
+			align-items: center;
+			justify-content: center;
+		}
+
+		.btn-complete {
+			width: 98%;
+			height: 76rpx;
+			border-radius: 40rpx;
+			font-size: 30rpx;
+			color: #FFFFFF;
+			background-color: #FD430E;
+			display: flex;
+			align-items: center;
+			justify-content: center;
+			margin: 0 auto;
+		}
+
+		.success-img {
+			width: 100%;
+			height: 1300rpx;
+			margin-top: 20rpx;
+		}
+	}
+</style>
+```
+
+### 传入的canvasList参数说明
+### 绘制类型有4种：color:背景色;image:图片;text:文字;line:线条
+``` 
+canvasList: [{
+	type: 'color', //绘制类型(color:背景色;image:图片;text:文字;line:线条),
+	width: 750, //宽度(rpx)
+	height: 1500, //高度(rpx)
+	x: 0, //x轴位置(离左边的距离rpx)
+	y: 0, //y轴位置(离上边的距离rpx)
+	radius: 100, //圆角(rpx)
+	lineWidth: 40, //边框宽度(rpx)
+	lineColor: '#000000', //边框颜色
+	colorObj: {
+		colorList: ['#6900FF', '#FFFFFF'], //传入1个值为纯色，2个值为渐变色
+		direction: 2 //渐变色绘制方向(1:从左到右;2:从上到下;3:左上角到右下角;4:右上角到左下角)
+	}, //type为color时必填
+	childs:[],//在背景色上绘制的内容放在childs里面即可
+}, {
+	type: 'image', //绘制类型(color:背景色;image:图片;text:文字;line:线条),
+	width: 132, //宽度(rpx)
+	height: 132, //高度(rpx)
+	x: 40, //x轴位置(离左边的距离rpx)
+	y: 150, //y轴位置(离上边的距离rpx)
+	radius: 66, //圆角(rpx)
+	lineWidth: 2, //边框宽度(rpx)
+	lineColor: '#FFFFFF', //边框颜色
+	path: 'https://img1.baidu.com/it/u=1471990434,2209509794&fm=253&fmt=auto&app=138&f=JPEG?w=400&h=400', //图片地址(type为image时必填)
+	childs:[],//如果在图片上绘制其他内容则将要绘制的内容放在childs里面即可
+}, {
+	type: 'text', //绘制类型(color:背景色;image:图片;text:文字;line:线条),
+	width: 400, //文本宽度(rpx)
+	height: 100, //文本高度(rpx)
+	x: 200, //x轴位置(离左边的距离rpx)
+	y: 170, //y轴位置(离上边的距离rpx)
+	color: '#FFFFFF', //文本颜色
+	fontSize: 36, //文字大小(rpx)
+	lineHeight: 45, //文字行高(rpx)
+	bold: true, //文字是否加粗
+	content: '好物分享猫猫虫好物分享猫猫虫好物分享猫猫虫好物分享猫猫虫好物分享猫猫虫好物分享猫猫虫好物分享猫猫虫', //文本内容(type为text时必填)
+}, {
+	type: 'line', //绘制类型(color:背景色;image:图片;text:文字;line:线条),
+	width: 2, //线条宽度(rpx)
+	color: '#FFFFFF', //线条颜色
+	startX: 0, //起点x轴位置(离左边的距离rpx)
+	startY: 310, //起点y轴位置(离上边的距离rpx)
+	endX: 750, //终点x轴位置(离左边的距离rpx)
+	endY: 310, //终点y轴位置(离上边的距离rpx)
+	lineType: 'dash', //线条类型(solid:实线;dash:虚线)
+}]
+```
+
+### 注意
+# 1、H5端使用网络图片需要解决跨域问题；
+# 2、小程序使用网络图片需要在微信公众平台配置downloadFile合法域名。
@@ -1,92 +0,0 @@
-## 2.1.9（2022-07-13）
-[修复] app端选择文件后初始化设置的文件列表被清空问题
-## 2.1.8（2022-07-13）
-[新增] ref方法初始化文件列表，用于已提交后再次编辑时需带入已上传文件：setFiles(files)，可传入数组或Map对象，传入格式请与组件选择返回格式保持一致，且name为必须属性。
-## 2.1.7（2022-07-12）
-修复ios端偶现创建webview初始化参数未生效的问题
-## 2.1.6（2022-07-11）
-[修复]：修复上个版本更新导致nvue窗口组件不能选择文件的问题；
-[新增]：
-1.应群友建议(填写禁止格式太多)格式限制formats由原来填写禁止选择的格式改为填写允许被选择的格式；
-2.应群友建议(增加上传结束回调事件)，上传结束回调事件@uploadEnd
-3.如能帮到你请留下你的免费好评，组件使用过程中有问题可以加QQ群交流，至于Map对象怎么使用这类前端基础问题请自行百度
-## 2.1.5（2022-07-01）
-app端组件销毁时添加自动销毁webview功能，避免v-if销毁组件的情况控件还能被点击的问题
-## 2.1.4（2022-07-01）
-修复小程序端回显问题
-## 2.1.3（2022-06-30）
-回调事件返回参数新增path字段(文件临时地址)，用于回显
-## 2.1.2（2022-06-16）
-修复APP端Tabbar窗口无法选择文件的问题
-## 2.1.1（2022-06-16）
-优化：
-1.组件优化为允许在v-if中使用；
-2.允许option直接在data赋值，不再强制在onRead中初始化；
-## 2.1.0（2022-06-13）
-h5 pc端更改为单次可多选
-## 2.0.9（2022-06-10）
-更新演示内容，部分同学不知道怎么获取服务端返回的数据
-## 2.0.8（2022-06-09）
-优化动态更新上传参数函数，具体查看下方说明：动态更新参数演示
-## 2.0.7（2022-06-07）
-新增wxFileType属性，用于小程序端选择附件时可选文件类型
-## 2.0.6（2022-06-07）
-修复小程序端真机选择文件提示失败的问题
-## 2.0.5（2022-06-02）
-优化小程序端调用hide()后未阻止触发文件选择问题
-## 2.0.4（2022-06-01）
-优化APP端选择器初始定位
-## 2.0.3（2022-05-31）
-修复nvue窗口选择文件报错问题 
-## 2.0.2（2022-05-20）
-修复ios端opiton设置过早未传入webview导致不自动上传问题
-## 2.0.1（2022-05-19）
-修复APP端子窗口点击选择文件不响应问题
-## 2.0.0（2022-05-18）
-此次组件更新至2.0版本，与1.0版本使用上略有差异，已使用1.0的同学请自行斟酌是否需要升级！
-部分差异：
-一、 2.0新增异步触发上传功能；
-二、2.0新增文件批量上传功能；
-三、2.0优化option，剔除属性，只保留上传接口所需字段，且允许异步更改option的值；
-四、组件增加size(文件大小限制)、count(文件个数限制)、formats(文件后缀限制)、accept(文件类型限制)、instantly(是否立即自动上传)、debug(日志打印)等属性；
-五、回调事件取消input事件、callback事件，新增change事件和progress事件；
-六、ref事件新增upload事件、clear事件；
-七、优化组件代码，show和hide函数改为显示隐藏，不再重复开关webview；
-
-## 1.2.3（2022-03-22）
-修复Demo里传入待完善功能[手动上传属性manual=true]导致不自动上传的问题，手动提交上传待下个版本更新
-## 1.2.2（2022-02-21）
-修复上版本APP优化导致H5和小程序端不自动初始化的问题，此次更新仅修复此问题。异步提交功能下个版本更新~
-## 1.2.1（2022-01-25）
-QQ1群已满，已开放2群：469580165
-## 1.2.0（2021-12-09）
-优化APP端页面中DOM重排后每次需要重新定位的问题
-## 1.1.1（2021-12-09）
-优化，与上版本使用方式有改变，请检查后确认是否需要更新，create更名为show,  close更名为hide，取消初始化时手动create, 传参方式改为props=>option
-## 1.1.0（2021-12-09）
-新增refresh方法，用于DOM发生重排时重新定位控件(APP端)
-## 1.0.9（2021-07-15）
-修复上传进度未同步渲染，直接返回100%的BUG
-## 1.0.8（2021-07-12）
-修复H5端传入height和width未生效的bug
-## 1.0.7（2021-07-07）
-修复h5和小程序端上传完成callback未返回fileName字段问题
-## 1.0.6（2021-07-07）
-修复h5端提示信息debug
-## 1.0.5（2021-06-29）
-感谢小伙伴找出bug,上传成功回调success未置为true,已修复
-## 1.0.4（2021-06-28）
-新增兼容APP,H5,小程序手动关闭控件，关闭后不再弹出文件选择框，需要重新create再次开启
-## 1.0.3（2021-06-28）
-close增加条件编译，除app端外不需要close
-## 1.0.2（2021-06-28）
-1.修复页面滚动位置后再create控件导致控件位置不正确的问题；
-2.修复nvue无法create控件；
-3.示例项目新增nvue使用案例；
-## 1.0.1（2021-06-28）
-因为有的朋友不清楚app端切换tab时应该怎么处理webview，现重新上传一版示例项目，需要做tab切换的朋友可以导入示例项目查看
-## 1.0.0（2021-06-25）
-此插件为l-file插件中上传功能改版，更新内容为：
-1. 按钮内嵌入页面，不再强制固定底部，可跟随页面滚动
-2.无需再单独弹框点击上传，减去中间层
-3.通过slot自定义按钮样式
@@ -1,392 +0,0 @@
-export class LsjFile {
-	constructor(data) {
-		this.dom = null;
-		// files.type = waiting（等待上传）|| loading（上传中）|| success（成功） || fail（失败）
-		this.files = new Map();
-		this.debug = data.debug || false;
-		this.id = data.id;
-		this.width = data.width;
-		this.height = data.height;
-		this.option = data.option;
-		this.instantly = data.instantly;
-		this.prohibited = data.prohibited;
-		this.onchange = data.onchange;
-		this.onprogress = data.onprogress;
-		this.uploadHandle = this._uploadHandle;
-		// #ifdef MP-WEIXIN
-		this.uploadHandle = this._uploadHandleWX;
-		// #endif
-	}
-	
-	
-	/**
-	 * 创建File节点
-	 * @param {string}path webview地址
-	 */
-	create(path) {
-		if (!this.dom) {
-			// #ifdef H5
-				let dom = document.createElement('input');
-				dom.type = 'file'
-				dom.value = ''
-				dom.style.height = this.height
-				dom.style.width = this.width
-				dom.style.position = 'absolute'
-				dom.style.top = 0
-				dom.style.left = 0
-				dom.style.right = 0
-				dom.style.bottom = 0
-				dom.style.opacity = 0
-				dom.style.zIndex = 999
-				dom.accept = this.prohibited.accept;
-				if (this.prohibited.count > 1) {
-				dom.multiple = 'multiple';
-				}
-				dom.onchange = event => {
-					for (let file of event.target.files) {
-						this.addFile(file);
-					}
-					this.dom.value = '';
-				};
-				this.dom = dom;
-			// #endif
-		
-			// #ifdef APP-PLUS
-				let styles = {
-					top: '-500px',
-					left: 0,
-					width: '1px',
-					height: '1px',
-					background: 'transparent' 
-				};
-				let extras = {
-					debug: this.debug,
-					instantly: this.instantly,
-					prohibited: this.prohibited,
-				}
-				this.dom = plus.webview.create(path, this.id, styles,extras);
-				this.setData(this.option); 
-				this._overrideUrlLoading();
-			// #endif
-			return this.dom;
-		}
-	}
-	
-	copyObject(obj) {
-		if (typeof obj !== "undefined") {
-			return JSON.parse(JSON.stringify(obj));
-		} else {
-			return obj;
-		}
-	}
-	
-	/**
-	 * 自动根据字符串路径设置对象中的值 支持.和[]
-	 * @param	{Object} dataObj 数据源
-	 * @param	{String} name 支持a.b 和 a[b]
-	 * @param	{String} value 值
-	 * setValue(dataObj, name, value);
-	 */
-	setValue(dataObj, name, value) {
-		// 通过正则表达式  查找路径数据
-		let dataValue;
-		if (typeof value === "object") {
-			dataValue = this.copyObject(value);
-		} else {
-			dataValue = value;
-		}
-		let regExp = new RegExp("([\\w$]+)|\\[(:\\d)\\]", "g");
-		const patten = name.match(regExp);
-		// 遍历路径  逐级查找  最后一级用于直接赋值
-		for (let i = 0; i < patten.length - 1; i++) {
-			let keyName = patten[i];
-			if (typeof dataObj[keyName] !== "object") dataObj[keyName] = {};
-			dataObj = dataObj[keyName];
-		}
-		// 最后一级
-		dataObj[patten[patten.length - 1]] = dataValue;
-		this.debug&&console.log('参数更新后',JSON.stringify(this.option));
-	}
-	
-	/**
-	 * 设置上传参数
-	 * @param {object|string}name 上传参数,支持a.b 和 a[b]
-	 */
-	setData() {
-		let [name,value = ''] = arguments;
-		if (typeof name === 'object') {
-			Object.assign(this.option,name);
-		}
-		else {
-			this.setValue(this.option,name,value);
-		}
-		
-		this.debug&&console.log(JSON.stringify(this.option));
-		
-		// #ifdef APP-PLUS
-			this.dom.evalJS(`vm.setData('${JSON.stringify(this.option)}')`);
-		// #endif
-	}
-	
-	/**
-	 * 上传
-	 * @param {string}name 文件名称
-	 */
-	async upload(name='') {
-		if (!this.option.url) {
-			throw Error('未设置上传地址');
-		}
-		
-		// #ifndef APP-PLUS
-			if (name && this.files.has(name)) {
-				await this.uploadHandle(this.files.get(name));
-			}
-			else {
-				for (let item of this.files.values()) {
-					if (item.type === 'waiting' || item.type === 'fail') {
-						await this.uploadHandle(item);
-					}
-				}
-			}
-		// #endif
-		
-		// #ifdef APP-PLUS
-			this.dom&&this.dom.evalJS(`vm.upload('${name}')`);
-		// #endif
-	}
-	
-	// 选择文件change
-	addFile(file) {
-		
-		let name = file.name;
-		this.debug&&console.log('文件名称',name,'大小',file.size);
-		
-		if (file) {
-			// 限制文件格式
-			let path = '';
-			let suffix = name.substring(name.lastIndexOf(".")+1).toLowerCase();
-			let formats = this.prohibited.formats.toLowerCase();
-			if (formats&&!formats.includes(suffix)) {
-				this.toast(`不支持上传${suffix.toUpperCase()}格式文件`);
-				return false;
-			}
-			// 限制文件大小
-			if (file.size > 1024 * 1024 * Math.abs(this.prohibited.size)) {
-				this.toast(`附件大小请勿超过${this.prohibited.size}M`)
-				return false;
-			}
-			// #ifndef MP-WEIXIN
-			path = URL.createObjectURL(file);
-			// #endif
-			// #ifdef MP-WEIXIN
-			path = file.path;
-			// #endif
-			this.files.set(file.name,{file,path,name: file.name,size: file.size,progress: 0,type: 'waiting'});
-			
-			// #ifndef MP-WEIXIN
-			this.onchange(this.files);
-			this.instantly&&this.upload();
-			// #endif
-			
-			// #ifdef MP-WEIXIN
-			return true;
-			// #endif
-		}
-	}
-	
-	/**
-	 * 移除文件
-	 * @param {string}name 不传name默认移除所有文件，传入name移除指定name的文件
-	 */
-	clear(name='') {
-		// #ifdef APP-PLUS
-		this.dom&&this.dom.evalJS(`vm.clear('${name}')`);
-		// #endif
-		
-		if (!name) {
-			this.files.clear();
-		}
-		else {
-			this.files.delete(name); 
-		}
-		return this.onchange(this.files);
-	}
-	
-	/**
-	 * 提示框
-	 * @param {string}msg 轻提示内容
-	 */
-	toast(msg) {
-		uni.showToast({
-			title: msg,
-			icon: 'none'
-		});
-	}
-	
-	/**
-	 * 微信小程序选择文件
-	 * @param {number}count 可选择文件数量
-	 */
-	chooseMessageFile(type,count) {
-		wx.chooseMessageFile({
-			count: count,
-			type: type,
-			success: ({ tempFiles }) => {
-				for (let file of tempFiles) {
-					let next = this.addFile(file);
-					if (!next) {return}
-				}
-				this.onchange(this.files);
-				this.instantly&&this.upload();
-			},
-			fail: () => {
-				this.toast(`打开失败`);
-			}
-		})
-	}
-	
-	_overrideUrlLoading() {
-		this.dom.overrideUrlLoading({ mode: 'reject' }, e => {
-			let {retype,item,files,end} = this._getRequest(
-				e.url
-			);
-			let _this = this;
-			switch (retype) {
-				case 'updateOption':
-					this.dom.evalJS(`vm.setData('${JSON.stringify(_this.option)}')`);
-					break
-				case 'change':
-					try {
-						_this.files = new Map([..._this.files,...JSON.parse(unescape(files))]);
-					} catch (e) {
-						return console.error('出错了，请检查代码')
-					}
-					_this.onchange(_this.files);
-					break
-				case 'progress':
-					try {
-						item = JSON.parse(unescape(item));
-					} catch (e) {
-						return console.error('出错了，请检查代码')
-					}
-					_this._changeFilesItem(item,end);
-					break
-				default:
-					break
-			}
-		})
-	}
-	
-	_getRequest(url) {
-		let theRequest = new Object()
-		let index = url.indexOf('?')
-		if (index != -1) {
-			let str = url.substring(index + 1)
-			let strs = str.split('&')
-			for (let i = 0; i < strs.length; i++) {
-				theRequest[strs[i].split('=')[0]] = unescape(strs[i].split('=')[1])
-			}
-		}
-		return theRequest
-	}
-	
-	_changeFilesItem(item,end=false) {
-		this.debug&&console.log('onprogress',JSON.stringify(item));
-		this.onprogress(item,end);
-		this.files.set(item.name,item);
-	}
-	
-	_uploadHandle(item) {
-		item.type = 'loading';
-		delete item.responseText;
-		return new Promise((resolve,reject)=>{
-			this.debug&&console.log('option',JSON.stringify(this.option));
-			let {url,name,method='POST',header,formData} = this.option;
-			let form = new FormData();
-			for (let keys in formData) {
-				form.append(keys, formData[keys])
-			}
-			form.append(name, item.file);
-			let xmlRequest = new XMLHttpRequest();
-			xmlRequest.open(method, url, true);
-			for (let keys in header) {
-				xmlRequest.setRequestHeader(keys, header[keys])
-			}
-			
-			xmlRequest.upload.addEventListener(
-				'progress',
-				event => {
-					if (event.lengthComputable) {
-						let progress = Math.ceil((event.loaded * 100) / event.total)
-						if (progress <= 100) {
-							item.progress = progress;
-							this._changeFilesItem(item);
-						}
-					}
-				},
-				false
-			);
-			
-			xmlRequest.ontimeout = () => {
-				console.error('请求超时')
-				item.type = 'fail';
-				this._changeFilesItem(item,true);
-				return resolve(false);
-			}
-			
-			xmlRequest.onreadystatechange = ev => {
-				if (xmlRequest.readyState == 4) {
-					if (xmlRequest.status == 200) {
-						this.debug&&console.log('上传完成：' + xmlRequest.responseText)
-						item['responseText'] = xmlRequest.responseText;
-						item.type = 'success';
-						this._changeFilesItem(item,true);
-						return resolve(true);
-					} else if (xmlRequest.status == 0) {
-						console.error('status = 0 :请检查请求头Content-Type与服务端是否匹配，服务端已正确开启跨域，并且nginx未拦截阻止请求')
-					}
-					console.error('--ERROR--：status = ' + xmlRequest.status)
-					item.type = 'fail';
-					this._changeFilesItem(item,true);
-					return resolve(false);
-				}
-			}
-			xmlRequest.send(form)
-		});
-	}
-	
-	_uploadHandleWX(item) {
-		item.type = 'loading';
-		delete item.responseText;
-		return new Promise((resolve,reject)=>{
-			this.debug&&console.log('option',JSON.stringify(this.option));
-			let form = {filePath: item.file.path,...this.option };
-			form['fail'] = ({ errMsg = '' }) => {
-				console.error('--ERROR--：' + errMsg)
-				item.type = 'fail';
-				this._changeFilesItem(item,true);
-				return resolve(false);
-			}
-			form['success'] = res => {
-				if (res.statusCode == 200) {
-					this.debug&&console.log('上传完成,微信端返回不一定是字符串，根据接口返回格式判断是否需要JSON.parse：' + res.data)
-					item['responseText'] = res.data;
-					item.type = 'success';
-					this._changeFilesItem(item,true);
-					return resolve(true);
-				}
-				item.type = 'fail';
-				this._changeFilesItem(item,true);
-				return resolve(false);
-			}
-			
-			let xmlRequest = uni.uploadFile(form);
-			xmlRequest.onProgressUpdate(({ progress = 0 }) => {
-				if (progress <= 100) {
-					item.progress = progress;
-					this._changeFilesItem(item);
-				}
-			})
-		});
-	}
-}
@@ -1,310 +0,0 @@
-<template>
-	<view class="lsj-file" :style="[getStyles]">
-		<view ref="lsj" class="hFile" :style="[getStyles]" @click="onClick">
-			<slot><view class="defview" :style="[getStyles]">附件上传</view></slot>
-		</view>
-	</view>
-</template>
-
-<script>
-// 查看文档：https://ext.dcloud.net.cn/plugin?id=5459
-import {LsjFile} from './LsjFile.js' 
-export default {
-	name: 'Lsj-upload',
-	props: {
-		// 打印日志
-		debug: {type: Boolean,default: false},
-		// 自动上传
-		instantly: {type: Boolean,default: false},
-		// 上传接口参数设置
-		option: {type: Object,default: ()=>{}},
-		// 文件大小上限
-		size: { type: Number, default: 10 },
-		// 文件选择个数上限,超出后不触发点击
-		count: { type: Number, default: 9 },
-		// 允许上传的文件格式（多个以逗号隔开）
-		formats: { type: String, default:''},
-		// input file选择限制
-		accept: {type: String,default: ''},
-		// 微信选择文件类型 
-		//all=从所有文件选择，
-		//video=只能选择视频文件，
-		//image=只能选择图片文件，
-		//file=可以选择除了图片和视频之外的其它的文件
-		wxFileType: { type: String, default: 'all' },
-		// webviewID需唯一，不同窗口也不要同Id
-		childId: { type: String, default: 'lsjUpload' },
-		// 文件选择触发面宽度
-		width: { type: String, default: '100%' },
-		// 文件选择触发面高度
-		height: { type: String, default: '80rpx' },
-		
-		// top,left,bottom,right仅position=absolute时才需要传入
-		top: { type: [String, Number], default: '' },
-		left: { type: [String, Number], default: '' },
-		bottom: { type: [String, Number], default: '' },
-		right: { type: [String, Number], default: '' },
-		// nvue不支持跟随窗口滚动
-		position: { 
-			type: String,
-			// #ifdef APP-NVUE
-			 default: 'absolute',
-			// #endif
-			// #ifndef APP-NVUE
-			default: 'static',
-			// #endif
-		},
-	},
-	data() {
-		return {
-			
-		}
-	},
-	watch: {
-		option(v) {
-			// #ifdef APP-PLUS
-			this.lsjFile&&this.show();
-			// #endif
-		}
-	},
-	updated() {
-		// #ifdef APP-PLUS
-			if (this.isShow) {
-				this.lsjFile&&this.show();
-			}
-		// #endif
-	},
-	computed: {
-		getStyles() {
-			let styles = {
-				width: this.width,
-				height: this.height
-			}
-			if (this.position == 'absolute') {
-				styles['top'] = this.top
-				styles['bottom'] = this.bottom
-				styles['left'] = this.left
-				styles['right'] = this.right
-				styles['position'] = 'fixed'
-			}
-
-			return styles
-		}
-	},
-	mounted() {
-		this._size = 0;
-		this.lsjFile = new LsjFile({
-			debug: this.debug,
-			id: this.childId,
-			width: this.width,
-			height: this.height,
-			option: this.option,
-			instantly: this.instantly,
-			// 限制条件
-			prohibited: {
-				// 大小
-				size: this.size,
-				// 允许上传的格式
-				formats: this.formats,
-				// 限制选择的格式
-				accept: this.accept,
-				count: this.count
-			},
-			onchange: this.onchange,
-			onprogress: this.onprogress,
-		});
-		this.create();
-		
-	},
-	beforeDestroy() {
-		// #ifdef APP-PLUS
-		this.lsjFile.dom.close();
-		// #endif
-	},
-	methods: {
-		setFiles(array) {
-			if (array instanceof Map) {
-				for (let [key, item] of array) {
-					item['progress'] = 100;
-					item['type'] = 'success';
-					this.lsjFile.files.set(key,item);
-				}
-			}
-			else if (Array.isArray(array)) {
-				array.forEach(item=>{
-					if (item.name) { 
-						item['progress'] = 100;
-						item['type'] = 'success';
-						this.lsjFile.files.set(item.name,item);
-					}
-				});
-			}
-			this.onchange(this.lsjFile.files);
-		},
-		setData() {
-			this.lsjFile&&this.lsjFile.setData(...arguments);
-		},
-		getDomStyles(callback) {
-			// #ifndef APP-NVUE
-			let view = uni
-				.createSelectorQuery()
-				.in(this)
-				.select('.lsj-file')
-			view.fields(
-				{
-					size: true,
-					rect: true
-				},
-				({ height, width, top, left, right, bottom }) => {
-					uni.createSelectorQuery()
-					.selectViewport()
-					.scrollOffset(({ scrollTop }) => {
-						return callback({
-							top: parseInt(top) + parseInt(scrollTop) + 'px',
-							left: parseInt(left) + 'px',
-							width: parseInt(width) + 'px',
-							height: parseInt(height) + 'px'
-						})
-					})
-					.exec()
-				}
-			).exec()
-			// #endif
-			// #ifdef APP-NVUE
-			const dom = weex.requireModule('dom')
-			dom.getComponentRect(this.$refs.lsj, ({ size: { height, width, top, left, right, bottom } }) => {
-				return callback({
-					top: parseInt(top) + 'px',
-					left: parseInt(left) + 'px',
-					width: parseInt(width) + 'px',
-					height: parseInt(height) + 'px',
-					right: parseInt(right) + 'px',
-					bottom: parseInt(bottom) + 'px'
-				})
-			})
-			// #endif
-		},
-		show() {
-			this.isShow = true;
-			// #ifdef APP-PLUS
-			this.lsjFile&&this.getDomStyles(styles => {
-				this.lsjFile.dom.setStyle(styles)
-			});
-			// #endif
-			// #ifdef H5
-			this.lsjFile.dom.style.display = 'inline'
-			// #endif
-		},
-		hide() {
-			this.isShow = false;
-			// #ifdef APP-PLUS
-			this.lsjFile&&this.lsjFile.dom.setStyle({
-				top: '-500px',
-				left:'0px',
-				width: '1px',
-				height: '1px',
-			});
-			// #endif
-			// #ifdef H5
-			this.lsjFile.dom.style.display = 'none'
-			// #endif
-		},
-		/**
-		 * 手动提交上传
-		 * @param {string}name 文件名称，不传则上传所有type等于waiting和fail的文件
-		 */
-		upload(name) {
-			this.lsjFile&&this.lsjFile.upload(name);
-		},
-		/**
-		 * @returns {Map} 已选择的文件Map集
-		 */
-		onchange(files) {
-			this.$emit('change',files);
-			this._size = files.size;
-			return files.size >= this.count ? this.hide() : this.show();
-		},
-		/**
-		 * @returns {object} 当前上传中的对象
-		 */
-		onprogress(item,end=false) {
-			this.$emit('progress',item);
-			if (end) {
-				setTimeout(()=>{
-					this.$emit('uploadEnd',item);
-				},0);
-			}
-		},
-		/**
-		 * 移除组件内缓存的某条数据
-		 * @param {string}name 文件名称,不指定默认清除所有文件
-		 */
-		clear(name) {
-			this.lsjFile.clear(name);
-		},
-		// 创建选择器
-		create() {
-			// 若iOS端服务端处理不了跨域就将hybrid目录内的html放到服务端去，并将此处path改成服务器上的地址
-			let path = '/uni_modules/lsj-upload/hybrid/html/uploadFile.html';
-			let dom = this.lsjFile.create(path);
-			// #ifdef H5
-			this.$refs.lsj.$el.appendChild(dom);
-			// #endif
-			// #ifndef APP-PLUS
-			this.show();
-			// #endif
-			// #ifdef APP-PLUS
-			dom.setStyle({position: this.position});
-			dom.loadURL(path);
-			setTimeout(()=>{
-				// #ifdef APP-NVUE
-				plus.webview.currentWebview().append(dom);
-				// #endif
-				// #ifndef APP-NVUE
-				this.$root.$scope.$getAppWebview().append(dom);
-				// #endif
-				this.show();
-			},300)
-			// #endif
-		},
-		// 点击选择附件
-		onClick() {
-			if (this._size >= this.count) {
-				this.toast(`只允许上传${this.count}个文件`);
-				return;
-			}
-			
-			// #ifdef MP-WEIXIN
-			if (!this.isShow) {return;}
-			let count = this.count - this._size;
-			this.lsjFile.chooseMessageFile(this.wxFileType,count);
-			// #endif
-		},
-		toast(msg) {
-			uni.showToast({
-				title: msg,
-				icon: 'none'
-			});
-		}
-	}
-}
-</script>
-
-<style scoped>
-.lsj-file {
-	display: inline-block;
-}
-.defview {
-	background-color: #007aff;
-	color: #fff;
-	border-radius: 10rpx;
-	display: flex;
-	align-items: center;
-	justify-content: center;
-	font-size: 28rpx;
-}
-.hFile {
-	position: relative;
-	overflow: hidden;
-}
-</style>
@@ -1,179 +0,0 @@
-<!DOCTYPE html>
-<html lang="zh-cn">
-
-	<head>
-		<meta charset="UTF-8">
-		<title class="title">[文件管理器]</title>
-		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
-		<style type="text/css">
-			.content {background: transparent;}
-			.btn {position: relative;top: 0;left: 0;bottom: 0;right: 0;}
-			.btn .file {position: fixed;z-index: 93;left: 0;right: 0;top: 0;bottom: 0;width: 100%;opacity: 0;}
-		</style>
-	</head>
-
-	<body>
-		
-		<div id="content" class="content">
-			<div class="btn">
-				<input @change="onChange" :accept="accept" ref="file" class="file" type="file" />
-			</div>
-		</div>
-		
-		<script type="text/javascript" src="js/vue.min.js"></script>
-		<script type="text/javascript">
-			let _this;
-			var vm = new Vue({
-				el: '#content',
-				data: {
-					accept: '',
-				},
-				mounted() {
-					console.log('加载webview');
-					_this = this;
-					this.files = new Map();
-					document.addEventListener('plusready', (e)=>{
-					let {debug,instantly,prohibited} = plus.webview.currentWebview();
-					this.debug = debug;
-					this.instantly = instantly;
-					this.prohibited = prohibited;
-					this.accept = prohibited.accept;
-					location.href = 'callback?retype=updateOption';
-					}, false);
-				},
-				methods: {
-					toast(msg) {
-						plus.nativeUI.toast(msg);
-					},
-					clear(name) {
-						if (!name) {
-							this.files.clear();
-							return;
-						}
-						this.files.delete(name);
-					},
-					setData(option='{}') {
-						this.debug&&console.log('更新参数：'+option);
-						try{
-							_this.option = JSON.parse(option);
-						}catch(e){
-							console.error('参数设置错误')
-						}
-					},
-					async upload(name=''){
-						if (name && this.files.has(name)) {
-							await this.createUpload(this.files.get(name));
-						}
-						else {
-							for (let item of this.files.values()) {
-								if (item.type === 'waiting' || item.type === 'fail') {
-									await this.createUpload(item);
-								}
-							}
-						}
-					},
-					onChange(e) {
-						let fileDom = this.$refs.file;
-						let file = fileDom.files[0];
-						let name = file.name;
-						fileDom.value = '';
-						this.debug&&console.log('文件名称',name,'大小',file.size);
-						
-						if (file) {
-							// 限制文件格式
-							let suffix = name.substring(name.lastIndexOf(".")+1).toLowerCase();
-							let formats = this.prohibited.formats.toLowerCase();
-							if (formats&&!formats.includes(suffix)) {
-								this.toast(`不支持上传${suffix.toUpperCase()}格式文件`);
-								return;
-							}
-							// 限制文件大小
-							if (file.size > 1024 * 1024 * Math.abs(this.prohibited.size)) {
-								this.toast(`附件大小请勿超过${this.prohibited.size}M`)
-								return;
-							}
-							let path = URL.createObjectURL(file);
-							this.files.set(file.name,{file,path,name: file.name,size: file.size,progress: 0,type: 'waiting'});
-							this.callChange();
-							this.instantly&&this.upload();
-						}
-						
-					},
-					/**
-					 * @returns {Map} 已选择的文件Map集
-					 */
-					callChange() {
-						location.href = 'callback?retype=change&files=' + escape(JSON.stringify([...this.files]));
-					},
-					/**
-					 * @returns {object} 正在处理的当前对象
-					 */
-					changeFilesItem(item,end='') {
-						this.files.set(item.name,item);
-						location.href = 'callback?retype=progress&end='+ end +'&item=' + escape(JSON.stringify(item));
-					},
-					createUpload(item) {
-						this.debug&&console.log('准备上传,option=：'+JSON.stringify(this.option));
-						item.type = 'loading';
-						delete item.responseText;
-						return new Promise((resolve,reject)=>{
-							let {url,name,method='POST',header={},formData={}} = this.option;
-							let form = new FormData();
-							for (let keys in formData) {
-								form.append(keys, formData[keys])
-							}
-							form.append(name, item.file);
-							let xmlRequest = new XMLHttpRequest();
-							xmlRequest.open(method, url, true);
-							for (let keys in header) {
-								xmlRequest.setRequestHeader(keys, header[keys])
-							}
-							xmlRequest.upload.addEventListener(
-								'progress',
-								event => {
-									if (event.lengthComputable) {
-										let progress = Math.ceil((event.loaded * 100) / event.total)
-										if (progress <= 100) {
-											item.progress = progress;
-											this.changeFilesItem(item);
-										}
-									}
-								},
-								false
-							);
-							
-							xmlRequest.ontimeout = () => {
-								console.error('请求超时')
-								item.type = 'fail';
-								this.changeFilesItem(item,true);
-								return resolve(false);
-							}
-							
-							xmlRequest.onreadystatechange = ev => {
-								if (xmlRequest.readyState == 4) {
-									if (xmlRequest.status == 200) {
-										this.debug && console.log('上传完成：' + xmlRequest.responseText)
-										item['responseText'] = xmlRequest.responseText;
-										item.type = 'success';
-										this.changeFilesItem(item,true);
-										return resolve(true);
-									} else if (xmlRequest.status == 0) {
-										console.error('status = 0 :请检查请求头Content-Type与服务端是否匹配，服务端已正确开启跨域，并且nginx未拦截阻止请求')
-									}
-									console.error('--ERROR--：status = ' + xmlRequest.status) 
-									item.type = 'fail';
-									this.changeFilesItem(item,true);
-									return resolve(false);
-								}
-							}
-							xmlRequest.send(form)
-						});
-						
-					}
-				}
-			});
-			
-		</script>
-	</body>
-
-</html>
@@ -1,82 +0,0 @@
-{
-    "id": "lsj-upload",
-    "displayName": "全文件上传选择非原生2.0版",
-    "version": "2.1.9",
-    "description": "文件选择上传-支持APP-H5网页-微信小程序",
-    "keywords": [
-        "附件",
-        "file",
-        "upload",
-        "上传",
-        "文件管理器"
-    ],
-    "repository": "",
-    "engines": {
-        "HBuilderX": "^3.2.0"
-    },
-    "dcloudext": {
-        "category": [
-            "前端组件",
-            "通用组件"
-        ],
-        "sale": {
-            "regular": {
-                "price": "0.00"
-            },
-            "sourcecode": {
-                "price": "0.00"
-            }
-        },
-        "contact": {
-            "qq": ""
-        },
-        "declaration": {
-            "ads": "无",
-            "data": "无",
-            "permissions": "无"
-        },
-        "npmurl": ""
-    },
-    "uni_modules": {
-        "platforms": {
-            "cloud": {
-                "tcb": "y",
-                "aliyun": "y"
-            },
-            "client": {
-                "App": {
-                    "app-vue": "y",
-                    "app-nvue": "y"
-                },
-                "H5-mobile": {
-                    "Safari": "y",
-                    "Android Browser": "y",
-                    "微信浏览器(Android)": "y",
-                    "QQ浏览器(Android)": "y"
-                },
-                "H5-pc": {
-                    "Chrome": "y",
-                    "IE": "y",
-                    "Edge": "y",
-                    "Firefox": "y",
-                    "Safari": "y"
-                },
-                "小程序": {
-                    "微信": "y",
-                    "阿里": "u",
-                    "百度": "u",
-                    "字节跳动": "u",
-                    "QQ": "u"
-                },
-                "快应用": {
-                    "华为": "y",
-                    "联盟": "y"
-                },
-                "Vue": {
-                    "vue2": "y",
-                    "vue3": "y"
-                }
-            }
-        }
-    }
-}
@@ -1,330 +0,0 @@
-# lsj-upload
-
-### 插件地址：https://ext.dcloud.net.cn/plugin?id=5459
-
-### 不清楚使用方式可点击右侧导入示例项目运行完整示例
-### 此次更新2.0与1.0使用方式略有差异，已使用1.0的同学自行斟酌是否更新到2.0版本！！！
-
-使用插件有任何问题欢迎加入QQ讨论群：
- 群1：701468256（已满）
- 群2：469580165
-
-若能帮到你请高抬贵手点亮5颗星~
------
-## 重要提示
-### 组件是窗口级滚动，不要在scroll-view内使用！！
-### 组件是窗口级滚动，不要在scroll-view内使用！！
-### 组件是窗口级滚动，不要在scroll-view内使用！！
-
-### 控件的height高度应与slot自定义内容高度保持一致
-### nvue窗口只能使用固定模式position=absolute
-### show() 当DOM重排后在this.$nextTick内调用show()，控件定位会更加准确
-### hide() APP端webview层级比view高，如不希望触发点击时，应调用hide隐藏控件，反之调用show
-### 若iOS端跨域服务端同学实在配置不好，可把hybrid下html目录放到服务器去，同源则不存在跨域问题。
-### 小程序端因hybrid不能使用本地HTML，所以插件提供的是从微信消息列表拉取文件并选择，请知悉。
------
-
-## 使用说明
-| 属性		| 是否必填	|  值类型	| 默认值	| 说明			|
-| --------- | -------- 	| -----: 	| --: 	| :------------:|
-| width		|	否 		| String	|100%	| 容器宽度		|
-| height	|	是 		| String	|80rpx	| 容器高度		|
-| debug		|	否 		| Boolean	|false	| 打印调试日志	|
-| option	|	是 		| Object	|-		| [文件上传接口相关参数](#p1)|
-| instantly	|	否 		| Boolean	|false	| true=自动上传	|
-| count		|	否 		| Number	|10		| 附件选择上限(个)|
-| size		|	否 		| Number	|10		| 附件大小上限(M)|
-| wxFileType	|	否 		| String	|all		| 微信小程序文件选择器格式限制(all=从所有文件选择，video=只能选择视频文件，image=只能选择图片文件，file=可以选择除了图片和视频之外的其它的文件)|
-| accept	|	否 		| String	|-		| 文件选择器input file格式限制(部分机型不兼容，建议使用formats)|
-| formats	|	否 		| String	|-		| 限制允许上传的格式，空串=不限制，默认为空，多个格式以逗号隔开，例如png,jpg,pdf|
-| childId	|	否 		| String	|lsjUpload| 控件的id(仅APP有效，应用内每个控件命名一个唯一Id，不同窗口也不要同名Id)|
-| position	|	否 		| String	|static	| 控件的定位模式(static=控件随页面滚动;absolute=控件在页面中绝对定位，不随窗口内容滚动)|
-| top,left,right,bottom	|	否 		| [Number,String]	|0		| 设置控件绝对位置，position=absolute时有效|
-| @change	|	否 		| Function	|Map	| 选择文件触发，返回所有已选择文件Map集合|
-| @progress	|	否 		| Function	|Object	| 上传过程中发生状态变化的文件对象，需通过set更新至Map集合|
-| @uploadEnd|	否 		| Function	|Object	| 上传结束回调，返回参数与progress一致|
-
-## <a id="p1">option说明</a>
-|参数 | 是否必填 |  说明|
-|---- | ---- | :--: |
-|url  |	是	| 上传接口地址|
-|name| 否	|上传接口文件key，默认为file|
-|header| 否	|上传接口请求头|
-|formData| 否	|上传接口额外参数|
-
-## ref调用
-|作用 | 方法名| 传入参数|  说明|
-|---- | --------- | -------- | :--: |
-|显示控件| show|-| 控件显示状态下可触发点击|
-|隐藏控件| hide|-| 控件隐藏状态下不触发点击|
-|动态设置文件列表| setFiles|[Array,Map] files| 传入格式请与组件选择返回格式保持一致，且name为必须属性，可查看下方演示|
-|动态更新参数| setData|[String] name,[any] value| name支持a.b 和 a[b]，可查看下方演示|
-|移除选择的文件| clear|[String] name| 不传参数清空所有文件，传入文件name时删除该name的文件|
-|手动上传| upload|[String] name| 不传参数默认依次上传所有type=waiting的文件，传入文件name时不关心type是否为waiting，单独上传指定name的文件|
-
-## progress返回对象字段说明
-|字段 |  说明|
-|---- | :--: |
-|file | 文件对象|
-|name |文件名称|
-|size |文件大小|
-|type |文件上传状态：waiting（等待上传）、loading（上传中）、success（成功） 、fail（失败）|
-|responseText|上传成功后服务端返回数据(仅type为success时存在)|
-
-## 以下演示为vue窗口使用方式，nvue使用区别是必须传入控件绝对位置如top，bottom，left，right，且position只能为absolute，如不清楚可点击右侧导入示例项目有详细演示代码。
-
-### vue:
-``` javascript
-<lsj-upload 
-	ref="lsjUpload"
-	childId="upload1"
-	:width="width"
-	:height="height"
-	:option="option"
-	:size="size"
-	:formats="formats"
-	:debug="debug"
-	:instantly="instantly"
-	@progress="onprogress"
-	@change="onChange">
-		<view class="btn" :style="{width: width,height: height}">选择附件</view>
-</lsj-upload>
-
-
-<view class="padding">
-			
-	<view>已选择文件列表：</view>
-	
-	<!-- #ifndef MP-WEIXIN -->
-	<view v-for="(item,index) in files.values()" :key="index">
-		<image style="width: 100rpx;height: 100rpx;" :src="item.path" mode="widthFix"></image>
-		<text>{{item.path}}</text>
-		<text>{{item.name}}</text>
-		<text style="margin-left: 10rpx;">大小：{{item.size}}</text>
-		<text style="margin-left: 10rpx;">状态：{{item.type}}</text>
-		<text style="margin-left: 10rpx;">进度：{{item.progress}}</text>
-		<!-- <text style="margin-left: 10rpx;" v-if="item.responseText">服务端返回演示：{{item.responseText.code}}</text> -->
-		<text @click="clear(item.name)" style="margin-left: 10rpx;padding: 0 10rpx;border: 1rpx solid #007AFF;">删除</text>
-	</view>
-	<!-- #endif -->
-	
-	<!-- #ifdef MP-WEIXIN -->
-	<view v-for="(item,index) in wxFiles" :key="index">
-		<text>{{item.name}}</text>
-		<text style="margin-left: 10rpx;">大小：{{item.size}}</text>
-		<text style="margin-left: 10rpx;">状态：{{item.type}}</text>
-		<text style="margin-left: 10rpx;">进度：{{item.progress}}</text>
-		<view>
-			<button>删除</button>
-		</view>
-	</view>
-	<!-- #endif -->
-	
-</view>
-
-
-```
-
---
-* 函数说明
-
-
-``` javascript
-export default {
-	data() {
-		return {
-			// 上传接口参数
-			option: {
-				// 上传服务器地址，此地址需要替换为你的接口地址
-				url: 'http://hlapi.j56.com/dropbox/document/upload',
-				// 上传附件的key
-				name: 'file',
-				// 根据你接口需求自定义请求头
-				header: {
-					'Authorization': 'bearer eyJhbGciOiJSUzI1NiIsI',
-					'uid': '27682',
-					'client': 'app',
-					'accountid': 'DP',
-				},
-				// 根据你接口需求自定义body参数
-				formData: {
-					// 'orderId': 1000
-				}
-			},
-			// 选择文件后是否立即自动上传，true=选择后立即上传
-			instantly: false,
-			// 必传宽高且宽高应与slot宽高保持一致
-			width: '180rpx',
-			height: '180rpx',
-			// 限制允许选择的格式，空串=不限制，默认为空
-			formats: 'png,jpg,mp4',
-			// 文件上传大小限制
-			size: 10,
-			// 文件回显列表
-			files: new Map(),
-			// 微信小程序Map对象for循环不显示，所以转成普通数组，不要问为什么，我也不知道
-			wxFiles: [],
-			// 是否打印日志
-			debug: true,
-			
-			
-			// 演示用
-			tabIndex: 0,
-			list:[], 
-		}
-	},
-	onReady() {
-		setTimeout(()=>{
-			console.log('----演示动态更新参数-----');
-			this.$refs.lsjUpload.setData('formData.orderId','动态设置的参数');
-			
-			console.log('以下注释内容为-动态更新参数更多演示，放开后可查看演示效果');
-			// 修改option对象的name属性
-			// this.$refs.lsjUpload.setData('name','myFile');
-			
-			// 修改option对象的formData内的属性
-			// this.$refs.lsjUpload.setData('formData.appid','1111');
-			
-			// 替换option对象的formData
-			// this.$refs.lsjUpload.setData('formData',{appid:'222'});
-			
-			// option对象的formData新增属性
-			// this.$refs.lsjUpload.setData('formData.newkey','新插入到formData的属性');
-			
-			// ---------演示初始化值，用于已提交后再次编辑时需带入已上传文件-------
-			// 方式1=传入数组
-			let files1 = [{
-					name: '1.png'
-				},
-				{
-					name: '2.png',
-				}];
-			
-			// 方式2=传入Map对象
-			let files2 = new Map();
-			files2.set('1.png',{name: '1.png'})
-			
-			// 设置初始files列表
-			this.$refs.lsjUpload.setFiles(files1);
-			
-		},2000)
-	},
-	methods: {
-		// 某文件上传结束回调(成功失败都回调)
-		onuploadEnd(item) {
-			console.log(`${item.name}已上传结束，上传状态=${item.type}`);
-			
-			// 更新当前状态变化的文件
-			this.files.set(item.name,item);
-			
-			// 演示上传完成后取服务端数据
-			if (item['responseText']) {
-				console.log('演示服务器返回的字符串JSON转对象');
-				this.files.get(item.name).responseText = JSON.parse(item.responseText);
-			}
-			
-			// 微信小程序Map对象for循环不显示，所以转成普通数组，不要问为什么，我也不知道
-			// #ifdef MP-WEIXIN
-			this.wxFiles = [...this.files.values()];
-			// #endif
-			
-			// 强制更新视图
-			this.$forceUpdate();
-			
-			
-			// ---可删除--演示判断是否所有文件均已上传成功
-			let isAll = [...this.files.values()].find(item=>item.type!=='success');
-			if (!isAll) {
-				console.log('已全部上传完毕');
-			}
-			else {
-				console.log(isAll.name+'待上传');
-			}
-			
-		},
-		// 上传进度回调
-		onprogress(item) {
-			// 更新当前状态变化的文件
-			this.files.set(item.name,item);
-			
-			console.log('打印对象',JSON.stringify(this.files.get(item.name)));
-			// 微信小程序Map对象for循环不显示，所以转成普通数组，不要问为什么，我也不知道
-			// #ifdef MP-WEIXIN
-			this.wxFiles = [...this.files.values()];
-			// #endif
-			
-			// 强制更新视图
-			this.$forceUpdate();
-			
-		},
-		// 文件选择回调
-		onChange(files) {
-			// 更新选择的文件
-			this.files = files;
-			// 强制更新视图
-			this.$forceUpdate();
-			
-			// 微信小程序Map对象for循环不显示，所以转成普通数组，不要问为什么，我也不知道
-			// #ifdef MP-WEIXIN
-			this.wxFiles = [...this.files.values()];
-			// #endif
-		},
-		// 手动上传
-		upload() {
-			// name=指定文件名，不指定则上传所有type等于waiting和fail的文件
-			this.$refs.lsjUpload.upload();
-		},
-		// 移除某个文件
-		clear(name) {
-			// name=指定文件名，不传name默认移除所有文件
-			this.$refs.lsjUpload.clear(name);
-		},
-		
-		
-		/**
-		 * 以下为演示
-		 */
-		// DOM重排演示，重排后组件内部updated默认会触发show方法,若特殊情况未能触发updated也可以手动调用一次show()
-		// 什么是DOM重排？自行百度去~
-		add() {
-			this.list.push('DOM重排测试');
-		},
-		// 切换视图演示，APP端因为是webview，层级比view高，
-		// 此时若不希望点击触发选择文件，需要手动调用hide()
-		// 手动调用hide后，需要调用show()才能恢复触发面
-		onTab(tabIndex) {
-			this.tabIndex = tabIndex;
-			
-			if (tabIndex == 0 ) {
-				this.$nextTick(()=>{
-					this.$refs.lsjUpload.show();
-				})
-			}
-			else {
-				this.$refs.lsjUpload.hide();
-			}
-		},
-		// 打开nvue窗口
-		open() {
-			uni.navigateTo({
-				url: '/pages/nvue-demo/nvue-demo'
-			});
-		}
-	}
-}
-
-```
-
-## 温馨提示
-	
-* 文件上传
-0. 如说明表达还不够清楚，不清楚怎么使用可导入完整示例项目运行体验和查看	
-1. APP端请优先联调Android,上传成功后再运行iOS端，如iOS返回status=0则需要后端开启允许跨域；
-2. header的Content-Type类型需要与服务端要求一致，否则收不到附件（服务端若没有明文规定则可不写，使用默认匹配）
-3. 服务端不清楚怎么配置跨域可加群咨询，具体百度~
-4. 欢迎加入QQ讨论群：701468256(已满)
-5. 欢迎加入QQ讨论群：469580165
-6. 欢迎加入QQ讨论群：469580165
-7. 若能帮到你还请点亮5颗小星星以作鼓励哈~
-8. 若能帮到你还请点亮5颗小星星以作鼓励哈~
-9. 若能帮到你还请点亮5颗小星星以作鼓励哈~
@@ -0,0 +1,320 @@
+## 2.5.0-20230101（2023-01-01）
+- 秋云图表组件 修改条件编译顺序，确保uniapp的cli方式的项目依赖不完整时可以正常显示
+- 秋云图表组件 恢复props属性directory的使用，以修复vue3项目中，开启echarts后，echarts目录识别错误的bug
+- uCharts.js 修复区域图、混合图只有一个数据时图表显示不正确的bug
+- uCharts.js 修复折线图、区域图中时间轴类别图表tooltip指示点显示不正确的bug
+- uCharts.js 修复x轴使用labelCount时，并且boundaryGap = 'justify' 并且关闭Y轴显示的时候，最后一个坐标值不显示的bug
+- uCharts.js 修复折线图只有一组数据时 ios16 渲染颜色不正确的bug
+- uCharts.js 修复玫瑰图半径显示不正确的bug
+- uCharts.js 柱状图、山峰图增加正负图功能，y轴网格如果需要显示0轴则由 min max 及 splitNumber 确定，后续版本优化自动显示0轴
+- uCharts.js 柱状图column增加 opts.extra.column.labelPosition，数据标签位置，有效值为 outside外部, insideTop内顶部, center内中间, bottom内底部
+- uCharts.js 雷达图radar增加 opts.extra.radar.labelShow，否显示各项标识文案是，默认true
+- uCharts.js 提示窗tooltip增加 opts.extra.tooltip.boxPadding，提示窗边框填充距离，默认3px
+- uCharts.js 提示窗tooltip增加 opts.extra.tooltip.fontSize，提示窗字体大小配置，默认13px
+- uCharts.js 提示窗tooltip增加 opts.extra.tooltip.lineHeight，提示窗文字行高，默认20px
+- uCharts.js 提示窗tooltip增加 opts.extra.tooltip.legendShow，是否显示左侧图例，默认true
+- uCharts.js 提示窗tooltip增加 opts.extra.tooltip.legendShape，图例形状，图例标识样式，有效值为 auto自动跟随图例, diamond◆, circle●, triangle▲, square■, rect▬, line-
+- uCharts.js 标记线markLine增加 opts.extra.markLine.labelFontSize，字体大小配置，默认13px
+- uCharts.js 标记线markLine增加 opts.extra.markLine.labelPadding，标签边框内填充距离，默认6px
+- uCharts.js 折线图line增加 opts.extra.line.linearType，渐变色类型，可选值 none关闭渐变色，custom 自定义渐变色。使用自定义渐变色时请赋值serie.linearColor作为颜色值
+- uCharts.js 折线图line增加 serie.linearColor，渐变色数组，格式为2维数组[起始位置，颜色值]，例如[[0,'#0EE2F8'],[0.3,'#2BDCA8'],[0.6,'#1890FF'],[1,'#9A60B4']]
+- uCharts.js 折线图line增加 opts.extra.line.onShadow，是否开启折线阴影，开启后请赋值serie.setShadow阴影设置
+- uCharts.js 折线图line增加 serie.setShadow，阴影配置，格式为4位数组：[offsetX,offsetY,blur,color]
+- uCharts.js 折线图line增加 opts.extra.line.animation，动画效果方向，可选值为vertical 垂直动画效果，horizontal 水平动画效果
+- uCharts.js X轴xAxis增加 opts.xAxis.lineHeight，X轴字体行高，默认20px
+- uCharts.js X轴xAxis增加 opts.xAxis.marginTop，X轴文字距离轴线的距离，默认0px
+- uCharts.js X轴xAxis增加 opts.xAxis.title，当前X轴标题
+- uCharts.js X轴xAxis增加 opts.xAxis.titleFontSize，标题字体大小，默认13px
+- uCharts.js X轴xAxis增加 opts.xAxis.titleOffsetY，标题纵向偏移距离，负数为向上偏移，正数向下偏移
+- uCharts.js X轴xAxis增加 opts.xAxis.titleOffsetX，标题横向偏移距离，负数为向左偏移，正数向右偏移
+- uCharts.js X轴xAxis增加 opts.xAxis.titleFontColor，标题字体颜色，默认#666666
+
+## 报错TypeError: Cannot read properties of undefined (reading 'length')
+- 如果是uni-modules版本组件，请先登录HBuilderX账号；
+- 在HBuilderX中的manifest.json，点击重新获取uniapp的appid，或者删除appid重新粘贴，重新运行；
+- 如果是cli项目请使用码云上的非uniCloud版本组件；
+- 或者添加uniCloud的依赖；
+- 或者使用原生uCharts；
+## 2.4.5-20221130（2022-11-30）
+- uCharts.js 优化tooltip当文字很多变为左侧显示时，如果画布仍显显示不下，提示框错位置变为以左侧0位置起画
+- uCharts.js 折线图修复特殊情况下只有单点数据，并改变线宽后点变为圆形的bug
+- uCharts.js 修复Y轴disabled启用后无效并报错的bug
+- uCharts.js 修复仪表盘起始结束角度特殊情况下显示不正确的bug
+- uCharts.js 雷达图新增参数 opts.extra.radar.radius , 自定义雷达图半径
+- uCharts.js 折线图、区域图增加tooltip指示点，opts.extra.line.activeType/opts.extra.area.activeType，可选值"none"不启用激活指示点,"hollow"空心点模式,"solid"实心点模式
+## 2.4.4-20221102（2022-11-02）
+- 秋云图表组件 修复使用echarts时reload、reshow无法调用重新渲染的bug，[详见码云PR](https://gitee.com/uCharts/uCharts/pulls/40)
+- 秋云图表组件 修复使用echarts时，初始化时宽高不正确的bug，[详见码云PR](https://gitee.com/uCharts/uCharts/pulls/42)
+- 秋云图表组件 修复uniapp的h5使用history模式时，无法加载echarts的bug
+- 秋云图表组件 小程序端@complete、@scrollLeft、@scrollRight、@getTouchStart、@getTouchMove、@getTouchEnd事件增加opts参数传出，方便一些特殊需求的交互获取数据。
+
+- uCharts.js 修复calTooltipYAxisData方法内formatter格式化方法未与y轴方法同步的问题，[详见码云PR](https://gitee.com/uCharts/uCharts/pulls/43)
+- uCharts.js 地图新增参数opts.series[i].fillOpacity，以透明度方式来设置颜色过度效果，[详见码云PR](https://gitee.com/uCharts/uCharts/pulls/38)
+- uCharts.js 地图新增参数opts.extra.map.active，是否启用点击激活变色
+- uCharts.js 地图新增参数opts.extra.map.activeTextColor，是否启用点击激活变色
+- uCharts.js 地图新增渲染完成事件renderComplete
+- uCharts.js 漏斗图修复当部分数据相同时tooltip提示窗点击错误的bug
+- uCharts.js 漏斗图新增参数series.data[i].centerText 居中标签文案
+- uCharts.js 漏斗图新增参数series.data[i].centerTextSize 居中标签文案字体大小，默认opts.fontSize
+- uCharts.js 漏斗图新增参数series.data[i].centerTextColor 居中标签文案字体颜色，默认#FFFFFF
+- uCharts.js 漏斗图新增参数opts.extra.funnel.minSize 最小值的最小宽度，默认0
+- uCharts.js 进度条新增参数opts.extra.arcbar.direction，动画方向，可选值为cw顺时针、ccw逆时针
+- uCharts.js 混合图新增参数opts.extra.mix.line.width，折线的宽度，默认2
+- uCharts.js 修复tooltip开启horizentalLine水平横线标注时，图表显示错位的bug
+- uCharts.js 优化tooltip当文字很多变为左侧显示时，如果画布仍显显示不下，提示框错位置变为以左侧0位置起画
+- uCharts.js 修复开启滚动条后X轴文字超出绘图区域后的隐藏逻辑
+- uCharts.js 柱状图、条状图修复堆叠模式不能通过{value,color}赋值单个柱子颜色的问题
+- uCharts.js 气泡图修复不识别series.textSize和series.textColor的bug
+
+## 报错TypeError: Cannot read properties of undefined (reading 'length')
+1. 如果是uni-modules版本组件，请先登录HBuilderX账号；
+2. 在HBuilderX中的manifest.json，点击重新获取uniapp的appid，或者删除appid重新粘贴，重新运行；
+3. 如果是cli项目请使用码云上的非uniCloud版本组件；
+4. 或者添加uniCloud的依赖；
+5. 或者使用原生uCharts；
+## 2.4.3-20220505（2022-05-05）
+- 秋云图表组件 修复开启canvas2d后将series赋值为空数组显示加载图标时，再次赋值后画布闪动的bug
+- 秋云图表组件 修复升级hbx最新版后ECharts的highlight方法报错的bug
+- uCharts.js 雷达图新增参数opts.extra.radar.gridEval，数据点位网格抽希，默认1
+- uCharts.js 雷达图新增参数opts.extra.radar.axisLabel，	是否显示刻度点值，默认false
+- uCharts.js 雷达图新增参数opts.extra.radar.axisLabelTofix，刻度点值小数位数，默认0
+- uCharts.js 雷达图新增参数opts.extra.radar.labelPointShow，是否显示末端刻度圆点，默认false
+- uCharts.js 雷达图新增参数opts.extra.radar.labelPointRadius，刻度圆点的半径，默认3
+- uCharts.js 雷达图新增参数opts.extra.radar.labelPointColor，刻度圆点的颜色，默认#cccccc
+- uCharts.js 雷达图新增参数opts.extra.radar.linearType，渐变色类型，可选值"none"关闭渐变,"custom"开启渐变
+- uCharts.js 雷达图新增参数opts.extra.radar.customColor，自定义渐变颜色，数组类型对应series的数组长度以匹配不同series颜色的不同配色方案，例如["#FA7D8D", "#EB88E2"]
+- uCharts.js 雷达图优化支持series.textColor、series.textSize属性
+- uCharts.js 柱状图中温度计式图标，优化支持全圆角类型，修复边框有缝隙的bug，详见官网【演示】中的温度计图表
+- uCharts.js 柱状图新增参数opts.extra.column.activeWidth，当前点击柱状图的背景宽度，默认一个单元格单位
+- uCharts.js 混合图增加opts.extra.mix.area.gradient 区域图是否开启渐变色
+- uCharts.js 混合图增加opts.extra.mix.area.opacity 区域图透明度，默认0.2
+- uCharts.js 饼图、圆环图、玫瑰图、漏斗图，增加opts.series[0].data[i].labelText，自定义标签文字，避免formatter格式化的繁琐，详见官网【演示】中的饼图
+- uCharts.js 饼图、圆环图、玫瑰图、漏斗图，增加opts.series[0].data[i].labelShow，自定义是否显示某一个指示标签，避免因饼图类别太多导致标签重复或者居多导致图形变形的问题，详见官网【演示】中的饼图
+- uCharts.js 增加opts.series[i].legendText/opts.series[0].data[i].legendText（与series.name同级）自定义图例显示文字的方法
+- uCharts.js 优化X轴、Y轴formatter格式化方法增加形参，统一为fromatter:function(value,index,opts){}
+- uCharts.js 修复横屏模式下无法使用双指缩放方法的bug
+- uCharts.js 修复当只有一条数据或者多条数据值相等的时候Y轴自动计算的最大值错误的bug
+- 【官网模板】增加外部自定义图例与图表交互的例子，[点击跳转](https://www.ucharts.cn/v2/#/layout/info?id=2)
+
+## 注意：非unimodules 版本如因更新 hbx 至 3.4.7 导致报错如下，请到码云更新非 unimodules 版本组件，[点击跳转](https://gitee.com/uCharts/uCharts/tree/master/uni-app/uCharts-%E7%BB%84%E4%BB%B6)
+> Error in callback for immediate watcher "uchartsOpts": "SyntaxError: Unexpected token u in JSON at position 0"
+## 2.4.2-20220421（2022-04-21）
+- 秋云图表组件 修复HBX升级3.4.6.20220420版本后echarts报错的问题
+## 2.4.2-20220420（2022-04-20）
+## 重要！此版本uCharts新增了很多功能，修复了诸多已知问题
+- 秋云图表组件 新增onzoom开启双指缩放功能（仅uCharts），前提需要直角坐标系类图表类型，并且ontouch为true、opts.enableScroll为true，详见实例项目K线图
+- 秋云图表组件 新增optsWatch是否监听opts变化，关闭optsWatch后，动态修改opts不会触发图表重绘
+- 秋云图表组件 修复开启canvas2d功能后，动态更新数据后画布闪动的bug
+- 秋云图表组件 去除directory属性，改为自动获取echarts.min.js路径（升级不受影响）
+- 秋云图表组件 增加getImage()方法及@getImage事件，通过ref调用getImage()方法获，触发@getImage事件获取当前画布的base64图片文件流。
+- 秋云图表组件 支付宝、字节跳动、飞书、快手小程序支持开启canvas2d同层渲染设置。
+- 秋云图表组件 新增加【非uniCloud】版本组件，避免有些不需要uniCloud的使用组件发布至小程序需要提交隐私声明问题，请到码云[【非uniCloud版本】](https://gitee.com/uCharts/uCharts/tree/master/uni-app/uCharts-%E7%BB%84%E4%BB%B6)，或npm[【非uniCloud版本】](https://www.npmjs.com/package/@qiun/uni-ucharts)下载使用。
+- uCharts.js 新增dobuleZoom双指缩放功能
+- uCharts.js 新增山峰图type="mount"，数据格式为饼图类格式，不需要传入categories，具体详见新版官网在线演示
+- uCharts.js 修复折线图当数据中存在null时tooltip报错的bug
+- uCharts.js 修复饼图类当画布比较小时自动计算的半径是负数报错的bug
+- uCharts.js 统一各图表类型的series.formatter格式化方法的形参为(val, index, series, opts)，方便格式化时有更多参数可用
+- uCharts.js 标记线功能增加labelText自定义显示文字，增加labelAlign标签显示位置（左侧或右侧），增加标签显示位置微调labelOffsetX、labelOffsetY
+- uCharts.js 修复条状图当数值很小时开启圆角后样式错误的bug
+- uCharts.js 修复X轴开启disabled后，X轴仍占用空间的bug
+- uCharts.js 修复X轴开启滚动条并且开启rotateLabel后，X轴文字与滚动条重叠的bug
+- uCharts.js 增加X轴rotateAngle文字旋转自定义角度，取值范围(-90至90)
+- uCharts.js 修复地图文字标签层级显示不正确的bug
+- uCharts.js 修复饼图、圆环图、玫瑰图当数据全部为0的时候不显示数据标签的bug
+- uCharts.js 修复当opts.padding上边距为0时，Y轴顶部刻度标签位置不正确的bug
+
+## 另外我们还开发了各大原生小程序组件，已发布至码云和npm
+[https://gitee.com/uCharts/uCharts](https://gitee.com/uCharts/uCharts)
+[https://www.npmjs.com/~qiun](https://www.npmjs.com/~qiun)
+
+## 对于原生uCharts文档我们已上线新版官方网站，详情点击下面链接进入官网
+[https://www.uCharts.cn/v2/](https://www.ucharts.cn/v2/)
+## 2.3.7-20220122（2022-01-22）
+## 重要！使用vue3编译，请使用cli模式并升级至最新依赖，HbuilderX编译需要使用3.3.8以上版本
+- uCharts.js 修复uni-app平台组件模式使用vue3编译到小程序报错的bug。
+## 2.3.7-20220118（2022-01-18）
+## 注意，使用vue3的前提是需要3.3.8.20220114-alpha版本的HBuilder！
+## 2.3.67-20220118（2022-01-18）
+- 秋云图表组件 组件初步支持vue3，全端编译会有些问题，具体详见下面修改：
+1. 小程序端运行时，在uni_modules文件夹的qiun-data-charts.js中搜索 new uni_modules_qiunDataCharts_js_sdk_uCharts_uCharts.uCharts，将.uCharts去掉。
+2. 小程序端发行时，在uni_modules文件夹的qiun-data-charts.js中搜索 new e.uCharts，将.uCharts去掉，变为 new e。
+3. 如果觉得上述步骤比较麻烦，如果您的项目只编译到小程序端，可以修改u-charts.js最后一行导出方式，将 export default uCharts;变更为 export default { uCharts: uCharts }; 这样变更后，H5和App端的renderjs会有问题，请开发者自行选择。（此问题非组件问题，请等待DC官方修复Vue3的小程序端）
+## 2.3.6-20220111（2022-01-11）
+- 秋云图表组件 修改组件 props 属性中的 background 默认值为 rgba(0,0,0,0)
+## 2.3.6-20211201（2021-12-01）
+- uCharts.js 修复bar条状图开启圆角模式时，值很小时圆角渲染错误的bug
+## 2.3.5-20211014（2021-10-15）
+- uCharts.js 增加vue3的编译支持（仅原生uCharts，qiun-data-charts组件后续会支持，请关注更新）
+## 2.3.4-20211012（2021-10-12）
+- 秋云图表组件 修复 mac os x 系统 mouseover 事件丢失的 bug
+## 2.3.3-20210706（2021-07-06）
+- uCharts.js 增加雷达图开启数据点值（opts.dataLabel）的显示
+## 2.3.2-20210627（2021-06-27）
+- 秋云图表组件 修复tooltipCustom个别情况下传值不正确报错TypeError: Cannot read property 'name' of undefined的bug
+## 2.3.1-20210616（2021-06-16）
+- uCharts.js 修复圆角柱状图使用4角圆角时，当数值过大时不正确的bug
+## 2.3.0-20210612（2021-06-12）
+- uCharts.js 【重要】uCharts增加nvue兼容，可在nvue项目中使用gcanvas组件渲染uCharts，[详见码云uCharts-demo-nvue](https://gitee.com/uCharts/uCharts)
+- 秋云图表组件 增加tapLegend属性，是否开启图例点击交互事件
+- 秋云图表组件 getIndex事件中增加返回uCharts实例中的opts参数，以便在页面中调用参数
+- 示例项目 pages/other/other.vue增加app端自定义tooltip的方法，详见showOptsTooltip方法
+## 2.2.1-20210603（2021-06-03）
+- uCharts.js 修复饼图、圆环图、玫瑰图，当起始角度不为0时，tooltip位置不准确的bug
+- uCharts.js 增加温度计式柱状图开启顶部半圆形的配置
+## 2.2.0-20210529（2021-05-29）
+- uCharts.js 增加条状图type="bar"
+- 示例项目 pages/ucharts/ucharts.vue增加条状图的demo
+## 2.1.7-20210524（2021-05-24）
+- uCharts.js 修复大数据量模式下曲线图不平滑的bug
+## 2.1.6-20210523（2021-05-23）
+- 秋云图表组件 修复小程序端开启滚动条更新数据后滚动条位置不符合预期的bug
+## 2.1.5-2021051702（2021-05-17）
+- uCharts.js 修复自定义Y轴min和max值为0时不能正确显示的bug
+## 2.1.5-20210517（2021-05-17）
+- uCharts.js 修复Y轴自定义min和max时，未按指定的最大值最小值显示坐标轴刻度的bug
+## 2.1.4-20210516（2021-05-16）
+- 秋云图表组件 优化onWindowResize防抖方法
+- 秋云图表组件 修复APP端uCharts更新数据时，清空series显示loading图标后再显示图表，图表抖动的bug
+- uCharts.js 修复开启canvas2d后，x轴、y轴、series自定义字体大小未按比例缩放的bug
+- 示例项目 修复format-e.vue拼写错误导致app端使用uCharts渲染图表
+## 2.1.3-20210513（2021-05-13）
+- 秋云图表组件 修改uCharts变更chartData数据为updateData方法，支持带滚动条的数据动态打点
+- 秋云图表组件 增加onWindowResize防抖方法 fix by ど誓言，如尘般染指流年づ 
+- 秋云图表组件 H5或者APP变更chartData数据显示loading图表时，原数据闪现的bug
+- 秋云图表组件 props增加errorReload禁用错误点击重新加载的方法
+- uCharts.js 增加tooltip显示category（x轴对应点位）标题的功能，opts.extra.tooltip.showCategory，默认为false
+- uCharts.js 修复mix混合图只有柱状图时，tooltip的分割线显示位置不正确的bug
+- uCharts.js 修复开启滚动条，图表在拖动中动态打点，滚动条位置不正确的bug
+- uCharts.js 修复饼图类数据格式为echarts数据格式，series为空数组报错的bug
+- 示例项目 修改uCharts.js更新到v2.1.2版本后，@getIndex方法获取索引值变更为e.currentIndex.index
+- 示例项目 pages/updata/updata.vue增加滚动条拖动更新（数据动态打点）的demo
+- 示例项目 pages/other/other.vue增加errorReload禁用错误点击重新加载的demo
+## 2.1.2-20210509（2021-05-09）
+秋云图表组件 修复APP端初始化时就传入chartData或lacaldata不显示图表的bug
+## 2.1.1-20210509（2021-05-09）
+- 秋云图表组件 变更ECharts的eopts配置在renderjs内执行，支持在config-echarts.js配置文件内写function配置。
+- 秋云图表组件 修复APP端报错Prop being mutated: "onmouse"错误的bug。
+- 秋云图表组件 修复APP端报错Error: Not Found：Page[6][-1,27] at view.umd.min.js:1的bug。
+## 2.1.0-20210507（2021-05-07）
+- 秋云图表组件 修复初始化时就有数据或者数据更新的时候loading加载动画闪动的bug
+- uCharts.js 修复x轴format方法categories为字符串类型时返回NaN的bug
+- uCharts.js 修复series.textColor、legend.fontColor未执行全局默认颜色的bug
+## 2.1.0-20210506（2021-05-06）
+- 秋云图表组件 修复极个别情况下报错item.properties undefined的bug
+- 秋云图表组件 修复极个别情况下关闭加载动画reshow不起作用，无法显示图表的bug
+- 示例项目 pages/ucharts/ucharts.vue 增加时间轴折线图（type="tline"）、时间轴区域图（type="tarea"）、散点图（type="scatter"）、气泡图demo（type="bubble"）、倒三角形漏斗图（opts.extra.funnel.type="triangle"）、金字塔形漏斗图（opts.extra.funnel.type="pyramid"）
+- 示例项目 pages/format-u/format-u.vue 增加X轴format格式化示例
+- uCharts.js 升级至v2.1.0版本
+- uCharts.js 修复 玫瑰图面积模式点击tooltip位置不正确的bug
+- uCharts.js 修复 玫瑰图点击图例，只剩一个类别显示空白的bug
+- uCharts.js 修复 饼图类图点击图例，其他图表tooltip位置某些情况下不准的bug
+- uCharts.js 修复 x轴为矢量轴（时间轴）情况下，点击tooltip位置不正确的bug
+- uCharts.js 修复 词云图获取点击索引偶尔不准的bug
+- uCharts.js 增加 直角坐标系图表X轴format格式化方法（原生uCharts.js用法请使用formatter）
+- uCharts.js 增加 漏斗图扩展配置，倒三角形（opts.extra.funnel.type="triangle"），金字塔形（opts.extra.funnel.type="pyramid"）
+- uCharts.js 增加 散点图（opts.type="scatter"）、气泡图（opts.type="bubble"）
+- 后期计划 完善散点图、气泡图，增加markPoints标记点，增加横向条状图。
+## 2.0.0-20210502（2021-05-02）
+- uCharts.js 修复词云图获取点击索引不正确的bug
+## 2.0.0-20210501（2021-05-01）
+- 秋云图表组件 修复QQ小程序、百度小程序在关闭动画效果情况下，v-for循环使用图表，显示不正确的bug
+## 2.0.0-20210426（2021-04-26）
+- 秋云图表组件 修复QQ小程序不支持canvas2d的bug
+- 秋云图表组件 修复钉钉小程序某些情况点击坐标计算错误的bug
+- uCharts.js 增加 extra.column.categoryGap 参数，柱状图类每个category点位（X轴点）柱子组之间的间距
+- uCharts.js 增加 yAxis.data[i].titleOffsetY 参数，标题纵向偏移距离，负数为向上偏移，正数向下偏移
+- uCharts.js 增加 yAxis.data[i].titleOffsetX 参数，标题横向偏移距离，负数为向左偏移，正数向右偏移
+- uCharts.js 增加 extra.gauge.labelOffset 参数，仪表盘标签文字径向便宜距离，默认13px
+## 2.0.0-20210422-2（2021-04-22）
+秋云图表组件 修复 formatterAssign 未判断 args[key] == null 的情况导致栈溢出的 bug
+## 2.0.0-20210422（2021-04-22）
+- 秋云图表组件 修复H5、APP、支付宝小程序、微信小程序canvas2d模式下横屏模式的bug
+## 2.0.0-20210421（2021-04-21）
+- uCharts.js 修复多行图例的情况下，图例在上方或者下方时，图例float为左侧或者右侧时，第二行及以后的图例对齐方式不正确的bug
+## 2.0.0-20210420（2021-04-20）
+- 秋云图表组件 修复微信小程序开启canvas2d模式后，windows版微信小程序不支持canvas2d模式的bug
+- 秋云图表组件 修改非uni_modules版本为v2.0版本qiun-data-charts组件
+## 2.0.0-20210419（2021-04-19）
+## v1.0版本已停更，建议转uni_modules版本组件方式调用，点击右侧绿色【使用HBuilderX导入插件】即可使用，示例项目请点击右侧蓝色按钮【使用HBuilderX导入示例项目】。
+## 初次使用如果提示未注册&lt;qiun-data-charts&gt;组件，请重启HBuilderX，如仍不好用，请重启电脑；
+## 如果是cli项目，请尝试清理node_modules，重新install，还不行就删除项目，再重新install。
+## 此问题已于DCloud官方确认，HBuilderX下个版本会修复。
+## 其他图表不显示问题详见[常见问题选项卡](https://demo.ucharts.cn)
+## <font color=#FF0000> 新手请先完整阅读帮助文档及常见问题3遍，右侧蓝色按钮示例项目请看2遍！ </font> 
+## [DEMO演示及在线生成工具（v2.0文档）https://demo.ucharts.cn](https://demo.ucharts.cn)
+## [图表组件在项目中的应用参见 UReport数据报表](https://ext.dcloud.net.cn/plugin?id=4651) 
+- uCharts.js 修复混合图中柱状图单独设置颜色不生效的bug
+- uCharts.js 修复多Y轴单独设置fontSize时，开启canvas2d后，未对应放大字体的bug
+## 2.0.0-20210418（2021-04-18）
+- 秋云图表组件 增加directory配置，修复H5端history模式下如果发布到二级目录无法正确加载echarts.min.js的bug
+## 2.0.0-20210416（2021-04-16）
+## v1.0版本已停更，建议转uni_modules版本组件方式调用，点击右侧绿色【使用HBuilderX导入插件】即可使用，示例项目请点击右侧蓝色按钮【使用HBuilderX导入示例项目】。
+## 初次使用如果提示未注册&lt;qiun-data-charts&gt;组件，请重启HBuilderX，如仍不好用，请重启电脑；
+## 如果是cli项目，请尝试清理node_modules，重新install，还不行就删除项目，再重新install。
+## 此问题已于DCloud官方确认，HBuilderX下个版本会修复。
+## 其他图表不显示问题详见[常见问题选项卡](https://demo.ucharts.cn)
+## <font color=#FF0000> 新手请先完整阅读帮助文档及常见问题3遍，右侧蓝色按钮示例项目请看2遍！ </font> 
+## [DEMO演示及在线生成工具（v2.0文档）https://demo.ucharts.cn](https://demo.ucharts.cn)
+## [图表组件在项目中的应用参见 UReport数据报表](https://ext.dcloud.net.cn/plugin?id=4651) 
+- 秋云图表组件 修复APP端某些情况下报错`Not Found Page`的bug，fix by 高级bug开发技术员
+- 示例项目 修复APP端v-for循环某些情况下报错`Not Found Page`的bug，fix by 高级bug开发技术员
+- uCharts.js 修复非直角坐标系tooltip提示窗右侧超出未变换方向显示的bug
+## 2.0.0-20210415（2021-04-15）
+- 秋云图表组件 修复H5端发布到二级目录下echarts无法加载的bug
+- 秋云图表组件 修复某些情况下echarts.off('finished')移除监听事件报错的bug
+## 2.0.0-20210414（2021-04-14）
+## v1.0版本已停更，建议转uni_modules版本组件方式调用，点击右侧绿色【使用HBuilderX导入插件】即可使用，示例项目请点击右侧蓝色按钮【使用HBuilderX导入示例项目】。
+## 初次使用如果提示未注册&lt;qiun-data-charts&gt;组件，请重启HBuilderX，如仍不好用，请重启电脑；
+## 如果是cli项目，请尝试清理node_modules，重新install，还不行就删除项目，再重新install。
+## 此问题已于DCloud官方确认，HBuilderX下个版本会修复。
+## 其他图表不显示问题详见[常见问题选项卡](https://demo.ucharts.cn)
+## <font color=#FF0000> 新手请先完整阅读帮助文档及常见问题3遍，右侧蓝色按钮示例项目请看2遍！ </font> 
+## [DEMO演示及在线生成工具（v2.0文档）https://demo.ucharts.cn](https://demo.ucharts.cn)
+## [图表组件在项目中的应用参见 UReport数据报表](https://ext.dcloud.net.cn/plugin?id=4651) 
+- 秋云图表组件 修复H5端在cli项目下ECharts引用地址错误的bug
+- 示例项目 增加ECharts的formatter用法的示例(详见示例项目format-e.vue)
+- uCharts.js 增加圆环图中心背景色的配置extra.ring.centerColor
+- uCharts.js 修复微信小程序安卓端柱状图开启透明色后显示不正确的bug
+## 2.0.0-20210413（2021-04-13）
+- 秋云图表组件 修复百度小程序多个图表真机未能正确获取根元素dom尺寸的bug
+- 秋云图表组件 修复百度小程序横屏模式方向不正确的bug
+- 秋云图表组件 修改ontouch时，@getTouchStart@getTouchMove@getTouchEnd的触发条件
+- uCharts.js 修复饼图类数据格式series属性不生效的bug
+- uCharts.js 增加时序区域图 详见示例项目中ucharts.vue
+## 2.0.0-20210412-2（2021-04-12）
+## v1.0版本已停更，建议转uni_modules版本组件方式调用，点击右侧绿色【使用HBuilderX导入插件】即可使用，示例项目请点击右侧蓝色按钮【使用HBuilderX导入示例项目】。
+## 初次使用如果提示未注册&lt;qiun-data-charts&gt;组件，请重启HBuilderX。如仍不好用，请重启电脑，此问题已于DCloud官方确认，HBuilderX下个版本会修复。
+## [DEMO演示及在线生成工具（v2.0文档）https://demo.ucharts.cn](https://demo.ucharts.cn)
+## [图表组件在uniCloudAdmin中的应用 UReport数据报表](https://ext.dcloud.net.cn/plugin?id=4651) 
+- 秋云图表组件 修复uCharts在APP端横屏模式下不能正确渲染的bug
+- 示例项目 增加ECharts柱状图渐变色、圆角柱状图、横向柱状图（条状图）的示例
+## 2.0.0-20210412（2021-04-12）
+- 秋云图表组件 修复created中判断echarts导致APP端无法识别，改回mounted中判断echarts初始化
+- uCharts.js 修复2d模式下series.textOffset未乘像素比的bug
+## 2.0.0-20210411（2021-04-11）
+## v1.0版本已停更，建议转uni_modules版本组件方式调用，点击右侧绿色【使用HBuilderX导入插件】即可使用，示例项目请点击右侧蓝色按钮【使用HBuilderX导入示例项目】。
+## 初次使用如果提示未注册<qiun-data-charts>组件，请重启HBuilderX，并清空小程序开发者工具缓存。
+## [DEMO演示及在线生成工具（v2.0文档）https://demo.ucharts.cn](https://demo.ucharts.cn)
+## [图表组件在uniCloudAdmin中的应用 UReport数据报表](https://ext.dcloud.net.cn/plugin?id=4651) 
+- uCharts.js 折线图区域图增加connectNulls断点续连的功能，详见示例项目中ucharts.vue
+- 秋云图表组件 变更初始化方法为created，变更type2d默认值为true，优化2d模式下组件初始化后dom获取不到的bug
+- 秋云图表组件 修复左右布局时，右侧图表点击坐标错误的bug，修复tooltip柱状图自定义颜色显示object的bug
+## 2.0.0-20210410（2021-04-10）
+- 修复左右布局时，右侧图表点击坐标错误的bug，修复柱状图自定义颜色tooltip显示object的bug
+- 增加标记线及柱状图自定义颜色的demo
+## 2.0.0-20210409（2021-04-08）
+## v1.0版本已停更，建议转uni_modules版本组件方式调用，点击右侧【使用HBuilderX导入插件】即可体验，DEMO演示及在线生成工具（v2.0文档）[https://demo.ucharts.cn](https://demo.ucharts.cn)
+## 图表组件在uniCloudAdmin中的应用 [UReport数据报表](https://ext.dcloud.net.cn/plugin?id=4651) 
+- uCharts.js 修复钉钉小程序百度小程序measureText不准确的bug，修复2d模式下饼图类activeRadius为按比例放大的bug
+- 修复组件在支付宝小程序端点击位置不准确的bug
+## 2.0.0-20210408（2021-04-07）
+- 修复组件在支付宝小程序端不能显示的bug（目前支付宝小程不能点击交互，后续修复）
+- uCharts.js 修复高分屏下柱状图类，圆弧进度条 自定义宽度不能按比例放大的bug
+## 2.0.0-20210407（2021-04-06）
+## v1.0版本已停更，建议转uni_modules版本组件方式调用，点击右侧【使用HBuilderX导入插件】即可体验，DEMO演示及在线生成工具（v2.0文档）[https://demo.ucharts.cn](https://demo.ucharts.cn)
+## 增加 通过tofix和unit快速格式化y轴的demo add by `howcode`
+## 增加 图表组件在uniCloudAdmin中的应用 [UReport数据报表](https://ext.dcloud.net.cn/plugin?id=4651) 
+## 2.0.0-20210406（2021-04-05）
+# 秋云图表组件+uCharts v2.0版本同步上线，使用方法详见https://demo.ucharts.cn帮助页
+## 2.0.0（2021-04-05）
+# 秋云图表组件+uCharts v2.0版本同步上线，使用方法详见https://demo.ucharts.cn帮助页
@@ -0,0 +1,162 @@
+<template>
+	 <view class="container loading1">
+		<view class="shape shape1"></view>
+		<view class="shape shape2"></view>
+		<view class="shape shape3"></view>
+		<view class="shape shape4"></view>
+	</view>
+</template>
+
+<script>
+	export default {
+		name: 'loading1',
+		data() {
+			return {
+				
+			};
+		}
+	}
+</script>
+
+<style scoped="true">
+.container {
+  width: 30px;
+  height: 30px;
+  position: relative;
+}
+.container.loading1 {
+  -webkit-transform: rotate(45deg);
+          transform: rotate(45deg);
+}
+
+.container .shape {
+  position: absolute;
+  width: 10px;
+  height: 10px;
+  border-radius: 1px;
+}
+.container .shape.shape1 {
+  left: 0;
+  background-color: #1890FF;
+}
+.container .shape.shape2 {
+  right: 0;
+  background-color: #91CB74;
+}
+.container .shape.shape3 {
+  bottom: 0;
+  background-color: #FAC858;
+}
+.container .shape.shape4 {
+  bottom: 0;
+  right: 0;
+  background-color: #EE6666;
+}
+
+.loading1 .shape1 {
+  -webkit-animation: animation1shape1 0.5s ease 0s infinite alternate;
+          animation: animation1shape1 0.5s ease 0s infinite alternate;
+}
+
+@-webkit-keyframes animation1shape1 {
+  from {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  to {
+    -webkit-transform: translate(16px, 16px);
+            transform: translate(16px, 16px);
+  }
+}
+
+@keyframes animation1shape1 {
+  from {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  to {
+    -webkit-transform: translate(16px, 16px);
+            transform: translate(16px, 16px);
+  }
+}
+.loading1 .shape2 {
+  -webkit-animation: animation1shape2 0.5s ease 0s infinite alternate;
+          animation: animation1shape2 0.5s ease 0s infinite alternate;
+}
+
+@-webkit-keyframes animation1shape2 {
+  from {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  to {
+    -webkit-transform: translate(-16px, 16px);
+            transform: translate(-16px, 16px);
+  }
+}
+
+@keyframes animation1shape2 {
+  from {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  to {
+    -webkit-transform: translate(-16px, 16px);
+            transform: translate(-16px, 16px);
+  }
+}
+.loading1 .shape3 {
+  -webkit-animation: animation1shape3 0.5s ease 0s infinite alternate;
+          animation: animation1shape3 0.5s ease 0s infinite alternate;
+}
+
+@-webkit-keyframes animation1shape3 {
+  from {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  to {
+    -webkit-transform: translate(16px, -16px);
+            transform: translate(16px, -16px);
+  }
+}
+
+@keyframes animation1shape3 {
+  from {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  to {
+    -webkit-transform: translate(16px, -16px);
+            transform: translate(16px, -16px);
+  }
+}
+.loading1 .shape4 {
+  -webkit-animation: animation1shape4 0.5s ease 0s infinite alternate;
+          animation: animation1shape4 0.5s ease 0s infinite alternate;
+}
+
+@-webkit-keyframes animation1shape4 {
+  from {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  to {
+    -webkit-transform: translate(-16px, -16px);
+            transform: translate(-16px, -16px);
+  }
+}
+
+@keyframes animation1shape4 {
+  from {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  to {
+    -webkit-transform: translate(-16px, -16px);
+            transform: translate(-16px, -16px);
+  }
+}
+
+
+</style>
@@ -0,0 +1,170 @@
+<template>
+	 <view class="container loading2">
+		<view class="shape shape1"></view>
+		<view class="shape shape2"></view>
+		<view class="shape shape3"></view>
+		<view class="shape shape4"></view>
+	</view>
+</template>
+
+<script>
+	export default {
+		name: 'loading2',
+		data() {
+			return {
+				
+			};
+		}
+	}
+</script>
+
+<style scoped="true">
+.container {
+  width: 30px;
+  height: 30px;
+  position: relative;
+}
+
+.container.loading2 {
+  -webkit-transform: rotate(10deg);
+          transform: rotate(10deg);
+}
+.container.loading2 .shape {
+  border-radius: 5px;
+}
+.container.loading2{
+  -webkit-animation: rotation 1s infinite;
+          animation: rotation 1s infinite;
+}
+
+.container .shape {
+  position: absolute;
+  width: 10px;
+  height: 10px;
+  border-radius: 1px;
+}
+.container .shape.shape1 {
+  left: 0;
+  background-color: #1890FF;
+}
+.container .shape.shape2 {
+  right: 0;
+  background-color: #91CB74;
+}
+.container .shape.shape3 {
+  bottom: 0;
+  background-color: #FAC858;
+}
+.container .shape.shape4 {
+  bottom: 0;
+  right: 0;
+  background-color: #EE6666;
+}
+
+
+.loading2 .shape1 {
+  -webkit-animation: animation2shape1 0.5s ease 0s infinite alternate;
+          animation: animation2shape1 0.5s ease 0s infinite alternate;
+}
+
+@-webkit-keyframes animation2shape1 {
+  from {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  to {
+    -webkit-transform: translate(20px, 20px);
+            transform: translate(20px, 20px);
+  }
+}
+
+@keyframes animation2shape1 {
+  from {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  to {
+    -webkit-transform: translate(20px, 20px);
+            transform: translate(20px, 20px);
+  }
+}
+.loading2 .shape2 {
+  -webkit-animation: animation2shape2 0.5s ease 0s infinite alternate;
+          animation: animation2shape2 0.5s ease 0s infinite alternate;
+}
+
+@-webkit-keyframes animation2shape2 {
+  from {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  to {
+    -webkit-transform: translate(-20px, 20px);
+            transform: translate(-20px, 20px);
+  }
+}
+
+@keyframes animation2shape2 {
+  from {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  to {
+    -webkit-transform: translate(-20px, 20px);
+            transform: translate(-20px, 20px);
+  }
+}
+.loading2 .shape3 {
+  -webkit-animation: animation2shape3 0.5s ease 0s infinite alternate;
+          animation: animation2shape3 0.5s ease 0s infinite alternate;
+}
+
+@-webkit-keyframes animation2shape3 {
+  from {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  to {
+    -webkit-transform: translate(20px, -20px);
+            transform: translate(20px, -20px);
+  }
+}
+
+@keyframes animation2shape3 {
+  from {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  to {
+    -webkit-transform: translate(20px, -20px);
+            transform: translate(20px, -20px);
+  }
+}
+.loading2 .shape4 {
+  -webkit-animation: animation2shape4 0.5s ease 0s infinite alternate;
+          animation: animation2shape4 0.5s ease 0s infinite alternate;
+}
+
+@-webkit-keyframes animation2shape4 {
+  from {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  to {
+    -webkit-transform: translate(-20px, -20px);
+            transform: translate(-20px, -20px);
+  }
+}
+
+@keyframes animation2shape4 {
+  from {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  to {
+    -webkit-transform: translate(-20px, -20px);
+            transform: translate(-20px, -20px);
+  }
+}
+
+</style>
@@ -0,0 +1,173 @@
+<template>
+	 <view class="container loading3">
+		<view class="shape shape1"></view>
+		<view class="shape shape2"></view>
+		<view class="shape shape3"></view>
+		<view class="shape shape4"></view>
+	</view>
+</template>
+
+<script>
+	export default {
+		name: 'loading3',
+		data() {
+			return {
+				
+			};
+		}
+	}
+</script>
+
+<style scoped="true">
+.container {
+  width: 30px;
+  height: 30px;
+  position: relative;
+}
+
+ .container.loading3 {
+  -webkit-animation: rotation 1s infinite;
+          animation: rotation 1s infinite;
+}
+.container.loading3 .shape1 {
+  border-top-left-radius: 10px;
+}
+.container.loading3 .shape2 {
+  border-top-right-radius: 10px;
+}
+.container.loading3 .shape3 {
+  border-bottom-left-radius: 10px;
+}
+.container.loading3 .shape4 {
+  border-bottom-right-radius: 10px;
+}
+
+.container .shape {
+  position: absolute;
+  width: 10px;
+  height: 10px;
+  border-radius: 1px;
+}
+.container .shape.shape1 {
+  left: 0;
+  background-color: #1890FF;
+}
+.container .shape.shape2 {
+  right: 0;
+  background-color: #91CB74;
+}
+.container .shape.shape3 {
+  bottom: 0;
+  background-color: #FAC858;
+}
+.container .shape.shape4 {
+  bottom: 0;
+  right: 0;
+  background-color: #EE6666;
+}
+
+.loading3 .shape1 {
+  -webkit-animation: animation3shape1 0.5s ease 0s infinite alternate;
+          animation: animation3shape1 0.5s ease 0s infinite alternate;
+}
+
+@-webkit-keyframes animation3shape1 {
+  from {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  to {
+    -webkit-transform: translate(5px, 5px);
+            transform: translate(5px, 5px);
+  }
+}
+
+@keyframes animation3shape1 {
+  from {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  to {
+    -webkit-transform: translate(5px, 5px);
+            transform: translate(5px, 5px);
+  }
+}
+.loading3 .shape2 {
+  -webkit-animation: animation3shape2 0.5s ease 0s infinite alternate;
+          animation: animation3shape2 0.5s ease 0s infinite alternate;
+}
+
+@-webkit-keyframes animation3shape2 {
+  from {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  to {
+    -webkit-transform: translate(-5px, 5px);
+            transform: translate(-5px, 5px);
+  }
+}
+
+@keyframes animation3shape2 {
+  from {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  to {
+    -webkit-transform: translate(-5px, 5px);
+            transform: translate(-5px, 5px);
+  }
+}
+.loading3 .shape3 {
+  -webkit-animation: animation3shape3 0.5s ease 0s infinite alternate;
+          animation: animation3shape3 0.5s ease 0s infinite alternate;
+}
+
+@-webkit-keyframes animation3shape3 {
+  from {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  to {
+    -webkit-transform: translate(5px, -5px);
+            transform: translate(5px, -5px);
+  }
+}
+
+@keyframes animation3shape3 {
+  from {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  to {
+    -webkit-transform: translate(5px, -5px);
+            transform: translate(5px, -5px);
+  }
+}
+.loading3 .shape4 {
+  -webkit-animation: animation3shape4 0.5s ease 0s infinite alternate;
+          animation: animation3shape4 0.5s ease 0s infinite alternate;
+}
+
+@-webkit-keyframes animation3shape4 {
+  from {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  to {
+    -webkit-transform: translate(-5px, -5px);
+            transform: translate(-5px, -5px);
+  }
+}
+
+@keyframes animation3shape4 {
+  from {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  to {
+    -webkit-transform: translate(-5px, -5px);
+            transform: translate(-5px, -5px);
+  }
+}
+</style>
@@ -0,0 +1,222 @@
+<template>
+	 <view class="container loading5">
+		<view class="shape shape1"></view>
+		<view class="shape shape2"></view>
+		<view class="shape shape3"></view>
+		<view class="shape shape4"></view>
+	</view>
+</template>
+
+<script>
+	export default {
+		name: 'loading5',
+		data() {
+			return {
+				
+			};
+		}
+	}
+</script>
+
+<style scoped="true">
+.container {
+  width: 30px;
+  height: 30px;
+  position: relative;
+}
+
+.container.loading5 .shape {
+  width: 15px;
+  height: 15px;
+}
+
+.container .shape {
+  position: absolute;
+  width: 10px;
+  height: 10px;
+  border-radius: 1px;
+}
+.container .shape.shape1 {
+  left: 0;
+  background-color: #1890FF;
+}
+.container .shape.shape2 {
+  right: 0;
+  background-color: #91CB74;
+}
+.container .shape.shape3 {
+  bottom: 0;
+  background-color: #FAC858;
+}
+.container .shape.shape4 {
+  bottom: 0;
+  right: 0;
+  background-color: #EE6666;
+}
+
+.loading5 .shape1 {
+  animation: animation5shape1 2s ease 0s infinite reverse;
+}
+
+@-webkit-keyframes animation5shape1 {
+  0% {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  25% {
+    -webkit-transform: translate(0, 15px);
+            transform: translate(0, 15px);
+  }
+  50% {
+    -webkit-transform: translate(15px, 15px);
+            transform: translate(15px, 15px);
+  }
+  75% {
+    -webkit-transform: translate(15px, 0);
+            transform: translate(15px, 0);
+  }
+}
+
+@keyframes animation5shape1 {
+  0% {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  25% {
+    -webkit-transform: translate(0, 15px);
+            transform: translate(0, 15px);
+  }
+  50% {
+    -webkit-transform: translate(15px, 15px);
+            transform: translate(15px, 15px);
+  }
+  75% {
+    -webkit-transform: translate(15px, 0);
+            transform: translate(15px, 0);
+  }
+}
+.loading5 .shape2 {
+  animation: animation5shape2 2s ease 0s infinite reverse;
+}
+
+@-webkit-keyframes animation5shape2 {
+  0% {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  25% {
+    -webkit-transform: translate(-15px, 0);
+            transform: translate(-15px, 0);
+  }
+  50% {
+    -webkit-transform: translate(-15px, 15px);
+            transform: translate(-15px, 15px);
+  }
+  75% {
+    -webkit-transform: translate(0, 15px);
+            transform: translate(0, 15px);
+  }
+}
+
+@keyframes animation5shape2 {
+  0% {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  25% {
+    -webkit-transform: translate(-15px, 0);
+            transform: translate(-15px, 0);
+  }
+  50% {
+    -webkit-transform: translate(-15px, 15px);
+            transform: translate(-15px, 15px);
+  }
+  75% {
+    -webkit-transform: translate(0, 15px);
+            transform: translate(0, 15px);
+  }
+}
+.loading5 .shape3 {
+  animation: animation5shape3 2s ease 0s infinite reverse;
+}
+
+@-webkit-keyframes animation5shape3 {
+  0% {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  25% {
+    -webkit-transform: translate(15px, 0);
+            transform: translate(15px, 0);
+  }
+  50% {
+    -webkit-transform: translate(15px, -15px);
+            transform: translate(15px, -15px);
+  }
+  75% {
+    -webkit-transform: translate(0, -15px);
+            transform: translate(0, -15px);
+  }
+}
+
+@keyframes animation5shape3 {
+  0% {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  25% {
+    -webkit-transform: translate(15px, 0);
+            transform: translate(15px, 0);
+  }
+  50% {
+    -webkit-transform: translate(15px, -15px);
+            transform: translate(15px, -15px);
+  }
+  75% {
+    -webkit-transform: translate(0, -15px);
+            transform: translate(0, -15px);
+  }
+}
+.loading5 .shape4 {
+  animation: animation5shape4 2s ease 0s infinite reverse;
+}
+
+@-webkit-keyframes animation5shape4 {
+  0% {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  25% {
+    -webkit-transform: translate(0, -15px);
+            transform: translate(0, -15px);
+  }
+  50% {
+    -webkit-transform: translate(-15px, -15px);
+            transform: translate(-15px, -15px);
+  }
+  75% {
+    -webkit-transform: translate(-15px, 0);
+            transform: translate(-15px, 0);
+  }
+}
+
+@keyframes animation5shape4 {
+  0% {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  25% {
+    -webkit-transform: translate(0, -15px);
+            transform: translate(0, -15px);
+  }
+  50% {
+    -webkit-transform: translate(-15px, -15px);
+            transform: translate(-15px, -15px);
+  }
+  75% {
+    -webkit-transform: translate(-15px, 0);
+            transform: translate(-15px, 0);
+  }
+}
+
+</style>
@@ -0,0 +1,229 @@
+<template>
+	 <view class="container loading6">
+		<view class="shape shape1"></view>
+		<view class="shape shape2"></view>
+		<view class="shape shape3"></view>
+		<view class="shape shape4"></view>
+	</view>
+</template>
+
+<script>
+	export default {
+		name: 'loading6',
+		data() {
+			return {
+				
+			};
+		}
+	}
+</script>
+<style scoped="true">
+.container {
+  width: 30px;
+  height: 30px;
+  position: relative;
+}
+
+.container.loading6 {
+  -webkit-animation: rotation 1s infinite;
+          animation: rotation 1s infinite;
+}
+.container.loading6 .shape {
+  width: 12px;
+  height: 12px;
+  border-radius: 2px;
+}
+.container .shape {
+  position: absolute;
+  width: 10px;
+  height: 10px;
+  border-radius: 1px;
+}
+.container .shape.shape1 {
+  left: 0;
+  background-color: #1890FF;
+}
+.container .shape.shape2 {
+  right: 0;
+  background-color: #91CB74;
+}
+.container .shape.shape3 {
+  bottom: 0;
+  background-color: #FAC858;
+}
+.container .shape.shape4 {
+  bottom: 0;
+  right: 0;
+  background-color: #EE6666;
+}
+
+
+.loading6 .shape1 {
+  -webkit-animation: animation6shape1 2s linear 0s infinite normal;
+          animation: animation6shape1 2s linear 0s infinite normal;
+}
+
+@-webkit-keyframes animation6shape1 {
+  0% {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  25% {
+    -webkit-transform: translate(0, 18px);
+            transform: translate(0, 18px);
+  }
+  50% {
+    -webkit-transform: translate(18px, 18px);
+            transform: translate(18px, 18px);
+  }
+  75% {
+    -webkit-transform: translate(18px, 0);
+            transform: translate(18px, 0);
+  }
+}
+
+@keyframes animation6shape1 {
+  0% {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  25% {
+    -webkit-transform: translate(0, 18px);
+            transform: translate(0, 18px);
+  }
+  50% {
+    -webkit-transform: translate(18px, 18px);
+            transform: translate(18px, 18px);
+  }
+  75% {
+    -webkit-transform: translate(18px, 0);
+            transform: translate(18px, 0);
+  }
+}
+.loading6 .shape2 {
+  -webkit-animation: animation6shape2 2s linear 0s infinite normal;
+          animation: animation6shape2 2s linear 0s infinite normal;
+}
+
+@-webkit-keyframes animation6shape2 {
+  0% {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  25% {
+    -webkit-transform: translate(-18px, 0);
+            transform: translate(-18px, 0);
+  }
+  50% {
+    -webkit-transform: translate(-18px, 18px);
+            transform: translate(-18px, 18px);
+  }
+  75% {
+    -webkit-transform: translate(0, 18px);
+            transform: translate(0, 18px);
+  }
+}
+
+@keyframes animation6shape2 {
+  0% {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  25% {
+    -webkit-transform: translate(-18px, 0);
+            transform: translate(-18px, 0);
+  }
+  50% {
+    -webkit-transform: translate(-18px, 18px);
+            transform: translate(-18px, 18px);
+  }
+  75% {
+    -webkit-transform: translate(0, 18px);
+            transform: translate(0, 18px);
+  }
+}
+.loading6 .shape3 {
+  -webkit-animation: animation6shape3 2s linear 0s infinite normal;
+          animation: animation6shape3 2s linear 0s infinite normal;
+}
+
+@-webkit-keyframes animation6shape3 {
+  0% {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  25% {
+    -webkit-transform: translate(18px, 0);
+            transform: translate(18px, 0);
+  }
+  50% {
+    -webkit-transform: translate(18px, -18px);
+            transform: translate(18px, -18px);
+  }
+  75% {
+    -webkit-transform: translate(0, -18px);
+            transform: translate(0, -18px);
+  }
+}
+
+@keyframes animation6shape3 {
+  0% {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  25% {
+    -webkit-transform: translate(18px, 0);
+            transform: translate(18px, 0);
+  }
+  50% {
+    -webkit-transform: translate(18px, -18px);
+            transform: translate(18px, -18px);
+  }
+  75% {
+    -webkit-transform: translate(0, -18px);
+            transform: translate(0, -18px);
+  }
+}
+.loading6 .shape4 {
+  -webkit-animation: animation6shape4 2s linear 0s infinite normal;
+          animation: animation6shape4 2s linear 0s infinite normal;
+}
+
+@-webkit-keyframes animation6shape4 {
+  0% {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  25% {
+    -webkit-transform: translate(0, -18px);
+            transform: translate(0, -18px);
+  }
+  50% {
+    -webkit-transform: translate(-18px, -18px);
+            transform: translate(-18px, -18px);
+  }
+  75% {
+    -webkit-transform: translate(-18px, 0);
+            transform: translate(-18px, 0);
+  }
+}
+
+@keyframes animation6shape4 {
+  0% {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  25% {
+    -webkit-transform: translate(0, -18px);
+            transform: translate(0, -18px);
+  }
+  50% {
+    -webkit-transform: translate(-18px, -18px);
+            transform: translate(-18px, -18px);
+  }
+  75% {
+    -webkit-transform: translate(-18px, 0);
+            transform: translate(-18px, 0);
+  }
+}
+</style>
@@ -0,0 +1,36 @@
+<template>
+	<view>
+	 <Loading1 v-if="loadingType==1"/>
+	 <Loading2 v-if="loadingType==2"/>
+	 <Loading3 v-if="loadingType==3"/>
+	 <Loading4 v-if="loadingType==4"/>
+	 <Loading5 v-if="loadingType==5"/>
+	</view>
+</template>
+
+<script>
+	import Loading1 from "./loading1.vue";
+	import Loading2 from "./loading2.vue";
+	import Loading3 from "./loading3.vue";
+	import Loading4 from "./loading4.vue";
+	import Loading5 from "./loading5.vue";
+	export default {
+		components:{Loading1,Loading2,Loading3,Loading4,Loading5},
+		name: 'qiun-loading',
+		props: {
+			loadingType: {
+				type: Number,
+				default: 2
+			},
+		},
+		data() {
+			return {
+				
+			};
+		},
+	}
+</script>
+
+<style>
+
+</style>
@@ -0,0 +1,422 @@
+/*
+ * uCharts®
+ * 高性能跨平台图表库，支持H5、APP、小程序（微信/支付宝/百度/头条/QQ/360）、Vue、Taro等支持canvas的框架平台
+ * Copyright (c) 2021 QIUN®秋云 https://www.ucharts.cn All rights reserved.
+ * Licensed ( http://www.apache.org/licenses/LICENSE-2.0 )
+ * 复制使用请保留本段注释，感谢支持开源！
+ * 
+ * uCharts®官方网站
+ * https://www.uCharts.cn
+ * 
+ * 开源地址:
+ * https://gitee.com/uCharts/uCharts
+ * 
+ * uni-app插件市场地址：
+ * http://ext.dcloud.net.cn/plugin?id=271
+ * 
+ */
+
+// 通用配置项
+
+// 主题颜色配置：如每个图表类型需要不同主题，请在对应图表类型上更改color属性
+const color = ['#1890FF', '#91CB74', '#FAC858', '#EE6666', '#73C0DE', '#3CA272', '#FC8452', '#9A60B4', '#ea7ccc'];
+
+const cfe = {
+  //demotype为自定义图表类型
+	"type": ["pie", "ring", "rose", "funnel", "line", "column", "area", "radar", "gauge","candle","demotype"],
+  //增加自定义图表类型，如果需要categories，请在这里加入您的图表类型例如最后的"demotype"
+	"categories": ["line", "column", "area", "radar", "gauge", "candle","demotype"],
+  //instance为实例变量承载属性，option为eopts承载属性，不要删除
+	"instance": {},
+	"option": {},
+  //下面是自定义format配置，因除H5端外的其他端无法通过props传递函数，只能通过此属性对应下标的方式来替换
+  "formatter":{
+    "tooltipDemo1":function(res){
+      let result = ''
+      for (let i in res) {
+      	if (i == 0) {
+      		result += res[i].axisValueLabel + '年销售额'
+      	}
+      	let value = '--'
+      	if (res[i].data !== null) {
+      		value = res[i].data
+      	}
+      	// #ifdef H5
+      	result += '\n' + res[i].seriesName + '：' + value + ' 万元'
+      	// #endif
+      	
+      	// #ifdef APP-PLUS
+      	result += '<br/>' + res[i].marker + res[i].seriesName + '：' + value + ' 万元'
+      	// #endif
+      }
+      return result;
+    },
+    legendFormat:function(name){
+      return "自定义图例+"+name;
+    },
+    yAxisFormatDemo:function (value, index) {
+      return value + '元';
+    },
+    seriesFormatDemo:function(res){
+      return res.name + '年' + res.value + '元';
+    }
+  },
+  //这里演示了自定义您的图表类型的option，可以随意命名，之后在组件上 type="demotype" 后，组件会调用这个花括号里的option，如果组件上还存在eopts参数，会将demotype与eopts中option合并后渲染图表。
+  "demotype":{
+    "color": color,
+    //在这里填写echarts的option即可
+    
+  },
+  //下面是自定义配置，请添加项目所需的通用配置
+	"column": {
+		"color": color,
+		"title": {
+			"text": ''
+		},
+		"tooltip": {
+			"trigger": 'axis'
+		},
+		"grid": {
+			"top": 30,
+			"bottom": 50,
+			"right": 15,
+			"left": 40
+		},
+		"legend": {
+			"bottom": 'left',
+		},
+		"toolbox": {
+			"show": false,
+		},
+		"xAxis": {
+			"type": 'category',
+			"axisLabel": {
+				"color": '#666666'
+			},
+			"axisLine": {
+				"lineStyle": {
+					"color": '#CCCCCC'
+				}
+			},
+			"boundaryGap": true,
+			"data": []
+		},
+		"yAxis": {
+			"type": 'value',
+			"axisTick": {
+				"show": false,
+			},
+			"axisLabel": {
+				"color": '#666666'
+			},
+			"axisLine": {
+				"lineStyle": {
+					"color": '#CCCCCC'
+				}
+			},
+		},
+		"seriesTemplate": {
+			"name": '',
+			"type": 'bar',
+			"data": [],
+			"barwidth": 20,
+			"label": {
+				"show": true,
+        "color": "#666666",
+				"position": 'top',
+			},
+		},
+	},
+	"line": {
+		"color": color,
+		"title": {
+			"text": ''
+		},
+		"tooltip": {
+			"trigger": 'axis'
+		},
+		"grid": {
+			"top": 30,
+			"bottom": 50,
+			"right": 15,
+			"left": 40
+		},
+		"legend": {
+			"bottom": 'left',
+		},
+		"toolbox": {
+			"show": false,
+		},
+		"xAxis": {
+			"type": 'category',
+			"axisLabel": {
+				"color": '#666666'
+			},
+			"axisLine": {
+				"lineStyle": {
+					"color": '#CCCCCC'
+				}
+			},
+			"boundaryGap": true,
+			"data": []
+		},
+		"yAxis": {
+			"type": 'value',
+			"axisTick": {
+				"show": false,
+			},
+			"axisLabel": {
+				"color": '#666666'
+			},
+			"axisLine": {
+				"lineStyle": {
+					"color": '#CCCCCC'
+				}
+			},
+		},
+		"seriesTemplate": {
+			"name": '',
+			"type": 'line',
+			"data": [],
+			"barwidth": 20,
+			"label": {
+				"show": true,
+        "color": "#666666",
+				"position": 'top',
+			},
+		},
+	},
+	"area": {
+		"color": color,
+		"title": {
+			"text": ''
+		},
+		"tooltip": {
+			"trigger": 'axis'
+		},
+		"grid": {
+			"top": 30,
+			"bottom": 50,
+			"right": 15,
+			"left": 40
+		},
+		"legend": {
+			"bottom": 'left',
+		},
+		"toolbox": {
+			"show": false,
+		},
+		"xAxis": {
+			"type": 'category',
+			"axisLabel": {
+				"color": '#666666'
+			},
+			"axisLine": {
+				"lineStyle": {
+					"color": '#CCCCCC'
+				}
+			},
+			"boundaryGap": true,
+			"data": []
+		},
+		"yAxis": {
+			"type": 'value',
+			"axisTick": {
+				"show": false,
+			},
+			"axisLabel": {
+				"color": '#666666'
+			},
+			"axisLine": {
+				"lineStyle": {
+					"color": '#CCCCCC'
+				}
+			},
+		},
+		"seriesTemplate": {
+			"name": '',
+			"type": 'line',
+			"data": [],
+			"areaStyle": {},
+			"label": {
+				"show": true,
+        "color": "#666666",
+				"position": 'top',
+			},
+		},
+	},
+	"pie": {
+		"color": color,
+		"title": {
+			"text": ''
+		},
+		"tooltip": {
+			"trigger": 'item'
+		},
+		"grid": {
+			"top": 40,
+			"bottom": 30,
+			"right": 15,
+			"left": 15
+		},
+		"legend": {
+			"bottom": 'left',
+		},
+		"seriesTemplate": {
+			"name": '',
+			"type": 'pie',
+			"data": [],
+			"radius": '50%',
+			"label": {
+				"show": true,
+        "color": "#666666",
+				"position": 'top',
+			},
+		},
+	},
+	"ring": {
+		"color": color,
+		"title": {
+			"text": ''
+		},
+		"tooltip": {
+			"trigger": 'item'
+		},
+		"grid": {
+			"top": 40,
+			"bottom": 30,
+			"right": 15,
+			"left": 15
+		},
+		"legend": {
+			"bottom": 'left',
+		},
+		"seriesTemplate": {
+			"name": '',
+			"type": 'pie',
+			"data": [],
+			"radius": ['40%', '70%'],
+			"avoidLabelOverlap": false,
+			"label": {
+				"show": true,
+        "color": "#666666",
+				"position": 'top',
+			},
+			"labelLine": {
+				"show": true
+			},
+		},
+	},
+	"rose": {
+		"color": color,
+		"title": {
+			"text": ''
+		},
+		"tooltip": {
+			"trigger": 'item'
+		},
+		"legend": {
+			"top": 'bottom'
+		},
+		"seriesTemplate": {
+			"name": '',
+			"type": 'pie',
+			"data": [],
+			"radius": "55%",
+			"center": ['50%', '50%'],
+			"roseType": 'area',
+		},
+	},
+	"funnel": {
+		"color": color,
+		"title": {
+			"text": ''
+		},
+		"tooltip": {
+			"trigger": 'item',
+			"formatter": "{b} : {c}%"
+		},
+		"legend": {
+			"top": 'bottom'
+		},
+		"seriesTemplate": {
+			"name": '',
+			"type": 'funnel',
+			"left": '10%',
+			"top": 60,
+			"bottom": 60,
+			"width": '80%',
+			"min": 0,
+			"max": 100,
+			"minSize": '0%',
+			"maxSize": '100%',
+			"sort": 'descending',
+			"gap": 2,
+			"label": {
+				"show": true,
+				"position": 'inside'
+			},
+			"labelLine": {
+				"length": 10,
+				"lineStyle": {
+					"width": 1,
+					"type": 'solid'
+				}
+			},
+			"itemStyle": {
+				"bordercolor": '#fff',
+				"borderwidth": 1
+			},
+			"emphasis": {
+				"label": {
+					"fontSize": 20
+				}
+			},
+			"data": [],
+		},
+	},
+	"gauge": {
+		"color": color,
+		"tooltip": {
+        "formatter": '{a} <br/>{b} : {c}%'
+    },
+		"seriesTemplate": {
+			"name": '业务指标',
+      "type": 'gauge',
+      "detail": {"formatter": '{value}%'},
+      "data": [{"value": 50, "name": '完成率'}]
+		},
+	},
+	"candle": {
+		"xAxis": {
+			"data": []
+		},
+		"yAxis": {},
+		"color": color,
+		"title": {
+			"text": ''
+		},
+		"dataZoom": [{
+				"type": 'inside',
+				"xAxisIndex": [0, 1],
+				"start": 10,
+				"end": 100
+			},
+			{
+				"show": true,
+				"xAxisIndex": [0, 1],
+				"type": 'slider',
+				"bottom": 10,
+				"start": 10,
+				"end": 100
+			}
+		],
+		"seriesTemplate": {
+			"name": '',
+			"type": 'k',
+			"data": [],
+		},
+	}
+}
+
+export default cfe;
@@ -0,0 +1,637 @@
+/*
+ * uCharts®
+ * 高性能跨平台图表库，支持H5、APP、小程序（微信/支付宝/百度/头条/QQ/360）、Vue、Taro等支持canvas的框架平台
+ * Copyright (c) 2021 QIUN®秋云 https://www.ucharts.cn All rights reserved.
+ * Licensed ( http://www.apache.org/licenses/LICENSE-2.0 )
+ * 复制使用请保留本段注释，感谢支持开源！
+ * 
+ * uCharts®官方网站
+ * https://www.uCharts.cn
+ * 
+ * 开源地址:
+ * https://gitee.com/uCharts/uCharts
+ * 
+ * uni-app插件市场地址：
+ * http://ext.dcloud.net.cn/plugin?id=271
+ * 
+ */
+
+// 主题颜色配置：如每个图表类型需要不同主题，请在对应图表类型上更改color属性
+const color = ['#1890FF', '#91CB74', '#FAC858', '#EE6666', '#73C0DE', '#3CA272', '#FC8452', '#9A60B4', '#ea7ccc'];
+
+//事件转换函数，主要用作格式化x轴为时间轴，根据需求自行修改
+const formatDateTime = (timeStamp, returnType)=>{
+  var date = new Date();
+  date.setTime(timeStamp * 1000);
+  var y = date.getFullYear();
+  var m = date.getMonth() + 1;
+  m = m < 10 ? ('0' + m) : m;
+  var d = date.getDate();
+  d = d < 10 ? ('0' + d) : d;
+  var h = date.getHours();
+  h = h < 10 ? ('0' + h) : h;
+  var minute = date.getMinutes();
+  var second = date.getSeconds();
+  minute = minute < 10 ? ('0' + minute) : minute;
+  second = second < 10 ? ('0' + second) : second;
+  if(returnType == 'full'){return y + '-' + m + '-' + d + ' '+ h +':' + minute + ':' + second;}
+  if(returnType == 'y-m-d'){return y + '-' + m + '-' + d;}
+  if(returnType == 'h:m'){return  h +':' + minute;}
+  if(returnType == 'h:m:s'){return  h +':' + minute +':' + second;}
+  return [y, m, d, h, minute, second];
+}
+
+const cfu = {
+  //demotype为自定义图表类型，一般不需要自定义图表类型，只需要改根节点上对应的类型即可
+	"type":["pie","ring","rose","word","funnel","map","arcbar","line","column","mount","bar","area","radar","gauge","candle","mix","tline","tarea","scatter","bubble","demotype"],
+	"range":["饼状图","圆环图","玫瑰图","词云图","漏斗图","地图","圆弧进度条","折线图","柱状图","山峰图","条状图","区域图","雷达图","仪表盘","K线图","混合图","时间轴折线","时间轴区域","散点图","气泡图","自定义类型"],
+  //增加自定义图表类型，如果需要categories，请在这里加入您的图表类型，例如最后的"demotype"
+  //自定义类型时需要注意"tline","tarea","scatter","bubble"等时间轴（矢量x轴）类图表，没有categories，不需要加入categories
+	"categories":["line","column","mount","bar","area","radar","gauge","candle","mix","demotype"],
+  //instance为实例变量承载属性，不要删除
+  "instance":{},
+  //option为opts及eopts承载属性，不要删除
+  "option":{},
+  //下面是自定义format配置，因除H5端外的其他端无法通过props传递函数，只能通过此属性对应下标的方式来替换
+  "formatter":{
+    "yAxisDemo1":function(val, index, opts){return val+'元'},
+    "yAxisDemo2":function(val, index, opts){return val.toFixed(2)},
+    "xAxisDemo1":function(val, index, opts){return val+'年';},
+    "xAxisDemo2":function(val, index, opts){return formatDateTime(val,'h:m')},
+    "seriesDemo1":function(val, index, series, opts){return val+'元'},
+    "tooltipDemo1":function(item, category, index, opts){
+      if(index==0){
+      	return '随便用'+item.data+'年'
+      }else{
+      	return '其他我没改'+item.data+'天'
+      }
+    },
+	"tooltipTag":function(item, category, index, opts){
+	  	return item.name + '：' + item.data + '篇文章'
+	},
+	"tooltipCategory":function(item, category, index, opts){
+	  	return category + '：' + item.data + '篇文章'
+	},
+	"tooltipTop10Articles":function(item, category, index, opts){
+		const name = category.slice(0,6) + '...';
+	  	return name + '：访问量' + item.data + '次';
+	},
+	"tooltipUserComments":function(item, category, index, opts){
+	  	return category + '：评论' + item.data + '次'
+	},
+    "pieDemo":function(val, index, series, opts){
+      if(index !== undefined){
+        return series[index].name+'：'+series[index].data+'元'
+      }
+    },
+	"xAxisTop10Article":function(val, index, opts){
+		if(val.length>6){
+			return val.slice(0,6) +'...'
+		}
+		return val
+	},
+	"xAxisUserComments":function(val, index, opts){
+		if(val.length>6){
+			return val.slice(0,6) +'...'
+		}
+		return val
+	},
+	"xAxisCategory":function(val, index, opts){
+		if(val.length>6){
+			return val.slice(0,6) +'...'
+		}
+		return val
+	},
+  },
+  //这里演示了自定义您的图表类型的option，可以随意命名，之后在组件上 type="demotype" 后，组件会调用这个花括号里的option，如果组件上还存在opts参数，会将demotype与opts中option合并后渲染图表。
+  "demotype":{
+    //我这里把曲线图当做了自定义图表类型，您可以根据需要随意指定类型或配置
+    "type": "line",
+    "color": color,
+    "padding": [15,10,0,15],
+    "xAxis": {
+      "disableGrid": true,
+    },
+    "yAxis": {
+      "gridType": "dash",
+      "dashLength": 2,
+    },
+    "legend": {
+    },
+    "extra": {
+    	"line": {
+    		"type": "curve",
+    		"width": 2
+    	},
+    }
+  },
+  //下面是自定义配置，请添加项目所需的通用配置
+	"pie":{
+		"type": "pie",
+    "color": color,
+		"padding": [5,5,5,5],
+		"extra": {
+			"pie": {
+				"activeOpacity": 0.5,
+				"activeRadius": 10,
+				"offsetAngle": 0,
+				"labelWidth": 15,
+				"border": true,
+				"borderWidth": 3,
+				"borderColor": "#FFFFFF"
+			},
+		}
+	},
+	"ring":{
+		"type": "ring",
+    "color": color,
+		"padding": [5,5,5,5],
+		"rotate": false,
+		"dataLabel": true,
+		"legend": {
+			"show": true,
+			"position": "right",
+      "lineHeight": 25,
+		},
+		"title": {
+			"name": "收益率",
+			"fontSize": 15,
+			"color": "#666666"
+		},
+		"subtitle": {
+			"name": "70%",
+			"fontSize": 25,
+			"color": "#7cb5ec"
+		},
+		"extra": {
+			"ring": {
+				"ringWidth":30,
+				"activeOpacity": 0.5,
+				"activeRadius": 10,
+				"offsetAngle": 0,
+				"labelWidth": 15,
+				"border": true,
+				"borderWidth": 3,
+				"borderColor": "#FFFFFF"
+			},
+		},
+	},
+	"rose":{
+		"type": "rose",
+    "color": color,
+		"padding": [5,5,5,5],
+		"legend": {
+			"show": true,
+			"position": "left",
+      "lineHeight": 25,
+		},
+		"extra": {
+			"rose": {
+				"type": "area",
+				"minRadius": 50,
+				"activeOpacity": 0.5,
+				"activeRadius": 10,
+				"offsetAngle": 0,
+				"labelWidth": 15,
+				"border": false,
+				"borderWidth": 2,
+				"borderColor": "#FFFFFF"
+			},
+		}
+	},
+	"word":{
+		"type": "word",
+    "color": color,
+		"extra": {
+			"word": {
+				"type": "normal",
+				"autoColors": false
+			}
+		}
+	},
+	"funnel":{
+		"type": "funnel",
+    "color": color,
+		"padding": [15,15,0,15],
+		"extra": {
+			"funnel": {
+				"activeOpacity": 0.3,
+				"activeWidth": 10,
+				"border": true,
+				"borderWidth": 2,
+				"borderColor": "#FFFFFF",
+				"fillOpacity": 1,
+				"labelAlign": "right"
+			},
+		}
+	},
+	"map":{
+		"type": "map",
+    "color": color,
+		"padding": [0,0,0,0],
+    "dataLabel": true,
+		"extra": {
+			"map": {
+				"border": true,
+				"borderWidth": 1,
+				"borderColor": "#666666",
+				"fillOpacity": 0.6,
+				"activeBorderColor": "#F04864",
+				"activeFillColor": "#FACC14",
+				"activeFillOpacity": 1
+			},
+		}
+	},
+	"arcbar":{
+		"type": "arcbar",
+    "color": color,
+		"title": {
+			"name": "百分比",
+			"fontSize": 25,
+			"color": "#00FF00"
+		},
+		"subtitle": {
+			"name": "默认标题",
+			"fontSize": 15,
+			"color": "#666666"
+		},
+		"extra": {
+			"arcbar": {
+				"type": "default",
+				"width": 12,
+				"backgroundColor": "#E9E9E9",
+				"startAngle": 0.75,
+				"endAngle": 0.25,
+				"gap": 2
+			}
+		}
+	},
+	"line":{
+		"type": "line",
+    "color": color,
+		"padding": [15,10,0,15],
+		"xAxis": {
+      "disableGrid": true,
+		},
+		"yAxis": {
+      "gridType": "dash",
+      "dashLength": 2,
+		},
+		"legend": {
+		},
+		"extra": {
+			"line": {
+				"type": "straight",
+				"width": 2,
+        "activeType": "hollow"
+			},
+		}
+	},
+  "tline":{
+  	"type": "line",
+    "color": color,
+  	"padding": [15,10,0,15],
+  	"xAxis": {
+      "disableGrid": false,
+      "boundaryGap":"justify",
+  	},
+  	"yAxis": {
+      "gridType": "dash",
+      "dashLength": 2,
+      "data":[
+        {
+          "min":0,
+          "max":80
+        }
+      ]
+  	},
+  	"legend": {
+  	},
+  	"extra": {
+  		"line": {
+  			"type": "curve",
+  			"width": 2,
+        "activeType": "hollow"
+  		},
+  	}
+  },
+  "tarea":{
+  	"type": "area",
+    "color": color,
+  	"padding": [15,10,0,15],
+  	"xAxis": {
+      "disableGrid": true,
+      "boundaryGap":"justify",
+  	},
+  	"yAxis": {
+      "gridType": "dash",
+      "dashLength": 2,
+      "data":[
+        {
+          "min":0,
+          "max":80
+        }
+      ]
+  	},
+  	"legend": {
+  	},
+  	"extra": {
+  		"area": {
+  			"type": "curve",
+  			"opacity": 0.2,
+  			"addLine": true,
+  			"width": 2,
+  			"gradient": true,
+        "activeType": "hollow"
+  		},
+  	}
+  },
+	"column":{
+		"type": "column",
+    "color": color,
+		"padding": [15,15,0,5],
+		"xAxis": {
+      "disableGrid": true,
+		},
+		"yAxis": {
+      "data":[{"min":0}]
+		},
+		"legend": {
+		},
+		"extra": {
+			"column": {
+				"type": "group",
+				"width": 30,
+				"activeBgColor": "#000000",
+				"activeBgOpacity": 0.08
+			},
+		}
+	},
+  "mount":{
+  	"type": "mount",
+    "color": color,
+  	"padding": [15,15,0,5],
+  	"xAxis": {
+      "disableGrid": true,
+  	},
+  	"yAxis": {
+      "data":[{"min":0}]
+  	},
+  	"legend": {
+  	},
+  	"extra": {
+  		"mount": {
+  			"type": "mount",
+  			"widthRatio": 1.5,
+  		},
+  	}
+  },
+  "bar":{
+  	"type": "bar",
+    "color": color,
+  	"padding": [15,30,0,5],
+  	"xAxis": {
+      "boundaryGap":"justify",
+      "disableGrid":false,
+      "min":0,
+      "axisLine":false
+  	},
+  	"yAxis": {
+  	},
+  	"legend": {
+  	},
+  	"extra": {
+  		"bar": {
+  			"type": "group",
+  			"width": 30,
+  			"meterBorde": 1,
+  			"meterFillColor": "#FFFFFF",
+  			"activeBgColor": "#000000",
+  			"activeBgOpacity": 0.08
+  		},
+  	}
+  },
+	"area":{
+		"type": "area",
+		"color": color,
+		"padding": [15,15,0,15],
+		"xAxis": {
+      "disableGrid": true,
+		},
+		"yAxis": {
+      "gridType": "dash",
+      "dashLength": 2,
+		},
+		"legend": {
+		},
+		"extra": {
+			"area": {
+				"type": "straight",
+				"opacity": 0.2,
+				"addLine": true,
+				"width": 2,
+				"gradient": false,
+        "activeType": "hollow"
+			},
+		}
+	},
+	"radar":{
+		"type": "radar",
+		"color": color,
+		"padding": [5,5,5,5],
+    "dataLabel": false,
+		"legend": {
+			"show": true,
+			"position": "right",
+      "lineHeight": 25,
+		},
+		"extra": {
+			"radar": {
+				"gridType": "radar",
+				"gridColor": "#CCCCCC",
+				"gridCount": 3,
+				"opacity": 0.2,
+				"max": 200,
+				"labelShow": true
+			},
+		}
+	},
+	"gauge":{
+		"type": "gauge",
+		"color": color,
+		"title": {
+			"name": "66Km/H",
+			"fontSize": 25,
+			"color": "#2fc25b",
+			"offsetY": 50
+		},
+		"subtitle": {
+			"name": "实时速度",
+			"fontSize": 15,
+			"color": "#1890ff",
+			"offsetY": -50
+		},
+		"extra": {
+			"gauge": {
+				"type": "default",
+				"width": 30,
+				"labelColor": "#666666",
+				"startAngle": 0.75,
+				"endAngle": 0.25,
+				"startNumber": 0,
+				"endNumber": 100,
+				"labelFormat": "",
+				"splitLine": {
+					"fixRadius": 0,
+					"splitNumber": 10,
+					"width": 30,
+					"color": "#FFFFFF",
+					"childNumber": 5,
+					"childWidth": 12
+				},
+				"pointer": {
+					"width": 24,
+					"color": "auto"
+				}
+			}
+		}
+	},
+	"candle":{
+		"type": "candle",
+		"color": color,
+		"padding": [15,15,0,15],
+		"enableScroll": true,
+		"enableMarkLine": true,
+		"dataLabel": false,
+		"xAxis": {
+			"labelCount": 4,
+			"itemCount": 40,
+			"disableGrid": true,
+			"gridColor": "#CCCCCC",
+			"gridType": "solid",
+			"dashLength": 4,
+			"scrollShow": true,
+			"scrollAlign": "left",
+			"scrollColor": "#A6A6A6",
+			"scrollBackgroundColor": "#EFEBEF"
+		},
+		"yAxis": {
+		},
+		"legend": {
+		},
+		"extra": {
+			"candle": {
+				"color": {
+					"upLine": "#f04864",
+					"upFill": "#f04864",
+					"downLine": "#2fc25b",
+					"downFill": "#2fc25b"
+				},
+				"average": {
+					"show": true,
+					"name": ["MA5","MA10","MA30"],
+					"day": [5,10,20],
+					"color": ["#1890ff","#2fc25b","#facc14"]
+				}
+			},
+			"markLine": {
+				"type": "dash",
+				"dashLength": 5,
+				"data": [
+					{
+						"value": 2150,
+						"lineColor": "#f04864",
+						"showLabel": true
+					},
+					{
+						"value": 2350,
+						"lineColor": "#f04864",
+						"showLabel": true
+					}
+				]
+			}
+		}
+	},
+	"mix":{
+		"type": "mix",
+		"color": color,
+		"padding": [15,15,0,15],
+		"xAxis": {
+      "disableGrid": true,
+		},
+		"yAxis": {
+			"disabled": false,
+			"disableGrid": false,
+			"splitNumber": 5,
+			"gridType": "dash",
+			"dashLength": 4,
+			"gridColor": "#CCCCCC",
+			"padding": 10,
+			"showTitle": true,
+			"data": []
+		},
+		"legend": {
+		},
+		"extra": {
+			"mix": {
+				"column": {
+					"width": 20
+				}
+			},
+		}
+	},
+	"scatter":{
+		"type": "scatter",
+		"color":color,
+		"padding":[15,15,0,15],
+    "dataLabel":false,
+    "xAxis": {
+      "disableGrid": false,
+      "gridType":"dash",
+      "splitNumber":5,
+      "boundaryGap":"justify",
+      "min":0
+    },
+    "yAxis": {
+      "disableGrid": false,
+      "gridType":"dash",
+    },
+    "legend": {
+    },
+    "extra": {
+    	"scatter": {
+    	},
+    }
+	},
+	"bubble":{
+		"type": "bubble",
+		"color":color,
+		"padding":[15,15,0,15],
+    "xAxis": {
+      "disableGrid": false,
+      "gridType":"dash",
+      "splitNumber":5,
+      "boundaryGap":"justify",
+      "min":0,
+      "max":250
+    },
+    "yAxis": {
+      "disableGrid": false,
+      "gridType":"dash",
+      "data":[{
+        "min":0,
+        "max":150
+      }]
+    },
+    "legend": {
+    },
+    "extra": {
+    	"bubble": {
+        "border":2,
+        "opacity": 0.5,
+    	},
+    }
+	}
+}
+
+export default cfu;
@@ -0,0 +1,5 @@
+# uCharts JSSDK说明
+1、如不使用uCharts组件，可直接引用u-charts.js，打包编译后会`自动压缩`，压缩后体积约为`120kb`。
+2、如果120kb的体积仍需压缩，请手到uCharts官网通过在线定制选择您需要的图表。
+3、config-ucharts.js为uCharts组件的用户配置文件，升级前请`自行备份config-ucharts.js`文件，以免被强制覆盖。
+4、config-echarts.js为ECharts组件的用户配置文件，升级前请`自行备份config-echarts.js`文件，以免被强制覆盖。
@@ -0,0 +1,201 @@
+                                 Apache License
+                           Version 2.0, January 2004
+                        http://www.apache.org/licenses/
+
+   TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION
+
+   1. Definitions.
+
+      "License" shall mean the terms and conditions for use, reproduction,
+      and distribution as defined by Sections 1 through 9 of this document.
+
+      "Licensor" shall mean the copyright owner or entity authorized by
+      the copyright owner that is granting the License.
+
+      "Legal Entity" shall mean the union of the acting entity and all
+      other entities that control, are controlled by, or are under common
+      control with that entity. For the purposes of this definition,
+      "control" means (i) the power, direct or indirect, to cause the
+      direction or management of such entity, whether by contract or
+      otherwise, or (ii) ownership of fifty percent (50%) or more of the
+      outstanding shares, or (iii) beneficial ownership of such entity.
+
+      "You" (or "Your") shall mean an individual or Legal Entity
+      exercising permissions granted by this License.
+
+      "Source" form shall mean the preferred form for making modifications,
+      including but not limited to software source code, documentation
+      source, and configuration files.
+
+      "Object" form shall mean any form resulting from mechanical
+      transformation or translation of a Source form, including but
+      not limited to compiled object code, generated documentation,
+      and conversions to other media types.
+
+      "Work" shall mean the work of authorship, whether in Source or
+      Object form, made available under the License, as indicated by a
+      copyright notice that is included in or attached to the work
+      (an example is provided in the Appendix below).
+
+      "Derivative Works" shall mean any work, whether in Source or Object
+      form, that is based on (or derived from) the Work and for which the
+      editorial revisions, annotations, elaborations, or other modifications
+      represent, as a whole, an original work of authorship. For the purposes
+      of this License, Derivative Works shall not include works that remain
+      separable from, or merely link (or bind by name) to the interfaces of,
+      the Work and Derivative Works thereof.
+
+      "Contribution" shall mean any work of authorship, including
+      the original version of the Work and any modifications or additions
+      to that Work or Derivative Works thereof, that is intentionally
+      submitted to Licensor for inclusion in the Work by the copyright owner
+      or by an individual or Legal Entity authorized to submit on behalf of
+      the copyright owner. For the purposes of this definition, "submitted"
+      means any form of electronic, verbal, or written communication sent
+      to the Licensor or its representatives, including but not limited to
+      communication on electronic mailing lists, source code control systems,
+      and issue tracking systems that are managed by, or on behalf of, the
+      Licensor for the purpose of discussing and improving the Work, but
+      excluding communication that is conspicuously marked or otherwise
+      designated in writing by the copyright owner as "Not a Contribution."
+
+      "Contributor" shall mean Licensor and any individual or Legal Entity
+      on behalf of whom a Contribution has been received by Licensor and
+      subsequently incorporated within the Work.
+
+   2. Grant of Copyright License. Subject to the terms and conditions of
+      this License, each Contributor hereby grants to You a perpetual,
+      worldwide, non-exclusive, no-charge, royalty-free, irrevocable
+      copyright license to reproduce, prepare Derivative Works of,
+      publicly display, publicly perform, sublicense, and distribute the
+      Work and such Derivative Works in Source or Object form.
+
+   3. Grant of Patent License. Subject to the terms and conditions of
+      this License, each Contributor hereby grants to You a perpetual,
+      worldwide, non-exclusive, no-charge, royalty-free, irrevocable
+      (except as stated in this section) patent license to make, have made,
+      use, offer to sell, sell, import, and otherwise transfer the Work,
+      where such license applies only to those patent claims licensable
+      by such Contributor that are necessarily infringed by their
+      Contribution(s) alone or by combination of their Contribution(s)
+      with the Work to which such Contribution(s) was submitted. If You
+      institute patent litigation against any entity (including a
+      cross-claim or counterclaim in a lawsuit) alleging that the Work
+      or a Contribution incorporated within the Work constitutes direct
+      or contributory patent infringement, then any patent licenses
+      granted to You under this License for that Work shall terminate
+      as of the date such litigation is filed.
+
+   4. Redistribution. You may reproduce and distribute copies of the
+      Work or Derivative Works thereof in any medium, with or without
+      modifications, and in Source or Object form, provided that You
+      meet the following conditions:
+
+      (a) You must give any other recipients of the Work or
+          Derivative Works a copy of this License; and
+
+      (b) You must cause any modified files to carry prominent notices
+          stating that You changed the files; and
+
+      (c) You must retain, in the Source form of any Derivative Works
+          that You distribute, all copyright, patent, trademark, and
+          attribution notices from the Source form of the Work,
+          excluding those notices that do not pertain to any part of
+          the Derivative Works; and
+
+      (d) If the Work includes a "NOTICE" text file as part of its
+          distribution, then any Derivative Works that You distribute must
+          include a readable copy of the attribution notices contained
+          within such NOTICE file, excluding those notices that do not
+          pertain to any part of the Derivative Works, in at least one
+          of the following places: within a NOTICE text file distributed
+          as part of the Derivative Works; within the Source form or
+          documentation, if provided along with the Derivative Works; or,
+          within a display generated by the Derivative Works, if and
+          wherever such third-party notices normally appear. The contents
+          of the NOTICE file are for informational purposes only and
+          do not modify the License. You may add Your own attribution
+          notices within Derivative Works that You distribute, alongside
+          or as an addendum to the NOTICE text from the Work, provided
+          that such additional attribution notices cannot be construed
+          as modifying the License.
+
+      You may add Your own copyright statement to Your modifications and
+      may provide additional or different license terms and conditions
+      for use, reproduction, or distribution of Your modifications, or
+      for any such Derivative Works as a whole, provided Your use,
+      reproduction, and distribution of the Work otherwise complies with
+      the conditions stated in this License.
+
+   5. Submission of Contributions. Unless You explicitly state otherwise,
+      any Contribution intentionally submitted for inclusion in the Work
+      by You to the Licensor shall be under the terms and conditions of
+      this License, without any additional terms or conditions.
+      Notwithstanding the above, nothing herein shall supersede or modify
+      the terms of any separate license agreement you may have executed
+      with Licensor regarding such Contributions.
+
+   6. Trademarks. This License does not grant permission to use the trade
+      names, trademarks, service marks, or product names of the Licensor,
+      except as required for reasonable and customary use in describing the
+      origin of the Work and reproducing the content of the NOTICE file.
+
+   7. Disclaimer of Warranty. Unless required by applicable law or
+      agreed to in writing, Licensor provides the Work (and each
+      Contributor provides its Contributions) on an "AS IS" BASIS,
+      WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or
+      implied, including, without limitation, any warranties or conditions
+      of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A
+      PARTICULAR PURPOSE. You are solely responsible for determining the
+      appropriateness of using or redistributing the Work and assume any
+      risks associated with Your exercise of permissions under this License.
+
+   8. Limitation of Liability. In no event and under no legal theory,
+      whether in tort (including negligence), contract, or otherwise,
+      unless required by applicable law (such as deliberate and grossly
+      negligent acts) or agreed to in writing, shall any Contributor be
+      liable to You for damages, including any direct, indirect, special,
+      incidental, or consequential damages of any character arising as a
+      result of this License or out of the use or inability to use the
+      Work (including but not limited to damages for loss of goodwill,
+      work stoppage, computer failure or malfunction, or any and all
+      other commercial damages or losses), even if such Contributor
+      has been advised of the possibility of such damages.
+
+   9. Accepting Warranty or Additional Liability. While redistributing
+      the Work or Derivative Works thereof, You may choose to offer,
+      and charge a fee for, acceptance of support, warranty, indemnity,
+      or other liability obligations and/or rights consistent with this
+      License. However, in accepting such obligations, You may act only
+      on Your own behalf and on Your sole responsibility, not on behalf
+      of any other Contributor, and only if You agree to indemnify,
+      defend, and hold each Contributor harmless for any liability
+      incurred by, or claims asserted against, such Contributor by reason
+      of your accepting any such warranty or additional liability.
+
+   END OF TERMS AND CONDITIONS
+
+   APPENDIX: How to apply the Apache License to your work.
+
+      To apply the Apache License to your work, attach the following
+      boilerplate notice, with the fields enclosed by brackets "[]"
+      replaced with your own identifying information. (Don't include
+      the brackets!)  The text should be enclosed in the appropriate
+      comment syntax for the file format. We also recommend that a
+      file or class name and description of purpose be included on the
+      same "printed page" as the copyright notice for easier
+      identification within third-party archives.
+
+   Copyright [yyyy] [name of copyright owner]
+
+   Licensed under the Apache License, Version 2.0 (the "License");
+   you may not use this file except in compliance with the License.
+   You may obtain a copy of the License at
+
+       http://www.apache.org/licenses/LICENSE-2.0
+
+   Unless required by applicable law or agreed to in writing, software
+   distributed under the License is distributed on an "AS IS" BASIS,
+   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+   See the License for the specific language governing permissions and
+   limitations under the License.
@@ -0,0 +1,80 @@
+{
+  "id": "qiun-data-charts",
+  "displayName": "秋云 ucharts echarts 高性能跨全端图表组件",
+  "version": "2.5.0-20230101",
+  "description": "uCharts 新增正负柱状图！支持H5及APP用 ucharts echarts 渲染图表，uniapp可视化首选组件",
+  "keywords": [
+    "ucharts",
+    "echarts",
+    "f2",
+    "图表",
+    "可视化"
+],
+  "repository": "https://gitee.com/uCharts/uCharts",
+"engines": {
+  },
+"dcloudext": {
+    "sale": {
+      "regular": {
+        "price": "0.00"
+      },
+      "sourcecode": {
+        "price": "0.00"
+      }
+    },
+    "contact": {
+      "qq": "474119"
+    },
+    "declaration": {
+      "ads": "无",
+      "data": "插件不采集任何数据",
+      "permissions": "无"
+    },
+    "npmurl": "https://www.npmjs.com/~qiun",
+    "type": "component-vue"
+  },
+  "uni_modules": {
+    "dependencies": [],
+    "encrypt": [],
+    "platforms": {
+      "cloud": {
+        "tcb": "y",
+        "aliyun": "y"
+      },
+      "client": {
+        "App": {
+          "app-vue": "y",
+          "app-nvue": "y"
+        },
+        "H5-mobile": {
+          "Safari": "y",
+          "Android Browser": "y",
+          "微信浏览器(Android)": "y",
+          "QQ浏览器(Android)": "y"
+        },
+        "H5-pc": {
+          "Chrome": "y",
+          "IE": "y",
+          "Edge": "y",
+          "Firefox": "y",
+          "Safari": "y"
+        },
+        "小程序": {
+          "微信": "y",
+          "阿里": "y",
+          "百度": "y",
+          "字节跳动": "y",
+          "QQ": "y"
+        },
+        "快应用": {
+          "华为": "y",
+          "联盟": "y"
+        },
+        "Vue": {
+            "vue2": "y",
+            "vue3": "y"
+        }
+      }
+    }
+  }
+}
@@ -0,0 +1,84 @@
+![logo](https://img-blog.csdnimg.cn/4a276226973841468c1be356f8d9438b.png)
+
+
+[![star](https://gitee.com/uCharts/uCharts/badge/star.svg?theme=gvp)](https://gitee.com/uCharts/uCharts/stargazers)
+[![fork](https://gitee.com/uCharts/uCharts/badge/fork.svg?theme=gvp)](https://gitee.com/uCharts/uCharts/members)
+[![License](https://img.shields.io/badge/license-Apache%202-4EB1BA.svg)](https://www.apache.org/licenses/LICENSE-2.0.html)
+[![npm package](https://img.shields.io/npm/v/@qiun/ucharts.svg?style=flat-square)](https://www.npmjs.com/~qiun)
+
+
+## uCharts简介
+
+`uCharts`是一款基于`canvas API`开发的适用于所有前端应用的图表库，开发者编写一套代码，可运行到 Web、iOS、Android（基于 uni-app / taro ）、以及各种小程序（微信/支付宝/百度/头条/飞书/QQ/快手/钉钉/淘宝）、快应用等更多支持 canvas API 的平台。
+
+## 官方网站
+
+## [https://www.ucharts.cn](https://www.ucharts.cn)
+
+## 快速体验
+
+一套代码编到多个平台，依次扫描二维码，亲自体验uCharts图表跨平台效果！其他平台请自行编译。
+
+![](https://www.ucharts.cn/images/web/guide/qrcode20220224.png)
+
+![](https://img-blog.csdnimg.cn/7d0115593ff24ac39a224fb7c6ed72a4.png)
+
+## 致开发者
+
+感谢各位开发者`五年`来对秋云及uCharts的支持，uCharts的进步离不开各位开发者的鼓励与贡献。为更好的帮助各位开发者使用图表工具，我们推出了新版官网，增加了在线定制、问答社区、在线配置等一些增值服务，为确保您能更好的应用图表组件，建议您先`仔细阅读官网指南`以及`常见问题`，而不是下载下来`直接使用`。如仍然不能解决，请到`官网社区`或开通会员后加入`专属VIP会员群`提问将会很快得到回答。
+
+## 视频教程
+
+## [uCharts新手入门教程](https://www.bilibili.com/video/BV1qA411Q7se/?share_source=copy_web&vd_source=42a1242f9aaade6427736af69eb2e1d9)
+
+
+## 社群支持
+
+uCharts官方拥有5个2000人的QQ群及专属VIP会员群支持，庞大的用户量证明我们一直在努力，请各位放心使用！uCharts的开源图表组件的开发，团队付出了大量的时间与精力，经过四来的考验，不会有比较明显的bug，请各位放心使用。如果您有更好的想法，可以在`码云提交Pull Requests`以帮助更多开发者完成需求，再次感谢各位对uCharts的鼓励与支持！
+
+#### 官方交流群
+- 交流群1：371774600（已满）
+- 交流群2：619841586（已满）
+- 交流群3：955340127（已满）
+- 交流群4：641669795（已满）
+- 交流群5：236294809（只能扫码加入）
+
+![](https://www.ucharts.cn/images/web/qq5.jpg)
+
+- 口令`uniapp`
+
+#### 专属VIP会员群
+- 开通会员后详见【账号详情】页面中顶部的滚动通知
+- 口令`您的用户ID`
+
+## 版权信息
+
+uCharts始终坚持开源，遵循 [Apache Licence 2.0](https://www.apache.org/licenses/LICENSE-2.0.html) 开源协议，意味着您无需支付任何费用，即可将uCharts应用到您的产品中。
+
+注意：这并不意味着您可以将uCharts应用到非法的领域，比如涉及赌博，暴力等方面。如因此产生纠纷或法律问题，uCharts相关方及秋云科技不承担任何责任。
+
+## 合作伙伴
+
+[![DIY官网](https://www.ucharts.cn/images/web/guide/links/diy-gw.png)](https://www.diygw.com/)
+[![HasChat](https://www.ucharts.cn/images/web/guide/links/haschat.png)](https://gitee.com/howcode/has-chat)
+[![uViewUI](https://www.ucharts.cn/images/web/guide/links/uView.png)](https://www.uviewui.com/)
+[![图鸟UI](https://www.ucharts.cn/images/web/guide/links/tuniao.png)](https://ext.dcloud.net.cn/plugin?id=7088)
+[![thorui](https://www.ucharts.cn/images/web/guide/links/thorui.png)](https://ext.dcloud.net.cn/publisher?id=202)
+[![FirstUI](https://www.ucharts.cn/images/web/guide/links/first.png)](https://www.firstui.cn/)
+[![nProUI](https://www.ucharts.cn/images/web/guide/links/nPro.png)](https://ext.dcloud.net.cn/plugin?id=5169)
+[![GraceUI](https://www.ucharts.cn/images/web/guide/links/grace.png)](https://www.graceui.com/)
+
+
+## 更新记录
+
+详见官网指南中说明，[点击此处查看](https://www.ucharts.cn/v2/#/guide/index?id=100)
+
+
+## 相关链接
+- [uCharts官网](https://www.ucharts.cn)
+- [DCloud插件市场地址](https://ext.dcloud.net.cn/plugin?id=271)
+- [uCharts码云开源托管地址](https://gitee.com/uCharts/uCharts) [![star](https://gitee.com/uCharts/uCharts/badge/star.svg?theme=gvp)](https://gitee.com/uCharts/uCharts/stargazers)
+- [uCharts npm开源地址](https://www.ucharts.cn)
+- [ECharts官网](https://echarts.apache.org/zh/index.html)
+- [ECharts配置手册](https://echarts.apache.org/zh/option.html)
+- [图表组件在项目中的应用 ReportPlus数据报表](https://www.ucharts.cn/v2/#/layout/info?id=1) 
--- a/Show More
+++ b/Show More
Author	SHA1	Message	Date
小莫唐尼	1407b58024	fix: 修复分类统计显示undefined问题 #42	2026-07-20 16:21:18 +08:00
小莫唐尼	de142c4729	feat: 添加文章访问统计功能 1. 新增getDomainOnly工具函数用于提取URL域名 2. 新增postTrackersCounter接口调用方法 3. 在文章详情页添加访问数据上报 #31 #41	2026-06-05 13:20:25 +08:00
小莫唐尼	0b4090f9e9	chore: 向gitignore添加.trae目录忽略.trae临时配置目录，避免将其提交到代码仓库	2026-05-25 00:33:24 +08:00
小莫唐尼	3ccd4f7ccf	chore: 删除无用的 git 提交消息规则文件移除了项目中未实际使用的自定义提交规则配置文件	2026-05-25 00:32:16 +08:00
小莫唐尼	6f01501fd1	chore: 发布版本2.0.10，修复并优化多项功能 1. 更新manifest.json和package.json版本号至2.0.10 2. 修复友情链接api #40 3. 修复图库api #39 4. 统一home.vue页面的代码缩进格式 5. 清理api文件冗余注释，修复接口域名路径 6. 优化图库页面空状态提示文案	2026-05-25 00:27:42 +08:00
yhliu	e426abf336	modify home.vue	2026-04-27 22:43:37 +08:00
yhliu	a767397e23	feat 链接管理、投票管理控制	2026-04-27 22:43:37 +08:00
yhliu	17f5b4b917	feat 首页是否显示快捷导航	2026-04-27 22:43:37 +08:00
小莫唐尼	94ff37f77f	fix: 修复文档图片不显示问题	2026-04-24 18:53:56 +08:00
小莫唐尼	73bc88bad8	fix: 修复域名后缀带 / 问题，修改doc文档	2026-04-24 18:06:23 +08:00
小莫唐尼	72dc278a2b	feat: 修复数据看板无法滚动问题	2025-11-28 01:19:52 +08:00
小莫唐尼	7ba35ffd5d	feat: 新增数据可视化看板、删除多余的文件	2025-11-28 00:01:00 +08:00
小莫唐尼	3643bdf6f6	fix: 修复海报保存问题	2025-11-26 15:19:04 +08:00
liuyiwuqing	21fee2dc9a	feat(auth): 限制阅读支持评论后访问 - 引入 getOpenid 和 getNologinEmail 方法统一管理认证信息 - 替换原有直接读取 storage 方式为封装方法调用 - 优化文章详情页按钮文案展示逻辑 - 新增评论后自动刷新限制阅读内容功能 - 调整评论权限提示逻辑，跳转至评论弹窗而非 toast 提示	2025-11-25 21:32:07 +08:00
小莫唐尼	90f6516f45	fix: 修复文章详情的豆瓣资源名称重复显示	2025-11-13 18:43:43 +08:00
小莫唐尼	a15621d55e	feat: 优化文章详情的豆瓣资源显示	2025-11-13 18:33:40 +08:00
小莫唐尼	a717beb0e7	feat: 文章详情支持豆瓣插件	2025-11-13 17:37:33 +08:00
liuyiwuqing	b9ad94ddb5	!26 fix(api):修复友情链接提交接口地址 * fix(api):修复友情链接提交接口地址	2025-10-20 08:51:09 +00:00
小莫唐尼	9ab013562d	fix: 修复投票状态显示问题	2025-08-29 17:52:53 +08:00
小莫唐尼	a8bd121deb	feat: 文章详情有封面图的时候支持点击预览大图	2025-08-22 11:16:33 +08:00
小莫唐尼	476a1ec48e	fix: 修复投票详情页面分享BUG	2025-08-22 11:15:56 +08:00
小莫唐尼	31ade9908a	feat: 优化投票功能，调整API	2025-08-21 19:32:22 +08:00
小莫唐尼	5606e8c59f	fix: 修复投票多选BUG	2025-08-21 11:18:08 +08:00
小莫唐尼	61d3b22fdb	fix: 修复插件状态检测功能	2025-08-21 11:17:36 +08:00
小莫唐尼	c05aa5253c	feat: 优化投票功能，在审核模式下设置不显示	2025-08-20 23:47:05 +08:00
小莫唐尼	0b599dcced	feat: 优化首页快捷导航	2025-08-20 23:29:05 +08:00
小莫唐尼	623e3fa59a	feat: 文章详情支持投票功能	2025-08-20 23:19:41 +08:00
小莫唐尼	1075f588fa	fix: 修复全局预定义css影响问题	2025-08-20 22:00:47 +08:00
小莫唐尼	c0d8cb2c3b	feat: 新增投票功能	2025-08-20 21:56:34 +08:00
小莫唐尼	9c6a054b12	feat: 补充遗漏插件检查组件	2025-08-20 21:55:11 +08:00
小莫唐尼	6a05f664ba	feat: 添加插件检测	2025-08-20 21:53:24 +08:00
小莫唐尼	9c4d2242ae	fix: 修复瞬间详情显示bug	2025-07-22 00:40:36 +08:00
小莫唐尼	eac027c116	feat: 内容搜索支持显示文章和瞬间、瞬间支持跳转详情	2025-07-22 00:07:57 +08:00
小莫唐尼	3a08008192	fix: 修复审核模式瞬间无法正确加载数据问题 (#33 )	2025-07-21 22:19:06 +08:00
小莫唐尼	7daf93d51f	fix: 修复瞬间视频可同时播放多个视频bug、优化列表加载	2025-07-21 17:53:36 +08:00
小莫唐尼	409be28deb	fix: 修复图库添加左右手势滑动后布局显示bug	2025-07-20 00:11:41 +08:00
小莫唐尼	97e358e41f	fix: 修复图库功能loading 成功状态 error 改为 success	2025-07-20 00:04:53 +08:00
小莫唐尼	c17e668afe	feat: 优化返回顶部按钮大小	2025-07-19 23:59:56 +08:00
小莫唐尼	4611932ad8	feat: 图库支持左右滑动	2025-07-19 23:46:40 +08:00
小莫唐尼	452d021816	fix: 修复图库分类排序问题	2025-07-19 14:08:44 +08:00
小莫唐尼	d71022c224	fix: 修复分类详情分享bug	2025-07-01 20:23:06 +08:00
小莫唐尼	d521a641de	refactor: 对token配置进行重构、同时修复token获取失败的问题	2025-07-01 20:09:05 +08:00
小莫唐尼	4246d8cdcb	refactor: 调整默认的配置文件	2025-06-29 11:29:06 +08:00
小莫唐尼	6989fd8ddc	fix: 修复自定义轮播图弹窗链接跳转网页问题	2025-06-28 15:09:56 +08:00
小莫唐尼	742b51a23e	feat: 新增瞬间支持音频	2025-06-25 18:51:44 +08:00
小莫唐尼	bc541a3ef6	fix: 修复瞬间内容中的图片视频无法展示问题	2025-06-25 18:33:44 +08:00
小莫唐尼	67fc682164	feat: 瞬间卡片增加标签显示功能	2025-06-25 17:28:57 +08:00
小莫唐尼	b43dd7e5a7	fix: 修复启动页面视频背景url兼容问题	2025-06-25 16:22:07 +08:00
小莫唐尼	e29ccf65c5	fix: 修复搜索功能	2025-06-22 12:02:43 +08:00
小莫唐尼	91553fc053	feat: 优化分类显示按钮根据审核模式状态显示因此	2025-06-22 11:15:20 +08:00
小莫唐尼	22f57b7860	feat: 优化UI	2025-06-22 11:06:41 +08:00
小莫唐尼	2a25727c0b	feat: 分类页面支持切换不同的展示模式	2025-06-16 19:42:45 +08:00
小莫唐尼	eb69ae4af6	feat: 更新版本 2.0.8	2025-06-15 18:42:00 +08:00
小莫唐尼	2fd83a7814	feat: 新增首页轮播支持配置	2025-06-15 18:38:52 +08:00
小莫唐尼	8963ba1921	fix: 修复首页和分类页面显示已经隐藏的分类数据问题	2025-06-15 14:58:07 +08:00
liuyiwuqing	051c72b584	!25 支持文章自定义验证码获取方式、优化友链提交页面 * fix(提交链接): 修复博客 logo 显示问题 * feat(plugin): 重构友链提交插件配置 * feat(api): 为 restrict-read 请求添加微信会话 ID 并支持自定义验证码类型	2025-06-15 06:37:50 +00:00
小莫唐尼	552827eaac	update: 调整token配置参数	2025-06-13 12:47:12 +08:00
liuyiwuqing	e8d13c674f	!24 feat(restrict-read): 实现文章限制阅读功能 * feat(restrict-read): 实现文章限制阅读功能 * Merge remote-tracking branch 'origin/v2.0-beta' into v2.0-beta * feat(restrict-read): 实现文章限制阅读功能	2025-06-13 03:38:44 +00:00
小莫唐尼	256bc0e00f	update: 首页分类查询过滤	2025-06-11 15:57:35 +08:00
小莫唐尼	9aa0e310f2	fix: 修复文章详情海报二维码在安卓下显示异常问题	2025-02-14 16:44:43 +08:00
小莫唐尼	6a0bb0e07f	update: 文章海报取消渐变背景	2025-02-07 21:21:51 +08:00
小莫唐尼	044f737016	update: 瞬间过滤非公开的内容	2025-02-07 21:11:48 +08:00
小莫唐尼	27b3d31828	update: 优化文章详情海报图片在安卓下显示不完整问题	2025-02-07 21:03:43 +08:00
小莫唐尼	64c9a15d51	update: 修改README内容	2024-12-04 17:28:13 +08:00
小莫唐尼	df4c58d3e4	feat: 文章详情新增评论自动滚动到评论区域	2024-12-03 10:04:08 +08:00
小莫唐尼	93f23696ef	update: 修改作者相关网页地址、免责声明页面邮箱点击可复制	2024-12-03 09:25:50 +08:00
小莫唐尼	2ed7e1a260	update: 修改作者博客地址	2024-11-29 16:16:20 +08:00
小莫唐尼	e19b107ed0	feat: 新增文章点赞功能	2024-11-06 19:23:13 +08:00
小莫唐尼	7c15c84dba	update: 调整获取模拟参数请求策略	2024-10-28 18:38:29 +08:00
小莫唐尼	e8edc03526	update: 修改我的页面文章归档的显示策略	2024-10-28 18:28:56 +08:00
小莫唐尼	2b717ad449	update: 修改模拟数据请求地址为动态配置	2024-10-28 18:25:40 +08:00
小莫唐尼	5efc877a89	feat: 添加模拟数据模板	2024-10-28 18:00:19 +08:00
小莫唐尼	75a133415a	fix: 修复README内容链接丢失	2024-10-28 17:57:37 +08:00
小莫唐尼	bf41b08b35	update: 优化审核模式，新增审核使用模拟数据	2024-10-28 17:53:43 +08:00
小莫唐尼	74a5efb596	Merge branch 'main' of https://github.com/ialley-workshop-open/uni-halo	2024-10-22 18:26:29 +08:00
小莫唐尼	40dd4f4b7f	update: 调整审核模式隐藏部分内容，修复分类显示控制不生效	2024-10-22 18:19:23 +08:00
小莫唐尼	341670adcf	fix: 修复恋爱日记图标丢失问题	2024-10-22 18:06:34 +08:00
小莫唐尼	115aea2580	fix: 修复文章分享功能	2024-10-22 17:03:06 +08:00
小莫唐尼	58f1e7f131	fix: 修复文章分享功能	2024-10-22 16:30:30 +08:00
小莫唐尼	26ce84b950	fix: 修复瞬间视频不显示bug	2024-10-17 18:49:28 +08:00
小莫唐尼	32b3bbaa74	fix: 修复文章归档	2024-10-17 18:07:15 +08:00
小莫唐尼	76c00f31f6	update: 恋爱配置导航内图标支持后台配置	2024-10-17 17:29:15 +08:00
小莫唐尼	e28ea6ca08	fix: 修复文章归档功能	2024-10-17 17:19:39 +08:00
小莫唐尼	a98254e6cc	fix: 修复编译到app时，启动页按钮样式丢失问题	2024-10-17 11:28:13 +08:00