mirror of
https://github.com/ialley-workshop-open/uni-halo.git
synced 2026-07-27 04:20:43 +08:00
Compare commits
37 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| a8bd121deb | |||
| 476a1ec48e | |||
| 31ade9908a | |||
| 5606e8c59f | |||
| 61d3b22fdb | |||
| c05aa5253c | |||
| 0b599dcced | |||
| 623e3fa59a | |||
| 1075f588fa | |||
| c0d8cb2c3b | |||
| 9c6a054b12 | |||
| 6a05f664ba | |||
| 9c4d2242ae | |||
| eac027c116 | |||
| 3a08008192 | |||
| 7daf93d51f | |||
| 409be28deb | |||
| 97e358e41f | |||
| c17e668afe | |||
| 4611932ad8 | |||
| 452d021816 | |||
| d71022c224 | |||
| d521a641de | |||
| 4246d8cdcb | |||
| 6989fd8ddc | |||
| 742b51a23e | |||
| bc541a3ef6 | |||
| 67fc682164 | |||
| b43dd7e5a7 | |||
| e29ccf65c5 | |||
| 91553fc053 | |||
| 22f57b7860 | |||
| 2a25727c0b | |||
| eb69ae4af6 | |||
| 2fd83a7814 | |||
| 8963ba1921 | |||
| 051c72b584 |
@@ -2,8 +2,3 @@ node_modules/
|
|||||||
unpackage/
|
unpackage/
|
||||||
package-lock.json
|
package-lock.json
|
||||||
.idea
|
.idea
|
||||||
|
|
||||||
config/halo.config.js
|
|
||||||
config/love.config.js
|
|
||||||
config/token.config.js
|
|
||||||
config/plugins.config.js
|
|
||||||
|
|||||||
@@ -1,5 +1,5 @@
|
|||||||
<script>
|
<script>
|
||||||
import HaloTokenConfig from '@/config/token.config.js';
|
import HaloTokenConfig from '@/config/uhalo.config.js';
|
||||||
|
|
||||||
// app升级检测(搭配:https://ext.dcloud.net.cn/plugin?id=4470 升级中心)
|
// app升级检测(搭配:https://ext.dcloud.net.cn/plugin?id=4470 升级中心)
|
||||||
import CheckAppUpdate from '@/uni_modules/uni-upgrade-center-app/utils/check-update';
|
import CheckAppUpdate from '@/uni_modules/uni-upgrade-center-app/utils/check-update';
|
||||||
|
|||||||
+261
-204
@@ -1,234 +1,291 @@
|
|||||||
/**
|
/**
|
||||||
* 所有的接口
|
* 所有的接口
|
||||||
*/
|
*/
|
||||||
import HaloTokenConfig from '@/config/token.config.js'
|
import {
|
||||||
|
getPersonalToken
|
||||||
|
} from '@/utils/token.js'
|
||||||
import HttpHandler from '@/common/http/request.js'
|
import HttpHandler from '@/common/http/request.js'
|
||||||
import qs from 'qs'
|
import qs from 'qs'
|
||||||
|
|
||||||
import {
|
import {
|
||||||
getAppConfigs
|
getAppConfigs
|
||||||
} from '@/config/index.js'
|
} from '@/config/index.js'
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
/**
|
/**
|
||||||
* 获取文章列表
|
* 获取文章列表
|
||||||
* @param {Object} params 参数
|
* @param {Object} params 参数
|
||||||
*/
|
*/
|
||||||
getPostList: (params) => {
|
getPostList: (params) => {
|
||||||
return HttpHandler.Get(`/apis/api.content.halo.run/v1alpha1/posts`, params)
|
return HttpHandler.Get(`/apis/api.content.halo.run/v1alpha1/posts`, params)
|
||||||
},
|
},
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 根据名称获取文章
|
* 根据名称获取文章
|
||||||
* @param {String} name 分类名称
|
* @param {String} name 分类名称
|
||||||
*/
|
*/
|
||||||
getPostByName: (name) => {
|
getPostByName: (name) => {
|
||||||
return HttpHandler.Get(`/apis/api.content.halo.run/v1alpha1/posts/${name}`, {}, {
|
return HttpHandler.Get(`/apis/api.content.halo.run/v1alpha1/posts/${name}`, {}, {
|
||||||
header: {
|
header: {
|
||||||
'Wechat-Session-Id': uni.getStorageSync('openid'),
|
'Wechat-Session-Id': uni.getStorageSync('openid'),
|
||||||
}
|
}
|
||||||
})
|
|
||||||
},
|
|
||||||
|
|
||||||
/**
|
|
||||||
* 搜索文章
|
|
||||||
* @param {Object} params 数据
|
|
||||||
*/
|
|
||||||
getPostListByKeyword: (params) => {
|
|
||||||
return HttpHandler.Get(`/apis/api.halo.run/v1alpha1/indices/post`, params)
|
|
||||||
},
|
|
||||||
|
|
||||||
/**
|
|
||||||
* 查询分类列表
|
|
||||||
* @param {Object} params 查询参数
|
|
||||||
*/
|
|
||||||
getCategoryList: (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 数据
|
||||||
* @param {Object} params 查询参数
|
*/
|
||||||
*/
|
getPostListByKeyword: (params) => {
|
||||||
getCategoryPostList: (name, params) => {
|
// return HttpHandler.Get(`/apis/api.halo.run/v1alpha1/indices/post`, params)
|
||||||
return HttpHandler.Get(`/apis/api.content.halo.run/v1alpha1/categories/${name}/posts`, params)
|
return HttpHandler.Post(`/apis/api.halo.run/v1alpha1/indices/-/search`, params)
|
||||||
},
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 查询分类列表
|
||||||
|
* @param {Object} params 查询参数
|
||||||
|
*/
|
||||||
|
getCategoryList: (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 查询参数
|
* @param {Object} params 查询参数
|
||||||
*/
|
*/
|
||||||
getPostCommentList: (params) => {
|
getPostCommentList: (params) => {
|
||||||
return HttpHandler.Get(`/apis/api.halo.run/v1alpha1/comments`, params)
|
return HttpHandler.Get(`/apis/api.halo.run/v1alpha1/comments`, params)
|
||||||
},
|
},
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 获取回复列表
|
* 获取回复列表
|
||||||
* @param {String} commentName 名称
|
* @param {String} commentName 名称
|
||||||
* @param {Object} params 查询参数
|
* @param {Object} params 查询参数
|
||||||
*/
|
*/
|
||||||
getPostCommentReplyList: (commentName, params) => {
|
getPostCommentReplyList: (commentName, params) => {
|
||||||
return HttpHandler.Get(`/apis/api.halo.run/v1alpha1/comments/${commentName}/reply`, params)
|
return HttpHandler.Get(`/apis/api.halo.run/v1alpha1/comments/${commentName}/reply`, params)
|
||||||
},
|
},
|
||||||
|
|
||||||
// 提交评论
|
// 提交评论
|
||||||
addPostComment: (data) => {
|
addPostComment: (data) => {
|
||||||
return HttpHandler.Post(`/apis/api.halo.run/v1alpha1/comments`, data)
|
return HttpHandler.Post(`/apis/api.halo.run/v1alpha1/comments`, data)
|
||||||
},
|
},
|
||||||
// 提交回复
|
// 提交回复
|
||||||
addPostCommentReply: (commentName, data) => {
|
addPostCommentReply: (commentName, data) => {
|
||||||
return HttpHandler.Post(`/apis/api.halo.run/v1alpha1/comments/${commentName}/reply`, data)
|
return HttpHandler.Post(`/apis/api.halo.run/v1alpha1/comments/${commentName}/reply`, data)
|
||||||
},
|
},
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 获取标签列表
|
* 获取标签列表
|
||||||
* @param {Object} params 查询参数
|
* @param {Object} params 查询参数
|
||||||
*/
|
*/
|
||||||
getTagList: (params) => {
|
getTagList: (params) => {
|
||||||
return HttpHandler.Get(`/apis/api.content.halo.run/v1alpha1/tags`, params)
|
return HttpHandler.Get(`/apis/api.content.halo.run/v1alpha1/tags`, params)
|
||||||
},
|
},
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 根据标签获取文章列表
|
* 根据标签获取文章列表
|
||||||
* @param {String} tagName 参数
|
* @param {String} tagName 参数
|
||||||
* @param {Object} params 查询参数
|
* @param {Object} params 查询参数
|
||||||
*/
|
*/
|
||||||
getPostByTagName: (tagName, params) => {
|
getPostByTagName: (tagName, params) => {
|
||||||
return HttpHandler.Get(`/apis/api.content.halo.run/v1alpha1/tags/${tagName}/posts`, params)
|
return HttpHandler.Get(`/apis/api.content.halo.run/v1alpha1/tags/${tagName}/posts`, params)
|
||||||
},
|
},
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 获取瞬间列表
|
* 获取瞬间列表
|
||||||
*/
|
*/
|
||||||
getMomentList: (params) => {
|
getMomentList: (params) => {
|
||||||
return HttpHandler.Get(`/apis/moment.halo.run/v1alpha1/moments`, params, {
|
return HttpHandler.Get(`/apis/moment.halo.run/v1alpha1/moments`, params, {
|
||||||
custom: {
|
custom: {
|
||||||
systemToken: HaloTokenConfig.systemToken
|
personalToken: getPersonalToken()
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 查询站点统计信息
|
* 获取瞬间详情
|
||||||
*/
|
* @param {String} name 瞬间id
|
||||||
getBlogStatistics: () => {
|
*/
|
||||||
return HttpHandler.Get(`/apis/api.halo.run/v1alpha1/stats/-`, {})
|
getMomentByName: (name) => {
|
||||||
},
|
return HttpHandler.Get(`/apis/moment.halo.run/v1alpha1/moments/${name}`, {}, {
|
||||||
|
custom: {
|
||||||
|
personalToken: getPersonalToken()
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 查询站点统计信息
|
||||||
|
*/
|
||||||
|
getBlogStatistics: () => {
|
||||||
|
return HttpHandler.Get(`/apis/api.halo.run/v1alpha1/stats/-`, {})
|
||||||
|
},
|
||||||
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 获取相册分组
|
* 获取相册分组
|
||||||
*/
|
*/
|
||||||
getPhotoGroupList: (params) => {
|
getPhotoGroupList: (params) => {
|
||||||
return HttpHandler.Get(`/apis/core.halo.run/v1alpha1/photogroups`, params, {
|
return HttpHandler.Get(`/apis/core.halo.run/v1alpha1/photogroups`, params, {
|
||||||
custom: {
|
custom: {
|
||||||
systemToken: HaloTokenConfig.systemToken
|
personalToken: getPersonalToken()
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 根据分组获取相册
|
* 根据分组获取相册
|
||||||
*/
|
*/
|
||||||
getPhotoListByGroupName: (params) => {
|
getPhotoListByGroupName: (params) => {
|
||||||
return HttpHandler.Get(`/apis/console.api.photo.halo.run/v1alpha1/photos`, params, {
|
return HttpHandler.Get(`/apis/console.api.photo.halo.run/v1alpha1/photos`, params, {
|
||||||
custom: {
|
custom: {
|
||||||
systemToken: HaloTokenConfig.systemToken
|
personalToken: getPersonalToken()
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 获取友链分组
|
* 获取友链分组
|
||||||
*/
|
*/
|
||||||
getFriendLinkGroupList: (params) => {
|
getFriendLinkGroupList: (params) => {
|
||||||
return HttpHandler.Get(`/apis/core.halo.run/v1alpha1/linkgroups`, params, {
|
return HttpHandler.Get(`/apis/core.halo.run/v1alpha1/linkgroups`, params, {
|
||||||
custom: {
|
custom: {
|
||||||
systemToken: HaloTokenConfig.systemToken
|
personalToken: getPersonalToken()
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 获取友链
|
* 获取友链
|
||||||
*/
|
*/
|
||||||
getFriendLinkList: (params) => {
|
getFriendLinkList: (params) => {
|
||||||
return HttpHandler.Get(`/apis/api.plugin.halo.run/v1alpha1/plugins/PluginLinks/links`, params)
|
return HttpHandler.Get(`/apis/api.plugin.halo.run/v1alpha1/plugins/PluginLinks/links`, params)
|
||||||
},
|
},
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 限制阅读校验
|
* 限制阅读校验
|
||||||
* @param restrictType
|
* @param restrictType
|
||||||
* @param code
|
* @param code
|
||||||
* @param keyId
|
* @param keyId
|
||||||
* @returns {HttpPromise<any>}
|
* @returns {HttpPromise<any>}
|
||||||
*/
|
*/
|
||||||
requestRestrictReadCheck: (restrictType, code, keyId) => {
|
requestRestrictReadCheck: (restrictType, code, keyId) => {
|
||||||
const params = {
|
const params = {
|
||||||
code: code,
|
code: code,
|
||||||
templateType: 'post',
|
templateType: 'post',
|
||||||
restrictType: restrictType,
|
restrictType: restrictType,
|
||||||
keyId: keyId
|
keyId: keyId
|
||||||
}
|
}
|
||||||
return HttpHandler.Post(`/apis/tools.muyin.site/v1alpha1/restrict-read/check`, params, {
|
return HttpHandler.Post(`/apis/tools.muyin.site/v1alpha1/restrict-read/check`, params, {
|
||||||
header: {
|
header: {
|
||||||
'Authorization': getAppConfigs().pluginConfig.toolsPlugin?.Authorization,
|
'Authorization': getAppConfigs().pluginConfig.toolsPlugin?.Authorization,
|
||||||
'Wechat-Session-Id': uni.getStorageSync('openid'),
|
'Wechat-Session-Id': uni.getStorageSync('openid'),
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 获取文章验证码
|
* 获取文章验证码
|
||||||
*/
|
*/
|
||||||
createVerificationCode: () => {
|
createVerificationCode: () => {
|
||||||
return HttpHandler.Get(`/apis/tools.muyin.site/v1alpha1/restrict-read/create`, null, {
|
return HttpHandler.Get(`/apis/tools.muyin.site/v1alpha1/restrict-read/create`, null, {
|
||||||
header: {
|
header: {
|
||||||
'Authorization': getAppConfigs().pluginConfig.toolsPlugin?.Authorization,
|
'Authorization': getAppConfigs().pluginConfig.toolsPlugin?.Authorization,
|
||||||
}
|
'Wechat-Session-Id': uni.getStorageSync('openid'),
|
||||||
})
|
}
|
||||||
},
|
})
|
||||||
|
},
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 提交友情链接
|
* 提交友情链接
|
||||||
*/
|
*/
|
||||||
submitLink(form) {
|
submitLink(form) {
|
||||||
return HttpHandler.Post(`/apis/linksSubmit.muyin.site/v1alpha1/submit`, form, {
|
return HttpHandler.Post(`/apis/linksSubmit.muyin.site/v1alpha1/submit`, form, {
|
||||||
header: {
|
header: {
|
||||||
'Authorization': getAppConfigs().pluginConfig.linksSubmitPlugin?.Authorization,
|
'Authorization': getAppConfigs().pluginConfig.linksSubmitPlugin?.Authorization,
|
||||||
'Wechat-Session-Id': uni.getStorageSync('openid'),
|
'Wechat-Session-Id': uni.getStorageSync('openid'),
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
/**
|
/**
|
||||||
* 获取二维码信息
|
* 获取二维码信息
|
||||||
*/
|
*/
|
||||||
getQRCodeInfo: (key) => {
|
getQRCodeInfo: (key) => {
|
||||||
return HttpHandler.Get(`/apis/api.uni.uhalo.pro/v1alpha1/plugins/plugin-uni-halo/getQRCodeInfo/${key}`,
|
return HttpHandler.Get(`/apis/api.uni.uhalo.pro/v1alpha1/plugins/plugin-uni-halo/getQRCodeInfo/${key}`,
|
||||||
null, {})
|
null, {})
|
||||||
},
|
},
|
||||||
/**
|
/**
|
||||||
* 获取二维码图片
|
* 获取二维码图片
|
||||||
*/
|
*/
|
||||||
getQRCodeImg: (postId) => {
|
getQRCodeImg: (postId) => {
|
||||||
return HttpHandler.Get(`/apis/api.uni.uhalo.pro/v1alpha1/plugins/plugin-uni-halo/getQRCodeImg/${postId}`,
|
return HttpHandler.Get(`/apis/api.uni.uhalo.pro/v1alpha1/plugins/plugin-uni-halo/getQRCodeImg/${postId}`,
|
||||||
null, {})
|
null, {})
|
||||||
},
|
},
|
||||||
/**
|
/**
|
||||||
* 点赞
|
* 点赞
|
||||||
* @param {*} data ={group, plural, name}
|
* @param {*} data ={group, plural, name}
|
||||||
*/
|
*/
|
||||||
submitUpvote(data) {
|
submitUpvote(data) {
|
||||||
return HttpHandler.Post(`/apis/api.halo.run/v1alpha1/trackers/upvote`, 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)
|
||||||
|
},
|
||||||
|
/**
|
||||||
|
* 获取投票详情
|
||||||
|
* @param {String} name id
|
||||||
|
*/
|
||||||
|
getVoteDetail: (name) => {
|
||||||
|
return HttpHandler.Get(`/apis/api.vote.kunkunyu.com/v1alpha1/votes/${name}/detail`, {})
|
||||||
|
},
|
||||||
|
/**
|
||||||
|
* 获取投票用户列表
|
||||||
|
* @param {String} name id
|
||||||
|
*/
|
||||||
|
getVoteUserList: (name) => {
|
||||||
|
return HttpHandler.Get(`/apis/api.vote.kunkunyu.com/v1alpha1/votes/${name}/user-list`, {})
|
||||||
|
},
|
||||||
|
/**
|
||||||
|
* 提交投票
|
||||||
|
* @param {String} name id
|
||||||
|
* @param {Object} { voteData:["选项ID"] } 提交的数据
|
||||||
|
* @param {Boolean} canAnonymously 是否匿名 默认匿名
|
||||||
|
*/
|
||||||
|
submitVote: (name, data, canAnonymously = true) => {
|
||||||
|
return HttpHandler.Post(`/apis/api.vote.kunkunyu.com/v1alpha1/votes/${name}/submit`, data, {
|
||||||
|
custom: {
|
||||||
|
personalToken: canAnonymously ? undefined : getPersonalToken()
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
/**
|
||||||
|
* 检查是否安装启用插件
|
||||||
|
* @param {String} name 插件id
|
||||||
|
*/
|
||||||
|
checkPluginAvailable: (name) => {
|
||||||
|
return HttpHandler.Get(`/apis/api.plugin.halo.run/v1alpha1/plugins/${name}/available`, {})
|
||||||
|
},
|
||||||
|
}
|
||||||
@@ -10,7 +10,7 @@
|
|||||||
* 修改时间:
|
* 修改时间:
|
||||||
*/
|
*/
|
||||||
|
|
||||||
import HaloTokenConfig from '@/config/token.config.js'
|
import HaloTokenConfig from '@/config/uhalo.config.js'
|
||||||
import {
|
import {
|
||||||
setInterceptors
|
setInterceptors
|
||||||
} from "./interceptors.js";
|
} from "./interceptors.js";
|
||||||
|
|||||||
+119
-135
@@ -9,149 +9,133 @@
|
|||||||
* 修改人员:
|
* 修改人员:
|
||||||
* 修改时间:
|
* 修改时间:
|
||||||
*/
|
*/
|
||||||
import {
|
import {delCache, setCache} from "@/utils/storage";
|
||||||
getAdminAccessToken
|
|
||||||
} from "@/utils/auth.js";
|
|
||||||
import {
|
|
||||||
delCache,
|
|
||||||
setCache
|
|
||||||
} from "@/utils/storage";
|
|
||||||
|
|
||||||
const getCategoryNameByUrl = (url) => {
|
const getCategoryNameByUrl = (url) => {
|
||||||
const reg = '(?<=/api/content/categories/).+(?=/posts)'
|
const reg = '(?<=/api/content/categories/).+(?=/posts)'
|
||||||
return url.match(reg)[0] || '无分类名'
|
return url.match(reg)[0] || '无分类名'
|
||||||
}
|
}
|
||||||
const showCategoryInputPasswordModal = (response, category) => {
|
const showCategoryInputPasswordModal = (response, category) => {
|
||||||
uni.showModal({
|
uni.showModal({
|
||||||
title: `[ ${category} ] 分类已加密`, // TODO 这里应该获取分类的名字,可以在弹窗之前请求后台拿到所有分类根据分类code拿到名称,但是不会在这之前发送请求
|
title: `[ ${category} ] 分类已加密`, // TODO 这里应该获取分类的名字,可以在弹窗之前请求后台拿到所有分类根据分类code拿到名称,但是不会在这之前发送请求
|
||||||
content: '',
|
content: '',
|
||||||
editable: true,
|
editable: true,
|
||||||
placeholderText: '请输入分类密码后访问',
|
placeholderText: '请输入分类密码后访问',
|
||||||
confirmText: '验证密码',
|
confirmText: '验证密码',
|
||||||
cancelText: '暂不访问',
|
cancelText: '暂不访问',
|
||||||
showCancel: true,
|
showCancel: true,
|
||||||
cancelColor: '#999999',
|
cancelColor: '#999999',
|
||||||
confirmColor: '#03a9f4',
|
confirmColor: '#03a9f4',
|
||||||
success: (res) => {
|
success: (res) => {
|
||||||
if (res.confirm) {
|
if (res.confirm) {
|
||||||
// TODO 这里如果没有输入密码点击确认应该阻止窗口关闭,但是没找到方法
|
// TODO 这里如果没有输入密码点击确认应该阻止窗口关闭,但是没找到方法
|
||||||
if (!res.content) {
|
if (!res.content) {
|
||||||
uni.showToast({
|
uni.showToast({
|
||||||
title: '提示:请输入密码',
|
title: '提示:请输入密码', icon: 'none', success: () => {
|
||||||
icon: 'none',
|
setTimeout(() => {
|
||||||
success: () => {
|
showCategoryInputPasswordModal(response, category);
|
||||||
setTimeout(() => {
|
}, 800)
|
||||||
showCategoryInputPasswordModal(response, category);
|
}
|
||||||
}, 800)
|
})
|
||||||
}
|
return;
|
||||||
})
|
}
|
||||||
return;
|
// 根据请求URL正则匹配分类code,然后把输入的密码根据分类code放入缓存,然后在category.getCategoryPostList中获取,解决多个分类加密输入密码后点错的问题
|
||||||
}
|
// 目前存在一个问题,比如前两个都需要密码,如果先输入第二个的密码之后,重新进来默认打开第一个还会弹窗,所以想在弹窗标题上增加分类名字
|
||||||
// 根据请求URL正则匹配分类code,然后把输入的密码根据分类code放入缓存,然后在category.getCategoryPostList中获取,解决多个分类加密输入密码后点错的问题
|
// 另外有以下两种方式科技解决
|
||||||
// 目前存在一个问题,比如前两个都需要密码,如果先输入第二个的密码之后,重新进来默认打开第一个还会弹窗,所以想在弹窗标题上增加分类名字
|
// TODO 1.其实这里获取到密码之后可以直接发送一个请求追加上password参数,因为后台会缓存权限,后续不输入密码也可以访问,可惜不会
|
||||||
// 另外有以下两种方式科技解决
|
// TODO 2.另外也可以拿到密码之后,直接选中该分类追加password参数,重新请求,可惜也不会
|
||||||
// TODO 1.其实这里获取到密码之后可以直接发送一个请求追加上password参数,因为后台会缓存权限,后续不输入密码也可以访问,可惜不会
|
setCache('APP_CATEGORY_PWD_' + category, res.content)
|
||||||
// TODO 2.另外也可以拿到密码之后,直接选中该分类追加password参数,重新请求,可惜也不会
|
uni.reLaunch({
|
||||||
setCache('APP_CATEGORY_PWD_' + category, res.content)
|
url: '/pages/tabbar/category/category'
|
||||||
uni.reLaunch({
|
});
|
||||||
url: '/pages/tabbar/category/category'
|
} else if (res.cancel) {
|
||||||
});
|
}
|
||||||
} else if (res.cancel) {}
|
},
|
||||||
},
|
})
|
||||||
})
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export const setInterceptors = (http) => {
|
export const setInterceptors = (http) => {
|
||||||
http.interceptors.request.use(
|
http.interceptors.request.use((config) => {
|
||||||
(config) => {
|
console.log("config", config)
|
||||||
console.log("config", config)
|
|
||||||
|
|
||||||
// 可使用async await 做异步操作
|
// 可使用async await 做异步操作
|
||||||
config.header = {
|
config.header = {
|
||||||
...config.header
|
...config.header
|
||||||
// ... 可以直接加参数
|
// ... 可以直接加参数
|
||||||
};
|
};
|
||||||
if (config.custom.systemToken) {
|
if (config.custom.personalToken) {
|
||||||
config.header['Authorization'] = `Bearer ${config.custom.systemToken}`
|
config.header['Authorization'] = `Bearer ${config.custom.personalToken}`
|
||||||
}
|
}
|
||||||
return config;
|
return config;
|
||||||
},
|
}, (config) => {
|
||||||
(config) => {
|
// 可使用async await 做异步操作
|
||||||
// 可使用async await 做异步操作
|
return Promise.reject(config);
|
||||||
return Promise.reject(config);
|
});
|
||||||
}
|
|
||||||
);
|
|
||||||
|
|
||||||
http.interceptors.response.use(
|
http.interceptors.response.use((response) => {
|
||||||
(response) => {
|
/* 对响应成功做点什么 可使用async await 做异步操作*/
|
||||||
/* 对响应成功做点什么 可使用async await 做异步操作*/
|
// if (response.data.code !== 200) { // 服务端返回的状态码不等于200,则reject()
|
||||||
// if (response.data.code !== 200) { // 服务端返回的状态码不等于200,则reject()
|
// return Promise.reject(response) // return Promise.reject 可使promise状态进入catch
|
||||||
// return Promise.reject(response) // return Promise.reject 可使promise状态进入catch
|
// if (response.config.custom.verification) { // 演示自定义参数的作用
|
||||||
// if (response.config.custom.verification) { // 演示自定义参数的作用
|
// return response.data
|
||||||
// return response.data
|
// }
|
||||||
// }
|
|
||||||
|
|
||||||
if (response.statusCode == 200) {
|
if (response.statusCode == 200) {
|
||||||
return response.data;
|
return response.data;
|
||||||
} else {
|
} else {
|
||||||
return Promise.reject(response);
|
return Promise.reject(response);
|
||||||
}
|
}
|
||||||
},
|
}, (response) => {
|
||||||
(response) => {
|
/* 对响应错误做点什么 (statusCode !== 200)*/
|
||||||
/* 对响应错误做点什么 (statusCode !== 200)*/
|
if (!response.data) {
|
||||||
if (!response.data) {
|
return Promise.reject({
|
||||||
return Promise.reject({
|
status: 500, message: 'API接口服务异常!'
|
||||||
status: 500,
|
})
|
||||||
message: 'API接口服务异常!'
|
} else if (response.data.status == 401) {
|
||||||
})
|
uni.$tm.toast(response.data.message);
|
||||||
} else if (response.data.status == 401) {
|
// 如果是请求分类之后报401说明密码错误,那么清除该密码,下次点击会报403弹窗再次输入密码
|
||||||
uni.$tm.toast(response.data.message);
|
if (response.config.url.indexOf('/api/content/categories') >= 0) {
|
||||||
// 如果是请求分类之后报401说明密码错误,那么清除该密码,下次点击会报403弹窗再次输入密码
|
const category = getCategoryNameByUrl(response.config.url)
|
||||||
if (response.config.url.indexOf('/api/content/categories') >= 0) {
|
delCache('APP_CATEGORY_PWD_' + category);
|
||||||
const category = getCategoryNameByUrl(response.config.url)
|
uni.showToast({
|
||||||
delCache('APP_CATEGORY_PWD_' + category);
|
title: '提示:密码不正确', icon: 'none', success: () => {
|
||||||
uni.showToast({
|
setTimeout(() => {
|
||||||
title: '提示:密码不正确',
|
showCategoryInputPasswordModal(response, category);
|
||||||
icon: 'none',
|
}, 800)
|
||||||
success: () => {
|
}
|
||||||
setTimeout(() => {
|
})
|
||||||
showCategoryInputPasswordModal(response, category);
|
} else {
|
||||||
}, 800)
|
// 其他情况维持原来的逻辑
|
||||||
}
|
delCache('APP_ADMIN_LOGIN_TOKEN');
|
||||||
})
|
uni.$eShowModal({
|
||||||
} else {
|
title: '提示',
|
||||||
// 其他情况维持原来的逻辑
|
content: '您未登录超管账号或登录已过期,是否重新登录?',
|
||||||
delCache('APP_ADMIN_LOGIN_TOKEN');
|
showCancel: true,
|
||||||
uni.$eShowModal({
|
cancelText: '否',
|
||||||
title: '提示',
|
cancelColor: '#999999',
|
||||||
content: '您未登录超管账号或登录已过期,是否重新登录?',
|
confirmText: '是',
|
||||||
showCancel: true,
|
confirmColor: '#03a9f4'
|
||||||
cancelText: '否',
|
}).then(res => {
|
||||||
cancelColor: '#999999',
|
uni.navigateTo({
|
||||||
confirmText: '是',
|
url: '/pagesB/login/login'
|
||||||
confirmColor: '#03a9f4'
|
})
|
||||||
}).then(res => {
|
}).catch(err => {
|
||||||
uni.navigateTo({
|
uni.switchTab({
|
||||||
url: '/pagesB/login/login'
|
url: '/pages/tabbar/about/about'
|
||||||
})
|
})
|
||||||
}).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) {
|
||||||
return Promise.reject(response.data);
|
const category = getCategoryNameByUrl(response.config.url);
|
||||||
} else if (response.data.status == 403) {
|
showCategoryInputPasswordModal(response, category);
|
||||||
// 如果报403是请求分类文章接口(您没有该分类的访问权限)的话说明是私密分类,需要输入密码请求
|
}
|
||||||
if (response.config.url.indexOf('/api/content/categories') >= 0) {
|
return Promise.reject(response.data);
|
||||||
const category = getCategoryNameByUrl(response.config.url);
|
} else {
|
||||||
showCategoryInputPasswordModal(response, category);
|
return Promise.reject(response.data);
|
||||||
}
|
}
|
||||||
return Promise.reject(response.data);
|
|
||||||
} else {
|
|
||||||
return Promise.reject(response.data);
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
});
|
||||||
);
|
};
|
||||||
};
|
|
||||||
|
|||||||
@@ -3,7 +3,7 @@
|
|||||||
*/
|
*/
|
||||||
|
|
||||||
import {getAppConfigs} from '@/config/index.js'
|
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'
|
import utils from '@/utils/index.js'
|
||||||
|
|
||||||
export default {
|
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;
|
display: flex;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
margin: 0 24rpx;
|
margin: 0 24rpx;
|
||||||
padding: 24rpx;
|
padding:22rpx 24rpx;
|
||||||
border-radius: 12rpx;
|
border-radius: 12rpx;
|
||||||
background-color: #ffff;
|
background-color: #ffff;
|
||||||
box-shadow: 0rpx 2rpx 24rpx rgba(0, 0, 0, 0.03);
|
box-shadow: 0rpx 2rpx 24rpx rgba(0, 0, 0, 0.03);
|
||||||
|
|||||||
@@ -1,220 +1,222 @@
|
|||||||
<template>
|
<template>
|
||||||
<view class="article-min-card" :class="[globalAppSettings.layout.cardType]" @click="fnClickEvent('card')">
|
<view class="article-min-card" @click="fnClickEvent('card')">
|
||||||
<view class="left">
|
<view class="left">
|
||||||
<cache-image class="thumbnail" radius="6rpx" :url="$utils.checkThumbnailUrl(article.thumbnail)" :fileMd5="$utils.checkThumbnailUrl(article.thumbnail)" mode="aspectFill"></cache-image>
|
<cache-image class="thumbnail" radius="6rpx" :url="$utils.checkThumbnailUrl(article.spec.cover)" :fileMd5="article.spec.cover"
|
||||||
</view>
|
mode="aspectFill"></cache-image>
|
||||||
<view class="right">
|
</view>
|
||||||
<view class="title text-overflow">{{ article.title }}</view>
|
<view class="right">
|
||||||
<view class="content text-overflow">{{ article.summary }}</view>
|
<view class="title text-overflow">{{ article.spec.title }}</view>
|
||||||
<view class="foot">
|
<view class="content text-overflow">{{ article.status.excerpt }}</view>
|
||||||
<view class="create-time">
|
<view class="foot">
|
||||||
<!-- <text class="icon iconfont icon-clock"></text> -->
|
<view class="create-time">
|
||||||
<text class="time-label">发布时间:</text>
|
<text class="time-label">发布时间:</text>
|
||||||
{{ { d: article.createTime, f: 'yyyy-MM-dd' } | formatTime }}
|
{{ {d: article.spec.publishTime, f: 'yyyy-MM-dd'} | formatTime }}
|
||||||
</view>
|
</view>
|
||||||
<view class="visits">
|
<view class="visits">
|
||||||
<!-- <text class="icon iconfont icon-eye"></text> -->
|
浏览
|
||||||
浏览
|
<text class="number">{{ article.stats.visit }}</text>
|
||||||
<text class="number">{{ article.visits }}</text>
|
次
|
||||||
次
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
export default {
|
export default {
|
||||||
name: 'article-min-card',
|
name: 'article-min-card',
|
||||||
props: {
|
props: {
|
||||||
article: {
|
article: {
|
||||||
type: Object,
|
type: Object,
|
||||||
default: () => {}
|
default: () => {
|
||||||
}
|
}
|
||||||
},
|
}
|
||||||
methods: {
|
},
|
||||||
fnClickEvent() {
|
methods: {
|
||||||
this.$emit('on-click', this.article);
|
fnClickEvent() {
|
||||||
}
|
this.$emit('on-click', this.article);
|
||||||
}
|
}
|
||||||
};
|
}
|
||||||
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped lang="scss">
|
<style scoped lang="scss">
|
||||||
.article-min-card {
|
.article-min-card {
|
||||||
display: flex;
|
display: flex;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
border-radius: 12rpx;
|
border-radius: 12rpx;
|
||||||
background-color: #ffff;
|
background-color: #ffff;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
margin: 12rpx 24rpx;
|
margin: 12rpx 24rpx;
|
||||||
margin-bottom: 24rpx;
|
margin-bottom: 24rpx;
|
||||||
padding: 16rpx;
|
padding: 16rpx;
|
||||||
box-shadow: 0rpx 2rpx 24rpx rgba(0, 0, 0, 0.03);
|
box-shadow: 0rpx 2rpx 24rpx rgba(0, 0, 0, 0.03);
|
||||||
|
|
||||||
&.lr_image_text {}
|
&.lr_image_text {
|
||||||
|
}
|
||||||
|
|
||||||
&.lr_text_image {
|
&.lr_text_image {
|
||||||
.left {
|
.left {
|
||||||
order: 2;
|
order: 2;
|
||||||
padding-left: 30rpx;
|
padding-left: 30rpx;
|
||||||
}
|
}
|
||||||
|
|
||||||
.right {
|
.right {
|
||||||
order: 1;
|
order: 1;
|
||||||
padding-left: 0;
|
padding-left: 0;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
&.tb_image_text {
|
&.tb_image_text {
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
|
|
||||||
.left {
|
.left {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 220rpx;
|
height: 220rpx;
|
||||||
}
|
}
|
||||||
|
|
||||||
.right {
|
.right {
|
||||||
padding-left: 0;
|
padding-left: 0;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
|
||||||
.title {
|
.title {
|
||||||
margin-top: 24rpx;
|
margin-top: 24rpx;
|
||||||
}
|
}
|
||||||
|
|
||||||
.foot {
|
.foot {
|
||||||
justify-content: flex-start;
|
justify-content: flex-start;
|
||||||
|
|
||||||
.create-time {
|
.create-time {
|
||||||
.time-label {
|
.time-label {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.visits {
|
.visits {
|
||||||
margin-left: 24rpx;
|
margin-left: 24rpx;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
&.tb_text_image {
|
&.tb_text_image {
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
|
|
||||||
.left {
|
.left {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 220rpx;
|
height: 220rpx;
|
||||||
order: 2;
|
order: 2;
|
||||||
margin-top: 20rpx;
|
margin-top: 20rpx;
|
||||||
}
|
}
|
||||||
|
|
||||||
.right {
|
.right {
|
||||||
padding-left: 0;
|
padding-left: 0;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
order: 1;
|
order: 1;
|
||||||
|
|
||||||
.foot {
|
.foot {
|
||||||
justify-content: flex-start;
|
justify-content: flex-start;
|
||||||
|
|
||||||
.create-time {
|
.create-time {
|
||||||
.time-label {
|
.time-label {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.visits {
|
.visits {
|
||||||
margin-left: 24rpx;
|
margin-left: 24rpx;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
&.only_text {
|
&.only_text {
|
||||||
.left {
|
.left {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
.right {
|
.right {
|
||||||
padding-left: 0;
|
padding-left: 0;
|
||||||
|
|
||||||
.foot {
|
.foot {
|
||||||
justify-content: flex-start;
|
justify-content: flex-start;
|
||||||
|
|
||||||
.create-time {
|
.create-time {
|
||||||
.time-label {
|
.time-label {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.visits {
|
.visits {
|
||||||
margin-left: 24rpx;
|
margin-left: 24rpx;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.left {
|
.left {
|
||||||
width: 180rpx;
|
width: 180rpx;
|
||||||
height: 130rpx;
|
height: 130rpx;
|
||||||
|
|
||||||
.thumbnail {
|
.thumbnail {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
border-radius: 12rpx;
|
border-radius: 12rpx;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.right {
|
.right {
|
||||||
width: 0;
|
width: 0;
|
||||||
flex-grow: 1;
|
flex-grow: 1;
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
padding-left: 20rpx;
|
padding-left: 20rpx;
|
||||||
|
|
||||||
.title {
|
.title {
|
||||||
font-size: 28rpx;
|
font-size: 28rpx;
|
||||||
font-weight: 600;
|
font-weight: 600;
|
||||||
color: var(--main-text-color);
|
color: var(--main-text-color);
|
||||||
}
|
}
|
||||||
|
|
||||||
.content {
|
.content {
|
||||||
font-size: 26rpx;
|
font-size: 26rpx;
|
||||||
color: #909399;
|
color: #909399;
|
||||||
margin-top: 14rpx;
|
margin-top: 14rpx;
|
||||||
}
|
}
|
||||||
|
|
||||||
.foot {
|
.foot {
|
||||||
display: flex;
|
display: flex;
|
||||||
font-size: 24rpx;
|
font-size: 24rpx;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
color: #909399;
|
color: #909399;
|
||||||
margin-top: 14rpx;
|
margin-top: 14rpx;
|
||||||
|
|
||||||
.create-time {
|
.create-time {
|
||||||
font-size: 24rpx;
|
font-size: 24rpx;
|
||||||
|
|
||||||
.time-label {
|
.time-label {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
.icon {
|
.icon {
|
||||||
font-size: 24rpx;
|
font-size: 24rpx;
|
||||||
padding-right: 4rpx;
|
padding-right: 4rpx;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.visits {
|
.visits {
|
||||||
.icon {
|
.icon {
|
||||||
font-size: 28rpx;
|
font-size: 28rpx;
|
||||||
}
|
}
|
||||||
|
|
||||||
.number {
|
.number {
|
||||||
padding: 0 6rpx;
|
padding: 0 6rpx;
|
||||||
font-size: 24rpx;
|
font-size: 24rpx;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</style>
|
|
||||||
|
</style>
|
||||||
|
|||||||
@@ -0,0 +1,605 @@
|
|||||||
|
<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 v-if="vote.spec.type==='single'" color="light-blue" :shadow="0" rounded size="s"
|
||||||
|
model="fill">单选</tm-tags>
|
||||||
|
<tm-tags v-else-if="vote.spec.type==='multiple'" color="light-blue" :shadow="0" rounded size="s"
|
||||||
|
model="fill">多选</tm-tags>
|
||||||
|
<tm-tags v-else-if="vote.spec.type==='pk'" color="light-blue" :shadow="0" rounded size="s"
|
||||||
|
model="fill">双选PK</tm-tags>
|
||||||
|
|
||||||
|
<tm-tags v-if="vote.spec._state=='已结束'" color="red" size="s" rounded :shadow="0"
|
||||||
|
model="fill">已结束</tm-tags>
|
||||||
|
<tm-tags v-else-if="vote.spec._state=='未开始'" color="orange" size="s" rounded :shadow="0"
|
||||||
|
model="fill">未开始</tm-tags>
|
||||||
|
<tm-tags v-else-if="vote.spec._state=='进行中'" color="green" size="s" rounded :shadow="0"
|
||||||
|
model="fill">进行中</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">
|
||||||
|
<view v-for="(option,optionIndex) in vote.spec.options" :key="optionIndex"
|
||||||
|
class="is-voted-item" :class="[option.checked?'selected':'']" :style="{
|
||||||
|
'--percent': option.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.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">
|
||||||
|
<view v-for="(option,optionIndex) in vote.spec.options" :key="optionIndex"
|
||||||
|
class="is-voted-item" :class="[option.checked?'selected':'']" :style="{
|
||||||
|
'--percent': option.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.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.percent + '%'}">
|
||||||
|
<view class="option-item"
|
||||||
|
:class="[optionIndex==0?'option-item-left':'option-item-right']">
|
||||||
|
{{option.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">
|
||||||
|
<view v-for="(option,optionIndex) in vote.spec.options" :key="optionIndex"
|
||||||
|
class="is-voted-item" :class="[option.checked?'selected':'']" :style="{
|
||||||
|
'--percent': option.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.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="!vote.spec.canAnonymously" theme="red" :shadow="0" class="w-full" text :block="true"
|
||||||
|
:height="72" @click="handleSubmit()">不支持匿名投票(点击)</tm-button>
|
||||||
|
<tm-button v-else-if="fnCalcIsVoted()" theme="white" text :block="true" :height="72"
|
||||||
|
class="w-full">您已参与投票</tm-button>
|
||||||
|
<tm-button v-else theme="light-blue" class="w-full" :block="true" :height="72"
|
||||||
|
@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 {
|
||||||
|
voteCacheUtil
|
||||||
|
} from '@/utils/vote.js'
|
||||||
|
|
||||||
|
const types = {
|
||||||
|
"pk": "双选PK",
|
||||||
|
"multiple": "多选",
|
||||||
|
"single": "单选"
|
||||||
|
}
|
||||||
|
|
||||||
|
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: []
|
||||||
|
},
|
||||||
|
}
|
||||||
|
},
|
||||||
|
created() {
|
||||||
|
this.fnGetData();
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
fnGetData() {
|
||||||
|
this.loadingText = "加载中,请稍等...";
|
||||||
|
this.loading = "loading";
|
||||||
|
this.$httpApi.v2
|
||||||
|
.getVoteDetail(this.voteId)
|
||||||
|
.then(res => {
|
||||||
|
this.pageTitle = "投票详情" + `(${types[res.vote.spec.type]})`
|
||||||
|
|
||||||
|
const tempVoteRes = res;
|
||||||
|
|
||||||
|
tempVoteRes.vote.spec.isVoted = this.fnCalcIsVoted()
|
||||||
|
tempVoteRes.vote.spec.disabled = this.fnCalcIsVoted()
|
||||||
|
tempVoteRes.vote.spec._state = this.handleCalcVoteState(tempVoteRes.vote)
|
||||||
|
|
||||||
|
tempVoteRes.vote.spec.options.map((option, index) => {
|
||||||
|
option.value = option.id
|
||||||
|
option.label = option.title
|
||||||
|
option.isVoted = this.fnCalcIsVoted()
|
||||||
|
option.checked = this.fnCalcIsChecked(option)
|
||||||
|
|
||||||
|
if (tempVoteRes.vote.spec.type === 'single') {
|
||||||
|
option.percent = this.fnCalcPercent(option, tempVoteRes.vote.stats);
|
||||||
|
} else if (tempVoteRes.vote.spec.type === 'multiple') {
|
||||||
|
option.percent = this.fnCalcPercent(option, tempVoteRes.vote.stats);
|
||||||
|
} else if (tempVoteRes.vote.spec.type === 'pk') {
|
||||||
|
option.percent = this.fnCalcPercent(option, tempVoteRes.vote.stats);
|
||||||
|
}
|
||||||
|
|
||||||
|
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 = "投票内容加载失败,点击重试"
|
||||||
|
})
|
||||||
|
},
|
||||||
|
fnCalcPercent(voteOption, stats) {
|
||||||
|
if (!this.fnCalcIsVoted()) return 0;
|
||||||
|
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() {
|
||||||
|
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
|
||||||
|
},
|
||||||
|
handleCalcVoteState(vote) {
|
||||||
|
if (vote.spec.timeLimit !== 'custom') {
|
||||||
|
return vote.spec.hasEnd ? "已结束" : "进行中"
|
||||||
|
}
|
||||||
|
|
||||||
|
const nowTime = new Date().getTime()
|
||||||
|
const startTime = new Date(vote.spec.startDate).getTime()
|
||||||
|
const endTime = new Date(vote.spec.endDate).getTime()
|
||||||
|
|
||||||
|
if (nowTime < startTime) {
|
||||||
|
return "未开始"
|
||||||
|
}
|
||||||
|
if (nowTime < endTime) {
|
||||||
|
return "进行中"
|
||||||
|
}
|
||||||
|
return vote.spec.hasEnd ? "已结束" : "进行中"
|
||||||
|
},
|
||||||
|
formatJsonStr(jsonStr) {
|
||||||
|
return jsonStr ? JSON.parse(jsonStr) : {}
|
||||||
|
},
|
||||||
|
handleSubmitTip() {
|
||||||
|
uni.showToast({
|
||||||
|
icon: "none",
|
||||||
|
title: "请选择选项后继续"
|
||||||
|
})
|
||||||
|
},
|
||||||
|
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.$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: "提交失败,请重试"
|
||||||
|
})
|
||||||
|
})
|
||||||
|
},
|
||||||
|
|
||||||
|
handleSelectSingleOption(option) {
|
||||||
|
if (this.vote.spec._state == '未开始') {
|
||||||
|
this.showToast(`投票未开始`)
|
||||||
|
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._state == '未开始') {
|
||||||
|
this.showToast(`投票未开始`)
|
||||||
|
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;
|
top: 0;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
background-color: rgba(0, 0, 0, 0.5);
|
background-color: rgba(0, 0, 0, 0.25);
|
||||||
backdrop-filter: blur(3rpx);
|
backdrop-filter: blur(3rpx);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -43,7 +43,7 @@
|
|||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<view class="right-hot-ttf">
|
<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>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
@@ -63,7 +63,7 @@
|
|||||||
</view>
|
</view>
|
||||||
<!-- 标题 -->
|
<!-- 标题 -->
|
||||||
<view class="Top-Title">
|
<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>
|
||||||
<!-- 用户信息 -->
|
<!-- 用户信息 -->
|
||||||
<view v-if="false" class="Bottom-UserInfo">
|
<view v-if="false" class="Bottom-UserInfo">
|
||||||
@@ -217,4 +217,4 @@
|
|||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
@import './e-swiper.scss';
|
@import './e-swiper.scss';
|
||||||
</style>
|
</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>
|
||||||
@@ -0,0 +1,343 @@
|
|||||||
|
<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 v-if="vote.spec.type==='single'" color="light-blue" :shadow="0" rounded size="s"
|
||||||
|
model="fill">单选</tm-tags>
|
||||||
|
<tm-tags v-else-if="vote.spec.type==='multiple'" color="light-blue" :shadow="0" rounded size="s"
|
||||||
|
model="fill">多选</tm-tags>
|
||||||
|
<tm-tags v-else-if="vote.spec.type==='pk'" color="light-blue" :shadow="0" rounded size="s"
|
||||||
|
model="fill">双选PK</tm-tags>
|
||||||
|
</view>
|
||||||
|
<view class="title text-overflow">
|
||||||
|
{{ vote.spec.title }}
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view v-if="false" class="flex-shrink right flex flex-end">
|
||||||
|
<tm-tags v-if="vote.spec.hasEnded" color="red" rounded :shadow="0" size="s" model="text">已结束</tm-tags>
|
||||||
|
<tm-tags v-else color="green" rounded size="s" :shadow="0" model="text">进行中</tm-tags>
|
||||||
|
</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>
|
||||||
|
|
||||||
|
<template v-if="showOptions">
|
||||||
|
<!-- 单选 -->
|
||||||
|
<view v-if="vote.spec.type==='single'" class="single">
|
||||||
|
<tm-groupradio @change="onOptionRadioChange">
|
||||||
|
<tm-radio v-for="(option,optionIndex) in vote.spec.options" :key="optionIndex" dense
|
||||||
|
:disabled="vote.spec.disabled" v-model="option.checked" :extendData="option">
|
||||||
|
<template v-slot:default="{checkData}">
|
||||||
|
<tm-button :shadow="0" :theme="checkData.checked?'light-blue':'grey-lighten-3'"
|
||||||
|
:plan="false" :block="true" class="w-full" size="m" :height="72">
|
||||||
|
<view class="flex flex-between w-full">
|
||||||
|
<text class="text-align-left text-overflow"> {{ checkData.extendData.title }}
|
||||||
|
</text>
|
||||||
|
<text class="flex-shrink"> {{checkData.extendData.percent }}% </text>
|
||||||
|
</view>
|
||||||
|
</tm-button>
|
||||||
|
</template>
|
||||||
|
</tm-radio>
|
||||||
|
</tm-groupradio>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- 多选 -->
|
||||||
|
<view v-else-if="vote.spec.type==='multiple'" class="multiple">
|
||||||
|
<tm-groupcheckbox @change="onOptionCheckboxChange">
|
||||||
|
<tm-checkbox v-for="(option,optionIndex) in vote.spec.options" :key="optionIndex" dense
|
||||||
|
:disabled="vote.spec.disabled" v-model="option.checked" :extendData="option">
|
||||||
|
<template v-slot:default="{checkData}">
|
||||||
|
<tm-button :shadow="0" :theme="checkData.checked?'light-blue':'grey-lighten-3'"
|
||||||
|
:plan="false" :block="true" class="w-full" size="m" :height="72">
|
||||||
|
<view class="flex flex-between w-full">
|
||||||
|
<text class="text-align-left text-overflow"> {{ checkData.extendData.title }}
|
||||||
|
</text>
|
||||||
|
<text class="flex-shrink"> {{checkData.extendData.percent }}% </text>
|
||||||
|
</view>
|
||||||
|
</tm-button>
|
||||||
|
</template>
|
||||||
|
</tm-checkbox>
|
||||||
|
</tm-groupcheckbox>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- PK -->
|
||||||
|
<view v-else-if="vote.spec.type==='pk'" class="pk">
|
||||||
|
<tm-groupradio @change="onOptionPkChange">
|
||||||
|
<tm-radio v-for="(option,optionIndex) in vote.spec.options" :key="optionIndex" dense
|
||||||
|
:disabled="vote.spec.disabled" v-model="option.checked" :extendData="option"
|
||||||
|
class="radio-item" :class="[optionIndex==0?'radio-left':'radio-right']"
|
||||||
|
:style="{width:option.percent + '%'}">
|
||||||
|
<template v-slot:default="{checkData}">
|
||||||
|
<view class="option-item"
|
||||||
|
:class="[optionIndex==0?'option-item-left':'option-item-right']">
|
||||||
|
{{checkData.extendData.percent }}%
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
</tm-radio>
|
||||||
|
</tm-groupradio>
|
||||||
|
<view class="option-foot w-full flex flex-between">
|
||||||
|
<view v-for="(option,optionIndex) in vote.spec.options" :key="optionIndex">
|
||||||
|
<view v-if="optionIndex==0" class="left flex-1 flex-shrink text-overflow">
|
||||||
|
{{option.title}}
|
||||||
|
</view>
|
||||||
|
<view v-else class="right flex-1 flex-shrink text-overflow text-align-right">
|
||||||
|
{{option.title}}
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
</view>
|
||||||
|
<view class="vote-card-foot flex flex-between">
|
||||||
|
<view class="left flex">
|
||||||
|
<tm-tags v-if="vote.spec._state=='已结束'" color="red" size="s" rounded :shadow="0"
|
||||||
|
model="text">已结束</tm-tags>
|
||||||
|
<tm-tags v-else-if="vote.spec._state=='未开始'" color="orange" size="s" rounded :shadow="0"
|
||||||
|
model="text">未开始</tm-tags>
|
||||||
|
<tm-tags v-else-if="vote.spec._state=='进行中'" color="green" size="s" rounded :shadow="0"
|
||||||
|
model="text">进行中</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._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
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
onOptionRadioChange(e) {
|
||||||
|
console.log("onOptionRadioChange", e)
|
||||||
|
},
|
||||||
|
onOptionCheckboxChange(e) {
|
||||||
|
console.log("onOptionCheckboxChange", e)
|
||||||
|
},
|
||||||
|
onOptionPkChange(e) {
|
||||||
|
console.log("onOptionPkChange", e)
|
||||||
|
},
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</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>
|
||||||
+37
-2
@@ -4,12 +4,47 @@ export const _AppMockJsonKey = 'APP_GLOBAL_MOCK_JSON';
|
|||||||
|
|
||||||
// 默认的应用设置
|
// 默认的应用设置
|
||||||
export const DefaultAppConfigs = {
|
export const DefaultAppConfigs = {
|
||||||
|
basicConfig: {
|
||||||
|
tokenConfig: {
|
||||||
|
personalToken: "",
|
||||||
|
}
|
||||||
|
},
|
||||||
loveConfig: {},
|
loveConfig: {},
|
||||||
imagesConfig: {},
|
imagesConfig: {},
|
||||||
authorConfig: {},
|
authorConfig: {},
|
||||||
appConfig: {},
|
appConfig: {},
|
||||||
pluginConfig: {},
|
pluginConfig: {
|
||||||
pageConfig: {}
|
toolsPlugin: {},
|
||||||
|
linksSubmitPlugin: {},
|
||||||
|
},
|
||||||
|
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: ""
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
|||||||
@@ -1,18 +0,0 @@
|
|||||||
import {getAppConfigs} from "@/config/index";
|
|
||||||
|
|
||||||
/** 配置后台管理员token */
|
|
||||||
const HaloTokenConfig = Object.freeze({
|
|
||||||
|
|
||||||
/** 基础请求域名:你的Halo博客基础域名 */
|
|
||||||
BASE_API: "",
|
|
||||||
// BASE_API: "https://blog.xiaoxiaomo.cn",
|
|
||||||
|
|
||||||
|
|
||||||
/** 管理员token */
|
|
||||||
systemToken: getAppConfigs()?.basicConfig?.tokenConfig?.personalToken,
|
|
||||||
/** 匿名用户token */
|
|
||||||
anonymousToken: ``
|
|
||||||
})
|
|
||||||
|
|
||||||
|
|
||||||
export default HaloTokenConfig;
|
|
||||||
@@ -0,0 +1,12 @@
|
|||||||
|
/** 应用基础配置 */
|
||||||
|
const UHaloBaseConfig = Object.freeze({
|
||||||
|
|
||||||
|
/** 基础请求域名:你的Halo博客基础域名 */
|
||||||
|
BASE_API: "",
|
||||||
|
// 示例:
|
||||||
|
// BASE_API: "https://blog.xiaoxiaomo.cn",
|
||||||
|
|
||||||
|
// todo:可能有其他配置
|
||||||
|
})
|
||||||
|
|
||||||
|
export default UHaloBaseConfig;
|
||||||
@@ -4,6 +4,7 @@ import Vue from "vue";
|
|||||||
// 挂载全局工具类
|
// 挂载全局工具类
|
||||||
import utils from "./utils/index.js";
|
import utils from "./utils/index.js";
|
||||||
Vue.prototype.$utils = utils;
|
Vue.prototype.$utils = utils;
|
||||||
|
uni.$utils = utils;
|
||||||
|
|
||||||
// 全局统一样式的对话框
|
// 全局统一样式的对话框
|
||||||
import Fy from '@/js_sdk/fy-showModal/index.js'
|
import Fy from '@/js_sdk/fy-showModal/index.js'
|
||||||
@@ -57,7 +58,7 @@ Vue.prototype.$http = http;
|
|||||||
import ApiManager from '@/api/index.js'
|
import ApiManager from '@/api/index.js'
|
||||||
Vue.use(ApiManager);
|
Vue.use(ApiManager);
|
||||||
|
|
||||||
import HaloTokenConfig from '@/config/token.config.js'
|
import HaloTokenConfig from '@/config/uhalo.config.js'
|
||||||
Vue.prototype.$baseApiUrl = HaloTokenConfig.BASE_API
|
Vue.prototype.$baseApiUrl = HaloTokenConfig.BASE_API
|
||||||
|
|
||||||
// 由于微信小程序的运行机制问题,需声明如下一行,H5和APP非必填
|
// 由于微信小程序的运行机制问题,需声明如下一行,H5和APP非必填
|
||||||
|
|||||||
+31
-16
@@ -2,8 +2,8 @@
|
|||||||
"name" : "uni-halo",
|
"name" : "uni-halo",
|
||||||
"appid" : "__UNI__5748B6E",
|
"appid" : "__UNI__5748B6E",
|
||||||
"description" : "uni-halo博客:基于halo开源博客系统API开发的多端博客。",
|
"description" : "uni-halo博客:基于halo开源博客系统API开发的多端博客。",
|
||||||
"versionName" : "1.0.0",
|
"versionName" : "2.0.8",
|
||||||
"versionCode" : 100,
|
"versionCode" : 208,
|
||||||
"transformPx" : false,
|
"transformPx" : false,
|
||||||
/* 5+App特有相关 */
|
/* 5+App特有相关 */
|
||||||
"app-plus" : {
|
"app-plus" : {
|
||||||
@@ -112,43 +112,43 @@
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
"uniStatistics" : {
|
"uniStatistics" : {
|
||||||
"enable" : true
|
"enable" : false
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
/* 快应用特有相关 */
|
/* 快应用特有相关 */
|
||||||
"quickapp" : {},
|
"quickapp" : {},
|
||||||
/* 小程序特有相关 */
|
/* 小程序特有相关 */
|
||||||
"mp-weixin" : {
|
"mp-weixin" : {
|
||||||
"appid" : "wx1bb161867082c72f",
|
"appid" : "",
|
||||||
"setting" : {
|
"setting" : {
|
||||||
"urlCheck" : false,
|
"urlCheck" : false,
|
||||||
"minified" : true
|
"minified" : true
|
||||||
},
|
},
|
||||||
"usingComponents" : true,
|
"usingComponents" : true,
|
||||||
"uniStatistics" : {
|
"uniStatistics" : {
|
||||||
"enable" : true
|
"enable" : false
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"mp-alipay" : {
|
"mp-alipay" : {
|
||||||
"usingComponents" : true,
|
"usingComponents" : true,
|
||||||
"uniStatistics" : {
|
"uniStatistics" : {
|
||||||
"enable" : true
|
"enable" : false
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"mp-baidu" : {
|
"mp-baidu" : {
|
||||||
"usingComponents" : true,
|
"usingComponents" : true,
|
||||||
"uniStatistics" : {
|
"uniStatistics" : {
|
||||||
"enable" : true
|
"enable" : false
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"mp-toutiao" : {
|
"mp-toutiao" : {
|
||||||
"usingComponents" : true,
|
"usingComponents" : true,
|
||||||
"uniStatistics" : {
|
"uniStatistics" : {
|
||||||
"enable" : true
|
"enable" : false
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"uniStatistics" : {
|
"uniStatistics" : {
|
||||||
"enable" : true,
|
"enable" : false,
|
||||||
"version" : "2"
|
"version" : "2"
|
||||||
},
|
},
|
||||||
"vueVersion" : "2",
|
"vueVersion" : "2",
|
||||||
@@ -174,7 +174,7 @@
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
"uniStatistics" : {
|
"uniStatistics" : {
|
||||||
"enable" : true
|
"enable" : false
|
||||||
},
|
},
|
||||||
"router" : {
|
"router" : {
|
||||||
"base" : "/uni-halo/",
|
"base" : "/uni-halo/",
|
||||||
@@ -190,32 +190,47 @@
|
|||||||
"es6" : true
|
"es6" : true
|
||||||
},
|
},
|
||||||
"uniStatistics" : {
|
"uniStatistics" : {
|
||||||
"enable" : true
|
"enable" : false
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"mp-jd" : {
|
"mp-jd" : {
|
||||||
"uniStatistics" : {
|
"uniStatistics" : {
|
||||||
"enable" : true
|
"enable" : false
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"mp-kuaishou" : {
|
"mp-kuaishou" : {
|
||||||
"uniStatistics" : {
|
"uniStatistics" : {
|
||||||
"enable" : true
|
"enable" : false
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"mp-lark" : {
|
"mp-lark" : {
|
||||||
"uniStatistics" : {
|
"uniStatistics" : {
|
||||||
"enable" : true
|
"enable" : false
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"quickapp-webview-huawei" : {
|
"quickapp-webview-huawei" : {
|
||||||
"uniStatistics" : {
|
"uniStatistics" : {
|
||||||
"enable" : true
|
"enable" : false
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"quickapp-webview-union" : {
|
"quickapp-webview-union" : {
|
||||||
"uniStatistics" : {
|
"uniStatistics" : {
|
||||||
"enable" : true
|
"enable" : false
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"app-harmony" : {
|
||||||
|
"uniStatistics" : {
|
||||||
|
"enable" : false
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"mp-harmony" : {
|
||||||
|
"uniStatistics" : {
|
||||||
|
"enable" : false
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"mp-xhs" : {
|
||||||
|
"uniStatistics" : {
|
||||||
|
"enable" : false
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
+1
-1
@@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "uni-halo",
|
"name": "uni-halo",
|
||||||
"version": "1.0.0",
|
"version": "2.0.8",
|
||||||
"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>",
|
"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": {
|
"repository": {
|
||||||
"type": "git",
|
"type": "git",
|
||||||
|
|||||||
+40
-1
@@ -266,7 +266,46 @@
|
|||||||
"navigationBarTitleText": "友链提交",
|
"navigationBarTitleText": "友链提交",
|
||||||
"enablePullDownRefresh": false
|
"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"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
|
|||||||
+126
-76
@@ -1,86 +1,136 @@
|
|||||||
<template>
|
<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>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
const homePagePath = '/pages/tabbar/home/home'
|
import pluginAvailableMixin from "@/common/mixins/pluginAvailable.js"
|
||||||
const startPagePath = '/pagesA/start/start'
|
import PluginUnavailable from '@/components/plugin-unavailable/plugin-unavailable.vue'
|
||||||
const articleDetailPath = '/pagesA/article-detail/article-detail';
|
|
||||||
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'
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// #ifdef MP-WEIXIN
|
const homePagePath = '/pages/tabbar/home/home'
|
||||||
// uni.$tm.vx.commit('setWxShare', res.shareConfig);
|
const startPagePath = '/pagesA/start/start'
|
||||||
// #endif
|
const articleDetailPath = '/pagesA/article-detail/article-detail';
|
||||||
|
|
||||||
// 获取mockjson
|
const _DEV_ = false
|
||||||
if (res.basicConfig.auditModeEnabled) {
|
const _DEV_TO_TYPE_ = "page"
|
||||||
await uni.$tm.vx.actions('config/fetchMockJson')
|
const _DEV_TO_PATH_ = "/pagesA/article-detail/article-detail?name=077efb85-3544-4307-b24c-537a9e53f116"
|
||||||
}
|
|
||||||
|
|
||||||
// 进入检查
|
export default {
|
||||||
this.fnCheckShowStarted();
|
mixins: [pluginAvailableMixin],
|
||||||
}).catch((err) => {
|
components: {
|
||||||
uni.switchTab({
|
PluginUnavailable
|
||||||
url: homePagePath
|
},
|
||||||
});
|
computed: {
|
||||||
})
|
configs() {
|
||||||
},
|
return this.$tm.vx.getters().getConfigs;
|
||||||
methods: {
|
}
|
||||||
fnCheckShowStarted() {
|
},
|
||||||
if (!this.configs.appConfig.startConfig.enabled) {
|
async onLoad(options) {
|
||||||
uni.switchTab({
|
// 检查插件
|
||||||
url: homePagePath
|
this.setPluginId(this.NeedPluginIds.PluginUniHalo)
|
||||||
});
|
this.setPluginError("阿偶,检测到当前插件没有安装或者启用,无法启动 uni-halo 哦,请联系管理员")
|
||||||
return;
|
if (!await this.checkPluginAvailable()) return
|
||||||
}
|
|
||||||
|
|
||||||
// 是否每次都显示启动页
|
// 获取配置
|
||||||
if (this.configs.appConfig.startConfig.alwaysShow) {
|
uni.$tm.vx.actions('config/fetchConfigs').then(async (res) => {
|
||||||
uni.removeStorageSync('APP_HAS_STARTED')
|
if (options.scene) {
|
||||||
uni.redirectTo({
|
if ('' !== options.scene) {
|
||||||
url: startPagePath
|
const postId = await this.getPostIdByQRCode(options.scene);
|
||||||
});
|
if (postId) {
|
||||||
return;
|
uni.redirectTo({
|
||||||
}
|
url: articleDetailPath + `?name=${postId}`,
|
||||||
|
animationType: 'slide-in-right'
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
// 只显示一次启动页
|
// #ifdef MP-WEIXIN
|
||||||
if (uni.getStorageSync('APP_HAS_STARTED')) {
|
// uni.$tm.vx.commit('setWxShare', res.shareConfig);
|
||||||
uni.switchTab({
|
// #endif
|
||||||
url: homePagePath
|
|
||||||
});
|
// 获取mockjson
|
||||||
} else {
|
if (res.auditConfig.auditModeEnabled) {
|
||||||
uni.redirectTo({
|
if (res.auditConfig.auditModeData.jsonUrl) {
|
||||||
url: startPagePath
|
await uni.$tm.vx.actions('config/fetchMockJson')
|
||||||
});
|
} else {
|
||||||
}
|
const mockJson = uni.$utils.checkJsonAndParse(res.auditConfig.auditModeData
|
||||||
},
|
.jsonData)
|
||||||
async getPostIdByQRCode(key) {
|
if (mockJson.ok) {
|
||||||
const response = await this.$httpApi.v2.getQRCodeInfo(key);
|
uni.$tm.vx.commit('config/setMockJson', mockJson.jsonData)
|
||||||
if (response) {
|
}
|
||||||
if (response && response.postId) {
|
}
|
||||||
return response.postId;
|
}
|
||||||
}
|
|
||||||
}
|
// 进入检查
|
||||||
return null;
|
this.fnCheckShowStarted();
|
||||||
}
|
}).catch((err) => {
|
||||||
}
|
uni.switchTab({
|
||||||
};
|
url: homePagePath
|
||||||
|
});
|
||||||
|
})
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
fnCheckShowStarted() {
|
||||||
|
// 本地开发,快速跳转页面,发布请设置 _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
|
||||||
|
}
|
||||||
|
|
||||||
|
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>
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.app-page {
|
||||||
|
width: 100vw;
|
||||||
|
height: 100vh;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
+567
-548
File diff suppressed because it is too large
Load Diff
@@ -1,36 +1,66 @@
|
|||||||
<template>
|
<template>
|
||||||
<view class="app-page">
|
<view class="app-page" :style="{
|
||||||
|
padding:calcShowType==='list-post'? 0 : '24rpx 0'
|
||||||
|
}">
|
||||||
<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>
|
<tm-skeleton model="listAvatr"></tm-skeleton>
|
||||||
<tm-skeleton model="listAvatr"></tm-skeleton>
|
<tm-skeleton model="listAvatr"></tm-skeleton>
|
||||||
</view>
|
</view>
|
||||||
<!-- 内容区域 -->
|
<!-- 内容区域 -->
|
||||||
<view v-else class="app-page-content">
|
<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;">
|
<view v-if="dataList.length === 0" class="content-empty flex flex-center" style="height: 70vh;">
|
||||||
<!-- 空布局 -->
|
<!-- 空布局 -->
|
||||||
<tm-empty icon="icon-shiliangzhinengduixiang-" label="暂无数据"></tm-empty>
|
<tm-empty icon="icon-shiliangzhinengduixiang-" label="暂无数据"></tm-empty>
|
||||||
</view>
|
</view>
|
||||||
<block v-else>
|
<block v-else>
|
||||||
<tm-translate v-for="(item, index) in dataList" :key="index"
|
<block v-if="calcAuditModeEnabled || calcShowType==='list'">
|
||||||
style="box-sizing: border-box;width: 50%;padding: 0 8rpx;" animation-name="fadeUp"
|
<tm-translate v-for="(item, index) in dataList" :key="index"
|
||||||
:wait="calcAniWait(index)">
|
style="box-sizing: border-box;width: 50%;padding: 0 8rpx;" animation-name="fadeUp"
|
||||||
<view class="catgory-card" :style="{backgroundImage:`url(${item.spec.cover})`}">
|
:wait="calcAniWait(index)">
|
||||||
<view class="content" @click="handleToCategory(item)">
|
<view class="catgory-card" :style="{backgroundImage:`url(${item.spec.cover})`}">
|
||||||
<view style="font-size: 32rpx;color: #ffffff;">{{ item.spec.displayName }}</view>
|
<view class="content" @click="handleToCategory(item)">
|
||||||
<view v-if="!haloConfigs.basicConfig.auditModeEnabled" style="font-size: 24rpx;color: #ffffff;margin-top: 6rpx;">
|
<view style="font-size: 32rpx;color: #ffffff;">{{ item.spec.displayName }}</view>
|
||||||
共 {{ item.postCount }} 篇文章
|
<view v-if="!calcAuditModeEnabled"
|
||||||
</view>
|
style="font-size: 24rpx;color: #ffffff;margin-top: 6rpx;">
|
||||||
<view v-else style="font-size: 24rpx;color: #ffffff;margin-top: 6rpx;">
|
共 {{ item.postCount }} 篇文章
|
||||||
共 {{ item.postCount }} 篇内容
|
</view>
|
||||||
</view>
|
</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>
|
</view>
|
||||||
</tm-translate>
|
<scroll-view class="right-content pt-12 pb-12" :scroll-y="true" :scroll-top="scrollTop"
|
||||||
<tm-flotbutton @click="fnToTopPage" size="m" color="light-blue"
|
:scroll-with-animation="true" :refresher-enabled="true" :refresher-triggered="triggered"
|
||||||
icon="icon-angle-up"></tm-flotbutton>
|
:refresher-threshold="60" refresher-background="#fafafa"
|
||||||
<view class="load-text">{{ loadMoreText }}</view>
|
@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>
|
</block>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
@@ -39,20 +69,27 @@
|
|||||||
|
|
||||||
<script>
|
<script>
|
||||||
import tmSkeleton from '@/tm-vuetify/components/tm-skeleton/tm-skeleton.vue';
|
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 tmTranslate from '@/tm-vuetify/components/tm-translate/tm-translate.vue';
|
import tmTranslate from '@/tm-vuetify/components/tm-translate/tm-translate.vue';
|
||||||
import tmEmpty from '@/tm-vuetify/components/tm-empty/tm-empty.vue';
|
import tmEmpty from '@/tm-vuetify/components/tm-empty/tm-empty.vue';
|
||||||
|
|
||||||
import MarkdownConfig from '@/common/markdown/markdown.config.js';
|
import MarkdownConfig from '@/common/markdown/markdown.config.js';
|
||||||
import mpHtml from '@/components/mp-html/components/mp-html/mp-html.vue';
|
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 {
|
export default {
|
||||||
components: {
|
components: {
|
||||||
tmSkeleton,
|
tmSkeleton,
|
||||||
tmFlotbutton,
|
tmButton,
|
||||||
tmTranslate,
|
tmTranslate,
|
||||||
tmEmpty,
|
tmEmpty,
|
||||||
mpHtml
|
mpHtml,
|
||||||
|
tmFlowLayout,
|
||||||
|
tmSliderNav,
|
||||||
|
ArticleMinCard
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
@@ -60,33 +97,65 @@ export default {
|
|||||||
loading: 'loading',
|
loading: 'loading',
|
||||||
queryParams: {
|
queryParams: {
|
||||||
size: 20,
|
size: 20,
|
||||||
page: 1
|
page: 1,
|
||||||
|
fieldSelector: ['spec.hideFromList=false']
|
||||||
},
|
},
|
||||||
hasNext: false,
|
hasNext: false,
|
||||||
dataList: [],
|
dataList: [],
|
||||||
|
categoryList: [],
|
||||||
isLoadMore: false,
|
isLoadMore: false,
|
||||||
loadMoreText: '加载中...'
|
loadMoreText: '加载中...',
|
||||||
|
currentCategoryConfig: {
|
||||||
|
type: "list"
|
||||||
|
},
|
||||||
|
currentCategoryName: "",
|
||||||
|
postQueryParams: {
|
||||||
|
size: 10,
|
||||||
|
page: 0,
|
||||||
|
},
|
||||||
|
postList: [],
|
||||||
|
triggered: false,
|
||||||
|
scrollTop: 0,
|
||||||
|
tempScrollTop: 0,
|
||||||
|
scrollTimeout: null,
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
haloConfigs() {
|
haloConfigs() {
|
||||||
return this.$tm.vx.getters().getConfigs;
|
return this.$tm.vx.getters().getConfigs;
|
||||||
},
|
},
|
||||||
|
calcAuditModeEnabled() {
|
||||||
|
return this.haloConfigs.auditConfig.auditModeEnabled
|
||||||
|
},
|
||||||
mockJson() {
|
mockJson() {
|
||||||
return this.$tm.vx.getters().getMockJson;
|
return this.$tm.vx.getters().getMockJson;
|
||||||
|
},
|
||||||
|
categoryConfig() {
|
||||||
|
return this.haloConfigs.pageConfig.categoryConfig
|
||||||
|
},
|
||||||
|
calcShowType() {
|
||||||
|
return this.currentCategoryConfig.type
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
onLoad() {
|
watch: {
|
||||||
this.fnGetData();
|
categoryConfig: {
|
||||||
|
deep: true,
|
||||||
|
immediate: true,
|
||||||
|
handler(newVal) {
|
||||||
|
console.log("执行了", newVal)
|
||||||
|
if (!newVal) return;
|
||||||
|
this.currentCategoryConfig = newVal
|
||||||
|
this.handleInitPage()
|
||||||
|
},
|
||||||
|
}
|
||||||
},
|
},
|
||||||
onPullDownRefresh() {
|
onPullDownRefresh() {
|
||||||
this.isLoadMore = false;
|
this.isLoadMore = false;
|
||||||
this.queryParams.page = 0;
|
this.queryParams.page = 0;
|
||||||
this.fnGetData();
|
this.fnGetData();
|
||||||
},
|
},
|
||||||
|
|
||||||
onReachBottom(e) {
|
onReachBottom(e) {
|
||||||
if (this.haloConfigs.basicConfig.auditModeEnabled) {
|
if (this.calcAuditModeEnabled) {
|
||||||
uni.showToast({
|
uni.showToast({
|
||||||
icon: 'none',
|
icon: 'none',
|
||||||
title: '没有更多数据了'
|
title: '没有更多数据了'
|
||||||
@@ -94,7 +163,12 @@ export default {
|
|||||||
return
|
return
|
||||||
}
|
}
|
||||||
if (this.hasNext) {
|
if (this.hasNext) {
|
||||||
this.queryParams.page += 1;
|
if (this.calcShowType === 'list') {
|
||||||
|
|
||||||
|
this.queryParams.page += 1;
|
||||||
|
} else {
|
||||||
|
this.postQueryParams.page += 1;
|
||||||
|
}
|
||||||
this.isLoadMore = true;
|
this.isLoadMore = true;
|
||||||
this.fnGetData();
|
this.fnGetData();
|
||||||
} else {
|
} else {
|
||||||
@@ -105,8 +179,37 @@ export default {
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
methods: {
|
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() {
|
fnGetData() {
|
||||||
if (this.haloConfigs.basicConfig.auditModeEnabled) {
|
if (this.calcAuditModeEnabled) {
|
||||||
|
this.categoryConfig.type = "list"
|
||||||
this.dataList = this.mockJson.category.list.map((item) => {
|
this.dataList = this.mockJson.category.list.map((item) => {
|
||||||
return {
|
return {
|
||||||
metadata: {
|
metadata: {
|
||||||
@@ -139,21 +242,37 @@ export default {
|
|||||||
.then(res => {
|
.then(res => {
|
||||||
console.log('请求结果:');
|
console.log('请求结果:');
|
||||||
console.log(res);
|
console.log(res);
|
||||||
|
if (this.calcShowType === 'list') {
|
||||||
|
this.loading = 'success';
|
||||||
|
this.loadMoreText = res.hasNext ? '上拉加载更多' : '呜呜,没有更多数据啦~';
|
||||||
|
// 处理数据
|
||||||
|
this.hasNext = res.hasNext;
|
||||||
|
|
||||||
this.loading = 'success';
|
const tempItems = res.items.map(item => {
|
||||||
this.loadMoreText = res.hasNext ? '上拉加载更多' : '呜呜,没有更多数据啦~';
|
item.spec.cover = this.$utils.checkThumbnailUrl(item.spec.cover, true)
|
||||||
// 处理数据
|
return item;
|
||||||
this.hasNext = res.hasNext;
|
})
|
||||||
|
|
||||||
const tempItems = res.items.map(item => {
|
if (this.isLoadMore) {
|
||||||
item.spec.cover = this.$utils.checkThumbnailUrl(item.spec.cover, true)
|
this.dataList = this.dataList.concat(tempItems);
|
||||||
return item;
|
} else {
|
||||||
})
|
this.dataList = tempItems;
|
||||||
|
}
|
||||||
if (this.isLoadMore) {
|
|
||||||
this.dataList = this.dataList.concat(tempItems);
|
|
||||||
} else {
|
} else {
|
||||||
this.dataList = tempItems;
|
this.dataList = res.items
|
||||||
|
this.categoryList = res.items.map(item => {
|
||||||
|
return {
|
||||||
|
displayName: item.spec.displayName,
|
||||||
|
name: item.metadata.name,
|
||||||
|
...item,
|
||||||
|
}
|
||||||
|
})
|
||||||
|
this.triggered = false;
|
||||||
|
this.loading = 'success';
|
||||||
|
if (this.dataList.length !== 0) {
|
||||||
|
this.currentCategoryName = this.dataList[0].metadata.name;
|
||||||
|
this.fnGetPostByCategory()
|
||||||
|
}
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
.catch(err => {
|
.catch(err => {
|
||||||
@@ -175,12 +294,90 @@ export default {
|
|||||||
})
|
})
|
||||||
},
|
},
|
||||||
handleToCategory(data) {
|
handleToCategory(data) {
|
||||||
if (this.haloConfigs.basicConfig.auditModeEnabled) {
|
if (this.calcAuditModeEnabled) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
uni.navigateTo({
|
uni.navigateTo({
|
||||||
url: `/pagesA/category-detail/category-detail?name=${data.metadata.name}&title=${data.spec.displayName}`
|
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()
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
@@ -212,8 +409,14 @@ export default {
|
|||||||
flex-wrap: wrap;
|
flex-wrap: wrap;
|
||||||
padding: 0 12rpx;
|
padding: 0 12rpx;
|
||||||
gap: 20rpx 0;
|
gap: 20rpx 0;
|
||||||
|
|
||||||
|
&.list-post {
|
||||||
|
padding: 0;
|
||||||
|
gap: 0;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
.catgory-card {
|
.catgory-card {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 200rpx;
|
height: 200rpx;
|
||||||
@@ -236,6 +439,7 @@ export default {
|
|||||||
right: 0;
|
right: 0;
|
||||||
bottom: 0;
|
bottom: 0;
|
||||||
background-color: rgba(0, 0, 0, 0.15);
|
background-color: rgba(0, 0, 0, 0.15);
|
||||||
|
backdrop-filter: blur(3rpx);
|
||||||
z-index: 1;
|
z-index: 1;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@@ -255,4 +459,14 @@ export default {
|
|||||||
width: 100%;
|
width: 100%;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.flot-buttons {
|
||||||
|
position: fixed;
|
||||||
|
bottom: 100rpx;
|
||||||
|
right: 32rpx;
|
||||||
|
flex-direction: column;
|
||||||
|
display: flex;
|
||||||
|
gap: 6rpx;
|
||||||
|
z-index: 999;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
+376
-279
@@ -1,296 +1,393 @@
|
|||||||
<template>
|
<template>
|
||||||
<view class="app-page">
|
<view class="app-page" :class="[uniHaloPluginPageClass]">
|
||||||
<!-- 顶部切换 -->
|
<PluginUnavailable v-if="!uniHaloPluginAvailable" :pluginId="uniHaloPluginId"
|
||||||
<view class="e-fixed" v-if="category.list.length > 0">
|
:error-text="uniHaloPluginAvailableError" />
|
||||||
<tm-tabs color="light-blue" v-model="category.activeIndex" range-key="displayName" :list="category.list"
|
<template v-else>
|
||||||
align="left" @change="fnOnCategoryChange"></tm-tabs>
|
<!-- 顶部切换 -->
|
||||||
</view>
|
<view class="e-fixed" v-if="category.list.length > 0">
|
||||||
<!-- 占位区域 -->
|
<tm-tabs color="light-blue" :shadow="0" v-model="category.activeIndex" range-key="displayName"
|
||||||
<view v-if="category.list.length > 0" style="width: 100vw;height: 90rpx;"></view>
|
:list="category.list" align="left" @change="fnOnCategoryChange($event, false)"></tm-tabs>
|
||||||
<!-- 加载区域 -->
|
</view>
|
||||||
<view v-if="loading !== 'success'" class="loading-wrap">
|
<!-- 占位区域 -->
|
||||||
<tm-skeleton model="card"></tm-skeleton>
|
<view v-if="category.list.length > 0" style="width: 100vw;height: 90rpx;"></view>
|
||||||
<tm-skeleton model="card"></tm-skeleton>
|
<!-- 加载区域 -->
|
||||||
<tm-skeleton model="card"></tm-skeleton>
|
<view v-if="loading == 'loading'" class="loading-wrap">
|
||||||
<tm-skeleton model="card"></tm-skeleton>
|
<tm-skeleton model="card"></tm-skeleton>
|
||||||
</view>
|
<tm-skeleton model="card"></tm-skeleton>
|
||||||
<!-- 内容区域 -->
|
<tm-skeleton model="card"></tm-skeleton>
|
||||||
<view class="content" v-else>
|
<tm-skeleton model="card"></tm-skeleton>
|
||||||
<view v-if="dataList.length === 0" class="content-empty">
|
</view>
|
||||||
<!-- 空布局 -->
|
<view v-else-if="loading == 'error'" class="flex flex-col flex-center" style="width:100%;height:60vh;">
|
||||||
<tm-empty icon="icon-shiliangzhinengduixiang-" label="博主还没有分享图片~"></tm-empty>
|
<tm-empty icon="icon-wind-cry" label="阿偶,似乎获取数据失败了~">
|
||||||
</view>
|
<tm-button theme="light-blue" size="m" :shadow="0" @click="fnGetData(true)">刷新试试</tm-button>
|
||||||
<block v-else>
|
</tm-empty>
|
||||||
<block v-if="galleryConfig.useWaterfall">
|
</view>
|
||||||
<!--瀑布流-->
|
<!-- 内容区域 -->
|
||||||
<tm-flowLayout-custom ref="wafll" style="width: 100%;" @click="fnOnFlowClick"></tm-flowLayout-custom>
|
<view v-else class="content">
|
||||||
</block>
|
<k-touch-listen class="touch-listen-content" @touchLeft="touchLeft" @touchRight="touchRight">
|
||||||
<!-- 列表 -->
|
<view v-if="dataList.length === 0" class="content-empty">
|
||||||
<block v-else>
|
<!-- 空布局 -->
|
||||||
<tm-translate v-for="(item, index) in dataList" :key="index"
|
<tm-empty icon="icon-shiliangzhinengduixiang-" label="博主还没有分享图片~"></tm-empty>
|
||||||
style="box-sizing: border-box;padding: 6rpx;width: 50%;height: 250rpx;"
|
</view>
|
||||||
animation-name="fadeUp" :wait="calcAniWait(index)">
|
<block v-else>
|
||||||
<view style="border-radius: 12rpx;overflow: hidden;width: 100%;height: 250rpx;">
|
<block v-if="galleryConfig.useWaterfall">
|
||||||
<image style="width: 100%;height: 100%;" mode="aspectFill" :src="item.spec.url"
|
<!--瀑布流-->
|
||||||
@click="fnPreview(item)"/>
|
<tm-flowLayout-custom ref="wafll" style="width: 100%;"
|
||||||
</view>
|
@click="fnOnFlowClick"></tm-flowLayout-custom>
|
||||||
</tm-translate>
|
</block>
|
||||||
</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>
|
||||||
<view class="load-text">{{ loadMoreText }}</view>
|
</block>
|
||||||
</block>
|
</k-touch-listen>
|
||||||
|
</view>
|
||||||
|
|
||||||
</view>
|
<view v-if="!calcAuditModeEnabled" class="flot-buttons">
|
||||||
</view>
|
<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>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import tmSkeleton from '@/tm-vuetify/components/tm-skeleton/tm-skeleton.vue';
|
import tmSkeleton from '@/tm-vuetify/components/tm-skeleton/tm-skeleton.vue';
|
||||||
import tmTranslate from '@/tm-vuetify/components/tm-translate/tm-translate.vue';
|
import tmTranslate from '@/tm-vuetify/components/tm-translate/tm-translate.vue';
|
||||||
import tmFlotbutton from '@/tm-vuetify/components/tm-flotbutton/tm-flotbutton.vue';
|
import tmFlotbutton from '@/tm-vuetify/components/tm-flotbutton/tm-flotbutton.vue';
|
||||||
import tmTags from '@/tm-vuetify/components/tm-tags/tm-tags.vue';
|
import tmTags from '@/tm-vuetify/components/tm-tags/tm-tags.vue';
|
||||||
import tmEmpty from '@/tm-vuetify/components/tm-empty/tm-empty.vue';
|
import tmEmpty from '@/tm-vuetify/components/tm-empty/tm-empty.vue';
|
||||||
import tmIcons from '@/tm-vuetify/components/tm-icons/tm-icons.vue';
|
import tmIcons from '@/tm-vuetify/components/tm-icons/tm-icons.vue';
|
||||||
import tmImages from '@/tm-vuetify/components/tm-images/tm-images.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 tmFlowLayoutCustom from '@/tm-vuetify/components/tm-flowLayout-custom/tm-flowLayout-custom.vue';
|
||||||
import tmTabs from '@/tm-vuetify/components/tm-tabs/tm-tabs.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 {
|
import pluginAvailable from "@/common/mixins/pluginAvailable.js"
|
||||||
options: {
|
import PluginUnavailable from '@/components/plugin-unavailable/plugin-unavailable.vue'
|
||||||
multipleSlots: true
|
export default {
|
||||||
},
|
options: {
|
||||||
components: {
|
multipleSlots: true
|
||||||
tmSkeleton,
|
},
|
||||||
tmTranslate,
|
mixins: [pluginAvailable],
|
||||||
tmFlotbutton,
|
components: {
|
||||||
tmTags,
|
tmSkeleton,
|
||||||
tmEmpty,
|
tmTranslate,
|
||||||
tmIcons,
|
tmFlotbutton,
|
||||||
tmImages,
|
tmTags,
|
||||||
tmFlowLayoutCustom,
|
tmEmpty,
|
||||||
tmTabs
|
tmIcons,
|
||||||
},
|
tmImages,
|
||||||
data() {
|
tmFlowLayoutCustom,
|
||||||
return {
|
tmTabs,
|
||||||
isBlackTheme: false,
|
tmButton,
|
||||||
loading: 'loading',
|
PluginUnavailable
|
||||||
category: {
|
},
|
||||||
activeIndex: 0,
|
data() {
|
||||||
activeValue: '',
|
return {
|
||||||
list: []
|
isBlackTheme: false,
|
||||||
},
|
loading: 'loading',
|
||||||
queryParams: {
|
category: {
|
||||||
size: 10,
|
activeIndex: 0,
|
||||||
page: 1,
|
activeValue: '',
|
||||||
group: ""
|
list: []
|
||||||
},
|
},
|
||||||
isLoadMore: false,
|
queryParams: {
|
||||||
loadMoreText: '',
|
size: 10,
|
||||||
hasNext: false,
|
page: 1,
|
||||||
dataList: []
|
group: ""
|
||||||
};
|
},
|
||||||
},
|
isLoadMore: false,
|
||||||
computed: {
|
loadMoreText: '',
|
||||||
galleryConfig() {
|
hasNext: false,
|
||||||
return this.$tm.vx.getters().getConfigs.pageConfig.galleryConfig;
|
dataList: [],
|
||||||
},
|
lock: false
|
||||||
haloConfigs() {
|
};
|
||||||
return this.$tm.vx.getters().getConfigs;
|
},
|
||||||
},
|
computed: {
|
||||||
mockJson() {
|
galleryConfig() {
|
||||||
return this.$tm.vx.getters().getMockJson;
|
return this.$tm.vx.getters().getConfigs.pageConfig.galleryConfig;
|
||||||
}
|
},
|
||||||
},
|
haloConfigs() {
|
||||||
watch: {
|
return this.$tm.vx.getters().getConfigs;
|
||||||
galleryConfig: {
|
},
|
||||||
handler(newValue, oldValue) {
|
mockJson() {
|
||||||
if (!newValue) return;
|
return this.$tm.vx.getters().getMockJson;
|
||||||
this.fnSetPageTitle(newValue.pageTitle);
|
},
|
||||||
this.fnGetCategory();
|
calcAuditModeEnabled() {
|
||||||
},
|
return this.haloConfigs.auditConfig.auditModeEnabled
|
||||||
deep: true,
|
},
|
||||||
immediate: true
|
},
|
||||||
}
|
watch: {
|
||||||
},
|
galleryConfig: {
|
||||||
onPullDownRefresh() {
|
async handler(newValue, oldValue) {
|
||||||
this.dataList = []
|
if (!newValue) return;
|
||||||
this.isLoadMore = false;
|
this.fnSetPageTitle(newValue.pageTitle);
|
||||||
this.queryParams.page = 1;
|
this.fnGetCategory();
|
||||||
this.fnGetData(true);
|
},
|
||||||
},
|
deep: true,
|
||||||
onReachBottom(e) {
|
immediate: true
|
||||||
if (this.haloConfigs.basicConfig.auditModeEnabled) {
|
}
|
||||||
uni.showToast({
|
},
|
||||||
icon: 'none',
|
async onLoad() {
|
||||||
title: '没有更多数据了'
|
// 检查插件
|
||||||
});
|
this.setPluginId(this.NeedPluginIds.PluginPhotos)
|
||||||
return;
|
this.setPluginError("阿偶,检测到当前插件没有安装或者启用,无法使用图库功能哦,请联系管理员")
|
||||||
}
|
await this.checkPluginAvailable()
|
||||||
if (this.hasNext) {
|
},
|
||||||
this.queryParams.page += 1;
|
onPullDownRefresh() {
|
||||||
this.isLoadMore = true;
|
if (!this.uniHaloPluginAvailable) {
|
||||||
this.fnGetData(false);
|
uni.hideLoading();
|
||||||
} else {
|
uni.stopPullDownRefresh();
|
||||||
uni.showToast({
|
return
|
||||||
icon: 'none',
|
}
|
||||||
title: '没有更多数据了'
|
this.dataList = []
|
||||||
});
|
this.isLoadMore = false;
|
||||||
}
|
this.queryParams.page = 1;
|
||||||
},
|
this.fnGetData(true);
|
||||||
methods: {
|
},
|
||||||
fnOnCategoryChange(index) {
|
onReachBottom(e) {
|
||||||
this.fnResetSetAniWaitIndex();
|
if (!this.uniHaloPluginAvailable) return;
|
||||||
this.queryParams.group = this.category.list[index].name;
|
if (this.calcAuditModeEnabled) {
|
||||||
this.queryParams.page = 1;
|
uni.showToast({
|
||||||
this.fnToTopPage();
|
icon: 'none',
|
||||||
this.dataList = [];
|
title: '没有更多数据了'
|
||||||
this.fnGetData(true);
|
});
|
||||||
},
|
return;
|
||||||
fnGetCategory() {
|
}
|
||||||
if (this.haloConfigs.basicConfig.auditModeEnabled) {
|
|
||||||
this.fnGetData(true);
|
|
||||||
return
|
|
||||||
}
|
|
||||||
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(isClearWaterfall = false) {
|
|
||||||
if (this.haloConfigs.basicConfig.auditModeEnabled) {
|
|
||||||
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.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.items.map(item => {
|
||||||
|
return {
|
||||||
|
name: item.metadata.name,
|
||||||
|
displayName: item.spec.displayName,
|
||||||
|
priority: item.spec.priority
|
||||||
|
}
|
||||||
|
}).sort((a, b) => a.priority - b.priority);
|
||||||
|
|
||||||
if (this.galleryConfig.useWaterfall) {
|
if (this.category.list.length !== 0) {
|
||||||
this.$nextTick(() => {
|
this.queryParams.group = this.category.list[0].name;
|
||||||
if (isClearWaterfall) {
|
this.fnGetData(true);
|
||||||
this.$refs.wafll.clear()
|
}
|
||||||
}
|
}).catch(e => {
|
||||||
setTimeout(() => {
|
this.loading = 'error'
|
||||||
this.$refs.wafll.pushData(this.dataList)
|
this.category.list = []
|
||||||
}, 50)
|
this.category.activeIndex = 0
|
||||||
})
|
this.category.activeValue = ""
|
||||||
}
|
});
|
||||||
this.loadMoreText = '呜呜,没有更多数据啦~';
|
},
|
||||||
uni.hideLoading();
|
fnGetData(isClearWaterfall = false) {
|
||||||
uni.stopPullDownRefresh();
|
if (this.calcAuditModeEnabled) {
|
||||||
return;
|
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.isLoadMore) {
|
|
||||||
this.loading = 'loading';
|
if (this.galleryConfig.useWaterfall) {
|
||||||
}
|
this.$nextTick(() => {
|
||||||
this.loadMoreText = '';
|
if (isClearWaterfall) {
|
||||||
this.$httpApi.v2
|
this.$refs.wafll.clear()
|
||||||
.getPhotoListByGroupName(this.queryParams)
|
}
|
||||||
.then(res => {
|
setTimeout(() => {
|
||||||
this.hasNext = res.hasNext;
|
this.$refs.wafll.pushData(this.dataList)
|
||||||
this.loading = 'success';
|
}, 50)
|
||||||
if (res.items.length !== 0) {
|
})
|
||||||
const _list = res.items.map((item, index) => {
|
}
|
||||||
item.spec.url = this.$utils.checkImageUrl(item.spec.url || item.spec.cover);
|
this.loadMoreText = '呜呜,没有更多数据啦~';
|
||||||
return item;
|
uni.hideLoading();
|
||||||
});
|
uni.stopPullDownRefresh();
|
||||||
if (this.isLoadMore) {
|
this.lock = false;
|
||||||
this.dataList = this.dataList.concat(_list);
|
return;
|
||||||
} else {
|
}
|
||||||
this.dataList = _list;
|
|
||||||
}
|
// 设置状态为加载中
|
||||||
if (this.galleryConfig.useWaterfall) {
|
if (!this.isLoadMore) {
|
||||||
this.$nextTick(() => {
|
this.loading = 'loading';
|
||||||
if (isClearWaterfall) {
|
}
|
||||||
this.$refs.wafll.clear()
|
this.loadMoreText = '';
|
||||||
}
|
this.$httpApi.v2
|
||||||
this.$refs.wafll.pushData(_list)
|
.getPhotoListByGroupName(this.queryParams)
|
||||||
})
|
.then(res => {
|
||||||
}
|
this.hasNext = res.hasNext;
|
||||||
}
|
this.loading = 'success';
|
||||||
this.loadMoreText = res.hasNext ? '上拉加载更多' : '呜呜,没有更多数据啦~';
|
if (res.items.length !== 0) {
|
||||||
})
|
const _list = res.items.map((item, index) => {
|
||||||
.catch(err => {
|
item.spec.url = this.$utils.checkImageUrl(item.spec.url || item.spec.cover);
|
||||||
console.error(err);
|
return item;
|
||||||
this.loading = 'error';
|
});
|
||||||
this.loadMoreText = '加载失败,请下拉刷新!';
|
if (this.isLoadMore) {
|
||||||
})
|
this.dataList = this.dataList.concat(_list);
|
||||||
.finally(() => {
|
} else {
|
||||||
setTimeout(() => {
|
this.dataList = _list;
|
||||||
uni.hideLoading();
|
}
|
||||||
uni.stopPullDownRefresh();
|
if (this.galleryConfig.useWaterfall) {
|
||||||
}, 500);
|
this.$nextTick(() => {
|
||||||
});
|
if (isClearWaterfall) {
|
||||||
},
|
this.$refs.wafll.clear()
|
||||||
fnOnFlowClick({item}) {
|
}
|
||||||
this.fnPreview(item)
|
this.$refs.wafll.pushData(_list)
|
||||||
},
|
})
|
||||||
// 预览
|
}
|
||||||
fnPreview(data) {
|
}
|
||||||
uni.previewImage({
|
this.loadMoreText = res.hasNext ? '上拉加载更多' : '呜呜,没有更多数据啦~';
|
||||||
current: this.dataList.findIndex(x => x.metadata.name === data.metadata.name),
|
})
|
||||||
urls: this.dataList.map(x => x.spec.url),
|
.catch(err => {
|
||||||
indicator: 'number',
|
console.error(err);
|
||||||
loop: true
|
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>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
.app-page {
|
.app-page {
|
||||||
width: 100vw;
|
width: 100vw;
|
||||||
min-height: 100vh;
|
min-height: 100vh;
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
padding-bottom: 24rpx;
|
padding-bottom: 24rpx;
|
||||||
background-color: #fafafa;
|
background-color: #fafafa;
|
||||||
}
|
}
|
||||||
|
|
||||||
.content {
|
.content {
|
||||||
display: flex;
|
width: 100%;
|
||||||
flex-wrap: wrap;
|
display: flex;
|
||||||
box-sizing: border-box;
|
flex-wrap: wrap;
|
||||||
padding: 24rpx 24rpx 0;
|
box-sizing: border-box;
|
||||||
gap: 12rpx 0;
|
|
||||||
|
|
||||||
.content-empty {
|
.content-empty {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 70vh;
|
height: 70vh;
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.loading-wrap {
|
.touch-listen-content {
|
||||||
box-sizing: border-box;
|
width: 100%;
|
||||||
padding: 24rpx;
|
display: flex;
|
||||||
}
|
flex-wrap: wrap;
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding: 24rpx 24rpx 0;
|
||||||
|
gap: 12rpx 0;
|
||||||
|
}
|
||||||
|
|
||||||
.load-text {
|
.loading-wrap {
|
||||||
width: 100%;
|
box-sizing: border-box;
|
||||||
text-align: center;
|
padding: 24rpx;
|
||||||
}
|
}
|
||||||
</style>
|
|
||||||
|
.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>
|
||||||
+703
-519
File diff suppressed because it is too large
Load Diff
+387
-271
@@ -1,294 +1,410 @@
|
|||||||
<template>
|
<template>
|
||||||
<view class="app-page">
|
<view class="app-page" :class="[uniHaloPluginPageClass]">
|
||||||
<view v-if="loading !== 'success'" class="loading-wrap">
|
<PluginUnavailable v-if="!uniHaloPluginAvailable" :pluginId="uniHaloPluginId"
|
||||||
<tm-skeleton model="listAvatr"></tm-skeleton>
|
:error-text="uniHaloPluginAvailableError" />
|
||||||
<tm-skeleton model="listAvatr"></tm-skeleton>
|
<template v-else>
|
||||||
<tm-skeleton model="listAvatr"></tm-skeleton>
|
<view v-if="loading !== 'success'" class="loading-wrap">
|
||||||
</view>
|
<tm-skeleton model="listAvatr"></tm-skeleton>
|
||||||
<!-- 内容区域 -->
|
<tm-skeleton model="listAvatr"></tm-skeleton>
|
||||||
<view v-else class="app-page-content">
|
<tm-skeleton model="listAvatr"></tm-skeleton>
|
||||||
<view v-if="dataList.length === 0" class="content-empty flex flex-center" style="min-height: 70vh;">
|
</view>
|
||||||
<!-- 空布局 -->
|
<!-- 内容区域 -->
|
||||||
<tm-empty icon="icon-shiliangzhinengduixiang-" label="暂无数据"></tm-empty>
|
<view v-else class="app-page-content">
|
||||||
</view>
|
<view v-if="dataList.length === 0" class="content-empty flex flex-center" style="min-height: 70vh;">
|
||||||
<block v-else>
|
<!-- 空布局 -->
|
||||||
<block v-for="(moment, index) in dataList" :key="index">
|
<tm-empty icon="icon-shiliangzhinengduixiang-" label="暂无数据"></tm-empty>
|
||||||
<!-- 卡片 -->
|
</view>
|
||||||
<tm-translate v-if="moment.spec.visible==='PUBLIC'" animation-name="fadeUp" :wait="calcAniWait()">
|
<block v-else>
|
||||||
<view class="moment-card">
|
<!-- 卡片 -->
|
||||||
<view class="head" style="display: flex;align-items: center;">
|
<tm-translate v-for="(moment, index) in dataList" :key="moment.metadata.name"
|
||||||
<view class="avatar" style="flex-shrink: 0;">
|
animation-name="fadeUp" :wait="calcAniWait(index)">
|
||||||
<image style="width: 66rpx;height: 66rpx;border-radius: 50%;"
|
<view class="moment-card">
|
||||||
:src="moment.spec.user.avatar"/>
|
<view class="head" style="display: flex;align-items: center;">
|
||||||
</view>
|
<view class="avatar" style="flex-shrink: 0;">
|
||||||
<view class="nickname" style="margin-left: 12rpx;">
|
<image style="width: 66rpx;height: 66rpx;border-radius: 50%;"
|
||||||
<view style="font-size: 30rpx;font-weight: bold;color: #333333;">
|
:src="moment.spec.user.avatar" />
|
||||||
{{ moment.spec.user.displayName }}
|
</view>
|
||||||
</view>
|
<view class="nickname" style="margin-left: 12rpx;">
|
||||||
<view style="margin-top: 6rpx;font-size: 24rpx;color: #666;">
|
<view style="font-size: 30rpx;font-weight: bold;color: #333333;">
|
||||||
{{ {d: moment.spec.releaseTime, f: 'yyyy年MM月dd日 星期w'} | formatTime }}
|
{{ moment.spec.user.displayName }}
|
||||||
</view>
|
</view>
|
||||||
</view>
|
<view style="margin-top: 6rpx;font-size: 24rpx;color: #666;">
|
||||||
</view>
|
{{ {d: moment.spec.releaseTime, f: 'yyyy年MM月dd日 星期w'} | formatTime }}
|
||||||
<view class="content">
|
</view>
|
||||||
<mp-html class="evan-markdown" lazy-load :domain="markdownConfig.domain"
|
</view>
|
||||||
:loading-img="markdownConfig.loadingGif" :scroll-table="true" :selectable="true"
|
</view>
|
||||||
:tag-style="markdownConfig.tagStyle" :container-style="markdownConfig.containStyle"
|
<view class="content" @click.stop="handleToMomentDetail(moment)">
|
||||||
:content="moment.spec.content.html" :markdown="true" :showLineNumber="true"
|
<mp-html class="evan-markdown" lazy-load :domain="markdownConfig.domain"
|
||||||
:showLanguageName="true" :copyByLongPress="true"/>
|
:loading-img="markdownConfig.loadingGif" :scroll-table="true" :selectable="true"
|
||||||
</view>
|
:tag-style="markdownConfig.tagStyle" :container-style="markdownConfig.containStyle"
|
||||||
<view class="mb-12 mt--12" v-if="moment.videos.length!==0"
|
:content="moment.spec.newHtml" :markdown="true" :showLineNumber="true"
|
||||||
style="display: flex; flex-direction: column; gap: 12rpx 0;padding: 0 24rpx; ">
|
:showLanguageName="true" :copyByLongPress="true" />
|
||||||
<video
|
</view>
|
||||||
style="width:100%;height: 400rpx;border-radius: 12rpx;"
|
<view v-if="moment.images && moment.images.length!==0" class="images"
|
||||||
v-for="(video,index) in moment.videos"
|
:class="['images-'+moment.images.length]">
|
||||||
:key="index" :src="video.url"></video>
|
<view class="image-item" v-for="(image,mediumIndex) in moment.images"
|
||||||
</view>
|
:key="mediumIndex">
|
||||||
<view v-if="moment.images.length!==0" class="images"
|
<image mode="aspectFill" style="width: 100%;height: 100%;border-radius: 6rpx;"
|
||||||
:class="['images-'+moment.images.length]">
|
:src="image.url" @click="handlePreview(mediumIndex,moment.images)" />
|
||||||
<view class="image-item"
|
</view>
|
||||||
v-for="(image,mediumIndex) in moment.images"
|
</view>
|
||||||
:key="mediumIndex">
|
<view v-if="moment.audios && moment.audios.length!==0" class="mb-12"
|
||||||
<image mode="aspectFill" style="width: 100%;height: 100%;border-radius: 6rpx;"
|
style="display: flex; flex-direction: column; gap: 12rpx 0;padding: 0 24rpx;padding-right:28rpx;">
|
||||||
:src="image.url"
|
<audio v-for="(audio,index) in moment.audios" :controls="true" :key="index"
|
||||||
@click="handlePreview(mediumIndex,moment.images)"/>
|
:id="audio.url" :poster="bloggerInfo.avatar"
|
||||||
</view>
|
:name="'来自' + (startConfig.title||bloggerInfo.nickname) + '的声音'"
|
||||||
</view>
|
:author="bloggerInfo.nickname" :src="audio.url"></audio>
|
||||||
</view>
|
</view>
|
||||||
</tm-translate>
|
<view v-if="moment.videos && moment.videos.length!==0" class="mb-12"
|
||||||
</block>
|
style="display: flex; flex-direction: column; gap: 12rpx 0;padding: 0 24rpx; ">
|
||||||
<tm-flotbutton @click="fnToTopPage" size="m" color="light-blue" icon="icon-angle-up"></tm-flotbutton>
|
<video style="width:100%;height: 400rpx;border-radius: 12rpx;"
|
||||||
<view class="load-text">{{ loadMoreText }}</view>
|
v-for="(video,index) in moment.videos" :key="index" :src="video.url"
|
||||||
</block>
|
:id="'video_' + video.id" :show-mute-btn="true" :controls="true"
|
||||||
</view>
|
:show-center-play-btn="true" :enable-progress-gesture="true"
|
||||||
</view>
|
@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>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import tmSkeleton from '@/tm-vuetify/components/tm-skeleton/tm-skeleton.vue';
|
import tmSkeleton from '@/tm-vuetify/components/tm-skeleton/tm-skeleton.vue';
|
||||||
import tmFlotbutton from '@/tm-vuetify/components/tm-flotbutton/tm-flotbutton.vue';
|
import tmFlotbutton from '@/tm-vuetify/components/tm-flotbutton/tm-flotbutton.vue';
|
||||||
import tmTranslate from '@/tm-vuetify/components/tm-translate/tm-translate.vue';
|
import tmTranslate from '@/tm-vuetify/components/tm-translate/tm-translate.vue';
|
||||||
import tmEmpty from '@/tm-vuetify/components/tm-empty/tm-empty.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 MarkdownConfig from '@/common/markdown/markdown.config.js';
|
||||||
import mpHtml from '@/components/mp-html/components/mp-html/mp-html.vue';
|
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 {
|
import pluginAvailableMixin from "@/common/mixins/pluginAvailable.js"
|
||||||
components: {
|
import PluginUnavailable from '@/components/plugin-unavailable/plugin-unavailable.vue'
|
||||||
tmSkeleton,
|
|
||||||
tmFlotbutton,
|
export default {
|
||||||
tmTranslate,
|
mixins: [pluginAvailableMixin],
|
||||||
tmEmpty,
|
components: {
|
||||||
mpHtml
|
tmSkeleton,
|
||||||
},
|
tmFlotbutton,
|
||||||
data() {
|
tmTranslate,
|
||||||
return {
|
tmEmpty,
|
||||||
markdownConfig: MarkdownConfig,
|
tmTags,
|
||||||
loading: 'loading',
|
mpHtml,
|
||||||
queryParams: {
|
PluginUnavailable
|
||||||
size: 10,
|
},
|
||||||
page: 1
|
data() {
|
||||||
},
|
return {
|
||||||
hasNext: false,
|
markdownConfig: MarkdownConfig,
|
||||||
dataList: [],
|
loading: 'loading',
|
||||||
isLoadMore: false,
|
queryParams: {
|
||||||
loadMoreText: '加载中...'
|
size: 10,
|
||||||
};
|
page: 1
|
||||||
},
|
},
|
||||||
|
hasNext: false,
|
||||||
|
dataList: [],
|
||||||
|
isLoadMore: false,
|
||||||
|
loadMoreText: '加载中...',
|
||||||
|
tagColors: ['orange', 'green', 'red', 'blue'],
|
||||||
|
videoContexts: {},
|
||||||
|
currentVideoId: null
|
||||||
|
};
|
||||||
|
},
|
||||||
|
|
||||||
computed: {
|
computed: {
|
||||||
bloggerInfo() {
|
bloggerInfo() {
|
||||||
let blogger = this.$tm.vx.getters().getConfigs.authorConfig.blogger;
|
let blogger = this.$tm.vx.getters().getConfigs.authorConfig.blogger;
|
||||||
blogger.avatar = this.$utils.checkAvatarUrl(blogger.avatar, true);
|
blogger.avatar = this.$utils.checkAvatarUrl(blogger.avatar, true);
|
||||||
return blogger;
|
return blogger;
|
||||||
},
|
},
|
||||||
haloConfigs() {
|
haloConfigs() {
|
||||||
return this.$tm.vx.getters().getConfigs;
|
return this.$tm.vx.getters().getConfigs;
|
||||||
},
|
},
|
||||||
mockJson() {
|
mockJson() {
|
||||||
return this.$tm.vx.getters().getMockJson;
|
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
|
||||||
|
|
||||||
|
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;
|
||||||
|
|
||||||
onLoad() {
|
const tempItems = res.items.filter(x => x.spec.visible === 'PUBLIC').map(item => {
|
||||||
this.fnGetData();
|
item.spec.user = {
|
||||||
},
|
displayName: this.bloggerInfo.nickname,
|
||||||
onPullDownRefresh() {
|
avatar: this.$utils.checkAvatarUrl(this.bloggerInfo.avatar)
|
||||||
this.isLoadMore = false;
|
}
|
||||||
this.queryParams.page = 0;
|
item.spec.content.medium.map(medium => {
|
||||||
this.fnGetData();
|
medium.url = this.$utils.checkThumbnailUrl(medium.url, true)
|
||||||
},
|
})
|
||||||
|
|
||||||
onReachBottom(e) {
|
item.spec.newHtml = this.removeTagLinksCompletely(item.spec.content.html, '')
|
||||||
if (this.haloConfigs.basicConfig.auditModeEnabled) {
|
item['images'] = item.spec.content.medium
|
||||||
uni.showToast({
|
.filter(x => x.type === 'PHOTO')
|
||||||
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.haloConfigs.basicConfig.auditModeEnabled) {
|
|
||||||
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;
|
|
||||||
|
|
||||||
const tempItems = res.items.map(item => {
|
item['videos'] = item.spec.content.medium
|
||||||
item.spec.user = {
|
.filter(x => x.type === 'VIDEO').map(item => {
|
||||||
displayName: this.bloggerInfo.nickname,
|
item.id = generateUUID()
|
||||||
avatar: this.$utils.checkAvatarUrl(this.bloggerInfo.avatar)
|
return item;
|
||||||
}
|
})
|
||||||
item.spec.content.medium.map(medium => {
|
|
||||||
medium.url = this.$utils.checkThumbnailUrl(medium.url, true)
|
|
||||||
})
|
|
||||||
|
|
||||||
item['images'] = item.spec.content.medium
|
item['audios'] = item.spec.content.medium
|
||||||
.filter(x => x.type === 'PHOTO')
|
.filter(x => x.type === 'AUDIO')
|
||||||
|
return item;
|
||||||
|
})
|
||||||
|
|
||||||
item['videos'] = item.spec.content.medium
|
if (this.isLoadMore) {
|
||||||
.filter(x => x.type === 'VIDEO')
|
this.dataList = this.dataList.concat(tempItems);
|
||||||
return item;
|
} else {
|
||||||
})
|
this.dataList = tempItems;
|
||||||
|
}
|
||||||
|
|
||||||
if (this.isLoadMore) {
|
this.$nextTick(() => {
|
||||||
this.dataList = this.dataList.concat(tempItems);
|
this.createVideoContexts(tempItems);
|
||||||
} else {
|
})
|
||||||
this.dataList = tempItems;
|
|
||||||
}
|
})
|
||||||
})
|
.catch(err => {
|
||||||
.catch(err => {
|
console.error(err);
|
||||||
console.error(err);
|
this.loading = 'error';
|
||||||
this.loading = 'error';
|
this.loadMoreText = '加载失败,请下拉刷新!';
|
||||||
this.loadMoreText = '加载失败,请下拉刷新!';
|
})
|
||||||
})
|
.finally(() => {
|
||||||
.finally(() => {
|
setTimeout(() => {
|
||||||
setTimeout(() => {
|
uni.hideLoading();
|
||||||
uni.hideLoading();
|
uni.stopPullDownRefresh();
|
||||||
uni.stopPullDownRefresh();
|
}, 500);
|
||||||
}, 500);
|
});
|
||||||
});
|
},
|
||||||
},
|
handlePreview(index, list) {
|
||||||
handlePreview(index, list) {
|
uni.previewImage({
|
||||||
uni.previewImage({
|
current: index,
|
||||||
current: index,
|
urls: list.map(item => item.url)
|
||||||
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>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
.app-page {
|
.app-page {
|
||||||
width: 100vw;
|
box-sizing: border-box;
|
||||||
display: flex;
|
width: 100vw;
|
||||||
flex-direction: column;
|
min-height: 100vh;
|
||||||
padding: 24rpx 0;
|
display: flex;
|
||||||
}
|
flex-direction: column;
|
||||||
|
padding: 24rpx 0;
|
||||||
|
}
|
||||||
|
|
||||||
.loading-wrap {
|
.loading-wrap {
|
||||||
padding: 24rpx;
|
padding: 24rpx;
|
||||||
}
|
}
|
||||||
|
|
||||||
.moment-card {
|
.moment-card {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
margin: 0 24rpx;
|
margin: 0 24rpx;
|
||||||
border-radius: 12rpx;
|
border-radius: 12rpx;
|
||||||
background-color: #ffff;
|
background-color: #ffff;
|
||||||
box-shadow: 0rpx 2rpx 24rpx rgba(0, 0, 0, 0.03);
|
box-shadow: 0rpx 2rpx 24rpx rgba(0, 0, 0, 0.03);
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
margin-bottom: 24rpx;
|
margin-bottom: 24rpx;
|
||||||
}
|
}
|
||||||
|
|
||||||
.head {
|
.head {
|
||||||
padding: 24rpx;
|
padding: 24rpx;
|
||||||
padding-bottom: 0;
|
padding-bottom: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.images {
|
.images {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-wrap: wrap;
|
flex-wrap: wrap;
|
||||||
align-items: flex-start;
|
align-items: flex-start;
|
||||||
padding: 24rpx;
|
padding: 24rpx;
|
||||||
padding-top: 0;
|
padding-top: 0;
|
||||||
|
|
||||||
.image-item {
|
.image-item {
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
border-radius: 24rpx;
|
border-radius: 24rpx;
|
||||||
padding: 6rpx;
|
padding: 6rpx;
|
||||||
width: 33%;
|
width: 33%;
|
||||||
height: 200rpx
|
height: 200rpx
|
||||||
}
|
}
|
||||||
|
|
||||||
&-1 {
|
&-1 {
|
||||||
> .image-item {
|
>.image-item {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 350rpx
|
height: 350rpx
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
&-2 {
|
&-2 {
|
||||||
> .image-item {
|
>.image-item {
|
||||||
width: 50%;
|
width: 50%;
|
||||||
height: 250rpx
|
height: 250rpx
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</style>
|
|
||||||
|
::v-deep .uni-audio-default {
|
||||||
|
width: 100%;
|
||||||
|
border-radius: 12rpx;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -18,7 +18,7 @@
|
|||||||
<!-- 加载完成区域 -->
|
<!-- 加载完成区域 -->
|
||||||
<block v-else>
|
<block v-else>
|
||||||
<view v-if="dataList.length === 0" class="list-empty flex flex-center">
|
<view v-if="dataList.length === 0" class="list-empty flex flex-center">
|
||||||
<tm-empty v-if="haloConfigs.basicConfig.auditModeEnabled" icon="icon-shiliangzhinengduixiang-" label="暂无归档的内容"></tm-empty>
|
<tm-empty v-if="calcAuditModeEnabled" icon="icon-shiliangzhinengduixiang-" label="暂无归档的内容"></tm-empty>
|
||||||
<tm-empty v-else icon="icon-shiliangzhinengduixiang-" label="暂无归档的文章"></tm-empty>
|
<tm-empty v-else icon="icon-shiliangzhinengduixiang-" label="暂无归档的文章"></tm-empty>
|
||||||
</view>
|
</view>
|
||||||
<view v-else class="e-timeline tm-timeline mt-24">
|
<view v-else class="e-timeline tm-timeline mt-24">
|
||||||
@@ -37,7 +37,7 @@
|
|||||||
<view class="flex time text-weight-b mb-24">
|
<view class="flex time text-weight-b mb-24">
|
||||||
<text>{{ item.year }}年</text>
|
<text>{{ item.year }}年</text>
|
||||||
<text v-if="tab.activeIndex === 0">{{ item.month }}月</text>
|
<text v-if="tab.activeIndex === 0">{{ item.month }}月</text>
|
||||||
<view v-if="haloConfigs.basicConfig.auditModeEnabled" class="text-size-s text-grey-darken-1 ml-12">
|
<view v-if="calcAuditModeEnabled" class="text-size-s text-grey-darken-1 ml-12">
|
||||||
(共 {{ item.posts.length }} 篇内容)
|
(共 {{ item.posts.length }} 篇内容)
|
||||||
</view>
|
</view>
|
||||||
<view v-else class="text-size-s text-grey-darken-1 ml-12">
|
<view v-else class="text-size-s text-grey-darken-1 ml-12">
|
||||||
@@ -128,7 +128,10 @@ export default {
|
|||||||
},
|
},
|
||||||
mockJson() {
|
mockJson() {
|
||||||
return this.$tm.vx.getters().getMockJson;
|
return this.$tm.vx.getters().getMockJson;
|
||||||
}
|
},
|
||||||
|
calcAuditModeEnabled() {
|
||||||
|
return this.haloConfigs.auditConfig.auditModeEnabled
|
||||||
|
},
|
||||||
},
|
},
|
||||||
created() {
|
created() {
|
||||||
this.fnGetData();
|
this.fnGetData();
|
||||||
@@ -139,7 +142,7 @@ export default {
|
|||||||
this.fnGetData();
|
this.fnGetData();
|
||||||
},
|
},
|
||||||
onReachBottom(e) {
|
onReachBottom(e) {
|
||||||
if (this.haloConfigs.basicConfig.auditModeEnabled) {
|
if (this.calcAuditModeEnabled) {
|
||||||
uni.showToast({
|
uni.showToast({
|
||||||
icon: 'none',
|
icon: 'none',
|
||||||
title: '没有更多数据了'
|
title: '没有更多数据了'
|
||||||
@@ -165,7 +168,7 @@ export default {
|
|||||||
this.fnToTopPage();
|
this.fnToTopPage();
|
||||||
},
|
},
|
||||||
fnGetData() {
|
fnGetData() {
|
||||||
if (this.haloConfigs.basicConfig.auditModeEnabled) {
|
if (this.calcAuditModeEnabled) {
|
||||||
const dataList = this.mockJson.archives.list.map(item => {
|
const dataList = this.mockJson.archives.list.map(item => {
|
||||||
const date = new Date(item.time)
|
const date = new Date(item.time)
|
||||||
const year = date.getFullYear()
|
const year = date.getFullYear()
|
||||||
@@ -353,7 +356,7 @@ export default {
|
|||||||
});
|
});
|
||||||
},
|
},
|
||||||
fnToArticleDetail(article) {
|
fnToArticleDetail(article) {
|
||||||
if (this.haloConfigs.basicConfig.auditModeEnabled) {
|
if (this.calcAuditModeEnabled) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
uni.navigateTo({
|
uni.navigateTo({
|
||||||
|
|||||||
+1478
-1386
File diff suppressed because it is too large
Load Diff
+228
-184
@@ -1,201 +1,245 @@
|
|||||||
<template>
|
<template>
|
||||||
<view class="app-page" :class="{ 'is-balck grey-darken-6': isBlackTheme }">
|
<view class="app-page" :class="[uniHaloPluginPageClass]">
|
||||||
<!-- 顶部切换 -->
|
<PluginUnavailable v-if="!uniHaloPluginAvailable" :pluginId="uniHaloPluginId"
|
||||||
<view class="e-fixed shadow-2">
|
:error-text="uniHaloPluginAvailableError" />
|
||||||
<tm-search v-model="queryParams.keyword" :round="24" :shadow="0" color="light-blue"
|
<template v-else>
|
||||||
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>
|
|
||||||
|
|
||||||
<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>
|
<tm-flotbutton @click="fnToTopPage" size="m" color="light-blue"
|
||||||
</view>
|
icon="icon-angle-up"></tm-flotbutton>
|
||||||
</view>
|
|
||||||
|
</block>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
</view>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import tmSkeleton from '@/tm-vuetify/components/tm-skeleton/tm-skeleton.vue';
|
import tmSkeleton from '@/tm-vuetify/components/tm-skeleton/tm-skeleton.vue';
|
||||||
import tmSearch from '@/tm-vuetify/components/tm-search/tm-search.vue';
|
import tmSearch from '@/tm-vuetify/components/tm-search/tm-search.vue';
|
||||||
import tmTranslate from '@/tm-vuetify/components/tm-translate/tm-translate.vue';
|
import tmTranslate from '@/tm-vuetify/components/tm-translate/tm-translate.vue';
|
||||||
import tmTabs from '@/tm-vuetify/components/tm-tabs/tm-tabs.vue';
|
import tmTabs from '@/tm-vuetify/components/tm-tabs/tm-tabs.vue';
|
||||||
import tmFlotbutton from '@/tm-vuetify/components/tm-flotbutton/tm-flotbutton.vue';
|
import tmFlotbutton from '@/tm-vuetify/components/tm-flotbutton/tm-flotbutton.vue';
|
||||||
import tmEmpty from '@/tm-vuetify/components/tm-empty/tm-empty.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 {
|
import MarkdownConfig from '@/common/markdown/markdown.config.js';
|
||||||
components: {
|
import mpHtml from '@/components/mp-html/components/mp-html/mp-html.vue';
|
||||||
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();
|
|
||||||
},
|
|
||||||
|
|
||||||
methods: {
|
import pluginAvailableMixin from "@/common/mixins/pluginAvailable.js"
|
||||||
fnOnTabChange(index) {
|
import PluginUnavailable from '@/components/plugin-unavailable/plugin-unavailable.vue'
|
||||||
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();
|
|
||||||
|
|
||||||
if (!this.queryParams.keyword) {
|
export default {
|
||||||
this.dataList = []
|
mixins: [pluginAvailableMixin],
|
||||||
} else {
|
components: {
|
||||||
this.fnGetData();
|
tmSkeleton,
|
||||||
}
|
tmSearch,
|
||||||
},
|
tmTranslate,
|
||||||
fnGetData() {
|
tmTabs,
|
||||||
if (this.haloConfigs.basicConfig.auditModeEnabled) {
|
tmFlotbutton,
|
||||||
return;
|
tmEmpty,
|
||||||
}
|
tmTags,
|
||||||
// 设置状态为加载中
|
mpHtml,
|
||||||
this.loading = 'loading';
|
PluginUnavailable
|
||||||
this.$httpApi.v2
|
},
|
||||||
.getPostListByKeyword(this.queryParams)
|
data() {
|
||||||
.then(res => {
|
return {
|
||||||
this.loading = 'success';
|
markdownConfig: MarkdownConfig,
|
||||||
this.dataList = res.hits;
|
loading: 'loading',
|
||||||
})
|
tab: {
|
||||||
.catch(err => {
|
activeIndex: 0,
|
||||||
console.error(err);
|
list: ['全部', '最新文章', '热门文章', '最近更新', '最多点赞']
|
||||||
this.loading = 'error';
|
},
|
||||||
})
|
queryParams: {
|
||||||
.finally(() => {
|
keyword: "",
|
||||||
setTimeout(() => {
|
limit: 50,
|
||||||
uni.hideLoading();
|
highlightPreTag: "",
|
||||||
uni.stopPullDownRefresh();
|
highlightPostTag: ""
|
||||||
}, 800);
|
},
|
||||||
});
|
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();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
//跳转文章详情
|
onPullDownRefresh() {
|
||||||
fnToArticleDetail(article) {
|
if (!this.uniHaloPluginAvailable) {
|
||||||
uni.navigateTo({
|
uni.hideLoading();
|
||||||
url: '/pagesA/article-detail/article-detail?name=' + article.metadataName,
|
uni.stopPullDownRefresh();
|
||||||
animationType: 'slide-in-right'
|
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>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
.app-page {
|
.app-page {
|
||||||
width: 100vw;
|
width: 100vw;
|
||||||
min-height: 100vh;
|
min-height: 100vh;
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
padding-bottom: 24rpx;
|
padding-bottom: 24rpx;
|
||||||
background-color: #fafafd;
|
background-color: #fafafd;
|
||||||
|
|
||||||
&.is-balck {
|
&.is-balck {
|
||||||
background-color: #212121;
|
background-color: #212121;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.content {
|
.content {
|
||||||
padding-top: 24rpx;
|
padding-top: 24rpx;
|
||||||
|
}
|
||||||
|
|
||||||
.content-empty {
|
.content-empty {
|
||||||
height: 60vh;
|
height: 60vh;
|
||||||
}
|
}
|
||||||
}
|
|
||||||
|
|
||||||
.article-card {
|
.article-card {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
margin: 0 24rpx;
|
margin: 0 24rpx;
|
||||||
padding: 24rpx;
|
padding: 24rpx;
|
||||||
border-radius: 12rpx;
|
border-radius: 12rpx;
|
||||||
background-color: #ffff;
|
background-color: #ffff;
|
||||||
box-shadow: 0rpx 2rpx 24rpx rgba(0, 0, 0, 0.03);
|
box-shadow: 0rpx 2rpx 24rpx rgba(0, 0, 0, 0.03);
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
margin-bottom: 24rpx;
|
margin-bottom: 24rpx;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
@@ -68,6 +68,18 @@ export default {
|
|||||||
this.queryParams.page = 0;
|
this.queryParams.page = 0;
|
||||||
this.fnGetData();
|
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) {
|
onReachBottom(e) {
|
||||||
if (this.hasNext) {
|
if (this.hasNext) {
|
||||||
this.queryParams.page += 1;
|
this.queryParams.page += 1;
|
||||||
|
|||||||
@@ -1,428 +1,454 @@
|
|||||||
<template>
|
<template>
|
||||||
<view class="app-page card-shadow">
|
<view class="app-page card-shadow" :class="[uniHaloPluginPageClass]">
|
||||||
<view v-if="loading != 'success'" class="loading-wrap">
|
<PluginUnavailable v-if="!uniHaloPluginAvailable" :pluginId="uniHaloPluginId"
|
||||||
<tm-skeleton model="listAvatr"></tm-skeleton>
|
:error-text="uniHaloPluginAvailableError" />
|
||||||
<tm-skeleton model="listAvatr"></tm-skeleton>
|
<template v-else>
|
||||||
<tm-skeleton model="listAvatr"></tm-skeleton>
|
<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>
|
<tm-skeleton model="listAvatr"></tm-skeleton>
|
||||||
<view v-else class="content" :class="{ 'bg-white': dataList.length !== 0 }">
|
<tm-skeleton model="listAvatr"></tm-skeleton>
|
||||||
<!-- 空数据 -->
|
<tm-skeleton model="listAvatr"></tm-skeleton>
|
||||||
<view v-if="dataList.length == 0" class="content-empty flex flex-center">
|
</view>
|
||||||
<tm-empty icon="icon-shiliangzhinengduixiang-" label="啊偶,博主还没有朋友呢~"></tm-empty>
|
<view v-else class="content" :class="{ 'bg-white': dataList.length !== 0 }">
|
||||||
</view>
|
<!-- 空数据 -->
|
||||||
|
<view v-if="dataList.length == 0" class="content-empty flex flex-center">
|
||||||
|
<tm-empty icon="icon-shiliangzhinengduixiang-" label="啊偶,博主还没有朋友呢~"></tm-empty>
|
||||||
|
</view>
|
||||||
|
|
||||||
<!-- 如果只有一个分组:使用列表的形式 dataList.length == 1 -->
|
<!-- 如果只有一个分组:使用列表的形式 dataList.length == 1 -->
|
||||||
<view v-else class="flex flex-col pb-24">
|
<view v-else class="flex flex-col pb-24">
|
||||||
<block v-for="(link, index) in dataList" :key="index">
|
<block v-for="(link, index) in dataList" :key="index">
|
||||||
<tm-translate animation-name="fadeUp" :wait="calcAniWait(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"
|
<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)">
|
:class="{ 'border-b-1': index !== dataList.length - 1 }" @click="fnOnLinkEvent(link)">
|
||||||
<view class="link-logo">
|
<view class="link-logo">
|
||||||
<cache-image class="link-logo_img" radius="12rpx" :url="link.spec.logo"
|
<cache-image class="link-logo_img" radius="12rpx" :url="link.spec.logo"
|
||||||
:fileMd5="link.spec.logo" mode="aspectFill"></cache-image>
|
:fileMd5="link.spec.logo" mode="aspectFill"></cache-image>
|
||||||
</view>
|
</view>
|
||||||
<view class="flex flex-col pl-30 info-detail">
|
<view class="flex flex-col pl-30 info-detail">
|
||||||
<view class="link-card_name text-size-l text-weight-b text-red">
|
<view class="link-card_name text-size-l text-weight-b text-red">
|
||||||
<tm-tags style="margin-right: 12rpx;margin-left: -2rpx;"
|
<tm-tags style="margin-right: 12rpx;margin-left: -2rpx;"
|
||||||
color="bg-gradient-light-blue-lighten" :shadow="0" size="s" model="fill">
|
color="bg-gradient-light-blue-lighten" :shadow="0" size="s" model="fill">
|
||||||
{{ link.spec.groupName || '暂未分组' }}
|
{{ link.spec.groupName || '暂未分组' }}
|
||||||
</tm-tags>
|
</tm-tags>
|
||||||
{{ link.spec.displayName }}
|
{{ link.spec.displayName }}
|
||||||
</view>
|
</view>
|
||||||
<view class="poup-tag mt-6" style="font-size: 28rpx;">
|
<view class="poup-tag mt-6" style="font-size: 28rpx;">
|
||||||
站点地址:{{ link.spec.url }}
|
站点地址:{{ link.spec.url }}
|
||||||
<!-- <tm-tags color="bg-gradient-amber-accent" :shadow="0" size="s" model="fill">
|
<!-- <tm-tags color="bg-gradient-amber-accent" :shadow="0" size="s" model="fill">
|
||||||
URL:{{ link.spec.url }}
|
URL:{{ link.spec.url }}
|
||||||
</tm-tags>
|
</tm-tags>
|
||||||
<tm-tags color=" bg-gradient-light-blue-lighten" :shadow="0" size="s" model="fill">
|
<tm-tags color=" bg-gradient-light-blue-lighten" :shadow="0" size="s" model="fill">
|
||||||
{{ link.spec.groupName || '暂未分组' }}
|
{{ link.spec.groupName || '暂未分组' }}
|
||||||
</tm-tags> -->
|
</tm-tags> -->
|
||||||
</view>
|
</view>
|
||||||
<view class="link-card_desc text-overflow mt-4" style="font-size: 28rpx;">
|
<view class="link-card_desc text-overflow mt-4" style="font-size: 28rpx;">
|
||||||
博客简介:{{ link.spec.description || '这个博主很懒,没写简介~' }}
|
博客简介:{{ link.spec.description || '这个博主很懒,没写简介~' }}
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<!-- 简洁版本 -->
|
<!-- 简洁版本 -->
|
||||||
<view v-else class="link-card flex ml-24 mr-24 pt-24 pb-24" @click="fnOnLinkEvent(link)">
|
<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>
|
<image class="logo shadow-6" :src="link.spec.logo" mode="aspectFill"></image>
|
||||||
<view class="info pl-24">
|
<view class="info pl-24">
|
||||||
<view class="name text-size-g">{{ link.spec.displayName }}</view>
|
<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 class="desc mt-12 text-size-s text-grey-darken-1">{{ link.spec.description }}
|
||||||
</view>
|
</view>
|
||||||
<view v-if="false" class="link mt-12 text-size-m text-grey-darken-1">
|
<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>
|
<text class="iconfont icon-link mr-6 text-size-s"></text>
|
||||||
{{ link.spec.url }}
|
{{ link.spec.url }}
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</tm-translate>
|
</tm-translate>
|
||||||
</block>
|
</block>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
<!-- 返回顶部 -->
|
<!-- 返回顶部 -->
|
||||||
<tm-flotbutton color="light-blue" @click="fnToTopPage" size="m" icon="icon-angle-up"></tm-flotbutton>
|
<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="申请"
|
<tm-flotbutton v-if="haloPluginConfigs.linksSubmitPlugin.enabled" :offset="[16,80]" label="申请"
|
||||||
actions-pos="left" :show-text="true" color="bg-gradient-orange-accent"
|
actions-pos="left" :show-text="true" color="bg-gradient-orange-accent"
|
||||||
@click="toSubmitLinkPage"></tm-flotbutton>
|
@click="toSubmitLinkPage"></tm-flotbutton>
|
||||||
<!-- 详情弹窗 -->
|
<!-- 详情弹窗 -->
|
||||||
<tm-poup v-model="detail.show" :width="640" height="auto" position="center" :round="6">
|
<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="poup pa-36" v-if="detail.data">
|
||||||
<view class="info flex">
|
<view class="info flex">
|
||||||
<view class="poup-logo bg-gradient-amber-accent pa-4 shadow-24">
|
<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>
|
<image class="poup-logo_img" :src="$utils.checkImageUrl(detail.data.spec.logo)"
|
||||||
</view>
|
mode="aspectFill"></image>
|
||||||
<view class="pl-24 info-detail">
|
</view>
|
||||||
<view class="poup-name text-size-lg text-weight-b">{{ detail.data.spec.displayName }}</view>
|
<view class="pl-24 info-detail">
|
||||||
<view class="poup-tag ml--10">
|
<view class="poup-name text-size-lg text-weight-b">{{ detail.data.spec.displayName }}
|
||||||
<tm-tags color="bg-gradient-light-blue-lighten" size="n" model="fill">
|
</view>
|
||||||
{{ detail.data.spec.groupName }}
|
<view class="poup-tag ml--10">
|
||||||
</tm-tags>
|
<tm-tags color="bg-gradient-light-blue-lighten" size="n" model="fill">
|
||||||
</view>
|
{{ detail.data.spec.groupName }}
|
||||||
<view class="poup-link text-size-m" @click="fnCopyLink(detail.data)">
|
</tm-tags>
|
||||||
<text class="text-orange">{{ detail.data.spec.url }}</text>
|
</view>
|
||||||
<text class="iconfont icon-copy text-size-s ml-6 text-grey"></text>
|
<view class="poup-link text-size-m" @click="fnCopyLink(detail.data)">
|
||||||
</view>
|
<text class="text-orange">{{ detail.data.spec.url }}</text>
|
||||||
</view>
|
<text class="iconfont icon-copy text-size-s ml-6 text-grey"></text>
|
||||||
</view>
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
<view class="poup-desc mt-20">
|
<view class="poup-desc mt-20">
|
||||||
博客简介:{{ detail.data.spec.description || '这个博主很懒,没写简介~' }}
|
博客简介:{{ detail.data.spec.description || '这个博主很懒,没写简介~' }}
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
<!-- 博客预览图 -->
|
<!-- 博客预览图 -->
|
||||||
<view class="mt-24">
|
<view class="mt-24">
|
||||||
<tm-images :width="568" :round="2" :src="calcSiteThumbnail(detail.data.spec.url)"
|
<tm-images :width="568" :round="2" :src="calcSiteThumbnail(detail.data.spec.url)"
|
||||||
mode="aspectFill"></tm-images>
|
mode="aspectFill"></tm-images>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</tm-poup>
|
</tm-poup>
|
||||||
|
|
||||||
<view class="load-text">{{ loadMoreText }}</view>
|
<view class="load-text">{{ loadMoreText }}</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</template>
|
||||||
|
</view>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import tmSkeleton from '@/tm-vuetify/components/tm-skeleton/tm-skeleton.vue';
|
import tmSkeleton from '@/tm-vuetify/components/tm-skeleton/tm-skeleton.vue';
|
||||||
import tmTranslate from '@/tm-vuetify/components/tm-translate/tm-translate.vue';
|
import tmTranslate from '@/tm-vuetify/components/tm-translate/tm-translate.vue';
|
||||||
import tmFlotbutton from '@/tm-vuetify/components/tm-flotbutton/tm-flotbutton.vue';
|
import tmFlotbutton from '@/tm-vuetify/components/tm-flotbutton/tm-flotbutton.vue';
|
||||||
import tmTags from '@/tm-vuetify/components/tm-tags/tm-tags.vue';
|
import tmTags from '@/tm-vuetify/components/tm-tags/tm-tags.vue';
|
||||||
import tmEmpty from '@/tm-vuetify/components/tm-empty/tm-empty.vue';
|
import tmEmpty from '@/tm-vuetify/components/tm-empty/tm-empty.vue';
|
||||||
import tmImages from '@/tm-vuetify/components/tm-images/tm-images.vue';
|
import tmImages from '@/tm-vuetify/components/tm-images/tm-images.vue';
|
||||||
import tmPoup from '@/tm-vuetify/components/tm-poup/tm-poup.vue';
|
import tmPoup from '@/tm-vuetify/components/tm-poup/tm-poup.vue';
|
||||||
|
|
||||||
export default {
|
import pluginAvailableMixin from "@/common/mixins/pluginAvailable.js"
|
||||||
components: {
|
import PluginUnavailable from '@/components/plugin-unavailable/plugin-unavailable.vue'
|
||||||
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);
|
|
||||||
|
|
||||||
})
|
export default {
|
||||||
.catch(err => {
|
mixins: [pluginAvailableMixin],
|
||||||
console.error(err);
|
components: {
|
||||||
this.loading = 'error';
|
tmSkeleton,
|
||||||
this.loadMoreText = '加载失败,请下拉刷新!';
|
tmTranslate,
|
||||||
})
|
tmFlotbutton,
|
||||||
.finally(() => {
|
tmTags,
|
||||||
setTimeout(() => {
|
tmEmpty,
|
||||||
uni.hideLoading();
|
tmImages,
|
||||||
uni.stopPullDownRefresh();
|
tmPoup,
|
||||||
}, 500);
|
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 => {
|
||||||
|
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.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 = {}
|
.catch(err => {
|
||||||
list.forEach(item => {
|
console.error(err);
|
||||||
if (group[item.spec.groupName]) {
|
this.loading = 'error';
|
||||||
group[item.spec.groupName].children.push(item)
|
this.loadMoreText = '加载失败,请下拉刷新!';
|
||||||
} else {
|
})
|
||||||
group[item.spec.groupName] = {
|
.finally(() => {
|
||||||
title: item.spec.groupName,
|
setTimeout(() => {
|
||||||
children: [item]
|
uni.hideLoading();
|
||||||
}
|
uni.stopPullDownRefresh();
|
||||||
}
|
}, 500);
|
||||||
})
|
});
|
||||||
|
},
|
||||||
|
|
||||||
return Object.keys(group).map(key => {
|
handleGroup(list) {
|
||||||
const {
|
const group = {}
|
||||||
title,
|
list.forEach(item => {
|
||||||
children = []
|
if (group[item.spec.groupName]) {
|
||||||
} = group[key]
|
group[item.spec.groupName].children.push(item)
|
||||||
return {
|
} else {
|
||||||
title,
|
group[item.spec.groupName] = {
|
||||||
children
|
title: item.spec.groupName,
|
||||||
}
|
children: [item]
|
||||||
})
|
}
|
||||||
},
|
}
|
||||||
fnOnLinkEvent(link) {
|
})
|
||||||
this.detail.data = link;
|
|
||||||
this.detail.show = true;
|
|
||||||
},
|
|
||||||
|
|
||||||
fnCopyLink(link) {
|
return Object.keys(group).map(key => {
|
||||||
uni.setClipboardData({
|
const {
|
||||||
data: `${link.spec.displayName}:${link.spec.url}`,
|
title,
|
||||||
showToast: false,
|
children = []
|
||||||
success: () => {
|
} = group[key]
|
||||||
uni.showToast({
|
return {
|
||||||
icon: 'none',
|
title,
|
||||||
title: '链接复制成功!'
|
children
|
||||||
});
|
}
|
||||||
},
|
})
|
||||||
fail: () => {
|
},
|
||||||
uni.showToast({
|
fnOnLinkEvent(link) {
|
||||||
icon: 'none',
|
this.detail.data = link;
|
||||||
title: '复制失败!'
|
this.detail.show = true;
|
||||||
});
|
},
|
||||||
}
|
|
||||||
});
|
fnCopyLink(link) {
|
||||||
},
|
uni.setClipboardData({
|
||||||
toSubmitLinkPage() {
|
data: `${link.spec.displayName}:${link.spec.url}`,
|
||||||
uni.navigateTo({
|
showToast: false,
|
||||||
url: '/pagesA/submit-link/submit-link'
|
success: () => {
|
||||||
})
|
uni.showToast({
|
||||||
}
|
icon: 'none',
|
||||||
}
|
title: '链接复制成功!'
|
||||||
};
|
});
|
||||||
|
},
|
||||||
|
fail: () => {
|
||||||
|
uni.showToast({
|
||||||
|
icon: 'none',
|
||||||
|
title: '复制失败!'
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
toSubmitLinkPage() {
|
||||||
|
uni.navigateTo({
|
||||||
|
url: '/pagesA/submit-link/submit-link'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
.app-page {
|
.app-page {
|
||||||
width: 100vw;
|
width: 100vw;
|
||||||
min-height: 100vh;
|
min-height: 100vh;
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
background-color: #fafafd;
|
background-color: #fafafd;
|
||||||
}
|
}
|
||||||
|
|
||||||
.loading-wrap {
|
.loading-wrap {
|
||||||
padding: 24rpx;
|
padding: 24rpx;
|
||||||
min-height: 100vh;
|
min-height: 100vh;
|
||||||
}
|
}
|
||||||
|
|
||||||
.content {
|
.content {
|
||||||
padding: 0 24rpx;
|
padding: 0 24rpx;
|
||||||
padding-top: 24rpx;
|
padding-top: 24rpx;
|
||||||
|
|
||||||
.content-empty {
|
.content-empty {
|
||||||
height: 60vh;
|
height: 60vh;
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.link-card {
|
.link-card {
|
||||||
border-bottom: 2rpx solid #f5f5f5;
|
border-bottom: 2rpx solid #f5f5f5;
|
||||||
background-color: #ffffff;
|
background-color: #ffffff;
|
||||||
|
|
||||||
&.one {
|
&.one {
|
||||||
border: 0;
|
border: 0;
|
||||||
box-shadow: 0rpx 2rpx 24rpx 0rpx rgba(0, 0, 0, 0.03);
|
box-shadow: 0rpx 2rpx 24rpx 0rpx rgba(0, 0, 0, 0.03);
|
||||||
|
|
||||||
.logo {
|
.logo {
|
||||||
box-shadow: 0rpx 2rpx 12rpx rgba(0, 0, 0, 0.1);
|
box-shadow: 0rpx 2rpx 12rpx rgba(0, 0, 0, 0.1);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.logo {
|
.logo {
|
||||||
// width: 126rpx;
|
// width: 126rpx;
|
||||||
// height: 126rpx;
|
// height: 126rpx;
|
||||||
width: 80rpx;
|
width: 80rpx;
|
||||||
height: 80rpx;
|
height: 80rpx;
|
||||||
border-radius: 12rpx;
|
border-radius: 12rpx;
|
||||||
border: 6rpx solid #ffffff;
|
border: 6rpx solid #ffffff;
|
||||||
box-shadow: none;
|
box-shadow: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
.info {
|
.info {
|
||||||
width: 0;
|
width: 0;
|
||||||
flex-grow: 1;
|
flex-grow: 1;
|
||||||
|
|
||||||
.name {
|
.name {
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
text-overflow: ellipsis;
|
text-overflow: ellipsis;
|
||||||
color: #303133;
|
color: #303133;
|
||||||
font-size: 30rpx;
|
font-size: 30rpx;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
}
|
}
|
||||||
|
|
||||||
.desc {
|
.desc {
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
text-overflow: ellipsis;
|
text-overflow: ellipsis;
|
||||||
color: #303133;
|
color: #303133;
|
||||||
font-size: 28rpx;
|
font-size: 28rpx;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.link-card_name {
|
.link-card_name {
|
||||||
// color: #303133;
|
// color: #303133;
|
||||||
// color: #0080fe;
|
// color: #0080fe;
|
||||||
}
|
}
|
||||||
|
|
||||||
.link-card_desc {
|
.link-card_desc {
|
||||||
font-size: 24rpx;
|
font-size: 24rpx;
|
||||||
line-height: 1.6;
|
line-height: 1.6;
|
||||||
color: #303133;
|
color: #303133;
|
||||||
}
|
}
|
||||||
|
|
||||||
.link-logo {
|
.link-logo {
|
||||||
width: 140rpx;
|
width: 140rpx;
|
||||||
height: 140rpx;
|
height: 140rpx;
|
||||||
|
|
||||||
&_img {
|
&_img {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.poup-logo {
|
.poup-logo {
|
||||||
width: 140rpx;
|
width: 140rpx;
|
||||||
height: 140rpx;
|
height: 140rpx;
|
||||||
border-radius: 50%;
|
border-radius: 50%;
|
||||||
|
|
||||||
&_img {
|
&_img {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
border-radius: 50%;
|
border-radius: 50%;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.info-detail {
|
.info-detail {
|
||||||
width: 0;
|
width: 0;
|
||||||
flex-grow: 1;
|
flex-grow: 1;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
.poup-desc {
|
.poup-desc {
|
||||||
font-size: 28rpx;
|
font-size: 28rpx;
|
||||||
line-height: 1.6;
|
line-height: 1.6;
|
||||||
color: #555 !important;
|
color: #555 !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
.preview-site {
|
.preview-site {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 300rpx;
|
height: 300rpx;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
@@ -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>
|
||||||
@@ -40,7 +40,7 @@
|
|||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
<video v-else class="video-bg" :object-fit="startConfig.bgVideoFit" :src="startConfig.bgVideo" :loop="true"
|
<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"
|
: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-center-play-btn="false" :show-loading="false" :enable-progress-gesture="false"
|
||||||
:show-progress="false"></video>
|
:show-progress="false"></video>
|
||||||
|
|||||||
@@ -53,7 +53,7 @@
|
|||||||
<view class="poup pa-36" scroll-y="auto">
|
<view class="poup pa-36" scroll-y="auto">
|
||||||
<view class="info flex">
|
<view class="info flex">
|
||||||
<view class="poup-logo pa-4 shadow-24">
|
<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>
|
||||||
<view class="pl-24 info-detail">
|
<view class="pl-24 info-detail">
|
||||||
<view class="poup-name text-size-lg text-weight-b">{{ blogDetail.blogName }}</view>
|
<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 tmImages from '@/tm-vuetify/components/tm-images/tm-images.vue'
|
||||||
import tmTags from '@/tm-vuetify/components/tm-tags/tm-tags.vue'
|
import tmTags from '@/tm-vuetify/components/tm-tags/tm-tags.vue'
|
||||||
import tmCoupon from '@/tm-vuetify/components/tm-coupon/tm-coupon.vue'
|
import tmCoupon from '@/tm-vuetify/components/tm-coupon/tm-coupon.vue'
|
||||||
|
import $utils from "@/utils";
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
components: {
|
components: {
|
||||||
@@ -128,11 +129,14 @@ export default {
|
|||||||
};
|
};
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
|
$utils() {
|
||||||
|
return $utils
|
||||||
|
},
|
||||||
haloPluginConfigs(){
|
haloPluginConfigs(){
|
||||||
return this.$tm.vx.getters().getConfigs.pluginConfig;
|
return this.$tm.vx.getters().getConfigs.pluginConfig;
|
||||||
},
|
},
|
||||||
blogDetail() {
|
blogDetail() {
|
||||||
return this.haloPluginConfigs.submitLink;
|
return this.haloPluginConfigs.linksSubmitPlugin;
|
||||||
},
|
},
|
||||||
calcSiteThumbnail(val) {
|
calcSiteThumbnail(val) {
|
||||||
return val => {
|
return val => {
|
||||||
@@ -147,13 +151,13 @@ export default {
|
|||||||
return `
|
return `
|
||||||
博客名称:${this.blogDetail.blogName}
|
博客名称:${this.blogDetail.blogName}
|
||||||
博客地址:${this.blogDetail.blogUrl}
|
博客地址:${this.blogDetail.blogUrl}
|
||||||
博客logo:${this.blogDetail.blogLogo}
|
博客logo:${$utils.checkAvatarUrl(this.blogDetail.blogLogo)}
|
||||||
博客简介:${this.blogDetail.blogDesc}
|
博客简介:${this.blogDetail.blogDesc}
|
||||||
`
|
`
|
||||||
},
|
},
|
||||||
calcBlogCoupon() {
|
calcBlogCoupon() {
|
||||||
return {
|
return {
|
||||||
img: this.blogDetail.blogLogo,
|
img: $utils.checkAvatarUrl(this.blogDetail.blogLogo),
|
||||||
title: this.blogDetail.blogName,
|
title: this.blogDetail.blogName,
|
||||||
time: this.blogDetail.blogDesc,
|
time: this.blogDetail.blogDesc,
|
||||||
btnText: '友链详情'
|
btnText: '友链详情'
|
||||||
|
|||||||
@@ -0,0 +1,771 @@
|
|||||||
|
<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 v-if="vote.spec.type==='single'" color="light-blue" :shadow="0" size="xs"
|
||||||
|
model="fill">单选</tm-tags>
|
||||||
|
<tm-tags v-else-if="vote.spec.type==='multiple'" color="light-blue" :shadow="0" size="xs"
|
||||||
|
model="fill">多选</tm-tags>
|
||||||
|
<tm-tags v-else-if="vote.spec.type==='pk'" color="light-blue" :shadow="0" size="xs"
|
||||||
|
model="fill">双选PK</tm-tags>
|
||||||
|
</view>
|
||||||
|
<view class="">
|
||||||
|
投票状态:<tm-tags v-if="vote.spec._state=='已结束'" color="red" size="xs" :shadow="0"
|
||||||
|
model="fill">已结束</tm-tags>
|
||||||
|
<tm-tags v-else-if="vote.spec._state=='未开始'" color="orange" size="xs" :shadow="0"
|
||||||
|
model="fill">
|
||||||
|
未开始
|
||||||
|
</tm-tags>
|
||||||
|
<tm-tags v-else-if="vote.spec._state=='进行中'" color="green" size="xs" :shadow="0"
|
||||||
|
model="fill">
|
||||||
|
进行中
|
||||||
|
</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">
|
||||||
|
<view v-for="(option,optionIndex) in vote.spec.options" :key="optionIndex"
|
||||||
|
class="is-voted-item" :class="[option.checked?'selected':'']" :style="{
|
||||||
|
'--percent':option.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.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">
|
||||||
|
<view v-for="(option,optionIndex) in vote.spec.options" :key="optionIndex"
|
||||||
|
class="is-voted-item" :class="[option.checked?'selected':'']" :style="{
|
||||||
|
'--percent':option.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.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.percent + '%'}">
|
||||||
|
<view class="option-item"
|
||||||
|
:class="[optionIndex==0?'option-item-left':'option-item-right']">
|
||||||
|
{{option.percent }}%
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="option-foot w-full flex flex-col uh-gap-8">
|
||||||
|
<template v-if="vote.spec.isVoted">
|
||||||
|
<view v-for="(option,optionIndex) in vote.spec.options" :key="optionIndex"
|
||||||
|
class="is-voted-item" :class="[option.checked?'selected':'']" :style="{
|
||||||
|
'--percent': option.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.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="!vote.spec.canAnonymously" theme="red" :shadow="0" class="w-full" text
|
||||||
|
:block="true" @click="handleSubmit()">不支持匿名投票</tm-button>
|
||||||
|
<tm-button v-else-if="fnCalcIsVoted()" theme="white" text :block="true"
|
||||||
|
class="w-full">您已参与投票</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 {
|
||||||
|
voteCacheUtil
|
||||||
|
} from '@/utils/vote.js'
|
||||||
|
|
||||||
|
const types = {
|
||||||
|
"pk": "双选PK",
|
||||||
|
"multiple": "多选",
|
||||||
|
"single": "单选"
|
||||||
|
}
|
||||||
|
|
||||||
|
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 = "投票详情" + `(${types[res.vote.spec.type]})`
|
||||||
|
|
||||||
|
const tempVoteRes = res;
|
||||||
|
|
||||||
|
tempVoteRes.vote.spec.isVoted = this.fnCalcIsVoted()
|
||||||
|
tempVoteRes.vote.spec.disabled = this.fnCalcIsVoted()
|
||||||
|
tempVoteRes.vote.spec._state = this.handleCalcVoteState(tempVoteRes.vote)
|
||||||
|
|
||||||
|
tempVoteRes.vote.spec.options.map((option, index) => {
|
||||||
|
option.value = option.id
|
||||||
|
option.label = option.title
|
||||||
|
option.isVoted = this.fnCalcIsVoted()
|
||||||
|
option.checked = this.fnCalcIsChecked(option)
|
||||||
|
|
||||||
|
if (tempVoteRes.vote.spec.type === 'single') {
|
||||||
|
option.percent = this.fnCalcPercent(option, tempVoteRes.vote.stats);
|
||||||
|
} else if (tempVoteRes.vote.spec.type === 'multiple') {
|
||||||
|
option.percent = this.fnCalcPercent(option, tempVoteRes.vote.stats);
|
||||||
|
} else if (tempVoteRes.vote.spec.type === 'pk') {
|
||||||
|
option.percent = this.fnCalcPercent(option, tempVoteRes.vote.stats);
|
||||||
|
}
|
||||||
|
|
||||||
|
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")
|
||||||
|
})
|
||||||
|
},
|
||||||
|
fnCalcPercent(voteOption, stats) {
|
||||||
|
if (!this.fnCalcIsVoted()) return 0;
|
||||||
|
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() {
|
||||||
|
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
|
||||||
|
},
|
||||||
|
handleCalcVoteState(vote) {
|
||||||
|
if (vote.spec.timeLimit !== 'custom') {
|
||||||
|
return vote.spec.hasEnd ? "已结束" : "进行中"
|
||||||
|
}
|
||||||
|
|
||||||
|
const nowTime = new Date().getTime()
|
||||||
|
const startTime = new Date(vote.spec.startDate).getTime()
|
||||||
|
const endTime = new Date(vote.spec.endDate).getTime()
|
||||||
|
|
||||||
|
if (nowTime < startTime) {
|
||||||
|
return "未开始"
|
||||||
|
}
|
||||||
|
if (nowTime < endTime) {
|
||||||
|
return "进行中"
|
||||||
|
}
|
||||||
|
return vote.spec.hasEnd ? "已结束" : "进行中"
|
||||||
|
},
|
||||||
|
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() {
|
||||||
|
this.showToast("请选择选项后继续")
|
||||||
|
},
|
||||||
|
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._state == '未开始') {
|
||||||
|
this.showToast(`投票未开始`)
|
||||||
|
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._state == '未开始') {
|
||||||
|
this.showToast(`投票未开始`)
|
||||||
|
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,422 @@
|
|||||||
|
<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 {
|
||||||
|
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._state = this.handleCalcVoteState(item)
|
||||||
|
item.spec.options.map((option, index) => {
|
||||||
|
|
||||||
|
option.checked = this.fnCalcIsChecked(item.metadata.name, option)
|
||||||
|
option.value = option.id
|
||||||
|
option.label = option.title
|
||||||
|
|
||||||
|
// todo:计算当前的选择占比
|
||||||
|
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
|
||||||
|
},
|
||||||
|
handleCalcVoteState(vote) {
|
||||||
|
if (vote.spec.timeLimit !== 'custom') {
|
||||||
|
return vote.spec.hasEnd ? "已结束" : "进行中"
|
||||||
|
}
|
||||||
|
|
||||||
|
const nowTime = new Date().getTime()
|
||||||
|
const startTime = new Date(vote.spec.startDate).getTime()
|
||||||
|
const endTime = new Date(vote.spec.endDate).getTime()
|
||||||
|
|
||||||
|
if (nowTime < startTime) {
|
||||||
|
return "未开始"
|
||||||
|
}
|
||||||
|
if (nowTime < endTime) {
|
||||||
|
return "进行中"
|
||||||
|
}
|
||||||
|
return vote.spec.hasEnd ? "已结束" : "进行中"
|
||||||
|
},
|
||||||
|
//跳转详情
|
||||||
|
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) {
|
onLoad(e) {
|
||||||
const {title, url} = JSON.parse(e.query.data);
|
const {title, url} = JSON.parse(e.data);
|
||||||
this.webUrl = url;
|
this.webUrl = decodeURIComponent(url);
|
||||||
this.fnSetPageTitle(title);
|
console.log("webUrl" + this.webUrl)
|
||||||
|
if (title) {
|
||||||
|
this.fnSetPageTitle(title);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|||||||
+10
-5
@@ -5,9 +5,10 @@
|
|||||||
* 时间:2024年06月22日 12:00:44
|
* 时间:2024年06月22日 12:00:44
|
||||||
* 版本:v0.1.0
|
* 版本:v0.1.0
|
||||||
*/
|
*/
|
||||||
import {DefaultAppConfigs, getAppConfigs, setAppConfigs,setAppMockJson,getAppMockJson} from '@/config/index.js'
|
import {DefaultAppConfigs, getAppConfigs, getAppMockJson, setAppConfigs, setAppMockJson} from '@/config/index.js'
|
||||||
import v2Config from '@/api/v2/all.config.js'
|
import v2Config from '@/api/v2/all.config.js'
|
||||||
import utils from '@/utils/index.js'
|
import utils from '@/utils/index.js'
|
||||||
|
import {setTokens} from "@/utils/token";
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
namespaced: true,
|
namespaced: true,
|
||||||
@@ -21,7 +22,7 @@ export default {
|
|||||||
return getAppConfigs()
|
return getAppConfigs()
|
||||||
},
|
},
|
||||||
getMockJson(state) {
|
getMockJson(state) {
|
||||||
if(state.mockJson) return state.mockJson;
|
if (state.mockJson) return state.mockJson;
|
||||||
return getAppMockJson()
|
return getAppMockJson()
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
@@ -36,12 +37,17 @@ export default {
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
actions: {
|
actions: {
|
||||||
fetchConfigs({commit, dispatch}) {
|
fetchConfigs({state, commit, dispatch}) {
|
||||||
return new Promise(async (resolve, reject) => {
|
return new Promise(async (resolve, reject) => {
|
||||||
try {
|
try {
|
||||||
const res = await v2Config.getAppConfigs()
|
const res = await v2Config.getAppConfigs()
|
||||||
if (res) {
|
if (res) {
|
||||||
commit('setConfigs', res)
|
commit('setConfigs', utils.deepMerge(DefaultAppConfigs, res))
|
||||||
|
|
||||||
|
// 存储token
|
||||||
|
if (res?.basicConfig?.tokenConfig) {
|
||||||
|
setTokens(res.basicConfig.tokenConfig)
|
||||||
|
}
|
||||||
resolve(res)
|
resolve(res)
|
||||||
} else {
|
} else {
|
||||||
dispatch("setDefaultAppSettings");
|
dispatch("setDefaultAppSettings");
|
||||||
@@ -65,7 +71,6 @@ export default {
|
|||||||
url: mockJsonUrl,
|
url: mockJsonUrl,
|
||||||
method: "GET",
|
method: "GET",
|
||||||
success: (res) => {
|
success: (res) => {
|
||||||
console.log("mockJson", res.data)
|
|
||||||
commit('setMockJson', res.data)
|
commit('setMockJson', res.data)
|
||||||
resolve({
|
resolve({
|
||||||
ok: true,
|
ok: true,
|
||||||
|
|||||||
@@ -2,7 +2,7 @@
|
|||||||
<view @click="onclick" class=" tm-checkbox " :class="[dense?'':'pa-20',inline?'d-inline-block':'']">
|
<view @click="onclick" class=" tm-checkbox " :class="[dense?'':'pa-20',inline?'d-inline-block':'']">
|
||||||
<view class=" flex-start">
|
<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"
|
<view :style="{width: sizes.wk,height: sizes.wk}" class="tm-checkbox-boey relative d-inline-block"
|
||||||
:class="[black?'bk':'','flex-shrink mr-10',
|
:class="[black?'bk':'','flex-shrink mr-10',
|
||||||
changValue?'ani':'',
|
changValue?'ani':'',
|
||||||
@@ -51,6 +51,10 @@
|
|||||||
*/
|
*/
|
||||||
import tmIcons from "@/tm-vuetify/components/tm-icons/tm-icons.vue"
|
import tmIcons from "@/tm-vuetify/components/tm-icons/tm-icons.vue"
|
||||||
export default {
|
export default {
|
||||||
|
options: {
|
||||||
|
virtualHost: true,
|
||||||
|
styleIsolation: 'shared'
|
||||||
|
},
|
||||||
components:{tmIcons},
|
components:{tmIcons},
|
||||||
name: 'tm-checkbox',
|
name: 'tm-checkbox',
|
||||||
model: {
|
model: {
|
||||||
@@ -117,6 +121,10 @@
|
|||||||
fllowTheme:{
|
fllowTheme:{
|
||||||
type:Boolean|String,
|
type:Boolean|String,
|
||||||
default:true
|
default:true
|
||||||
|
},
|
||||||
|
extendData:{
|
||||||
|
type:Object,
|
||||||
|
default:()=>({})
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
|
|||||||
@@ -100,8 +100,6 @@ export default {
|
|||||||
},
|
},
|
||||||
//向列表添加数据
|
//向列表添加数据
|
||||||
pushData(list) {
|
pushData(list) {
|
||||||
console.log('添加图片数据----------',list)
|
|
||||||
|
|
||||||
let prIdx_i = this.list2.length;
|
let prIdx_i = this.list2.length;
|
||||||
if (!Array.isArray(list) || typeof list == 'undefined') {
|
if (!Array.isArray(list) || typeof list == 'undefined') {
|
||||||
return false;
|
return false;
|
||||||
@@ -122,8 +120,6 @@ export default {
|
|||||||
return this.dataList;
|
return this.dataList;
|
||||||
},
|
},
|
||||||
async loadimg(event, isLoad, index) {
|
async loadimg(event, isLoad, index) {
|
||||||
console.log('图片加载事件----------',event)
|
|
||||||
|
|
||||||
this.isLoading = true;
|
this.isLoading = true;
|
||||||
let ps = this.list2[index];
|
let ps = this.list2[index];
|
||||||
ps.isLoad = true;
|
ps.isLoad = true;
|
||||||
|
|||||||
@@ -17,6 +17,10 @@
|
|||||||
*
|
*
|
||||||
*/
|
*/
|
||||||
export default {
|
export default {
|
||||||
|
options: {
|
||||||
|
virtualHost: true,
|
||||||
|
styleIsolation: 'shared'
|
||||||
|
},
|
||||||
name:'tm-groupcheckbox',
|
name:'tm-groupcheckbox',
|
||||||
props:{
|
props:{
|
||||||
// 最大选择数量
|
// 最大选择数量
|
||||||
|
|||||||
@@ -15,13 +15,13 @@
|
|||||||
<!-- <view class="tm-poup-wk bottom">{{ show ? 'on' : 'off'}}</view> -->
|
<!-- <view class="tm-poup-wk bottom">{{ show ? 'on' : 'off'}}</view> -->
|
||||||
<scroll-view :animation="aniData" @click.stop.prevent="" class="tm-poup-wk dhshiKa" scroll-y="true" :class="[
|
<scroll-view :animation="aniData" @click.stop.prevent="" class="tm-poup-wk dhshiKa" scroll-y="true" :class="[
|
||||||
position_sv == 'top'?'round-b-' + round:'',
|
position_sv == 'top'?'round-b-' + round:'',
|
||||||
position_sv == 'bottom'?'round-t-' + round:'',
|
position_sv == 'bottom'?'round-t-' + round:'',
|
||||||
position_sv, aniOn ? 'on ' : 'off',
|
position_sv, aniOn ? 'on ' : 'off',
|
||||||
black_tmeme ? 'grey-darken-5 bk' : bgColor
|
black_tmeme ? 'grey-darken-5 bk' : bgColor
|
||||||
]" :style="{
|
]" :style="{
|
||||||
width: (position_sv == 'top' || position_sv == 'bottom') ? '100%' : width_w,
|
width: (position_sv == 'top' || position_sv == 'bottom') ? '100%' : width_w,
|
||||||
height: position_sv == 'right' || position_sv == 'left' ?'100%' : height_h,
|
height: position_sv == 'right' || position_sv == 'left' ?'100%' : height_h,
|
||||||
|
|
||||||
}">
|
}">
|
||||||
<view :class="[clssStyle]" >
|
<view :class="[clssStyle]" >
|
||||||
<slot></slot>
|
<slot></slot>
|
||||||
@@ -178,7 +178,7 @@
|
|||||||
dhshiKa:true,//是否结束动画
|
dhshiKa:true,//是否结束动画
|
||||||
aniData:null,
|
aniData:null,
|
||||||
timdiiid:6369784254,
|
timdiiid:6369784254,
|
||||||
|
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
deactivated() {
|
deactivated() {
|
||||||
@@ -198,7 +198,7 @@
|
|||||||
this.close();
|
this.close();
|
||||||
},
|
},
|
||||||
close() {
|
close() {
|
||||||
let t = this;
|
let t = this;
|
||||||
clearTimeout(this.timdiiid)
|
clearTimeout(this.timdiiid)
|
||||||
this.dhshiKa=false;
|
this.dhshiKa=false;
|
||||||
t.aniOn=false;
|
t.aniOn=false;
|
||||||
@@ -213,18 +213,18 @@
|
|||||||
open() {
|
open() {
|
||||||
let t = this;
|
let t = this;
|
||||||
clearTimeout(this.timdiiid)
|
clearTimeout(this.timdiiid)
|
||||||
|
|
||||||
|
|
||||||
this.dhshiKa=false
|
this.dhshiKa=false
|
||||||
this.aniOn=true;
|
this.aniOn=true;
|
||||||
|
|
||||||
this.createBtT(this.position_sv,'on').then(()=>{
|
this.createBtT(this.position_sv,'on').then(()=>{
|
||||||
t.dhshiKa=true
|
t.dhshiKa=true
|
||||||
|
|
||||||
t.isclick=false
|
t.isclick=false
|
||||||
// console.log('on');
|
// console.log('on');
|
||||||
})
|
})
|
||||||
|
|
||||||
},
|
},
|
||||||
//下至上。
|
//下至上。
|
||||||
createBtT(pos,type){
|
createBtT(pos,type){
|
||||||
@@ -239,60 +239,60 @@
|
|||||||
if(type=='on'){
|
if(type=='on'){
|
||||||
aniData.translateY('0%').step();
|
aniData.translateY('0%').step();
|
||||||
this.aniData = aniData.export()
|
this.aniData = aniData.export()
|
||||||
|
|
||||||
}
|
}
|
||||||
if(type=='off'){
|
if(type=='off'){
|
||||||
aniData.translateY('100%').step();
|
aniData.translateY('100%').step();
|
||||||
this.aniData = aniData.export()
|
this.aniData = aniData.export()
|
||||||
|
|
||||||
}
|
}
|
||||||
}else if(pos=='top'){
|
}else if(pos=='top'){
|
||||||
if(type=='on'){
|
if(type=='on'){
|
||||||
aniData.translateY('0%').step();
|
aniData.translateY('0%').step();
|
||||||
this.aniData = aniData.export()
|
this.aniData = aniData.export()
|
||||||
|
|
||||||
}
|
}
|
||||||
if(type=='off'){
|
if(type=='off'){
|
||||||
aniData.translateY('-100%').step();
|
aniData.translateY('-100%').step();
|
||||||
this.aniData = aniData.export()
|
this.aniData = aniData.export()
|
||||||
|
|
||||||
}
|
}
|
||||||
}else if(pos=='left'){
|
}else if(pos=='left'){
|
||||||
if(type=='on'){
|
if(type=='on'){
|
||||||
aniData.translateX('0%').step();
|
aniData.translateX('0%').step();
|
||||||
this.aniData = aniData.export()
|
this.aniData = aniData.export()
|
||||||
|
|
||||||
}
|
}
|
||||||
if(type=='off'){
|
if(type=='off'){
|
||||||
aniData.translateX('-100%').step();
|
aniData.translateX('-100%').step();
|
||||||
this.aniData = aniData.export()
|
this.aniData = aniData.export()
|
||||||
|
|
||||||
}
|
}
|
||||||
}else if(pos=='right'){
|
}else if(pos=='right'){
|
||||||
if(type=='on'){
|
if(type=='on'){
|
||||||
aniData.translateX('0%').step();
|
aniData.translateX('0%').step();
|
||||||
this.aniData = aniData.export()
|
this.aniData = aniData.export()
|
||||||
|
|
||||||
}
|
}
|
||||||
if(type=='off'){
|
if(type=='off'){
|
||||||
aniData.translateX('100%').step();
|
aniData.translateX('100%').step();
|
||||||
this.aniData = aniData.export()
|
this.aniData = aniData.export()
|
||||||
|
|
||||||
}
|
}
|
||||||
}else if(pos=='center'){
|
}else if(pos=='center'){
|
||||||
|
|
||||||
if(type=='on'){
|
if(type=='on'){
|
||||||
aniData.opacity(1).scale(1).step();
|
aniData.opacity(1).scale(1).step();
|
||||||
this.aniData = aniData.export()
|
this.aniData = aniData.export()
|
||||||
|
|
||||||
}
|
}
|
||||||
if(type=='off'){
|
if(type=='off'){
|
||||||
aniData.opacity(0).scale(0.6).step();
|
aniData.opacity(0).scale(0.6).step();
|
||||||
this.aniData = aniData.export()
|
this.aniData = aniData.export()
|
||||||
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
return new Promise(res=>{
|
return new Promise(res=>{
|
||||||
t.timdiiid = setTimeout(()=>{
|
t.timdiiid = setTimeout(()=>{
|
||||||
t.aniData = null;
|
t.aniData = null;
|
||||||
@@ -319,7 +319,7 @@
|
|||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
top: 0;
|
top: 0;
|
||||||
left: 0;
|
left: 0;
|
||||||
|
|
||||||
&.isClickbled {
|
&.isClickbled {
|
||||||
pointer-events: none;
|
pointer-events: none;
|
||||||
}
|
}
|
||||||
@@ -346,7 +346,7 @@
|
|||||||
transform: translateY(100%);
|
transform: translateY(100%);
|
||||||
width: 100%;
|
width: 100%;
|
||||||
bottom: 0;
|
bottom: 0;
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
&.top {
|
&.top {
|
||||||
@@ -382,7 +382,7 @@
|
|||||||
justify-content: center;
|
justify-content: center;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
align-content: center;
|
align-content: center;
|
||||||
|
|
||||||
|
|
||||||
.tm-poup-wk {
|
.tm-poup-wk {
|
||||||
position: static;
|
position: static;
|
||||||
|
|||||||
@@ -2,7 +2,7 @@
|
|||||||
<view @click="onclick" class=" tm-checkbox " :class="[dense?'':'pa-20',inline?'d-inline-block ':'fulled']">
|
<view @click="onclick" class=" tm-checkbox " :class="[dense?'':'pa-20',inline?'d-inline-block ':'fulled']">
|
||||||
<view class="flex-start 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"
|
<view :style="{width: sizes.wk,height: sizes.wk}" class="tm-checkbox-boey relative d-inline-block"
|
||||||
:class="[black?'bk':'','flex-shrink mr-10 ',
|
:class="[black?'bk':'','flex-shrink mr-10 ',
|
||||||
changValue?'ani':'',
|
changValue?'ani':'',
|
||||||
@@ -119,8 +119,11 @@
|
|||||||
fllowTheme:{
|
fllowTheme:{
|
||||||
type:Boolean|String,
|
type:Boolean|String,
|
||||||
default:true
|
default:true
|
||||||
}
|
},
|
||||||
|
extendData:{
|
||||||
|
type:Object,
|
||||||
|
default:()=>({})
|
||||||
|
},
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
|
|||||||
@@ -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"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
+42
-1
@@ -10,7 +10,7 @@
|
|||||||
* 修改时间:
|
* 修改时间:
|
||||||
*/
|
*/
|
||||||
|
|
||||||
import HaloTokenConfig from '@/config/token.config.js'
|
import HaloTokenConfig from '@/config/uhalo.config.js'
|
||||||
import {getAppConfigs} from '@/config/index.js'
|
import {getAppConfigs} from '@/config/index.js'
|
||||||
|
|
||||||
const utils = {
|
const utils = {
|
||||||
@@ -160,7 +160,48 @@ const utils = {
|
|||||||
urls: list,
|
urls: list,
|
||||||
loop: true
|
loop: true
|
||||||
})
|
})
|
||||||
|
},
|
||||||
|
/**
|
||||||
|
* 检查是否为json字符串
|
||||||
|
* @param {Object} jsonStr 数据源
|
||||||
|
*/
|
||||||
|
checkJsonAndParse(jsonStr) {
|
||||||
|
try {
|
||||||
|
const jsonResult = JSON.parse(jsonStr);
|
||||||
|
return {
|
||||||
|
ok: true,
|
||||||
|
jsonData: jsonResult,
|
||||||
|
}
|
||||||
|
} catch (e) {
|
||||||
|
return {
|
||||||
|
ok: false,
|
||||||
|
jsonData: {},
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
isObject(obj) {
|
||||||
|
return obj && typeof obj === 'object' && !Array.isArray(obj);
|
||||||
|
},
|
||||||
|
deepMerge(target, source) {
|
||||||
|
let output = Object.assign({}, target);
|
||||||
|
|
||||||
|
if (this.isObject(target) && this.isObject(source)) {
|
||||||
|
Object.keys(source).forEach(key => {
|
||||||
|
const targetValue = target[key];
|
||||||
|
const sourceValue = source[key];
|
||||||
|
|
||||||
|
if (Array.isArray(targetValue) && Array.isArray(sourceValue)) {
|
||||||
|
output[key] = targetValue.concat(sourceValue);
|
||||||
|
} else if (this.isObject(targetValue) && this.isObject(sourceValue)) {
|
||||||
|
output[key] = this.deepMerge(targetValue, sourceValue);
|
||||||
|
} else {
|
||||||
|
output[key] = sourceValue;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
return output;
|
||||||
}
|
}
|
||||||
|
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
||||||
|
|||||||
@@ -0,0 +1,94 @@
|
|||||||
|
import utils from '@/utils/index.js'
|
||||||
|
import v2Apis from "@/api/v2/all.api.js"
|
||||||
|
|
||||||
|
export const NeedPluginIds = Object.freeze({
|
||||||
|
PluginUniHalo: "plugin-uni-halo",
|
||||||
|
PluginPhotos: "PluginPhotos",
|
||||||
|
PluginLinks: "PluginLinks",
|
||||||
|
PluginMoments: "PluginMoments",
|
||||||
|
PluginSearchWidget: "PluginSearchWidget",
|
||||||
|
PluginCommentWidget: "PluginCommentWidget",
|
||||||
|
PluginVote: "vote",
|
||||||
|
})
|
||||||
|
|
||||||
|
export const NeedPlugins = new Map([
|
||||||
|
[
|
||||||
|
NeedPluginIds.PluginUniHalo, {
|
||||||
|
id: "plugin-uni-halo",
|
||||||
|
name: "UniHalo配置",
|
||||||
|
desc: "uni-halo 核心插件,未安装和启用的情况下,将无法使用 uni-halo,请检查是否已安装和启用",
|
||||||
|
logo: utils.checkUrl("/plugins/plugin-uni-halo/assets/logo.png"),
|
||||||
|
url: "https://www.halo.run/store/apps/app-ryemX"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
[
|
||||||
|
NeedPluginIds.PluginPhotos, {
|
||||||
|
id: "PluginPhotos",
|
||||||
|
name: "图库管理",
|
||||||
|
desc: "图库功能模块所需要的插件",
|
||||||
|
logo: utils.checkUrl("/plugins/PluginPhotos/assets/logo.svg"),
|
||||||
|
url: "https://www.halo.run/store/apps/app-BmQJW"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
[
|
||||||
|
NeedPluginIds.PluginLinks, {
|
||||||
|
id: "PluginLinks",
|
||||||
|
name: "链接管理",
|
||||||
|
desc: "链接管理模块,用于网站友情链接功能模块",
|
||||||
|
logo: utils.checkUrl("/plugins/PluginLinks/assets/logo.svg"),
|
||||||
|
url: "https://www.halo.run/store/apps/app-hfbQg"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
[
|
||||||
|
NeedPluginIds.PluginMoments, {
|
||||||
|
id: "PluginMoments",
|
||||||
|
name: "瞬间",
|
||||||
|
desc: "提供一个轻量级的内容图文、视频、音频等内容展示",
|
||||||
|
logo: utils.checkUrl("/plugins/PluginMoments/assets/logo.svg"),
|
||||||
|
url: "https://www.halo.run/store/apps/app-SnwWD"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
[
|
||||||
|
NeedPluginIds.PluginSearchWidget, {
|
||||||
|
id: "PluginSearchWidget",
|
||||||
|
name: "搜索组件",
|
||||||
|
desc: "为应用提供统一的搜索组件",
|
||||||
|
logo: utils.checkUrl("/plugins/PluginSearchWidget/assets/logo.svg"),
|
||||||
|
url: "https://www.halo.run/store/apps/app-DlacW"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
[
|
||||||
|
NeedPluginIds.PluginCommentWidget, {
|
||||||
|
id: "PluginCommentWidget",
|
||||||
|
name: "评论组件",
|
||||||
|
desc: "为用户前台提供完整的评论解决方案",
|
||||||
|
logo: utils.checkUrl("/plugins/PluginCommentWidget/assets/logo.svg"),
|
||||||
|
url: "https://www.halo.run/store/apps/app-YXyaD"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
[
|
||||||
|
NeedPluginIds.PluginVote, {
|
||||||
|
id: "vote",
|
||||||
|
name: "投票管理",
|
||||||
|
desc: "投票模块所需要的插件,用于展示投票和提交投票",
|
||||||
|
logo: utils.checkUrl("/plugins/vote/assets/logo.png"),
|
||||||
|
url: "https://www.halo.run/store/apps/app-veyvzyhv"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
])
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 检查插件是否启用、安装
|
||||||
|
* @param {String} pluginId 插件id
|
||||||
|
* @return {Boolean} true = 安装、启用 false= 未安装启用
|
||||||
|
*/
|
||||||
|
export const checkNeedPluginAvailable = (pluginId) => {
|
||||||
|
return new Promise(async (resolve) => {
|
||||||
|
try {
|
||||||
|
const available = await v2Apis.checkPluginAvailable(pluginId)
|
||||||
|
resolve(available)
|
||||||
|
} catch (err) {
|
||||||
|
resolve(false)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
+6
-6
@@ -12,11 +12,11 @@
|
|||||||
|
|
||||||
/**
|
/**
|
||||||
* 指定范围生成随机数
|
* 指定范围生成随机数
|
||||||
* @param {Number} m
|
* @param {Number} m 最小值(包含)
|
||||||
* @param {Number} n
|
* @param {Number} n 最大(不包含)
|
||||||
* @return {Number}
|
* @return {Number} 随机值
|
||||||
*/
|
*/
|
||||||
export function GetRandomNumberByRange(m, n) {
|
export function getRandomNumberByRange(m, n) {
|
||||||
return Math.floor(Math.random() * (m - n) + n);
|
return Math.floor(Math.random() * (m - n) + n);
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -26,10 +26,10 @@ export function GetRandomNumberByRange(m, n) {
|
|||||||
* @param {*} min 最小值
|
* @param {*} min 最小值
|
||||||
* @param {*} max 最大值
|
* @param {*} max 最大值
|
||||||
*/
|
*/
|
||||||
export function GetRandomNumberArray(len, min, max) {
|
export function getRandomNumberArray(len, min, max) {
|
||||||
let arr = [];
|
let arr = [];
|
||||||
for (let index = 0; index < len; index++) {
|
for (let index = 0; index < len; index++) {
|
||||||
arr.push(GetRandomNumberByRange(min, max));
|
arr.push(getRandomNumberByRange(min, max));
|
||||||
}
|
}
|
||||||
return arr;
|
return arr;
|
||||||
}
|
}
|
||||||
|
|||||||
+22
-22
@@ -1,39 +1,39 @@
|
|||||||
/**
|
/**
|
||||||
* 设置缓存
|
* 设置缓存
|
||||||
* @param {缓存key} key
|
* @param {string} key 缓存key
|
||||||
* @param {需要存储的缓存值} value
|
* @param {Object} value 需要存储的缓存值
|
||||||
* @param {过期时间,默认0表示永久有效} expire
|
* @param {number} expire 过期时间,默认0表示永久有效
|
||||||
*/
|
*/
|
||||||
export const setCache = (key, value, expire = 0) => {
|
export const setCache = (key, value, expire = 0) => {
|
||||||
let obj = {
|
let obj = {
|
||||||
data: value, //存储的数据
|
data: value, //存储的数据
|
||||||
time: Date.now() / 1000, //记录存储的时间戳
|
time: Date.now() / 1000, //记录存储的时间戳
|
||||||
expire: expire //记录过期时间,单位秒
|
expire: expire //记录过期时间,单位秒
|
||||||
}
|
}
|
||||||
uni.setStorageSync(key, JSON.stringify(obj))
|
uni.setStorageSync(key, JSON.stringify(obj))
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 获取缓存
|
* 获取缓存
|
||||||
* @param {缓存key} key
|
* @param {string} key
|
||||||
*/
|
*/
|
||||||
export const getCache = (key) => {
|
export const getCache = (key) => {
|
||||||
let val = uni.getStorageSync(key)
|
let val = uni.getStorageSync(key)
|
||||||
if (!val) {
|
if (!val) {
|
||||||
return null
|
return null
|
||||||
}
|
}
|
||||||
val = JSON.parse(val)
|
val = JSON.parse(val)
|
||||||
if (val.expire && Date.now() / 1000 - val.time > val.expire) {
|
if (val.expire && Date.now() / 1000 - val.time > val.expire) {
|
||||||
uni.removeStorageSync(key)
|
uni.removeStorageSync(key)
|
||||||
return null
|
return null
|
||||||
}
|
}
|
||||||
return val.data
|
return val.data
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 删除缓存
|
* 删除缓存
|
||||||
* @param {缓存key} key
|
* @param { string } key 缓存key
|
||||||
*/
|
*/
|
||||||
export const delCache = (key) => {
|
export const delCache = (key) => {
|
||||||
uni.removeStorageSync(key)
|
uni.removeStorageSync(key)
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -0,0 +1,52 @@
|
|||||||
|
import {getCache, setCache} from "./storage";
|
||||||
|
import utils from "./index"
|
||||||
|
|
||||||
|
export const APP_TOKENS_KEY = "APP_TOKENS";
|
||||||
|
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 获取 tokens
|
||||||
|
*/
|
||||||
|
export function getTokens() {
|
||||||
|
const tokens = getCache(APP_TOKENS_KEY);
|
||||||
|
return tokens ?? null;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 设置 tokens
|
||||||
|
*/
|
||||||
|
export function setTokens(value) {
|
||||||
|
setCache(APP_TOKENS_KEY, value);
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 设置 tokens
|
||||||
|
*/
|
||||||
|
export function updateTokens(value) {
|
||||||
|
if (!value) return false
|
||||||
|
const tokens = getTokens(APP_TOKENS_KEY);
|
||||||
|
if (!tokens) return false
|
||||||
|
setTokens(utils.deepMerge(tokens, value))
|
||||||
|
return true
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 获取 系统token
|
||||||
|
*/
|
||||||
|
export function getPersonalToken() {
|
||||||
|
const tokens = getTokens(APP_TOKENS_KEY);
|
||||||
|
console.log("tokens", tokens)
|
||||||
|
return tokens?.personalToken;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 设置 系统token
|
||||||
|
*/
|
||||||
|
export function setPersonalToken(personalToken) {
|
||||||
|
const tokens = getCache(APP_TOKENS_KEY);
|
||||||
|
if (!tokens) return false
|
||||||
|
tokens.personalToken = personalToken
|
||||||
|
updateTokens(tokens)
|
||||||
|
return true
|
||||||
|
}
|
||||||
@@ -0,0 +1,16 @@
|
|||||||
|
|
||||||
|
/**
|
||||||
|
* 生成指定长度的uuid
|
||||||
|
* @param {number} = 长度
|
||||||
|
*/
|
||||||
|
export function generateUUID(length = 36) {
|
||||||
|
const characters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
|
||||||
|
let result = '';
|
||||||
|
|
||||||
|
const validLength = Math.max(1, Math.floor(Number(length)) || 36);
|
||||||
|
for (let i = 0; i < validLength; i++) {
|
||||||
|
result += characters.charAt(Math.floor(Math.random() * characters.length));
|
||||||
|
}
|
||||||
|
|
||||||
|
return result;
|
||||||
|
}
|
||||||
@@ -0,0 +1,34 @@
|
|||||||
|
const UnihaloVoteUid = "unihalo_vote_uid"
|
||||||
|
|
||||||
|
export const voteCacheUtil = {
|
||||||
|
getAll() {
|
||||||
|
const data = uni.getStorageSync(UnihaloVoteUid)
|
||||||
|
if (!data) {
|
||||||
|
return null
|
||||||
|
}
|
||||||
|
return JSON.parse(data)
|
||||||
|
},
|
||||||
|
get(name) {
|
||||||
|
const data = this.getAll()
|
||||||
|
if (!data) {
|
||||||
|
return null
|
||||||
|
}
|
||||||
|
return data[name]
|
||||||
|
},
|
||||||
|
has(name) {
|
||||||
|
const data = this.getAll()
|
||||||
|
if (!data) return false
|
||||||
|
return data[name] != undefined
|
||||||
|
},
|
||||||
|
set(name, value) {
|
||||||
|
let data = this.getAll()
|
||||||
|
if (!data) {
|
||||||
|
data = {
|
||||||
|
[name]: value
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
data[name] = value
|
||||||
|
}
|
||||||
|
uni.setStorageSync(UnihaloVoteUid, JSON.stringify(data))
|
||||||
|
}
|
||||||
|
}
|
||||||
Reference in New Issue
Block a user