Compare commits
112 Commits
master
...
d995ac2b37
| Author | SHA1 | Date | |
|---|---|---|---|
| d995ac2b37 | |||
| 01392a6329 | |||
| 689d12e632 | |||
| 8c50ffd479 | |||
| ca7982c974 | |||
| 6c85256b96 | |||
| 972bd2c8b8 | |||
| ecf120221f | |||
| 30fd03590c | |||
| 38fc29ccaa | |||
| 70a75333e8 | |||
| 92ca0a4418 | |||
| 6a002ceb16 | |||
| 7f7664e68f | |||
| 6f58ba2389 | |||
| 33430e0888 | |||
| 5b498724c4 | |||
| aef8799652 | |||
| bf189f7f5b | |||
| 06b60a4ff9 | |||
| c11116d9a9 | |||
| 48d4ede98e | |||
| fd31274a21 | |||
| ec5cddae61 | |||
| e361ff9c79 | |||
| c93cfeb266 | |||
| 4b36bc2e06 | |||
| ce3aab1c76 | |||
| 0efb671bff | |||
| c0d41b4d8d | |||
| 394df57af1 | |||
| ab57b6c9b2 | |||
| 87ce756f6b | |||
| 9d2863d6d3 | |||
| 8677405266 | |||
| a8b55412c6 | |||
| cc2f0d5eeb | |||
| 9c62a6a198 | |||
| b1174fc1e3 | |||
| e6c99fbbca | |||
| 239a1272b2 | |||
| 0d4c625b10 | |||
| dc824592ce | |||
| d096ebb83c | |||
| a0a44b4551 | |||
| cef6c8c341 | |||
| 9d4dda04c9 | |||
| 8754d3a333 | |||
| 8d9bc93955 | |||
| 1e292102d1 | |||
| 9417601ab1 | |||
| 2901b24f43 | |||
| f3fb25349b | |||
| ad61430545 | |||
| 164690bcce | |||
| 2ac31bc1a3 | |||
| 41ff1b8f44 | |||
| 9ac4fa6e5d | |||
| 0bc2bdb9bb | |||
| 4db377161c | |||
| a60b28aa22 | |||
| fec929bf06 | |||
| b0b50ed960 | |||
| 78939951d9 | |||
| 02bc9c00b0 | |||
| 823e3d9f99 | |||
| a1735a5e94 | |||
| 7839fa565e | |||
| 9054376279 | |||
| 3ae61916ca | |||
| 1a86b4cb7e | |||
| 7a33f67aed | |||
| 9f5942546d | |||
| 7c82166781 | |||
| cd58054cfa | |||
| 615ac78156 | |||
| 18ebc08645 | |||
| d006b3e5af | |||
| b7d6b37e87 | |||
| 24d2b82221 | |||
| d24ece1724 | |||
| 0e8fb5c838 | |||
| c8d47fd959 | |||
| bdad6d4406 | |||
| 3d8ae8816d | |||
| c01f51a488 | |||
| 5073c33e61 | |||
| 4dcd59f1d4 | |||
| 1a27904f23 | |||
| 85c49890d1 | |||
| 272c380c6e | |||
| 5092efdaeb | |||
| df3873c6eb | |||
| addef04ff0 | |||
| b1d2378cec | |||
| 7f2edb91e4 | |||
| 694a032d0a | |||
| a96dbb67fe | |||
| d26970fb3d | |||
| 9222d47b37 | |||
| acb7ccaf46 | |||
| e1c1fefa20 | |||
| 21780580b8 | |||
| e0507f3bd1 | |||
| fa971cff5b | |||
| a900399dd0 | |||
| 8761a91f13 | |||
| f4312f5f0c | |||
| 2c2e6f600b | |||
| cb56f9b7ba | |||
| be82375202 | |||
| a0f1ec758e |
@ -49,7 +49,7 @@ export const getChannelPosts = (params: { id: number }) => {
|
|||||||
* @return {Promise}
|
* @return {Promise}
|
||||||
*/
|
*/
|
||||||
export const postsDelete = (params: { id: number }) => {
|
export const postsDelete = (params: { id: number }) => {
|
||||||
return useDollarFetchRequest.del<IResponse<boolean>>('/prod-api/app-api/business/posts/delete', { params })
|
return useDollarFetchRequest.del<IResponse<boolean>>('/prod-api/app-api/business/posts/delete?id=' + params.id, {})
|
||||||
}
|
}
|
||||||
/**
|
/**
|
||||||
* 获取帖子详情
|
* 获取帖子详情
|
||||||
@ -147,5 +147,5 @@ export const deleteChannelFollow = (params: { channelId: string }) => {
|
|||||||
* 根据群组ID获取群组成员
|
* 根据群组ID获取群组成员
|
||||||
*/
|
*/
|
||||||
export const getGroupMembers = (params: { channelId: string }) => {
|
export const getGroupMembers = (params: { channelId: string }) => {
|
||||||
return useFetchRequest.get<IResponse<MemberUserRespDTO[]>>(`/prod-api/app-api/mqtt/session/users/${params.channelId}`)
|
return useDollarFetchRequest.get<IResponse<MemberUserRespDTO[]>>(`/prod-api/app-api/mqtt/session/users/${params.channelId}`)
|
||||||
}
|
}
|
||||||
|
|||||||
@ -7,22 +7,22 @@ import type { ProjectRespVO, PageResultProjectCommentResVO, ProjectDrawPageRespV
|
|||||||
* @return {Promise}
|
* @return {Promise}
|
||||||
*/
|
*/
|
||||||
export const getDetail = (params: { id?: number | string }) => {
|
export const getDetail = (params: { id?: number | string }) => {
|
||||||
return useFetchRequest.get<IResponse<ProjectRespVO>>('/prod-api/app-api/business/app/project-draw/preview', { query:params })
|
return useFetchRequest.get<IResponse<ProjectRespVO>>('/prod-api/app-api/business/app/project-draw/preview', { query: params })
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 获取评论列表
|
* 获取评论列表
|
||||||
* @return {Promise}
|
* @return {Promise}
|
||||||
*/
|
*/
|
||||||
export const getCommentList = (params: { relationId?: number | string; pageNum?: number; pageSize?: number }) => {
|
export const getCommentList = (params: { relationId?: number | string; pageNum?: number; pageSize?: number; type: number }) => {
|
||||||
return useDollarFetchRequest.get<IResponse<PageResultProjectCommentResVO>>('/prod-api/app-api/business/app/project-comment/page', { query:params })
|
return useDollarFetchRequest.get<IResponse<PageResultProjectCommentResVO>>('/prod-api/app-api/business/app/project-comment/page', { query: params })
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 发表评论
|
* 发表评论
|
||||||
* @return {Promise}
|
* @return {Promise}
|
||||||
*/
|
*/
|
||||||
export const createComment = (params: { relationId?: number | string; content?: string; projectId?: number | string }) => {
|
export const createComment = (params: { relationId?: number | string; content?: string; projectId?: number | string; type: number }) => {
|
||||||
return useDollarFetchRequest.post<IResponse<boolean>>('/prod-api/app-api/business/app/project-comment/create', params)
|
return useDollarFetchRequest.post<IResponse<boolean>>('/prod-api/app-api/business/app/project-comment/create', params)
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -31,14 +31,14 @@ export const createComment = (params: { relationId?: number | string; content?:
|
|||||||
* @return {Promise}
|
* @return {Promise}
|
||||||
*/
|
*/
|
||||||
export const getRelationRecommend = (params: { type?: number | string; projectType?: number | string }) => {
|
export const getRelationRecommend = (params: { type?: number | string; projectType?: number | string }) => {
|
||||||
return useFetchRequest.get<IResponse<ProjectDrawPageRespVO[]>>('/prod-api/app-api/business/app/project-draw/top-list', { query:params })
|
return useFetchRequest.get<IResponse<ProjectDrawPageRespVO[]>>('/prod-api/app-api/business/app/project-draw/top-list', { query: params })
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 举报
|
* 举报
|
||||||
* @return {Promise}
|
* @return {Promise}
|
||||||
*/
|
*/
|
||||||
export const report = (params: { id?: number | string; title?: string; comments?: string; files?: any; projectId: any; drawId: any }) => {
|
export const report = (params: { id?: number | string; title?: string; comments?: string; files?: any; projectId?: any; drawId: any; type: any }) => {
|
||||||
return useDollarFetchRequest.post<IResponse<boolean>>('/prod-api/app-api/business/project-report/create', params)
|
return useDollarFetchRequest.post<IResponse<boolean>>('/prod-api/app-api/business/project-report/create', params)
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -50,6 +50,14 @@ export const getUserInfo = (params: { id?: number | string }) => {
|
|||||||
return useFetchRequest.get<IResponse<UserExtendSimpleRespDTO>>('/prod-api/app-api/business/app/project-draw/preview-user-info', { params })
|
return useFetchRequest.get<IResponse<UserExtendSimpleRespDTO>>('/prod-api/app-api/business/app/project-draw/preview-user-info', { params })
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 获取工具发布人信息
|
||||||
|
*/
|
||||||
|
|
||||||
|
export const getToolUserInfo = (params: { id?: number | string }) => {
|
||||||
|
return useFetchRequest.get<IResponse<UserExtendSimpleRespDTO>>('/prod-api/app-api/business/resource/publish-user-info', { params })
|
||||||
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 当前用户的主要作品内容
|
* 当前用户的主要作品内容
|
||||||
*/
|
*/
|
||||||
@ -59,7 +67,7 @@ export const getMainWork = (params: { id?: number | string; limit: number; membe
|
|||||||
/**
|
/**
|
||||||
* 创建内容信息
|
* 创建内容信息
|
||||||
*/
|
*/
|
||||||
export const createContent = (params: { projectId: any; drawId: any }) => {
|
export const createContent = (params: { projectId?: any; drawId: any; type: any }) => {
|
||||||
return useDollarFetchRequest.post<IResponse<boolean>>('/prod-api/app-api/business/project-member-favorites/create', params)
|
return useDollarFetchRequest.post<IResponse<boolean>>('/prod-api/app-api/business/project-member-favorites/create', params)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@ -35,6 +35,7 @@ export interface ProjectRespVO {
|
|||||||
projectTypeName: string
|
projectTypeName: string
|
||||||
favoriteId?: string
|
favoriteId?: string
|
||||||
relationDraws: RelationDraws[]
|
relationDraws: RelationDraws[]
|
||||||
|
no?: string
|
||||||
filesInfo: {
|
filesInfo: {
|
||||||
fileSize: string
|
fileSize: string
|
||||||
count: number
|
count: number
|
||||||
@ -136,6 +137,7 @@ export interface UserExtendSimpleRespDTO {
|
|||||||
files: any[]
|
files: any[]
|
||||||
fansCount: number
|
fansCount: number
|
||||||
projectCount: number
|
projectCount: number
|
||||||
|
postsNum?: number
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface ProjectDrawMemberRespVO {
|
export interface ProjectDrawMemberRespVO {
|
||||||
|
|||||||
@ -7,6 +7,8 @@ import type {
|
|||||||
ProjectDrawStatisticAppRespVO,
|
ProjectDrawStatisticAppRespVO,
|
||||||
ProjectTrendingScoreUserInfoVO,
|
ProjectTrendingScoreUserInfoVO,
|
||||||
PageResultIndexSettingRespVO,
|
PageResultIndexSettingRespVO,
|
||||||
|
TdkSettingsRespVO,
|
||||||
|
TdkSettingsDO,
|
||||||
} from './type'
|
} from './type'
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@ -88,3 +90,24 @@ export const tab2 = () => {
|
|||||||
export const getDictTree = (params: { type: number, id: number}) => {
|
export const getDictTree = (params: { type: number, id: number}) => {
|
||||||
return useDollarFetchRequest.get<IResponse<ProjectDictNodeVO[]>>('/prod-api/app-api/business/app/dict/path-by-id', { query: params })
|
return useDollarFetchRequest.get<IResponse<ProjectDictNodeVO[]>>('/prod-api/app-api/business/app/dict/path-by-id', { query: params })
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 获得网站 TDK设置
|
||||||
|
*/
|
||||||
|
export const getTDK = () => {
|
||||||
|
return useFetchRequest.get<IResponse<TdkSettingsRespVO>>('/prod-api/app-api/business/tdk-settings/get-index', {})
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 获得网站 TDK栏目列表
|
||||||
|
*/
|
||||||
|
export const getTDKList = () => {
|
||||||
|
return useFetchRequest.get<IResponse<TdkSettingsDO[]>>('/prod-api/app-api/business/tdk-settings/list-menu', {})
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 通知列表
|
||||||
|
*/
|
||||||
|
export const getNoticeList = () => {
|
||||||
|
return useDollarFetchRequest.get<IResponse<any>>('/prod-api/app-api/system/index-setting/notice-list', {})
|
||||||
|
}
|
||||||
@ -105,3 +105,25 @@ export interface PageResultIndexSettingRespVO {
|
|||||||
status: number
|
status: number
|
||||||
createTime: string
|
createTime: string
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export interface TdkSettingsRespVO {
|
||||||
|
title: string
|
||||||
|
describeText: string
|
||||||
|
keyword: string
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface TdkSettingsDO {
|
||||||
|
createTime?: string
|
||||||
|
updateTime?: string
|
||||||
|
creator?: string
|
||||||
|
updater?: string
|
||||||
|
deleted?: boolean
|
||||||
|
id?: number
|
||||||
|
title?: string
|
||||||
|
icon?: string
|
||||||
|
type?: number
|
||||||
|
path: string
|
||||||
|
describeText?: string
|
||||||
|
keyword?: string
|
||||||
|
remark: string
|
||||||
|
}
|
||||||
|
|||||||
@ -27,8 +27,14 @@ export const loginByMobile = (params: { mobile: string; code: string; socialCode
|
|||||||
/**
|
/**
|
||||||
* 发送邮箱验证码
|
* 发送邮箱验证码
|
||||||
*/
|
*/
|
||||||
export const sendEmailCode = (params: { email: string }) => {
|
export const sendEmailCode = (data: { email: string }) => {
|
||||||
return useDollarFetchRequest.post<IResponse<any>>('/prod-api/app-api/member/auth/send-email-code', params)
|
return useDollarFetchRequest.post<IResponse<any>>('/prod-api/app-api/member/auth/send-email-code?email=' + data.email, {},{
|
||||||
|
headers: {
|
||||||
|
'Content-Type': 'application/x-www-form-urlencoded',
|
||||||
|
'Accept': 'application/json, text/plain, */*',
|
||||||
|
'Access-Control-Allow-Origin-Type': '*',
|
||||||
|
}
|
||||||
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
|||||||
@ -43,7 +43,7 @@ export const updateUserExtend = (params: UserExtendSaveReqVO) => {
|
|||||||
* @returns
|
* @returns
|
||||||
*/
|
*/
|
||||||
export const getUserAuthInfo = () => {
|
export const getUserAuthInfo = () => {
|
||||||
return useFetchRequest.get<IResponse<UserAuthInfoRespVO>>('/prod-api/app-api/member/user-auth-info/get', {})
|
return useDollarFetchRequest.get<IResponse<UserAuthInfoRespVO>>('/prod-api/app-api/member/user-auth-info/get', {})
|
||||||
}
|
}
|
||||||
/**
|
/**
|
||||||
* 创建用户信息
|
* 创建用户信息
|
||||||
@ -66,13 +66,13 @@ export const updateUserAuthInfo = (params: UserAuthInfoRespVO) => {
|
|||||||
* 获得内容信息分页
|
* 获得内容信息分页
|
||||||
*/
|
*/
|
||||||
export const getContentPage = (params: { type: number }) => {
|
export const getContentPage = (params: { type: number }) => {
|
||||||
return useDollarFetchRequest.get<IResponse<PageResultProjectHistoryResVO>>('/prod-api/app-api/business/project-history/page', {query:params})
|
return useDollarFetchRequest.get<IResponse<PageResultProjectHistoryResVO>>('/prod-api/app-api/business/project-history/page', { query: params })
|
||||||
}
|
}
|
||||||
/**
|
/**
|
||||||
* 获得用户项目工具箱下载分页
|
* 获得用户项目工具箱下载分页
|
||||||
*/
|
*/
|
||||||
export const getUserToolBoxPage = (params: { pageNum: number; pageSize: number; type?: number }) => {
|
export const getUserToolBoxPage = (params: { pageNum: number; pageSize: number; type?: number }) => {
|
||||||
return useDollarFetchRequest.get<IResponse<PageResultProjectHistoryResVO>>('/prod-api/app-api/business/project-member-file/page', {query:params})
|
return useDollarFetchRequest.get<IResponse<PageResultProjectHistoryResVO>>('/prod-api/app-api/business/project-member-file/page', { query: params })
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@ -92,20 +92,20 @@ export const signIn = () => {
|
|||||||
* 获得用户积分记录分页
|
* 获得用户积分记录分页
|
||||||
*/
|
*/
|
||||||
export const getUserPointPage = (params: { pageNo: number; pageSize: number }) => {
|
export const getUserPointPage = (params: { pageNo: number; pageSize: number }) => {
|
||||||
return useDollarFetchRequest.get<IResponse<PageResultMemberPointRecordRespVO>>('/prod-api/app-api/member/point/record/page', {query:params})
|
return useDollarFetchRequest.get<IResponse<PageResultMemberPointRecordRespVO>>('/prod-api/app-api/member/point/record/page', { query: params })
|
||||||
}
|
}
|
||||||
/**
|
/**
|
||||||
* 近期收益和近期活跃
|
* 近期收益和近期活跃
|
||||||
*/
|
*/
|
||||||
export const getRecentIncomeAndActive = (params: { type: number; limit: number }) => {
|
export const getRecentIncomeAndActive = (params: { type: number; limit: number }) => {
|
||||||
return useDollarFetchRequest.get<IResponse<UserStatisticsLineRespVO>>('/prod-api/app-api/member/statistics/line', {query:params})
|
return useDollarFetchRequest.get<IResponse<UserStatisticsLineRespVO>>('/prod-api/app-api/member/statistics/line', { query: params })
|
||||||
}
|
}
|
||||||
/**
|
/**
|
||||||
*
|
*
|
||||||
资源下载分布
|
资源下载分布
|
||||||
*/
|
*/
|
||||||
export const getResourceDistribution = (params: { type: number; limit: number }) => {
|
export const getResourceDistribution = (params: { type: number; limit: number }) => {
|
||||||
return useDollarFetchRequest.get<IResponse<UserStatisticsBarRespVO>>('/prod-api/app-api/member/statistics/bar', {query:params})
|
return useDollarFetchRequest.get<IResponse<UserStatisticsBarRespVO>>('/prod-api/app-api/member/statistics/bar', { query: params })
|
||||||
}
|
}
|
||||||
/**
|
/**
|
||||||
* 我的数据统计 包括我的金币 我的关注 我的发布等等
|
* 我的数据统计 包括我的金币 我的关注 我的发布等等
|
||||||
@ -118,14 +118,16 @@ export const getUserStatistics = () => {
|
|||||||
* 获得项目订单用户收藏信息分页
|
* 获得项目订单用户收藏信息分页
|
||||||
*/
|
*/
|
||||||
export const getUserFavoritePage = (params: { pageNo: number; pageSize: number; userId: any; type: number }) => {
|
export const getUserFavoritePage = (params: { pageNo: number; pageSize: number; userId: any; type: number }) => {
|
||||||
return useDollarFetchRequest.get<IResponse<PageResultProjectMemberFavoritesRespVO>>('/prod-api/app-api/business/project-member-favorites/page', {query:params})
|
return useDollarFetchRequest.get<IResponse<PageResultProjectMemberFavoritesRespVO>>('/prod-api/app-api/business/project-member-favorites/page', {
|
||||||
|
query: params,
|
||||||
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
/***
|
/***
|
||||||
* 自己发布的-内容信息分页
|
* 自己发布的-内容信息分页
|
||||||
*/
|
*/
|
||||||
export const getOwnContentPage = (params: { pageNo: number; pageSize: number; type: number }) => {
|
export const getOwnContentPage = (params: { pageNo: number; pageSize: number; type: number }) => {
|
||||||
return useDollarFetchRequest.get<IResponse<PageResultProjectHistoryResVO>>('/prod-api/app-api/business/app/project-draw/my-page', {query:params})
|
return useDollarFetchRequest.get<IResponse<PageResultProjectHistoryResVO>>('/prod-api/app-api/business/app/project-draw/my-page', { query: params })
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@ -148,3 +150,17 @@ export const deleteResource = (params: { id: number }) => {
|
|||||||
export const getUserExtend = () => {
|
export const getUserExtend = () => {
|
||||||
return useFetchRequest.get<IResponse<UserExtendRespVO>>('/prod-api/app-api/member/user-extend/get', {})
|
return useFetchRequest.get<IResponse<UserExtendRespVO>>('/prod-api/app-api/member/user-extend/get', {})
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 取消社交绑定
|
||||||
|
*/
|
||||||
|
export const cancelSocialBind = (params: { type: number; openid: string }) => {
|
||||||
|
return useDollarFetchRequest.post<IResponse<boolean>>('/prod-api/app-api/member/social-user/unbind', params)
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 用户注销账号
|
||||||
|
*/
|
||||||
|
export const userLogout = () => {
|
||||||
|
return useDollarFetchRequest.del<IResponse<boolean>>('/prod-api/app-api/member/user/unregister-user', {})
|
||||||
|
}
|
||||||
|
|||||||
@ -46,6 +46,8 @@ export interface UserExtendRespVO {
|
|||||||
description: string
|
description: string
|
||||||
authStatus: number
|
authStatus: number
|
||||||
createTime: string
|
createTime: string
|
||||||
|
wxOpenId: string
|
||||||
|
qqOpenId: string
|
||||||
files: {
|
files: {
|
||||||
id: number
|
id: number
|
||||||
memberId: number
|
memberId: number
|
||||||
|
|||||||
@ -1,6 +1,6 @@
|
|||||||
import * as useDollarFetchRequest from '~/composables/useDollarFetchRequest'
|
import * as useDollarFetchRequest from '~/composables/useDollarFetchRequest'
|
||||||
import * as useFetchRequest from '~/composables/useFetchRequest'
|
import * as useFetchRequest from '~/composables/useFetchRequest'
|
||||||
import type { TcreateReq, TpageReq, TpageRes } from './types'
|
import type { TcreateReq, TpageReq, TpageRes, ProjectResourceRespVO } from './types'
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 新建工具箱
|
* 新建工具箱
|
||||||
@ -8,12 +8,23 @@ import type { TcreateReq, TpageReq, TpageRes } from './types'
|
|||||||
* @returns
|
* @returns
|
||||||
*/
|
*/
|
||||||
export const create = (params: TcreateReq) => {
|
export const create = (params: TcreateReq) => {
|
||||||
return useDollarFetchRequest.post<IResponse<number>>('/prod-api/app-api/business/app/project-resource/create', params)
|
return useDollarFetchRequest.post<IResponse<number>>('/prod-api/app-api/business/resource/create', params)
|
||||||
}
|
}
|
||||||
|
|
||||||
/***
|
/***
|
||||||
* 获得内容信息分页
|
* 获得内容信息分页
|
||||||
*/
|
*/
|
||||||
export const page = (params: TpageReq) => {
|
export const page = (params: any) => {
|
||||||
return useFetchRequest.get<IResponse<TpageRes>>('/prod-api/app-api/business/app/project-resource/page', {query:params})
|
return useFetchRequest.get<IResponse<TpageRes>>('/prod-api/app-api/business/resource/page', {
|
||||||
|
query: params,
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 获得工具箱
|
||||||
|
*/
|
||||||
|
export const get = (params: { id: string }) => {
|
||||||
|
return useFetchRequest.get<IResponse<ProjectResourceRespVO>>('/prod-api/app-api/business/resource/get', {
|
||||||
|
query: params,
|
||||||
|
})
|
||||||
}
|
}
|
||||||
|
|||||||
@ -6,6 +6,9 @@ export interface TcreateReq {
|
|||||||
createAddress?: string
|
createAddress?: string
|
||||||
createIp?: string
|
createIp?: string
|
||||||
projectType: number[]
|
projectType: number[]
|
||||||
|
categoryId?: number
|
||||||
|
sourceType?: number
|
||||||
|
categoryName?: string
|
||||||
files: {
|
files: {
|
||||||
id: number
|
id: number
|
||||||
title: string
|
title: string
|
||||||
@ -59,3 +62,57 @@ export interface TpageItem {
|
|||||||
commentsPoint: number
|
commentsPoint: number
|
||||||
ownedUserId: string
|
ownedUserId: string
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export interface ProjectResourceRespVO {
|
||||||
|
id: number
|
||||||
|
title: string
|
||||||
|
labels: string[]
|
||||||
|
createAddress: string
|
||||||
|
createIp: string
|
||||||
|
projectType: number[]
|
||||||
|
categoryId: number
|
||||||
|
categoryName: string
|
||||||
|
favoriteId?: number
|
||||||
|
downloadId?: string
|
||||||
|
sourceType: number
|
||||||
|
ownedUserName?: string
|
||||||
|
ownedUserAvatar?: string
|
||||||
|
ownedUserIdInfo: {
|
||||||
|
id: number
|
||||||
|
nickName: string
|
||||||
|
avatar: string
|
||||||
|
}
|
||||||
|
files: {
|
||||||
|
id: number
|
||||||
|
title: string
|
||||||
|
fileId: number
|
||||||
|
drawId: number
|
||||||
|
type: number
|
||||||
|
url: string
|
||||||
|
sort: number
|
||||||
|
size: number
|
||||||
|
}[]
|
||||||
|
coverImages: {
|
||||||
|
id: number
|
||||||
|
title: string
|
||||||
|
fileId: number
|
||||||
|
drawId: number
|
||||||
|
type: number
|
||||||
|
url: string
|
||||||
|
sort: number
|
||||||
|
size: number
|
||||||
|
}[]
|
||||||
|
points: number
|
||||||
|
createTime: string
|
||||||
|
updateTime: string
|
||||||
|
status: number
|
||||||
|
recommend: boolean
|
||||||
|
iconUrl: string
|
||||||
|
hotPoint: number
|
||||||
|
description: string
|
||||||
|
previewPoint: number
|
||||||
|
previewUrl: string
|
||||||
|
previewImageUrl: string
|
||||||
|
commentsPoint: number
|
||||||
|
ownedUserId: string
|
||||||
|
}
|
||||||
|
|||||||
@ -16,7 +16,7 @@ export const create = (params: TcreateReq) => {
|
|||||||
* @returns
|
* @returns
|
||||||
*/
|
*/
|
||||||
export const parent = (params: { type: string | number; parentId: number | string }) => {
|
export const parent = (params: { type: string | number; parentId: number | string }) => {
|
||||||
return useFetchRequest.get<IResponse<parentRes[]>>('/prod-api/app-api/business/app/dict/parent', { query: params })
|
return useDollarFetchRequest.get<IResponse<parentRes[]>>('/prod-api/app-api/business/app/dict/parent', { query: params })
|
||||||
}
|
}
|
||||||
/**
|
/**
|
||||||
* 获取具有上下级的字典信息
|
* 获取具有上下级的字典信息
|
||||||
@ -32,7 +32,7 @@ export const parentV2 = (params: { type: string | number; parentId: number | str
|
|||||||
* @returns
|
* @returns
|
||||||
*/
|
*/
|
||||||
export const indexTabs = () => {
|
export const indexTabs = () => {
|
||||||
return useFetchRequest.get<IResponse<parentRes[]>>('/prod-api/app-api/business/project/index/index-tab3')
|
return useDollarFetchRequest.get<IResponse<parentRes[]>>('/prod-api/app-api/business/project/index/index-tab3')
|
||||||
}
|
}
|
||||||
/**
|
/**
|
||||||
* 模糊查询获取标签内容
|
* 模糊查询获取标签内容
|
||||||
@ -40,7 +40,7 @@ export const indexTabs = () => {
|
|||||||
* @returns
|
* @returns
|
||||||
*/
|
*/
|
||||||
export const keywords = (params: { type: string | number; keywords: string }) => {
|
export const keywords = (params: { type: string | number; keywords: string }) => {
|
||||||
return useFetchRequest.get<IResponse<boolean>>('/prod-api/app-api/business/app/dict/label-keywords', {query:params})
|
return useFetchRequest.get<IResponse<boolean>>('/prod-api/app-api/business/app/dict/label-keywords', { query: params })
|
||||||
}
|
}
|
||||||
/**
|
/**
|
||||||
* 获取格式类型字典信息
|
* 获取格式类型字典信息
|
||||||
@ -73,3 +73,24 @@ export const recommendTop = (params: recommendTopReq) => {
|
|||||||
export const homeLabel = () => {
|
export const homeLabel = () => {
|
||||||
return useFetchRequest.get<IResponse<ProjectDictNodeVO[]>>('/prod-api/app-api/business/app/dict/index-tab')
|
return useFetchRequest.get<IResponse<ProjectDictNodeVO[]>>('/prod-api/app-api/business/app/dict/index-tab')
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 获取客服微信
|
||||||
|
*/
|
||||||
|
export const getWechat = () => {
|
||||||
|
return useDollarFetchRequest.get<IResponse<string>>('/prod-api/app-api/system/index-setting/kefu-wechat')
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 查看图纸
|
||||||
|
*/
|
||||||
|
export const view = (params: { id: string | number; projectId: string | number }) => {
|
||||||
|
return useDollarFetchRequest.get<IResponse<TcreateReq>>('/prod-api/app-api/business/app/project-draw/get', { query: params })
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 编辑图纸
|
||||||
|
*/
|
||||||
|
export const edit = (data: TcreateReq) => {
|
||||||
|
return useDollarFetchRequest.put<IResponse<boolean>>('/prod-api/app-api/business/app/project/update', data)
|
||||||
|
}
|
||||||
|
|||||||
@ -10,9 +10,9 @@ export interface FileItem {
|
|||||||
|
|
||||||
// 定义整个 JSON 对象的类型
|
// 定义整个 JSON 对象的类型
|
||||||
export interface TcreateReq {
|
export interface TcreateReq {
|
||||||
activeName: string
|
activeName: string | number
|
||||||
id: number | string
|
id: number | string
|
||||||
type: any[]
|
type: number
|
||||||
isDomestic: number | string
|
isDomestic: number | string
|
||||||
province: string // 省份编码
|
province: string // 省份编码
|
||||||
city: string // 城市编码
|
city: string // 城市编码
|
||||||
@ -61,6 +61,7 @@ export interface pageReq {
|
|||||||
createAddress?: string
|
createAddress?: string
|
||||||
createIp?: string
|
createIp?: string
|
||||||
projectType?: any
|
projectType?: any
|
||||||
|
recommend: boolean // 是否推荐
|
||||||
}
|
}
|
||||||
export interface pageRes {
|
export interface pageRes {
|
||||||
list: {
|
list: {
|
||||||
@ -79,6 +80,7 @@ export interface pageRes {
|
|||||||
previewPoint?: number
|
previewPoint?: number
|
||||||
commentsPoint?: number
|
commentsPoint?: number
|
||||||
hotPoint?: number
|
hotPoint?: number
|
||||||
|
source?: number
|
||||||
}[]
|
}[]
|
||||||
total: number
|
total: number
|
||||||
}
|
}
|
||||||
|
|||||||
BIN
assets/images/activity1.png
Normal file
|
After Width: | Height: | Size: 92 KiB |
BIN
assets/images/activity2.png
Normal file
|
After Width: | Height: | Size: 109 KiB |
BIN
assets/images/avater2 copy.png
Normal file
|
After Width: | Height: | Size: 13 KiB |
BIN
assets/images/banner copy.png
Normal file
|
After Width: | Height: | Size: 434 KiB |
BIN
assets/images/bg-yy.png
Normal file
|
After Width: | Height: | Size: 2.8 KiB |
BIN
assets/images/crown.png
Normal file
|
After Width: | Height: | Size: 2.4 KiB |
BIN
assets/images/faxian.png
Normal file
|
After Width: | Height: | Size: 2.9 KiB |
BIN
assets/images/home-l (1).png
Normal file
|
After Width: | Height: | Size: 1.6 KiB |
BIN
assets/images/home-l (2).png
Normal file
|
After Width: | Height: | Size: 2.8 KiB |
BIN
assets/images/home-l (3).png
Normal file
|
After Width: | Height: | Size: 1.1 KiB |
BIN
assets/images/info copy.png
Normal file
|
After Width: | Height: | Size: 3.4 KiB |
BIN
assets/images/info.png
Normal file
|
After Width: | Height: | Size: 3.4 KiB |
BIN
assets/images/my_attention.png
Normal file
|
After Width: | Height: | Size: 5.7 KiB |
BIN
assets/images/my_collect.png
Normal file
|
After Width: | Height: | Size: 5.9 KiB |
BIN
assets/images/my_download.png
Normal file
|
After Width: | Height: | Size: 7.2 KiB |
BIN
assets/images/my_release.png
Normal file
|
After Width: | Height: | Size: 5.0 KiB |
BIN
assets/images/pingdao.png
Normal file
|
After Width: | Height: | Size: 3.7 KiB |
BIN
assets/images/shouye.png
Normal file
|
After Width: | Height: | Size: 1.7 KiB |
BIN
assets/images/talent-detail-bg.png
Normal file
|
After Width: | Height: | Size: 324 KiB |
BIN
assets/images/technicalCertificates.png
Normal file
|
After Width: | Height: | Size: 40 KiB |
BIN
assets/images/tuzhi (1).png
Normal file
|
After Width: | Height: | Size: 7.7 KiB |
BIN
assets/images/tuzhi (2).png
Normal file
|
After Width: | Height: | Size: 8.4 KiB |
BIN
assets/images/tuzhi (3).png
Normal file
|
After Width: | Height: | Size: 5.2 KiB |
BIN
assets/images/tuzhi (4).png
Normal file
|
After Width: | Height: | Size: 4.9 KiB |
BIN
assets/images/tuzhi (5).png
Normal file
|
After Width: | Height: | Size: 8.5 KiB |
BIN
assets/images/tuzhi (6).png
Normal file
|
After Width: | Height: | Size: 9.3 KiB |
BIN
assets/images/wode.png
Normal file
|
After Width: | Height: | Size: 2.6 KiB |
BIN
assets/images/x.png
Normal file
|
After Width: | Height: | Size: 1.4 KiB |
BIN
assets/images/yuan.png
Normal file
|
After Width: | Height: | Size: 1.5 KiB |
BIN
assets/images/zhuan.png
Normal file
|
After Width: | Height: | Size: 1.8 KiB |
@ -1,6 +1,8 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="mt-[30px] w-[100%]">
|
<div class="mt-[30px] w-[100%]">
|
||||||
<div class="h-[48px] w-[100%] rounded-[1px] bg-[#F8F8F8] pl-[10px] text-[16px] text-[#333333] font-normal line-height-[50px]"> 共有{{ result.total || 0 }}条评论 </div>
|
<div class="h-[48px] w-[100%] rounded-[1px] bg-[#F8F8F8] pl-[10px] text-[16px] text-[#333333] font-normal line-height-[50px]">
|
||||||
|
共有{{ result.total || 0 }}条评论
|
||||||
|
</div>
|
||||||
<div v-for="item in result.list" :key="item.id" class="mt-[20px] border-b-[1px] border-b-[#eee] border-b-solid pb-[14px]">
|
<div v-for="item in result.list" :key="item.id" class="mt-[20px] border-b-[1px] border-b-[#eee] border-b-solid pb-[14px]">
|
||||||
<div class="flex items-start">
|
<div class="flex items-start">
|
||||||
<el-avatar :src="item.creatorInfo.avatar" alt="" srcset="" class="h-[50px] w-[49px] rounded-full" />
|
<el-avatar :src="item.creatorInfo.avatar" alt="" srcset="" class="h-[50px] w-[49px] rounded-full" />
|
||||||
@ -44,7 +46,7 @@
|
|||||||
},
|
},
|
||||||
projectId: {
|
projectId: {
|
||||||
type: Number,
|
type: Number,
|
||||||
required: true,
|
required: false,
|
||||||
},
|
},
|
||||||
})
|
})
|
||||||
|
|
||||||
@ -66,7 +68,12 @@
|
|||||||
|
|
||||||
// 获取评论列表
|
// 获取评论列表
|
||||||
const handleGetCommentList = async () => {
|
const handleGetCommentList = async () => {
|
||||||
const res = await getCommentList({ relationId: props.relationId, pageNum: query.value.pageNo, pageSize: query.value.pageSize })
|
const res = await getCommentList({
|
||||||
|
relationId: props.relationId,
|
||||||
|
pageNum: query.value.pageNo,
|
||||||
|
pageSize: query.value.pageSize,
|
||||||
|
type: props.projectId ? 1 : 2,
|
||||||
|
})
|
||||||
if (res.code === 0) {
|
if (res.code === 0) {
|
||||||
result.value.list = res.data.list
|
result.value.list = res.data.list
|
||||||
result.value.total = res.data.total
|
result.value.total = res.data.total
|
||||||
@ -75,7 +82,7 @@
|
|||||||
|
|
||||||
// 发表评论
|
// 发表评论
|
||||||
const handleCreateComment = async () => {
|
const handleCreateComment = async () => {
|
||||||
const res = await createComment({ relationId: props.relationId, content: commentContent.value, projectId: props.projectId })
|
const res = await createComment({ relationId: props.relationId, content: commentContent.value, projectId: props.projectId || props.relationId, type: props.projectId ? 1 : 2 })
|
||||||
if (res.code === 0) {
|
if (res.code === 0) {
|
||||||
commentContent.value = ''
|
commentContent.value = ''
|
||||||
query.value.pageNo = 1
|
query.value.pageNo = 1
|
||||||
@ -87,8 +94,9 @@
|
|||||||
() => props.relationId,
|
() => props.relationId,
|
||||||
() => {
|
() => {
|
||||||
handleGetCommentList()
|
handleGetCommentList()
|
||||||
},{
|
},
|
||||||
immediate: true
|
{
|
||||||
|
immediate: true,
|
||||||
}
|
}
|
||||||
)
|
)
|
||||||
</script>
|
</script>
|
||||||
|
|||||||
@ -1,8 +1,9 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="relative mt-[34px] w-[100%]">
|
<div class="relative mt-[34px] w-[100%]">
|
||||||
<KlTabBar v-model="query.source" :data="tabBar" />
|
<KlTabBar v-model="query.source" :data="tabBar" />
|
||||||
<div class="absolute right-[0px] top-[10px] text-[16px] text-[#999999] font-normal"
|
<div class="absolute right-[0px] top-[0px] text-[16px] text-[#999999] font-normal">
|
||||||
>共<span class="color-[#1A65FF]">{{ result?.total }}</span
|
<el-button type="warning" class="mr-4px" @click="handleUpload">上传工具</el-button>
|
||||||
|
共<span class="color-[#1A65FF]">{{ result?.total }}</span
|
||||||
>个筛选结果</div
|
>个筛选结果</div
|
||||||
>
|
>
|
||||||
<div class="content mt-[10px]">
|
<div class="content mt-[10px]">
|
||||||
@ -17,11 +18,12 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
import KlTabBar from '~/components/kl-tab-bar/index.vue'
|
import KlTabBar from '~/components/kl-tab-bar/v3/index.vue'
|
||||||
import CardPicture from '~/components/kl-card-picture/index.vue'
|
import CardPicture from '~/components/kl-card-picture/index.vue'
|
||||||
import { ref } from 'vue'
|
import { ref } from 'vue'
|
||||||
import type { pageRes, pageReq } from '~/api/upnew/types'
|
import type { pageRes, pageReq } from '~/api/upnew/types'
|
||||||
import emptyImg from '~/assets/images/empty.png'
|
import emptyImg from '~/assets/images/empty.png'
|
||||||
|
import useUserStore from '~/stores/user'
|
||||||
|
|
||||||
const query = defineModel<pageReq>('modelValue', {
|
const query = defineModel<pageReq>('modelValue', {
|
||||||
required: true,
|
required: true,
|
||||||
@ -41,10 +43,18 @@
|
|||||||
value: 1,
|
value: 1,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: '最新上传',
|
label: '转载分享',
|
||||||
value: 2,
|
value: 2,
|
||||||
},
|
},
|
||||||
])
|
])
|
||||||
|
const handleUpload = () => {
|
||||||
|
// 先判断登录
|
||||||
|
const store = useUserStore()
|
||||||
|
if (!store.token) {
|
||||||
|
return ElMessage.error('请先登录')
|
||||||
|
}
|
||||||
|
navigateTo('/upnew?drawType=1')
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped></style>
|
<style lang="scss" scoped></style>
|
||||||
|
|||||||
@ -4,17 +4,33 @@
|
|||||||
<div class="banner-text">
|
<div class="banner-text">
|
||||||
<h1 class="title">开启 CAD 学习之旅</h1>
|
<h1 class="title">开启 CAD 学习之旅</h1>
|
||||||
<p class="subtitle">为你的创意引擎注入强劲动力,驱动设计梦想在市场中乘风破浪</p>
|
<p class="subtitle">为你的创意引擎注入强劲动力,驱动设计梦想在市场中乘风破浪</p>
|
||||||
<button class="join-button">快来加入</button>
|
<button class="join-button" @click="handleService">客服联系</button>
|
||||||
</div>
|
</div>
|
||||||
<div class="banner-image">
|
<div class="banner-image">
|
||||||
<img src="~/assets/images/foreign_banner.png" alt="CAD工作环境" />
|
<img src="~/assets/images/foreign_banner.png" alt="CAD工作环境" />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<!-- 打开客服弹窗 弄成组件 -->
|
||||||
|
<KlService v-if="dialogVisible" v-model:dialog-visible="dialogVisible"></KlService>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
|
import useUserStore from '~/stores/user'
|
||||||
|
import KlService from '~/components/kl-quick-menu/components/kl-service.vue'
|
||||||
// 组件逻辑可以在这里添加
|
// 组件逻辑可以在这里添加
|
||||||
|
const dialogVisible = ref(false)
|
||||||
|
const handleService = () => {
|
||||||
|
// 判断是否登录
|
||||||
|
const userStore = useUserStore()
|
||||||
|
if (!userStore.token) {
|
||||||
|
ElMessage.error('请先登录')
|
||||||
|
return
|
||||||
|
}
|
||||||
|
dialogVisible.value = true
|
||||||
|
// 读取未读消息
|
||||||
|
// readCount.value = false
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped>
|
<style scoped>
|
||||||
|
|||||||
@ -1,8 +1,8 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="relative mt-[34px] w-[100%]">
|
<div class="relative mt-[34px] w-[100%]">
|
||||||
<KlTabBar v-model="tabIndex" :data="tabBar" />
|
<KlTabBar v-model="query.source" :data="tabBar" />
|
||||||
<KlWallpaperCategory v-model="query" v-model:level="level" :type="1" />
|
<KlWallpaperCategory v-model="query" v-model:level="level" :type="1" />
|
||||||
<div class="absolute right-[0px] top-[10px] text-[16px] text-[#999999] font-normal"
|
<div class="absolute right-[0px] top-[0px] text-[16px] text-[#999999] font-normal"
|
||||||
>共<span class="color-[#1A65FF]">{{ result?.total }}</span
|
>共<span class="color-[#1A65FF]">{{ result?.total }}</span
|
||||||
>个筛选结果</div
|
>个筛选结果</div
|
||||||
>
|
>
|
||||||
@ -18,7 +18,7 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
import KlTabBar from '~/components/kl-tab-bar/index.vue'
|
import KlTabBar from '~/components/kl-tab-bar/v3/index.vue'
|
||||||
import CardPicture from '~/components/kl-card-picture/index.vue'
|
import CardPicture from '~/components/kl-card-picture/index.vue'
|
||||||
import KlWallpaperCategory from '~/components/kl-wallpaper-category/index.vue'
|
import KlWallpaperCategory from '~/components/kl-wallpaper-category/index.vue'
|
||||||
import { ref } from 'vue'
|
import { ref } from 'vue'
|
||||||
|
|||||||
@ -6,12 +6,17 @@
|
|||||||
<div class="box-border p-[16px]">
|
<div class="box-border p-[16px]">
|
||||||
<div class="flex items-center justify-between">
|
<div class="flex items-center justify-between">
|
||||||
<div>
|
<div>
|
||||||
<div class="title mr-[38px] text-[16px] text-[#333333] font-bold">{{ props.itemInfo.title }}</div>
|
<div class="title mr-[38px] text-[16px] text-[#333333] font-bold flex items-center" :title="props.itemInfo.title">
|
||||||
|
<img v-if="props.itemInfo.source === 2" src="~/assets/images/zhuan.png" alt="" srcset="" class="mr-[2px] w-[22px] relative bottom-[-4px]" />
|
||||||
|
<img v-if="props.itemInfo.source === 1" src="~/assets/images/yuan.png" alt="" srcset="" class="mr-[2px] w-[20px] relative bottom-[-4px]" />
|
||||||
|
{{ props.itemInfo.title }}
|
||||||
|
</div>
|
||||||
<div class="mt-[8px] text-[15px] text-[#999999] font-normal">by {{ props.itemInfo?.ownedUserIdInfo?.nickName }}</div>
|
<div class="mt-[8px] text-[15px] text-[#999999] font-normal">by {{ props.itemInfo?.ownedUserIdInfo?.nickName }}</div>
|
||||||
|
<div class="mt-[4px] text-[13px] text-[#999999] font-normal">{{ dayjs(props.itemInfo.createTime).format('YYYY-MM-DD HH:mm:ss') }}</div>
|
||||||
</div>
|
</div>
|
||||||
<div><img :src="props.itemInfo?.ownedUserIdInfo?.avatar" alt="" srcset="" class="h-[40px] w-[40px] rd-[50%]" /></div>
|
<div><img :src="props.itemInfo?.ownedUserIdInfo?.avatar" alt="" srcset="" class="h-[40px] w-[40px] rd-[50%]" /></div>
|
||||||
</div>
|
</div>
|
||||||
<div class="mt-[24px] flex items-center justify-between">
|
<div class="mt-[14px] flex items-center justify-between">
|
||||||
<div class="flex items-center justify-between text-[14px] text-[#666666] font-normal">
|
<div class="flex items-center justify-between text-[14px] text-[#666666] font-normal">
|
||||||
<div class="mr-[9px] flex items-center">
|
<div class="mr-[9px] flex items-center">
|
||||||
<img src="~/assets/images/look.png" alt="" srcset="" class="mr-[2px] h-[17px]" />
|
<img src="~/assets/images/look.png" alt="" srcset="" class="mr-[2px] h-[17px]" />
|
||||||
@ -35,6 +40,7 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
|
import dayjs from 'dayjs'
|
||||||
import type { PropType } from 'vue'
|
import type { PropType } from 'vue'
|
||||||
import type { pageRes } from '~/api/upnew/types'
|
import type { pageRes } from '~/api/upnew/types'
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
|
|||||||
@ -1,16 +1,16 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="mt-30px bg-[#14213d] px-[40px] pb-[20px] pt-[50px] text-white lg:px-[80px] sm:px-[60px]">
|
<div class="mt-[30px] bg-[#14213d] px-[40px] pb-[20px] pt-[50px] text-white lg:px-[80px] sm:px-[60px]">
|
||||||
<!-- 主内容区 -->
|
<!-- 主内容区 -->
|
||||||
<div class="mb-[40px] flex flex-col items-start justify-between gap-[30px] lg:flex-row">
|
<div class="mb-[40px] flex flex-col items-start justify-between gap-[30px] lg:flex-row">
|
||||||
<!-- 左侧 Logo -->
|
<!-- 左侧 Logo -->
|
||||||
<div class="mx-auto w-[200px] shrink-0 lg:mx0">
|
<div class="mx-auto w-[200px] shrink-0 lg:mx-0">
|
||||||
<img src="~/assets/images/logo5.png" class="h-auto w-full" />
|
<img src="~/assets/images/logo5.png" class="h-auto w-full" />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- 中间部分 -->
|
<!-- 中间部分 -->
|
||||||
<div class="grid grid-cols-2 mx-[80px] flex-1 gap-[10px] lg:grid-cols-3">
|
<div class="grid grid-cols-2 mx-[80px] flex-1 gap-[10px] lg:grid-cols-3">
|
||||||
<div v-for="(col, index) in bannerList?.slice(0, 3)" :key="index">
|
<div v-for="(col, index) in bannerList?.slice(0, 3)" :key="index">
|
||||||
<h3 v-if="handle(col)" class="ma-0px mb-[20px] pa-0px text-[16px]">{{ handle(col) }}</h3>
|
<h3 v-if="handle(col)" class="ma-[0px] mb-[20px] pa-[0px] text-[16px]">{{ handle(col) }}</h3>
|
||||||
<ul>
|
<ul>
|
||||||
<li
|
<li
|
||||||
v-for="(item, i) in handle2(col)"
|
v-for="(item, i) in handle2(col)"
|
||||||
@ -44,6 +44,8 @@
|
|||||||
<div class="border-t border-white/20 pt-[20px] text-center text-[14px] text-white/70">
|
<div class="border-t border-white/20 pt-[20px] text-center text-[14px] text-white/70">
|
||||||
Copyright 2007-2025 图夕夕网络科技(成都)有限公司
|
Copyright 2007-2025 图夕夕网络科技(成都)有限公司
|
||||||
<a href="http://beian.miit.gov.cn/" target="_blank" class="text-white/90 hover:text-blue-400!"> 蜀ICP备2025141494号-1</a>
|
<a href="http://beian.miit.gov.cn/" target="_blank" class="text-white/90 hover:text-blue-400!"> 蜀ICP备2025141494号-1</a>
|
||||||
|
<img src="~/assets/images/x.png" class="w-[20px] h-[20px] relative top-[2px]" />
|
||||||
|
<a href="http://www.beian.gov.cn/portal/registerSystemInfo?recordcode=51010702043645" rel="noreferrer" target="_blank">川公网安备51010702043645号</a >
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<el-image-viewer v-if="showViewer" :url-list="previewImgList" :url-index="0" @close="showViewer = false"></el-image-viewer>
|
<el-image-viewer v-if="showViewer" :url-list="previewImgList" :url-index="0" @close="showViewer = false"></el-image-viewer>
|
||||||
|
|||||||
@ -8,13 +8,13 @@
|
|||||||
</div>
|
</div>
|
||||||
<div class="item-center ml-[45px] w-[660px] flex justify-between">
|
<div class="item-center ml-[45px] w-[660px] flex justify-between">
|
||||||
<nuxt-link
|
<nuxt-link
|
||||||
v-for="(item, index) in menuItems"
|
v-for="(item, index) in tdkList"
|
||||||
:key="index"
|
:key="index"
|
||||||
:to="item.path"
|
:to="item.path"
|
||||||
class="parent-links relative rounded-lg px-3 py-2 text-[#1A65FF]"
|
class="parent-links relative rounded-lg px-3 py-2 text-[#1A65FF]"
|
||||||
>
|
>
|
||||||
{{ item.name }}
|
{{ item.remark }}
|
||||||
<img v-if="item.path === '/communication/channel'" src="~/assets/images/hot.png" alt="火" class="absolute right-[-15px] top-[-2px]" />
|
<img v-if="item.path === '/channel'" src="~/assets/images/hot.png" alt="火" class="absolute right-[-12px] top-[0px]" />
|
||||||
</nuxt-link>
|
</nuxt-link>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@ -31,19 +31,29 @@
|
|||||||
</template>
|
</template>
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import useUserStore from '~/stores/user'
|
import useUserStore from '~/stores/user'
|
||||||
|
import { getTDKList } from '~/api/home/index'
|
||||||
const userStore = useUserStore()
|
const userStore = useUserStore()
|
||||||
import { BellFilled } from '@element-plus/icons-vue'
|
import { BellFilled } from '@element-plus/icons-vue'
|
||||||
import { ref, computed } from 'vue'
|
import { ref, computed } from 'vue'
|
||||||
const menuItems = ref([
|
// const menuItems = ref([
|
||||||
{ name: '首页', path: '/' },
|
// { name: '首页', path: '/' },
|
||||||
{ name: '图纸', path: '/drawe' },
|
// { name: '图纸', path: '/drawe' },
|
||||||
{ name: '文本', path: '/text' },
|
// { name: '文本', path: '/text' },
|
||||||
{ name: '模型', path: '/model' },
|
// { name: '模型', path: '/model' },
|
||||||
{ name: '国外专区', path: '/foreign' },
|
// { name: '国外专区', path: '/foreign' },
|
||||||
{ name: '工具箱', path: '/toolbox' },
|
// { name: '工具箱', path: '/toolbox' },
|
||||||
{ name: '交流频道', path: '/channel' },
|
// { name: '交流频道', path: '/channel' },
|
||||||
// { name: '牛人社区', path: '/community' },
|
// // { name: '牛人社区', path: '/community' },
|
||||||
])
|
// ])
|
||||||
|
|
||||||
|
const { data: tdkList } = await useAsyncData('get-tdk-list-home', async () => {
|
||||||
|
const res = await getTDKList()
|
||||||
|
// 添加首页
|
||||||
|
if (!res.data.find((c) => c.remark === '首页')) {
|
||||||
|
res.data.unshift({ remark: '首页', path: '/' })
|
||||||
|
}
|
||||||
|
return res.data
|
||||||
|
})
|
||||||
|
|
||||||
// 是否登录
|
// 是否登录
|
||||||
const isLogin = computed(() => {
|
const isLogin = computed(() => {
|
||||||
|
|||||||
@ -3,7 +3,9 @@
|
|||||||
<div class="relative ma-auto flex items-center py-[20px] w-[1500px]!">
|
<div class="relative ma-auto flex items-center py-[20px] w-[1500px]!">
|
||||||
<img src="~/assets/images/logo5.png" alt="图夕夕" srcset="" class="h-[51px] w-[182px] cursor-pointer" @click="navigateTo('/')" />
|
<img src="~/assets/images/logo5.png" alt="图夕夕" srcset="" class="h-[51px] w-[182px] cursor-pointer" @click="navigateTo('/')" />
|
||||||
<div class="ml-[60px] flex items-center">
|
<div class="ml-[60px] flex items-center">
|
||||||
<span v-for="item in navList" :key="item" class="nav" :class="props.active === item ? 'active' : ''" @click="handleClick(item)">{{ item }}</span>
|
<span v-for="item in tdkList" :key="item.id" class="nav" :class="props.active === item.remark ? 'active' : ''" @click="handleClick(item.path)">{{
|
||||||
|
item.remark
|
||||||
|
}}</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="relative ml-[30px]">
|
<div class="relative ml-[30px]">
|
||||||
<el-input
|
<el-input
|
||||||
@ -38,11 +40,11 @@
|
|||||||
<div class="absolute right-[10px] flex items-center">
|
<div class="absolute right-[10px] flex items-center">
|
||||||
<div class="h-[36px] w-[36px] border-rd-[50%] bg-[#F5F5F5] text-center line-height-[44px]">
|
<div class="h-[36px] w-[36px] border-rd-[50%] bg-[#F5F5F5] text-center line-height-[44px]">
|
||||||
<img v-if="!isLogin" src="~/assets/images/user.png" alt="" srcset="" class="h-[19px] w-[17px] relative top-[0px] left-[0px]" />
|
<img v-if="!isLogin" src="~/assets/images/user.png" alt="" srcset="" class="h-[19px] w-[17px] relative top-[0px] left-[0px]" />
|
||||||
<img v-else :src="userStore.userInfoRes.avatar" alt="" srcset="" class="h-[19px] w-[17px] rd-[50%]" />
|
<img v-else :src="userStore.userInfoRes.avatar" alt="" srcset="" class="h-full w-full rd-[50%]" />
|
||||||
</div>
|
</div>
|
||||||
<span v-if="!isLogin" class="ml-[14px] cursor-pointer text-[14px] text-[#1A65FF] font-normal" @click="handleLogin">立即登录</span>
|
<span v-if="!isLogin" class="ml-[14px] cursor-pointer text-[14px] text-[#1A65FF] font-normal" @click="handleLogin">立即登录</span>
|
||||||
<el-dropdown v-else placement="top-start" @command="handleCommand">
|
<el-dropdown v-else placement="top-start" @command="handleCommand">
|
||||||
<span class="ml-[14px] cursor-pointer text-[14px] text-[#1A65FF] font-normal">{{ userStore.userInfoRes.nickname || '立即登录' }}</span>
|
<span class="ml-[10px] cursor-pointer text-[14px] text-[#1A65FF] font-normal">{{ userStore.userInfoRes.nickname || '立即登录' }}</span>
|
||||||
<template #dropdown>
|
<template #dropdown>
|
||||||
<el-dropdown-menu>
|
<el-dropdown-menu>
|
||||||
<el-dropdown-item command="个人中心"
|
<el-dropdown-item command="个人中心"
|
||||||
@ -64,7 +66,7 @@
|
|||||||
import { ref, getCurrentInstance, computed, onMounted } from 'vue'
|
import { ref, getCurrentInstance, computed, onMounted } from 'vue'
|
||||||
import { Setting, SwitchButton } from '@element-plus/icons-vue'
|
import { Setting, SwitchButton } from '@element-plus/icons-vue'
|
||||||
import { page } from '~/api/upnew/index'
|
import { page } from '~/api/upnew/index'
|
||||||
import { top } from '~/api/home/index'
|
import { top, getTDKList } from '~/api/home/index'
|
||||||
import type { ProjectDrawStatisticAppRespVO } from '~/api/home/type'
|
import type { ProjectDrawStatisticAppRespVO } from '~/api/home/type'
|
||||||
import { Search } from '@element-plus/icons-vue'
|
import { Search } from '@element-plus/icons-vue'
|
||||||
import refreshToken from '~/utils/RefreshToken'
|
import refreshToken from '~/utils/RefreshToken'
|
||||||
@ -92,7 +94,15 @@
|
|||||||
return !!userStore.token
|
return !!userStore.token
|
||||||
})
|
})
|
||||||
|
|
||||||
const navList = ref(['首页', '图纸', '文本', '模型', '国外专区', '工具箱', '交流频道'])
|
const { data: tdkList } = await useAsyncData('get-tdk-list-nav', async () => {
|
||||||
|
const res = await getTDKList()
|
||||||
|
// 添加首页
|
||||||
|
if (!res.data.find((c) => c.remark === '首页')) {
|
||||||
|
res.data.unshift({ remark: '首页', path: '/' })
|
||||||
|
}
|
||||||
|
return res.data
|
||||||
|
})
|
||||||
|
// const navList = ref(['首页', '图纸', '文本', '模型', '国外专区', '工具箱', '交流频道'])
|
||||||
|
|
||||||
const loading = ref(false)
|
const loading = ref(false)
|
||||||
const handleHot = async () => {
|
const handleHot = async () => {
|
||||||
@ -147,34 +157,7 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
const handleClick = (item: string) => {
|
const handleClick = (item: string) => {
|
||||||
switch (item) {
|
navigateTo(item)
|
||||||
case '首页':
|
|
||||||
navigateTo({ path: '/' }) // 修改为在新窗口打开
|
|
||||||
break
|
|
||||||
case '图纸':
|
|
||||||
navigateTo('/drawe') // 修改为在新窗口打开
|
|
||||||
break
|
|
||||||
case '文本':
|
|
||||||
navigateTo('/text') // 修改为在新窗口打开
|
|
||||||
break
|
|
||||||
case '模型':
|
|
||||||
navigateTo('/model') // 修改为在新窗口打开
|
|
||||||
break
|
|
||||||
case '国外专区':
|
|
||||||
navigateTo('/foreign') // 修改为在新窗口打开
|
|
||||||
break
|
|
||||||
case '牛人社区':
|
|
||||||
navigateTo('/community') // 修改为在新窗口打开
|
|
||||||
break
|
|
||||||
case '交流频道':
|
|
||||||
navigateTo('/channel') // 修改为在新窗口打开
|
|
||||||
break
|
|
||||||
case '工具箱':
|
|
||||||
navigateTo('/toolbox') // 修改为在新窗口打开
|
|
||||||
break
|
|
||||||
default:
|
|
||||||
break
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
const handleLogin = () => {
|
const handleLogin = () => {
|
||||||
app?.$openLogin() // 调用全局方法
|
app?.$openLogin() // 调用全局方法
|
||||||
|
|||||||
@ -153,8 +153,10 @@
|
|||||||
.vip-cards {
|
.vip-cards {
|
||||||
display: flex;
|
display: flex;
|
||||||
gap: 32px;
|
gap: 32px;
|
||||||
justify-content: center;
|
/* justify-content: center; */
|
||||||
margin: 24px 0;
|
margin: 24px 0;
|
||||||
|
overflow-x: auto;
|
||||||
|
padding: 10px;
|
||||||
}
|
}
|
||||||
.vip-card {
|
.vip-card {
|
||||||
background: #fff;
|
background: #fff;
|
||||||
|
|||||||
@ -7,7 +7,7 @@
|
|||||||
>
|
>
|
||||||
<el-tab-pane v-for="(item, index) in data" :key="index" :label="item.label" :name="item.value">
|
<el-tab-pane v-for="(item, index) in data" :key="index" :label="item.label" :name="item.value">
|
||||||
<template v-if="showNum" #label>
|
<template v-if="showNum" #label>
|
||||||
<img v-if="item.value === tabActive && showIcon" src="~/assets/images/2.png" alt="" srcset="" class="mr-7px" />
|
<img v-if="item.value === tabActive && showIcon" src="~/assets/images/2.png" alt="" srcset="" class="mr-[7px]" />
|
||||||
<span>{{ item.label }}</span>
|
<span>{{ item.label }}</span>
|
||||||
<el-badge :value="item.num" class="item" :max="9999999999999" :hidden="!item.num" />
|
<el-badge :value="item.num" class="item" :max="9999999999999" :hidden="!item.num" />
|
||||||
</template>
|
</template>
|
||||||
|
|||||||
47
components/kl-tab-bar/v3/index.vue
Normal file
@ -0,0 +1,47 @@
|
|||||||
|
<template>
|
||||||
|
<div class="flex items-center gap-[50px] mb-[20px]">
|
||||||
|
<el-link
|
||||||
|
v-for="(item, index) in props.data"
|
||||||
|
:key="index"
|
||||||
|
class="text-[15px]!"
|
||||||
|
:underline="modelValue === item.value ? 'always' : 'never'"
|
||||||
|
:type="modelValue === item.value ? 'primary' : 'info'"
|
||||||
|
@click="handleChange(item)"
|
||||||
|
>
|
||||||
|
{{ item.label }}
|
||||||
|
</el-link>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script lang="ts" setup>
|
||||||
|
import type { PropType } from 'vue'
|
||||||
|
const props = defineProps({
|
||||||
|
data: {
|
||||||
|
type: Array as PropType<{ num?: number; label: string; value: string | number; [key: string]: any }[]>,
|
||||||
|
default: () => [],
|
||||||
|
},
|
||||||
|
})
|
||||||
|
|
||||||
|
const emits = defineEmits(['change'])
|
||||||
|
|
||||||
|
const modelValue = defineModel<any>('modelValue', {
|
||||||
|
required: true,
|
||||||
|
}) // 双向绑定的value
|
||||||
|
|
||||||
|
const handleChange = (value: { value: string | number; [key: string]: any }) => {
|
||||||
|
modelValue.value = value.value
|
||||||
|
emits('change', value)
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
:deep(.el-link.is-underline) {
|
||||||
|
&::hover {
|
||||||
|
color: #1a65ff !important; // 鼠标悬停时的颜色
|
||||||
|
}
|
||||||
|
&::after {
|
||||||
|
bottom: -3px;
|
||||||
|
border-bottom: 2px solid #1a65ff; // 去掉下划线
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -323,7 +323,7 @@
|
|||||||
|
|
||||||
// 判断是否是图片
|
// 判断是否是图片
|
||||||
const handelFileType = (fileName: string) => {
|
const handelFileType = (fileName: string) => {
|
||||||
const ext = fileName.split('.').pop()?.toLowerCase() || ''
|
const ext = fileName?.split('.').pop()?.toLowerCase() || ''
|
||||||
return ['png', 'jpg', 'jpeg'].includes(ext)
|
return ['png', 'jpg', 'jpeg'].includes(ext)
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|||||||
@ -83,9 +83,16 @@
|
|||||||
return props.type === 1 ? '图纸' : props.type === 3 ? '模型' : '文本'
|
return props.type === 1 ? '图纸' : props.type === 3 ? '模型' : '文本'
|
||||||
})
|
})
|
||||||
|
|
||||||
|
/** 版本 */
|
||||||
|
const { data: editionsList } = useAsyncData(`editionsList-${props.type}}`, async () => {
|
||||||
|
const res = await parent({ type: 2, parentId: 0 })
|
||||||
|
const all = [{ id: '-1', name: '全部' }]
|
||||||
|
return [...all, ...res.data]
|
||||||
|
})
|
||||||
|
|
||||||
// 获取面包屑
|
// 获取面包屑
|
||||||
const { data: breadList } = await useAsyncData(
|
const { data: breadList } = await useAsyncData(
|
||||||
`breadList-${props.type}-${props.id}-${query.value.projectType}-${Date.now()}`,
|
`breadList-${props.type}-${props.id}-${query.value.projectType}}`,
|
||||||
async () => {
|
async () => {
|
||||||
const res = await getDictTree({ type: 1, id: query.value.projectType })
|
const res = await getDictTree({ type: 1, id: query.value.projectType })
|
||||||
const all = [
|
const all = [
|
||||||
@ -97,13 +104,8 @@
|
|||||||
]
|
]
|
||||||
const arr = [...res.data, ...all]
|
const arr = [...res.data, ...all]
|
||||||
return arr.reverse()
|
return arr.reverse()
|
||||||
},
|
|
||||||
{
|
|
||||||
immediate: true,
|
|
||||||
}
|
}
|
||||||
)
|
)
|
||||||
|
|
||||||
console.log('breadList', breadList);
|
|
||||||
|
|
||||||
// const projectTypeList = ref<any>([])
|
// const projectTypeList = ref<any>([])
|
||||||
/** 获取分类下拉框 */
|
/** 获取分类下拉框 */
|
||||||
@ -133,35 +135,49 @@
|
|||||||
// }
|
// }
|
||||||
// getEditionsList()
|
// getEditionsList()
|
||||||
|
|
||||||
/**获取分类下拉框 */
|
console.log('breadList.value.length----', breadList.value);
|
||||||
const { data: projectTypeList } = await useAsyncData(
|
|
||||||
`projectType-draw-${props.type}-${query.value.projectType}`,
|
// 服务端渲染兼容方案:顺序执行异步操作
|
||||||
async () => {
|
// 1. 先获取面包屑数据(已在上面通过useAsyncData获取)
|
||||||
let parentId: any = '0'
|
|
||||||
if (breadList?.value && breadList?.value.length > 1) {
|
// 2. 顺序获取分类下拉框数据
|
||||||
if (breadList.value.length > 2) {
|
// 创建一个函数来获取分类数据,确保服务端渲染时能获取到数据
|
||||||
const length = breadList.value?.length
|
const getProjectTypeList = async () => {
|
||||||
parentId = breadList?.value[length - 2].id
|
let parentId: any = '0'
|
||||||
} else {
|
|
||||||
const length = breadList.value?.length
|
// 计算parentId的逻辑
|
||||||
parentId = breadList?.value[length - 1].id
|
if (breadList?.value && breadList?.value.length > 1) {
|
||||||
}
|
if (breadList.value.length > 2) {
|
||||||
|
const length = breadList.value?.length
|
||||||
|
parentId = breadList?.value[length - 2].id
|
||||||
|
} else {
|
||||||
|
const length = breadList.value?.length
|
||||||
|
parentId = breadList?.value[length - 1].id
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
console.log('parentId', parentId);
|
||||||
|
|
||||||
|
|
||||||
|
try {
|
||||||
|
// 获取分类数据
|
||||||
const res = await parent({ type: 1, parentId: parentId })
|
const res = await parent({ type: 1, parentId: parentId })
|
||||||
const all = [{ id: parentId === '0' ? '-1' : parentId, name: '全部' }]
|
const all = [{ id: parentId === '0' ? '-1' : parentId, name: '全部' }]
|
||||||
return [...all, ...res.data]
|
return [...all, ...res.data]
|
||||||
},
|
} catch (error) {
|
||||||
{
|
console.error('获取分类数据失败:', error)
|
||||||
immediate: true,
|
return []
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 使用useAsyncData获取分类列表,确保服务端渲染兼容性
|
||||||
|
const { data: projectTypeList } = await useAsyncData(
|
||||||
|
`projectType-draw-${props.type}-${query.value.projectType}}`,
|
||||||
|
getProjectTypeList,
|
||||||
|
{ server: true } // 确保在服务端执行
|
||||||
)
|
)
|
||||||
|
|
||||||
/** 版本 */
|
|
||||||
const { data: editionsList } = useAsyncData(`editionsList-${props.type}-${Date.now()}`, async () => {
|
|
||||||
const res = await parent({ type: 2, parentId: 0 })
|
|
||||||
const all = [{ id: '-1', name: '全部' }]
|
|
||||||
return [...all, ...res.data]
|
|
||||||
})
|
|
||||||
|
|
||||||
const handleClick = (row: any) => {
|
const handleClick = (row: any) => {
|
||||||
query.value.title = ''
|
query.value.title = ''
|
||||||
|
|||||||
181
components/m/RecommendItem/index.vue
Normal file
@ -0,0 +1,181 @@
|
|||||||
|
<template>
|
||||||
|
<view class="design-list">
|
||||||
|
<view class="design-item" v-for="(item, index) in items" :key="index">
|
||||||
|
<view class="design-preview">
|
||||||
|
<image :src="item.image" mode="aspectFit"></image>
|
||||||
|
</view>
|
||||||
|
<view class="design-info">
|
||||||
|
<view class="design-title">{{ item.title }}</view>
|
||||||
|
<view class="design-author">by:{{ item.author }}</view>
|
||||||
|
|
||||||
|
<view class="design-stats">
|
||||||
|
<view class="stat-item">
|
||||||
|
<text class="iconfont">👁</text>
|
||||||
|
<text>{{ item.views }}</text>
|
||||||
|
</view>
|
||||||
|
<view class="stat-item">
|
||||||
|
<text class="iconfont">👍</text>
|
||||||
|
<text>{{ item.likes }}</text>
|
||||||
|
</view>
|
||||||
|
<view class="stat-item">
|
||||||
|
<text class="iconfont">💬</text>
|
||||||
|
<text>{{ item.comments }}</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="design-action">
|
||||||
|
<button class="view-btn">查看</button>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: "RecommendItem",
|
||||||
|
props: {
|
||||||
|
currentTab: {
|
||||||
|
type: Number,
|
||||||
|
default: 0,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
items: [
|
||||||
|
{
|
||||||
|
id: 1,
|
||||||
|
title: "高压细水雾灭火推车描述",
|
||||||
|
author: "赵其",
|
||||||
|
image: "/static/images/activity1.png",
|
||||||
|
views: 128,
|
||||||
|
likes: 16,
|
||||||
|
comments: 35,
|
||||||
|
url: "/pages/drawings/detail?id=1",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 2,
|
||||||
|
title: "高压细水雾灭火推车描述",
|
||||||
|
author: "赵其",
|
||||||
|
image: "/static/images/activity2.png",
|
||||||
|
views: 128,
|
||||||
|
likes: 16,
|
||||||
|
comments: 35,
|
||||||
|
url: "/pages/drawings/detail?id=2",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 1,
|
||||||
|
title: "室内CAD模型设计室内CAD模型设计",
|
||||||
|
author: "张泽",
|
||||||
|
image: "/static/images/activity1.png",
|
||||||
|
views: 95,
|
||||||
|
likes: 12,
|
||||||
|
comments: 28,
|
||||||
|
url: "/pages/models/detail?id=1",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 1,
|
||||||
|
title: "CAD设计规范文档",
|
||||||
|
author: "李华",
|
||||||
|
image: "/static/images/activity2.png",
|
||||||
|
views: 156,
|
||||||
|
likes: 23,
|
||||||
|
comments: 42,
|
||||||
|
url: "/pages/documents/detail?id=1",
|
||||||
|
},
|
||||||
|
],
|
||||||
|
};
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
viewDetail(item) {
|
||||||
|
console.log("View detail for:", item.title);
|
||||||
|
uni.navigateTo({
|
||||||
|
url: item.url,
|
||||||
|
});
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
// 变量定义
|
||||||
|
$primary-color: #007aff;
|
||||||
|
$text-color: #333;
|
||||||
|
$secondary-text: #666;
|
||||||
|
$light-text: #999;
|
||||||
|
$bg-color: #f0f4f9;
|
||||||
|
$white: #fff;
|
||||||
|
$border-color: #eee;
|
||||||
|
$border-radius: 15rpx;
|
||||||
|
.design-list {
|
||||||
|
// padding: 10rpx 20rpx;
|
||||||
|
|
||||||
|
.design-item {
|
||||||
|
display: flex;
|
||||||
|
margin-bottom: 20rpx;
|
||||||
|
background-color: $white;
|
||||||
|
border-radius: $border-radius;
|
||||||
|
border: 1px solid $border-color;
|
||||||
|
padding: 17rpx 10rpx;
|
||||||
|
box-sizing: border-box;
|
||||||
|
position: relative;
|
||||||
|
box-shadow: 0 0 10rpx rgba(0, 0, 0, 0.1);
|
||||||
|
|
||||||
|
.design-preview {
|
||||||
|
width: 220rpx;
|
||||||
|
height: 168rpx;
|
||||||
|
overflow: hidden;
|
||||||
|
|
||||||
|
image {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.design-info {
|
||||||
|
flex: 1;
|
||||||
|
padding: 0 20rpx;
|
||||||
|
|
||||||
|
.design-title {
|
||||||
|
font-size: 27rpx;
|
||||||
|
margin-bottom: 10rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.design-author {
|
||||||
|
font-size: 25rpx;
|
||||||
|
color: $light-text;
|
||||||
|
margin-bottom: 30rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.design-stats {
|
||||||
|
display: flex;
|
||||||
|
|
||||||
|
.stat-item {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
margin-right: 20rpx;
|
||||||
|
font-size: 24rpx;
|
||||||
|
color: $light-text;
|
||||||
|
|
||||||
|
.iconfont {
|
||||||
|
margin-right: 5rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.design-action {
|
||||||
|
position: absolute;
|
||||||
|
right: 20rpx;
|
||||||
|
bottom: 20rpx;
|
||||||
|
|
||||||
|
.view-btn {
|
||||||
|
background-color: $primary-color;
|
||||||
|
color: $white;
|
||||||
|
font-size: 25rpx;
|
||||||
|
padding: 0rpx 25rpx !important;
|
||||||
|
border-radius: 5rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
16
components/m/detail-components/Works.vue
Normal file
@ -0,0 +1,16 @@
|
|||||||
|
<template>
|
||||||
|
<div class="works">
|
||||||
|
<RecommendList />
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup lang="ts">
|
||||||
|
defineOptions({ name: 'Works' })
|
||||||
|
import RecommendList from "~/components/m/RecommendItem/index.vue";
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.works {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
73
components/m/detail-components/certificates.vue
Normal file
@ -0,0 +1,73 @@
|
|||||||
|
<template>
|
||||||
|
<div
|
||||||
|
class="cert-item"
|
||||||
|
v-for="(cert, index) in talentInfo.certificates"
|
||||||
|
:key="index"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
v-if="index !== talentInfo.certificates.length - 1"
|
||||||
|
class="border-left"
|
||||||
|
></div>
|
||||||
|
<div class="cert-dot"></div>
|
||||||
|
<div class="cert-info">
|
||||||
|
<span class="cert-year">{{ cert.year }}</span>
|
||||||
|
<span class="cert-desc">{{ cert.description }}</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup lang="ts">
|
||||||
|
defineOptions({ name: 'Certificates' })
|
||||||
|
interface Certificate { year: string; description: string }
|
||||||
|
interface TalentInfo { certificates: Certificate[] }
|
||||||
|
defineProps<{ talentInfo: TalentInfo }>()
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.border-left {
|
||||||
|
width: 1px;
|
||||||
|
height: calc(100%);
|
||||||
|
border-left: 2px dotted #e6f0ff;
|
||||||
|
position: absolute;
|
||||||
|
left: 7rpx;
|
||||||
|
top: 0;
|
||||||
|
}
|
||||||
|
// 证书列表
|
||||||
|
.cert-item {
|
||||||
|
display: flex;
|
||||||
|
align-items: flex-start;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cert-dot {
|
||||||
|
width: 16rpx;
|
||||||
|
height: 16rpx;
|
||||||
|
border-radius: 50%;
|
||||||
|
background-color: #1a65ff;
|
||||||
|
// margin-top: 12rpx;
|
||||||
|
margin-right: 20rpx;
|
||||||
|
flex-shrink: 0;
|
||||||
|
z-index: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cert-info {
|
||||||
|
flex: 1;
|
||||||
|
margin-bottom: 11rpx;
|
||||||
|
margin-top: -10rpx;
|
||||||
|
padding-bottom: 32rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cert-year {
|
||||||
|
font-size: 25rpx;
|
||||||
|
font-weight: bold;
|
||||||
|
color: #333;
|
||||||
|
display: block;
|
||||||
|
margin-bottom: 8rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cert-desc {
|
||||||
|
font-size: 21rpx;
|
||||||
|
color: #666;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
35
components/m/detail-components/technicalCertificates.vue
Normal file
@ -0,0 +1,35 @@
|
|||||||
|
<template>
|
||||||
|
<div class="flex">
|
||||||
|
<div
|
||||||
|
class="cert-technicalCertificates"
|
||||||
|
v-for="(cert, index) in 10"
|
||||||
|
:key="index"
|
||||||
|
>
|
||||||
|
<img
|
||||||
|
class="cert-image"
|
||||||
|
:src="`https://picsum.photos/90/90?random=${index}`"
|
||||||
|
alt="certificate"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup lang="ts">
|
||||||
|
defineOptions({ name: 'TechnicalCertificates' })
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.flex {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
gap: 50rpx;
|
||||||
|
}
|
||||||
|
.cert-technicalCertificates {
|
||||||
|
width: 135rpx;
|
||||||
|
height: 191rpx;
|
||||||
|
.cert-image {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
201
components/m/nav-bar/index.vue
Normal file
@ -0,0 +1,201 @@
|
|||||||
|
<template>
|
||||||
|
<!-- 顶部导航栏 -->
|
||||||
|
<view class="nav-bar">
|
||||||
|
<view class="nav-item active">全部</view>
|
||||||
|
<view class="nav-item">机械设备</view>
|
||||||
|
<view class="nav-item">零部件模型</view>
|
||||||
|
<view class="nav-item">交通运输</view>
|
||||||
|
<view class="nav-item">电子产品</view>
|
||||||
|
<view class="expand-btn" @tap="toggleCategoryMenu">
|
||||||
|
<text class="expand-icon">≡</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- 全部分类浮窗 -->
|
||||||
|
<view
|
||||||
|
class="category-popup"
|
||||||
|
v-if="showCategoryMenu"
|
||||||
|
@tap.stop="closeCategoryMenu"
|
||||||
|
>
|
||||||
|
<view class="popup-content" @tap.stop>
|
||||||
|
<view class="category-list">
|
||||||
|
<view
|
||||||
|
:key="index"
|
||||||
|
v-for="(section, index) in categoryList"
|
||||||
|
class="category-item"
|
||||||
|
@tap="selectCategory(section)"
|
||||||
|
>
|
||||||
|
{{ section.name }}
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- 筛选选项 -->
|
||||||
|
<view class="filter-bar">
|
||||||
|
<view class="filter-item"> 软件分类 <text class="icon-down">∨</text> </view>
|
||||||
|
<view class="filter-item"> 图纸类型 <text class="icon-down">∨</text> </view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
showCategoryMenu: false,
|
||||||
|
categoryList: [
|
||||||
|
{ name: "机械设备", active: false },
|
||||||
|
{ name: "零部件模型", active: false },
|
||||||
|
{ name: "交通运输", active: false },
|
||||||
|
{ name: "电子产品", active: false },
|
||||||
|
{ name: "机械设备", active: false },
|
||||||
|
{ name: "零部件模型", active: false },
|
||||||
|
{ name: "交通运输", active: false },
|
||||||
|
{ name: "电子产品", active: false },
|
||||||
|
{ name: "机械设备", active: false },
|
||||||
|
{ name: "零部件模型", active: false },
|
||||||
|
{ name: "交通运输", active: false },
|
||||||
|
{ name: "电子产品", active: false },
|
||||||
|
],
|
||||||
|
};
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
toggleCategoryMenu() {
|
||||||
|
this.showCategoryMenu = !this.showCategoryMenu;
|
||||||
|
},
|
||||||
|
closeCategoryMenu() {
|
||||||
|
this.showCategoryMenu = false;
|
||||||
|
},
|
||||||
|
selectCategory(section) {
|
||||||
|
// 演示用:显示toast提示
|
||||||
|
},
|
||||||
|
},
|
||||||
|
onLoad(options) {
|
||||||
|
console.log(options);
|
||||||
|
// 监听点击事件,点击页面空白处关闭菜单
|
||||||
|
uni.$on("page-click", () => {
|
||||||
|
if (this.showCategoryMenu) {
|
||||||
|
this.closeCategoryMenu();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
onUnload() {
|
||||||
|
// 移除事件监听
|
||||||
|
uni.$off("page-click");
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped lang="scss">
|
||||||
|
// 变量定义
|
||||||
|
$primary-color: #007aff;
|
||||||
|
$text-color: #333;
|
||||||
|
$secondary-text: #666;
|
||||||
|
$light-text: #999;
|
||||||
|
$bg-color: #fff;
|
||||||
|
$white: #fff;
|
||||||
|
$border-color: #eee;
|
||||||
|
$border-radius: 10rpx;
|
||||||
|
$mask-bg: rgba(0, 0, 0, 0.5);
|
||||||
|
.nav-bar {
|
||||||
|
display: flex;
|
||||||
|
background-color: $white;
|
||||||
|
padding: 10rpx 0;
|
||||||
|
position: relative;
|
||||||
|
padding-right: 60rpx;
|
||||||
|
|
||||||
|
.nav-item {
|
||||||
|
flex: 1;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 25rpx;
|
||||||
|
padding: 15rpx 0;
|
||||||
|
|
||||||
|
&.active {
|
||||||
|
color: $primary-color;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.expand-btn {
|
||||||
|
position: absolute;
|
||||||
|
right: 0;
|
||||||
|
top: 0;
|
||||||
|
height: 100%;
|
||||||
|
width: 80rpx;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
|
||||||
|
.expand-icon {
|
||||||
|
font-size: 40rpx;
|
||||||
|
color: $text-color;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 分类浮窗样式
|
||||||
|
.category-popup {
|
||||||
|
position: fixed;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
background-color: $mask-bg;
|
||||||
|
z-index: 999;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
.popup-content {
|
||||||
|
width: 100%;
|
||||||
|
max-height: 80vh;
|
||||||
|
background-color: $white;
|
||||||
|
animation: slideDown 0.3s ease;
|
||||||
|
overflow-y: auto;
|
||||||
|
|
||||||
|
.category-list {
|
||||||
|
padding: 20rpx;
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
|
||||||
|
.category-item {
|
||||||
|
padding: 8rpx 12.94rpx;
|
||||||
|
box-sizing: border-box;
|
||||||
|
margin-right: 3%;
|
||||||
|
margin-bottom: 20rpx;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 25rpx;
|
||||||
|
background-color: $bg-color;
|
||||||
|
border-radius: 4rpx;
|
||||||
|
border: 1px solid $border-color;
|
||||||
|
color: #666;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// 滑入动画
|
||||||
|
@keyframes slideDown {
|
||||||
|
from {
|
||||||
|
transform: translateY(-100%);
|
||||||
|
opacity: 0.5;
|
||||||
|
}
|
||||||
|
to {
|
||||||
|
transform: translateY(0);
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.filter-bar {
|
||||||
|
display: flex;
|
||||||
|
padding: 20rpx 30rpx;
|
||||||
|
|
||||||
|
.filter-item {
|
||||||
|
margin-right: 30rpx;
|
||||||
|
font-size: 25rpx;
|
||||||
|
color: $secondary-text;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-down {
|
||||||
|
font-size: 24rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -1,8 +1,9 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="relative mt-[34px] w-[100%]">
|
<div class="relative mt-[34px] w-[100%]">
|
||||||
<KlTabBar v-model="query.source" :data="tabBar" />
|
<KlTabBar v-model="query.source" :data="tabBar" />
|
||||||
<div class="absolute right-[0px] top-[10px] text-[16px] text-[#999999] font-normal"
|
<div class="absolute right-[0px] top-[0px] text-[16px] text-[#999999] font-normal">
|
||||||
>共<span class="color-[#1A65FF]">{{ result?.total }}</span
|
<el-button type="warning" class="mr-4px" @click="handleUpload">上传工具</el-button>
|
||||||
|
共<span class="color-[#1A65FF]">{{ result?.total }}</span
|
||||||
>个筛选结果</div
|
>个筛选结果</div
|
||||||
>
|
>
|
||||||
<div class="content mt-[10px]">
|
<div class="content mt-[10px]">
|
||||||
@ -17,16 +18,17 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
import KlTabBar from '~/components/kl-tab-bar/index.vue'
|
import KlTabBar from '~/components/kl-tab-bar/v3/index.vue'
|
||||||
import CardPicture from '~/components/kl-card-picture/index.vue'
|
import CardPicture from '~/components/kl-card-picture/index.vue'
|
||||||
import { ref } from 'vue'
|
import { ref } from 'vue'
|
||||||
import type { pageRes, pageReq } from '~/api/upnew/types'
|
import type { pageRes, pageReq } from '~/api/upnew/types'
|
||||||
import emptyImg from '~/assets/images/empty.png'
|
import emptyImg from '~/assets/images/empty.png'
|
||||||
|
import useUserStore from '~/stores/user'
|
||||||
|
|
||||||
const query = defineModel<pageReq>('modelValue', {
|
const query = defineModel<pageReq>('modelValue', {
|
||||||
required: true,
|
required: true,
|
||||||
})
|
})
|
||||||
const result = defineModel<pageRes| null>('result', {
|
const result = defineModel<pageRes | null>('result', {
|
||||||
required: true,
|
required: true,
|
||||||
})
|
})
|
||||||
|
|
||||||
@ -44,6 +46,15 @@
|
|||||||
value: 2,
|
value: 2,
|
||||||
},
|
},
|
||||||
])
|
])
|
||||||
|
|
||||||
|
const handleUpload = () => {
|
||||||
|
// 先判断登录
|
||||||
|
const store = useUserStore()
|
||||||
|
if (!store.token) {
|
||||||
|
return ElMessage.error('请先登录')
|
||||||
|
}
|
||||||
|
navigateTo('/upnew?drawType=3')
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped></style>
|
<style lang="scss" scoped></style>
|
||||||
|
|||||||
@ -16,7 +16,7 @@
|
|||||||
})
|
})
|
||||||
|
|
||||||
useHead({
|
useHead({
|
||||||
title: `${props.title} - 图夕夕`,
|
title: `${props.title}`,
|
||||||
meta: [
|
meta: [
|
||||||
{ name: 'description', content: `${props.description}`},
|
{ name: 'description', content: `${props.description}`},
|
||||||
{ name: 'keywords', content: props.keywords },
|
{ name: 'keywords', content: props.keywords },
|
||||||
|
|||||||
@ -1,10 +1,11 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="relative mt-[34px] w-[100%]">
|
<div class="relative mt-[34px] w-[100%]">
|
||||||
<KlTabBar v-model="query.source" :data="tabBar" />
|
<KlTabBar v-model="query.source" :data="tabBar" />
|
||||||
<div class="absolute right-[0px] top-[10px] text-[16px] text-[#999999] font-normal"
|
<div class="absolute right-[0px] top-[0px] text-[16px] text-[#999999] font-normal">
|
||||||
>共<span class="color-[#1A65FF]">{{ result?.total }}</span
|
<el-button type="warning" class="mr-4px" @click="handleUpload">上传工具</el-button>
|
||||||
>个筛选结果</div
|
共<span class="color-[#1A65FF]">{{ result?.total }}</span>
|
||||||
>
|
个筛选结果
|
||||||
|
</div>
|
||||||
<div class="content mt-[10px]">
|
<div class="content mt-[10px]">
|
||||||
<el-row :gutter="20">
|
<el-row :gutter="20">
|
||||||
<el-col v-for="(item, index) in result?.list" :key="index" :span="6">
|
<el-col v-for="(item, index) in result?.list" :key="index" :span="6">
|
||||||
@ -17,11 +18,12 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
import KlTabBar from '~/components/kl-tab-bar/index.vue'
|
import KlTabBar from '~/components/kl-tab-bar/v3/index.vue'
|
||||||
import CardPicture from '~/components/kl-card-picture/index.vue'
|
import CardPicture from '~/components/kl-card-picture/index.vue'
|
||||||
import { ref } from 'vue'
|
import { ref } from 'vue'
|
||||||
import type { pageRes, pageReq } from '~/api/upnew/types'
|
import type { pageRes, pageReq } from '~/api/upnew/types'
|
||||||
import emptyImg from '~/assets/images/empty.png'
|
import emptyImg from '~/assets/images/empty.png'
|
||||||
|
import useUserStore from '~/stores/user'
|
||||||
|
|
||||||
const query = defineModel<pageReq>('modelValue', {
|
const query = defineModel<pageReq>('modelValue', {
|
||||||
required: true,
|
required: true,
|
||||||
@ -34,7 +36,7 @@
|
|||||||
const tabBar = ref([
|
const tabBar = ref([
|
||||||
{
|
{
|
||||||
label: '文本推荐',
|
label: '文本推荐',
|
||||||
value: -1
|
value: -1,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: '原创文本',
|
label: '原创文本',
|
||||||
@ -45,6 +47,15 @@
|
|||||||
value: 2,
|
value: 2,
|
||||||
},
|
},
|
||||||
])
|
])
|
||||||
|
|
||||||
|
const handleUpload = () => {
|
||||||
|
// 先判断登录
|
||||||
|
const store = useUserStore()
|
||||||
|
if (!store.token) {
|
||||||
|
return ElMessage.error('请先登录')
|
||||||
|
}
|
||||||
|
navigateTo('/upnew?drawType=2')
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped></style>
|
<style lang="scss" scoped></style>
|
||||||
|
|||||||
77
components/toolbox-components/kl-wallpaper-category.vue
Normal file
@ -0,0 +1,77 @@
|
|||||||
|
<template>
|
||||||
|
<div class="box-border w-[100%] border border-[#EEEEEE] rounded-[12px] border-solid bg-[#FFFFFF] px-[20px] py-[26px]">
|
||||||
|
<div class="mb-[10px] flex items-start">
|
||||||
|
<div class="flex-shrink-0 text-[15px] text-[#333333] font-normal">软件分类</div>
|
||||||
|
<div class="ml-[30px] mt-[-6px] flex flex-wrap">
|
||||||
|
<div
|
||||||
|
v-for="(item, index) in projectTypeList"
|
||||||
|
:key="index"
|
||||||
|
class="mb-[8px] mr-[26px] cursor-pointer rounded-[15px] px-[15px] py-[6px] text-[14px] text-[#666666] font-normal"
|
||||||
|
:class="item.id === query ? '!bg-[#ebeefe] !text-[#1A65FF]' : ''"
|
||||||
|
@click="handleClick(item)"
|
||||||
|
>{{ item.name }}</div
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<script setup lang="ts">
|
||||||
|
import { computed, ref } from 'vue'
|
||||||
|
import { parent } from '~/api/upnew/index'
|
||||||
|
import type { pageReq } from '~/api/upnew/types'
|
||||||
|
import { getDictTree } from '~/api/home/index'
|
||||||
|
import { ArrowRight } from '@element-plus/icons-vue'
|
||||||
|
|
||||||
|
const props = defineProps({
|
||||||
|
type: {
|
||||||
|
type: Number,
|
||||||
|
default: 1,
|
||||||
|
},
|
||||||
|
id: {
|
||||||
|
type: String,
|
||||||
|
default: '',
|
||||||
|
},
|
||||||
|
groundId: {
|
||||||
|
type: String,
|
||||||
|
default: '',
|
||||||
|
},
|
||||||
|
})
|
||||||
|
|
||||||
|
const query = defineModel<string | undefined>('modelValue', {
|
||||||
|
required: true,
|
||||||
|
})
|
||||||
|
|
||||||
|
// 服务端渲染兼容方案:顺序执行异步操作
|
||||||
|
// 1. 先获取面包屑数据(已在上面通过useAsyncData获取)
|
||||||
|
|
||||||
|
// 2. 顺序获取分类下拉框数据
|
||||||
|
// 创建一个函数来获取分类数据,确保服务端渲染时能获取到数据
|
||||||
|
const getProjectTypeList = async () => {
|
||||||
|
try {
|
||||||
|
// 获取分类数据
|
||||||
|
const res = await parent({
|
||||||
|
type: 3,
|
||||||
|
parentId: 0,
|
||||||
|
})
|
||||||
|
const all = [{ id: '-1', name: '全部' }]
|
||||||
|
return [...all, ...res.data]
|
||||||
|
} catch (error) {
|
||||||
|
return []
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 使用useAsyncData获取分类列表,确保服务端渲染兼容性
|
||||||
|
const { data: projectTypeList } = await useAsyncData(
|
||||||
|
`projectType-draw-toolbox-${props.type}-${query.value}}`,
|
||||||
|
getProjectTypeList,
|
||||||
|
{ server: true } // 确保在服务端执行
|
||||||
|
)
|
||||||
|
|
||||||
|
const handleClick = (row: any) => {
|
||||||
|
query.value = row.id
|
||||||
|
}
|
||||||
|
|
||||||
|
const handleClickBread = (row: any, index: number) => {
|
||||||
|
query.value = row.id
|
||||||
|
}
|
||||||
|
</script>
|
||||||
@ -1,77 +1,56 @@
|
|||||||
import { isArray } from "~/utils/utils";
|
import { isArray } from '~/utils/utils'
|
||||||
|
import useUserStore from '~/stores/user'
|
||||||
// import refreshToken from "~/utils/RefreshToken";
|
// import refreshToken from "~/utils/RefreshToken";
|
||||||
|
|
||||||
type FetchType = typeof $fetch;
|
type FetchType = typeof $fetch
|
||||||
export type FetchOptions = Parameters<FetchType>[1];
|
export type FetchOptions = Parameters<FetchType>[1]
|
||||||
|
|
||||||
const useClientRequest = async <T = unknown>(
|
const useClientRequest = async <T = unknown>(url: string, opts?: FetchOptions) => {
|
||||||
url: string,
|
const token = useCookie<string | undefined>('token')
|
||||||
opts?: FetchOptions
|
const runtimeConfig = useRuntimeConfig()
|
||||||
) => {
|
const userStore = useUserStore()
|
||||||
const token = useCookie<string | undefined>("token");
|
|
||||||
const runtimeConfig = useRuntimeConfig();
|
|
||||||
|
|
||||||
const defaultOptions: FetchOptions = {
|
const defaultOptions: FetchOptions = {
|
||||||
baseURL: runtimeConfig.public.apiBase,
|
baseURL: runtimeConfig.public.apiBase,
|
||||||
onRequest({ options }) {
|
onRequest({ options }) {
|
||||||
options.headers = options.headers || 'application/json';
|
options.headers = options.headers || 'application/json'
|
||||||
if (token.value) {
|
if (token.value || userStore.token) {
|
||||||
options.headers.set("Authorization", `Bearer ${token.value}`);
|
options.headers.set('Authorization', `Bearer ${token.value || userStore.token}`)
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
onResponse({ response }) {
|
onResponse({ response }) {
|
||||||
if (+response.status === 200 && +response._data.code !== 0) {
|
if (+response.status === 200 && +response._data.code !== 0) {
|
||||||
ElMessage.error(response._data.msg);
|
ElMessage.error(response._data.msg)
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
onResponseError({ response }) {
|
onResponseError({ response }) {
|
||||||
ElMessage.error(
|
ElMessage.error(isArray(response._data.data.msg) ? response._data.data.msg[0] : response._data.data.msg)
|
||||||
isArray(response._data.data.msg)
|
|
||||||
? response._data.data.msg[0]
|
|
||||||
: response._data.data.msg
|
|
||||||
);
|
|
||||||
},
|
},
|
||||||
};
|
|
||||||
|
|
||||||
// 明确转换返回类型
|
|
||||||
const response = await $fetch(url, { ...defaultOptions, ...opts });
|
|
||||||
return response as unknown as T;
|
|
||||||
};
|
|
||||||
|
|
||||||
// GET请求
|
|
||||||
export const get = <T = unknown>(
|
|
||||||
endpoint: string,
|
|
||||||
config?: Omit<FetchOptions, 'method'>
|
|
||||||
): Promise<T> => {
|
|
||||||
return useClientRequest<T>(endpoint, { ...config, method: 'GET' })
|
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
// POST请求
|
// 明确转换返回类型
|
||||||
export const post = <T = unknown>(
|
const response = await $fetch(url, { ...defaultOptions, ...opts })
|
||||||
endpoint: string,
|
return response as unknown as T
|
||||||
body?: any,
|
}
|
||||||
config?: Omit<FetchOptions, 'method' | 'body'>
|
|
||||||
): Promise<T> => {
|
|
||||||
return useClientRequest<T>(endpoint, { ...config, method: 'POST', body })
|
|
||||||
}
|
|
||||||
|
|
||||||
|
// GET请求
|
||||||
// DELETE请求
|
export const get = <T = unknown>(endpoint: string, config?: Omit<FetchOptions, 'method'>): Promise<T> => {
|
||||||
export const del = <T = unknown>(
|
return useClientRequest<T>(endpoint, { ...config, method: 'GET' })
|
||||||
endpoint: string,
|
}
|
||||||
config?: Omit<FetchOptions, 'method'>
|
|
||||||
): Promise<T> => {
|
|
||||||
return useClientRequest<T>(endpoint, { ...config, method: 'DELETE' })
|
|
||||||
}
|
|
||||||
|
|
||||||
// PUT请求
|
// POST请求
|
||||||
export const put = <T = unknown>(
|
export const post = <T = unknown>(endpoint: string, body?: any, config?: Omit<FetchOptions, 'method' | 'body'>): Promise<T> => {
|
||||||
endpoint: string,
|
return useClientRequest<T>(endpoint, { ...config, method: 'POST', body })
|
||||||
body?: any,
|
}
|
||||||
config?: Omit<FetchOptions, 'method' | 'body'>
|
|
||||||
): Promise<T> => {
|
// DELETE请求
|
||||||
console.log({ ...config, method: 'PUT', body });
|
export const del = <T = unknown>(endpoint: string, config?: Omit<FetchOptions, 'method'>): Promise<T> => {
|
||||||
|
return useClientRequest<T>(endpoint, { ...config, method: 'DELETE' })
|
||||||
return useClientRequest<T>(endpoint, { ...config, method: 'PUT', body })
|
}
|
||||||
}
|
|
||||||
|
// PUT请求
|
||||||
|
export const put = <T = unknown>(endpoint: string, body?: any, config?: Omit<FetchOptions, 'method' | 'body'>): Promise<T> => {
|
||||||
|
console.log({ ...config, method: 'PUT', body })
|
||||||
|
|
||||||
|
return useClientRequest<T>(endpoint, { ...config, method: 'PUT', body })
|
||||||
|
}
|
||||||
|
|||||||
@ -10,6 +10,7 @@ const useServerRequest = async <T>(url: string, opts?: UseFetchOptions<T, unknow
|
|||||||
baseURL: runtimeConfig.public.apiBase,
|
baseURL: runtimeConfig.public.apiBase,
|
||||||
onRequest({ options }) {
|
onRequest({ options }) {
|
||||||
options.headers = options.headers || {}
|
options.headers = options.headers || {}
|
||||||
|
|
||||||
if (token.value) {
|
if (token.value) {
|
||||||
options.headers.set('Authorization', `Bearer ${token.value}`)
|
options.headers.set('Authorization', `Bearer ${token.value}`)
|
||||||
}
|
}
|
||||||
|
|||||||
81
composables/useMessage.ts
Normal file
@ -0,0 +1,81 @@
|
|||||||
|
import { ElMessage, ElMessageBox, ElNotification } from 'element-plus'
|
||||||
|
export const useMessage = () => {
|
||||||
|
return {
|
||||||
|
// 消息提示
|
||||||
|
info(content: string) {
|
||||||
|
ElMessage.info(content)
|
||||||
|
},
|
||||||
|
// 错误消息
|
||||||
|
error(content: string) {
|
||||||
|
ElMessage.error(content)
|
||||||
|
},
|
||||||
|
// 成功消息
|
||||||
|
success(content: string) {
|
||||||
|
ElMessage.success(content)
|
||||||
|
},
|
||||||
|
// 警告消息
|
||||||
|
warning(content: string) {
|
||||||
|
ElMessage.warning(content)
|
||||||
|
},
|
||||||
|
// 弹出提示
|
||||||
|
alert(content: string, title: string) {
|
||||||
|
ElMessageBox.alert(content, title)
|
||||||
|
},
|
||||||
|
// 错误提示
|
||||||
|
alertError(content: string, title: string) {
|
||||||
|
ElMessageBox.alert(content, title, { type: 'error' })
|
||||||
|
},
|
||||||
|
// 成功提示
|
||||||
|
alertSuccess(content: string, title: string) {
|
||||||
|
ElMessageBox.alert(content, title, { type: 'success' })
|
||||||
|
},
|
||||||
|
// 警告提示
|
||||||
|
alertWarning(content: string, title: string) {
|
||||||
|
ElMessageBox.alert(content, title, { type: 'warning' })
|
||||||
|
},
|
||||||
|
// 通知提示
|
||||||
|
notify(content: string) {
|
||||||
|
ElNotification.info(content)
|
||||||
|
},
|
||||||
|
// 错误通知
|
||||||
|
notifyError(content: string) {
|
||||||
|
ElNotification.error(content)
|
||||||
|
},
|
||||||
|
// 成功通知
|
||||||
|
notifySuccess(content: string) {
|
||||||
|
ElNotification.success(content)
|
||||||
|
},
|
||||||
|
// 警告通知
|
||||||
|
notifyWarning(content: string) {
|
||||||
|
ElNotification.warning(content)
|
||||||
|
},
|
||||||
|
// 确认窗体
|
||||||
|
confirm(content: string, title?: string, options?: any) {
|
||||||
|
return ElMessageBox.confirm(content, title, {
|
||||||
|
type: 'warning',
|
||||||
|
...options
|
||||||
|
})
|
||||||
|
},
|
||||||
|
// 删除窗体
|
||||||
|
delConfirm(content?: string, title?: string, options?: any) {
|
||||||
|
return ElMessageBox.confirm(content, title, {
|
||||||
|
type: 'warning',
|
||||||
|
...options
|
||||||
|
})
|
||||||
|
},
|
||||||
|
// 导出窗体
|
||||||
|
exportConfirm(content?: string, title?: string, options?: any) {
|
||||||
|
return ElMessageBox.confirm(content, title, {
|
||||||
|
type: 'warning',
|
||||||
|
...options
|
||||||
|
})
|
||||||
|
},
|
||||||
|
// 提交内容
|
||||||
|
prompt(content: string, title: string, options?: any) {
|
||||||
|
return ElMessageBox.prompt(content, title, {
|
||||||
|
type: 'warning',
|
||||||
|
...options
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -0,0 +1,70 @@
|
|||||||
|
<script setup lang="ts">
|
||||||
|
const active = ref('home')
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<div class="m">
|
||||||
|
<div class="scroll-container">
|
||||||
|
<slot />
|
||||||
|
</div>
|
||||||
|
<!-- 底部信息 -->
|
||||||
|
<div class="footer">
|
||||||
|
<van-tabbar v-model="active">
|
||||||
|
<van-tabbar-item name="home" icon="home-o">标签</van-tabbar-item>
|
||||||
|
<van-tabbar-item name="search" icon="search">标签</van-tabbar-item>
|
||||||
|
<van-tabbar-item name="friends" icon="friends-o">标签</van-tabbar-item>
|
||||||
|
<van-tabbar-item name="setting" icon="setting-o">标签</van-tabbar-item>
|
||||||
|
</van-tabbar>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
/* 移动端样式重置 - 只在移动端布局中生效 */
|
||||||
|
.m {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
background-color: #f8f8f8;
|
||||||
|
.scroll-container {
|
||||||
|
// flex: 1;
|
||||||
|
overflow-y: auto;
|
||||||
|
height: calc(100vh - 40px);
|
||||||
|
}
|
||||||
|
.footer {
|
||||||
|
height: auto;
|
||||||
|
}
|
||||||
|
/* 重置 body 的最小宽度限制 */
|
||||||
|
:global(body) {
|
||||||
|
min-width: unset !important;
|
||||||
|
width: 100% !important;
|
||||||
|
max-width: 100% !important;
|
||||||
|
background-color: #f8f8f8;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 重置 #__nuxt 容器的样式 */
|
||||||
|
:global(#__nuxt) {
|
||||||
|
min-width: unset !important;
|
||||||
|
width: 100% !important;
|
||||||
|
max-width: 100% !important;
|
||||||
|
|
||||||
|
// .page-content {
|
||||||
|
// padding: 0 !important;
|
||||||
|
// overflow-x: hidden !important;
|
||||||
|
|
||||||
|
// .page-table-wrap {
|
||||||
|
// padding: 8px !important;
|
||||||
|
// }
|
||||||
|
|
||||||
|
// .page-card {
|
||||||
|
// padding: 8px !important;
|
||||||
|
// }
|
||||||
|
// }
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 移动端优化滚动条 */
|
||||||
|
:global(::-webkit-scrollbar) {
|
||||||
|
width: 4px !important;
|
||||||
|
height: 4px !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|||||||
12
middleware/login.global.ts
Normal file
@ -0,0 +1,12 @@
|
|||||||
|
import useUserStore from '~/stores/user'
|
||||||
|
export default defineNuxtRouteMiddleware((to, from) => {
|
||||||
|
const { code, state, type } = to.query
|
||||||
|
if (code && state && type && import.meta.client) {
|
||||||
|
const userStore = useUserStore()
|
||||||
|
userStore.getToken({
|
||||||
|
code: code as string,
|
||||||
|
state: state as string,
|
||||||
|
type: type as string,
|
||||||
|
})
|
||||||
|
}
|
||||||
|
})
|
||||||
@ -6,13 +6,13 @@ export default defineNuxtRouteMiddleware((to, from) => {
|
|||||||
// 是否是移动端设备
|
// 是否是移动端设备
|
||||||
const isMobile = /(Android|webOS|iPhone|iPod|tablet|BlackBerry|Mobile)/i.test(navigator.userAgent)
|
const isMobile = /(Android|webOS|iPhone|iPod|tablet|BlackBerry|Mobile)/i.test(navigator.userAgent)
|
||||||
// 是否是手机端路由开头
|
// 是否是手机端路由开头
|
||||||
const isRouterMobile = to.path.startsWith('/m')
|
const isRouterMobile = to.path.startsWith('/mobile')
|
||||||
|
|
||||||
console.log(isMobile, isRouterMobile);
|
console.log(isMobile, isRouterMobile);
|
||||||
|
|
||||||
// 移动端并且 不是/m开头路由
|
// 移动端并且 不是/m开头路由
|
||||||
if (isMobile && !isRouterMobile) {
|
if (isMobile && !isRouterMobile) {
|
||||||
return navigateTo(`/m`)
|
return navigateTo(`/mobile`)
|
||||||
}
|
}
|
||||||
// 不是移动端 是/m开头路由
|
// 不是移动端 是/m开头路由
|
||||||
if (!isMobile && isRouterMobile) {
|
if (!isMobile && isRouterMobile) {
|
||||||
19
middleware/tdk.global.ts
Normal file
@ -0,0 +1,19 @@
|
|||||||
|
import { getTDKList } from '~/api/home/index'
|
||||||
|
// middleware/tdk.global.ts
|
||||||
|
export default defineNuxtRouteMiddleware(async (to) => {
|
||||||
|
const { data: tdkData } = await getTDKList()
|
||||||
|
// 获取当前路由
|
||||||
|
const currentPath = to.path;
|
||||||
|
// 根据当前路由获取对应的TDK数据
|
||||||
|
const currentTdk = tdkData?.find((item) => item.path === currentPath)
|
||||||
|
|
||||||
|
if (currentTdk) {
|
||||||
|
useHead({
|
||||||
|
title: currentTdk.title,
|
||||||
|
meta: [
|
||||||
|
{ name: 'description', content: currentTdk.describeText },
|
||||||
|
{ name: 'keywords', content: currentTdk.keyword }
|
||||||
|
]
|
||||||
|
})
|
||||||
|
}
|
||||||
|
})
|
||||||
@ -12,7 +12,7 @@ export default defineNuxtConfig({
|
|||||||
debug: process.env.NODE_ENV === 'development', // 开启详细调试日志
|
debug: process.env.NODE_ENV === 'development', // 开启详细调试日志
|
||||||
|
|
||||||
ssr: true,
|
ssr: true,
|
||||||
modules: ['@unocss/nuxt', '@pinia/nuxt', '@element-plus/nuxt', 'pinia-plugin-persistedstate/nuxt'],
|
modules: ['@unocss/nuxt', '@pinia/nuxt', '@element-plus/nuxt', 'pinia-plugin-persistedstate/nuxt','@vant/nuxt'],
|
||||||
unocss: {
|
unocss: {
|
||||||
nuxtLayers: true,
|
nuxtLayers: true,
|
||||||
},
|
},
|
||||||
@ -31,26 +31,31 @@ export default defineNuxtConfig({
|
|||||||
postcss: {
|
postcss: {
|
||||||
plugins: [
|
plugins: [
|
||||||
postcsspxtoviewport({
|
postcsspxtoviewport({
|
||||||
unitToConvert: 'px', // 要转化的单位
|
unitToConvert: 'px',
|
||||||
viewportWidth: 750, // UI设计稿的宽度
|
viewportWidth: 750,
|
||||||
unitPrecision: 6, // 转换后的精度,即小数点位数
|
unitPrecision: 6,
|
||||||
propList: ['*'], // 指定转换的css属性的单位,*代表全部css属性的单位都进行转换
|
propList: ['*'],
|
||||||
viewportUnit: 'vw', // 指定需要转换成的视窗单位,默认vw
|
viewportUnit: 'vw',
|
||||||
fontViewportUnit: 'vw', // 指定字体需要转换成的视窗单位,默认vw
|
fontViewportUnit: 'vw',
|
||||||
selectorBlackList: ['el-'], // 指定不转换为视窗单位的类名,例如van-(vantUI组件),
|
selectorBlackList: ['el-'],
|
||||||
minPixelValue: 1, // 默认值1,小于或等于1px则不进行转换
|
minPixelValue: 1,
|
||||||
mediaQuery: true, // 是否在媒体查询的css代码中也进行转换,默认false
|
mediaQuery: true,
|
||||||
replace: true, // 是否转换后直接更换属性值
|
replace: true,
|
||||||
exclude: [/node_modules/, /^(?!.*\/pages\/m\/).*$/], // 排除node_modules和非pages/m目录下的文件
|
// 严格只允许 pages/mobile 下的文件被转换
|
||||||
landscape: false, // 是否处理横屏情况
|
// 使用强排除:排除 node_modules 和 所有不在 pages/mobile 下的文件
|
||||||
// 只转换pages下的m文件
|
exclude: [
|
||||||
include: [/pages\/m/],
|
/node_modules/,
|
||||||
|
/^(?!.*\/(pages|src)\/mobile\/).*$/
|
||||||
|
],
|
||||||
|
landscape: false,
|
||||||
|
// 可选:进一步放宽 include,以便某些移动端专用布局文件也参与
|
||||||
|
include: [/\/pages\/mobile\//],
|
||||||
}),
|
}),
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
optimizeDeps: {
|
optimizeDeps: {
|
||||||
include: ['naive-ui'],
|
include: ['element-plus','unocss'], // 预构建依赖项
|
||||||
},
|
},
|
||||||
// 生产环境构建优化
|
// 生产环境构建优化
|
||||||
build: {
|
build: {
|
||||||
@ -137,7 +142,7 @@ export default defineNuxtConfig({
|
|||||||
},
|
},
|
||||||
|
|
||||||
build: {
|
build: {
|
||||||
transpile: ['vueuc', '@css-render/vue3-ssr', '@tinymce/tinymce-vue', 'tinymce'],
|
transpile: process.env.NODE_ENV === 'production' ? ['lodash'] : [],
|
||||||
},
|
},
|
||||||
plugins: [
|
plugins: [
|
||||||
// 在这里引入插件
|
// 在这里引入插件
|
||||||
|
|||||||
@ -1,5 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "nuxt-app",
|
"name": "nuxt-app",
|
||||||
|
"version": "1.0.0",
|
||||||
"private": true,
|
"private": true,
|
||||||
"type": "module",
|
"type": "module",
|
||||||
"scripts": {
|
"scripts": {
|
||||||
@ -16,12 +17,14 @@
|
|||||||
"@wangeditor/editor-for-vue": "^5.1.12",
|
"@wangeditor/editor-for-vue": "^5.1.12",
|
||||||
"decimal.js": "^10.6.0",
|
"decimal.js": "^10.6.0",
|
||||||
"echarts": "^6.0.0",
|
"echarts": "^6.0.0",
|
||||||
|
"lodash": "^4.17.21",
|
||||||
"mqtt": "^5.14.0",
|
"mqtt": "^5.14.0",
|
||||||
"nuxt": "^3.18.1",
|
"nuxt": "^3.18.1",
|
||||||
"pdfjs-dist": "^5.4.54",
|
"pdfjs-dist": "^5.4.54",
|
||||||
"pinia": "^3.0.3",
|
"pinia": "^3.0.3",
|
||||||
"postcss-px-to-viewport": "^1.1.1",
|
"postcss-px-to-viewport": "^1.1.1",
|
||||||
"qrcode.vue": "^3.6.0",
|
"qrcode.vue": "^3.6.0",
|
||||||
|
"vant": "^4.9.21",
|
||||||
"vue": "^3.5.18",
|
"vue": "^3.5.18",
|
||||||
"vue-pdf-embed": "^2.1.3",
|
"vue-pdf-embed": "^2.1.3",
|
||||||
"vue-router": "^4.5.1",
|
"vue-router": "^4.5.1",
|
||||||
|
|||||||
@ -2,6 +2,7 @@
|
|||||||
<div class="ml-[19px] w-[100%]">
|
<div class="ml-[19px] w-[100%]">
|
||||||
<ChannelHeader v-if="Object.keys(lunTanRes || {}).length" v-model="lunTanRes"></ChannelHeader>
|
<ChannelHeader v-if="Object.keys(lunTanRes || {}).length" v-model="lunTanRes"></ChannelHeader>
|
||||||
<div
|
<div
|
||||||
|
v-if="pageRes?.list.length"
|
||||||
class="mb-[13px] box-border flex flex-1 flex-col cursor-pointer gap-[12px] border border-[#EEEEEE] rounded-[8px] border-solid bg-[#FFFFFF] px-[20px] py-[16px]"
|
class="mb-[13px] box-border flex flex-1 flex-col cursor-pointer gap-[12px] border border-[#EEEEEE] rounded-[8px] border-solid bg-[#FFFFFF] px-[20px] py-[16px]"
|
||||||
>
|
>
|
||||||
<div
|
<div
|
||||||
@ -20,7 +21,7 @@
|
|||||||
<div class="w-[100px] flex flex-shrink-0 items-center justify-end">
|
<div class="w-[100px] flex flex-shrink-0 items-center justify-end">
|
||||||
<span class="ellipsis text-[13px] color-[#96999f]">{{ item.creatorName }}</span>
|
<span class="ellipsis text-[13px] color-[#96999f]">{{ item.creatorName }}</span>
|
||||||
<!-- 删除 -->
|
<!-- 删除 -->
|
||||||
<el-button v-if="false" type="danger" size="small" @click="handleDelete(item.postsId)">删除</el-button>
|
<el-button v-if="false" type="danger" size="small" @click.stop="handleDelete(item.postsId)">删除</el-button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@ -1,19 +1,24 @@
|
|||||||
<template>
|
<template>
|
||||||
<SeoHead :title="detail?.title" :description="detail?.description" :keywords="detail?.labels?.toString()" />
|
<SeoHead :title="detail?.title" :description="detail?.description" :keywords="detail?.labels?.toString()" />
|
||||||
<KlNavTab />
|
<KlNavTab />
|
||||||
|
<div v-if="breadList && breadList.length > 1" class="mb-[-10px] mt-[20px] w-[1440px] mx-auto">
|
||||||
|
<el-breadcrumb :separator-icon="ArrowRight">
|
||||||
|
<el-breadcrumb-item v-for="(item, index) in breadList" :key="item.name">{{ item.name }}</el-breadcrumb-item>
|
||||||
|
</el-breadcrumb>
|
||||||
|
</div>
|
||||||
<div class="ml-auto mr-auto mt-[20px] w-[1440px]">
|
<div class="ml-auto mr-auto mt-[20px] w-[1440px]">
|
||||||
<div class="flex items-center">
|
<div class="flex items-center">
|
||||||
<div
|
<div
|
||||||
class="box-border h-[60px] w-[1019px] flex items-center justify-between border border-[#EEEEEE] rounded-[12px] border-solid bg-[#FFFFFF] px-[27px] py-[24px]"
|
class="box-border h-[60px] w-[1019px] flex items-center justify-between border border-[#EEEEEE] rounded-[12px] border-solid bg-[#FFFFFF] px-[27px] py-[24px]"
|
||||||
>
|
>
|
||||||
<div class="text-[20px] text-[#333333] font-normal"> {{ detail?.title }}</div>
|
<div class="text-[16px] text-[#333333] font-normal"> {{ detail?.title }}</div>
|
||||||
<div class="flex items-center">
|
<div class="flex items-center">
|
||||||
<img :src="detail?.ownedUserIdInfo?.avatar" alt="" srcset="" class="h-[30px] w-[30px] rd-[50%]" />
|
<img :src="detail?.ownedUserIdInfo?.avatar" alt="" srcset="" class="h-[30px] w-[30px] rd-[50%]" />
|
||||||
<span class="ml-[12px] color-[#999999]">by {{ detail?.ownedUserIdInfo?.nickName }}</span>
|
<span class="ml-[12px] color-[#999999]">by {{ detail?.ownedUserIdInfo?.nickName }}</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="ml-[23px] flex flex-1 text-[18px] text-[#FFFFFF] font-normal">
|
<div class="ml-[23px] flex flex-1 text-[16px] text-[#FFFFFF] font-normal">
|
||||||
<div class="h-[60px] w-[160px] flex cursor-pointer items-center justify-center rounded-[8px] bg-[#1A65FF]" @click="handleDownload">
|
<div class="h-[60px] w-[160px] flex cursor-pointer items-center justify-center rounded-[8px] bg-[#1A65FF]" @click="handleDownload">
|
||||||
<img src="~/assets/images/download.png" alt="" srcset="" class="mr-[4px] h-[22px] w-[27px]" />
|
<img src="~/assets/images/download.png" alt="" srcset="" class="mr-[4px] h-[22px] w-[27px]" />
|
||||||
{{ detail?.points === 0 ? '免费下载' : '立即下载' }}
|
{{ detail?.points === 0 ? '免费下载' : '立即下载' }}
|
||||||
@ -40,23 +45,27 @@
|
|||||||
<div>
|
<div>
|
||||||
<ThumBnail :data="detail?.coverImages" :type="detail?.type"></ThumBnail>
|
<ThumBnail :data="detail?.coverImages" :type="detail?.type"></ThumBnail>
|
||||||
</div>
|
</div>
|
||||||
<div class="mb-[20px] mt-[34px] flex items-center text-[16px] text-[#333333] font-normal">
|
<div class="mb-[20px] mt-[34px] flex items-center text-[14px] text-[#333333] font-normal">
|
||||||
<div class="h-[24px] w-[4px] rounded-[1px] bg-[#1A65FF]"></div><span class="ml-[10px]">{{ detail?.title }}描述</span></div
|
<div class="h-[20px] w-[4px] rounded-[1px] bg-[#1A65FF]"></div><span class="ml-[10px]">{{ detail?.title }}描述</span></div
|
||||||
>
|
>
|
||||||
<div
|
<div
|
||||||
class="box-border min-h-[90px] w-[1019px] border border-[#EEEEEE] rounded-[6px] border-solid bg-[#FFFFFF] pa-[24px] text-[14px] text-[#333333] font-normal"
|
class="box-border min-h-[90px] w-[1019px] border border-[#EEEEEE] rounded-[6px] border-solid bg-[#FFFFFF] pa-[24px] text-[14px] text-[#333333] font-normal"
|
||||||
>
|
>
|
||||||
{{ detail?.description }}
|
{{ detail?.description }}
|
||||||
</div>
|
</div>
|
||||||
<div id="section1" class="mb-[20px] mt-[34px] flex items-center text-[16px] text-[#333333] font-normal">
|
<div id="section1" class="mb-[20px] mt-[34px] flex items-center text-[14px] text-[#333333] font-normal">
|
||||||
<div class="h-[24px] w-[4px] rounded-[1px] bg-[#1A65FF]"></div><span class="ml-[10px]">{{ detail?.title }}附件</span></div
|
<div class="h-[20px] w-[4px] rounded-[1px] bg-[#1A65FF]"></div><span class="ml-[10px]">{{ detail?.title }}附件</span></div
|
||||||
>
|
>
|
||||||
<div class="box-border w-[1019px] border border-[#EEEEEE] rounded-[6px] border-solid bg-[#FFFFFF] pa-[24px]">
|
<div class="box-border w-[1019px] border border-[#EEEEEE] rounded-[6px] border-solid bg-[#FFFFFF] pa-[24px]">
|
||||||
<div class="border-b-[1px] border-b-[#eee] border-b-solid p-b-[10px]">
|
<div class="border-b-[1px] border-b-[#eee] border-b-solid p-b-[10px]">
|
||||||
{{ detail?.type === 1 ? '图纸' : detail?.type === 2 ? '文本' : '模型' }}中包含的文件
|
{{ detail?.type === 1 ? '图纸' : detail?.type === 2 ? '文本' : '模型' }}中包含的文件
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<div v-for="item in detail?.files" :key="item.id" class="flex items-center justify-between border-b-[1px] border-b-[#eee] border-b-solid py-[10px]">
|
<div
|
||||||
|
v-for="item in detail?.otherFiles"
|
||||||
|
:key="item.id"
|
||||||
|
class="flex items-center justify-between border-b-[1px] border-b-[#eee] border-b-solid py-[10px]"
|
||||||
|
>
|
||||||
<!-- <img src="~/assets/images/avater.png" alt="" srcset="" class="h-30px w-30px" /> -->
|
<!-- <img src="~/assets/images/avater.png" alt="" srcset="" class="h-30px w-30px" /> -->
|
||||||
<div>
|
<div>
|
||||||
<!-- <span class="ml-[10px] cursor-pointer" @click="handleDownloadPreview(item)">{{ item.title }}</span> -->
|
<!-- <span class="ml-[10px] cursor-pointer" @click="handleDownloadPreview(item)">{{ item.title }}</span> -->
|
||||||
@ -77,8 +86,8 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<!-- 关联项目 -->
|
<!-- 关联项目 -->
|
||||||
<div class="mb-[20px] mt-[34px] flex items-center text-[16px] text-[#333333] font-normal">
|
<div class="mb-[20px] mt-[34px] flex items-center text-[14px] text-[#333333] font-normal">
|
||||||
<div class="h-[24px] w-[4px] rounded-[1px] bg-[#1A65FF]"></div
|
<div class="h-[20px] w-[4px] rounded-[1px] bg-[#1A65FF]"></div
|
||||||
><span class="ml-[10px]">关联{{ detail?.type === 1 ? '图纸' : detail?.type === 2 ? '文本' : '模型' }}</span></div
|
><span class="ml-[10px]">关联{{ detail?.type === 1 ? '图纸' : detail?.type === 2 ? '文本' : '模型' }}</span></div
|
||||||
>
|
>
|
||||||
<el-row :gutter="20">
|
<el-row :gutter="20">
|
||||||
@ -88,8 +97,8 @@
|
|||||||
</el-row>
|
</el-row>
|
||||||
<el-empty v-if="!detail?.relationDraws?.length" description="暂无数据"></el-empty>
|
<el-empty v-if="!detail?.relationDraws?.length" description="暂无数据"></el-empty>
|
||||||
<!-- 关联模型 -->
|
<!-- 关联模型 -->
|
||||||
<div class="mb-[20px] mt-[34px] flex items-center text-[16px] text-[#333333] font-normal">
|
<div class="mb-[20px] mt-[34px] flex items-center text-[14px] text-[#333333] font-normal">
|
||||||
<div class="h-[24px] w-[4px] rounded-[1px] bg-[#1A65FF]"></div
|
<div class="h-[20px] w-[4px] rounded-[1px] bg-[#1A65FF]"></div
|
||||||
><span class="ml-[10px]">相关{{ detail?.type === 1 ? '图纸' : detail?.type === 2 ? '文本' : '模型' }}推荐</span></div
|
><span class="ml-[10px]">相关{{ detail?.type === 1 ? '图纸' : detail?.type === 2 ? '文本' : '模型' }}推荐</span></div
|
||||||
>
|
>
|
||||||
<el-row :gutter="20">
|
<el-row :gutter="20">
|
||||||
@ -102,7 +111,7 @@
|
|||||||
</div>
|
</div>
|
||||||
<div class="ml-[22px]">
|
<div class="ml-[22px]">
|
||||||
<div class="box-border min-h-[269px] w-[397px] border border-[#EEEEEE] rounded-[12px] border-solid bg-[#FFFFFF] pa-[22px]">
|
<div class="box-border min-h-[269px] w-[397px] border border-[#EEEEEE] rounded-[12px] border-solid bg-[#FFFFFF] pa-[22px]">
|
||||||
<div class="mb-[10px]">图纸ID: {{ detail?.id }}</div>
|
<div class="mb-[10px]">图纸ID: {{ detail?.no }}</div>
|
||||||
<div class="mb-[10px]">文件大小:{{ detail?.filesInfo?.fileSize || 0 }} </div>
|
<div class="mb-[10px]">文件大小:{{ detail?.filesInfo?.fileSize || 0 }} </div>
|
||||||
<!-- <div class="mb-10px">图纸版本:{{ detail.editionsName }} </div> -->
|
<!-- <div class="mb-10px">图纸版本:{{ detail.editionsName }} </div> -->
|
||||||
<div class="mb-[10px]">图纸格式:{{ detail?.formatType?.toString() }}</div>
|
<div class="mb-[10px]">图纸格式:{{ detail?.formatType?.toString() }}</div>
|
||||||
@ -137,7 +146,7 @@
|
|||||||
<div class="h-[20px]">
|
<div class="h-[20px]">
|
||||||
<img src="~/assets/images/user4.png" alt="fans" class="w-[80%] rounded-full vertical-top" />
|
<img src="~/assets/images/user4.png" alt="fans" class="w-[80%] rounded-full vertical-top" />
|
||||||
</div>
|
</div>
|
||||||
<div class="relative top-[-3px] ml-[8px] text-[14px] text-[#666] font-normal">粉丝: {{ userInfo.fansCount || 0 }}</div>
|
<div class="relative top-[-3px] ml-[8px] text-[14px] text-[#666] font-normal">发帖数: {{ userInfo.postsNum || 0 }}</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@ -154,8 +163,8 @@
|
|||||||
|
|
||||||
<div class="mt-[20px] h-[1px] w-[336px] rounded-[1px] bg-[#EEEEEE]"></div>
|
<div class="mt-[20px] h-[1px] w-[336px] rounded-[1px] bg-[#EEEEEE]"></div>
|
||||||
<div class="mt-[20px] flex items-center">
|
<div class="mt-[20px] flex items-center">
|
||||||
<div class="h-[24px] w-[4px] rounded-[1px] bg-[#1A65FF]"></div>
|
<div class="h-[20px] w-[4px] rounded-[1px] bg-[#1A65FF]"></div>
|
||||||
<span class="ml-[10px] text-[16px]">最新发布</span>
|
<span class="ml-[10px] text-[14px]">最新发布</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="mt-[10px]">
|
<div class="mt-[10px]">
|
||||||
<div
|
<div
|
||||||
@ -176,11 +185,13 @@
|
|||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import dayjs from 'dayjs'
|
import dayjs from 'dayjs'
|
||||||
|
import { ArrowRight } from '@element-plus/icons-vue'
|
||||||
import { downloadFile } from '~/utils/utils'
|
import { downloadFile } from '~/utils/utils'
|
||||||
import { useMessage } from '~/utils/useMessage'
|
import { useMessage } from '~/utils/useMessage'
|
||||||
import { Warning } from '@element-plus/icons-vue'
|
import { Warning } from '@element-plus/icons-vue'
|
||||||
import SeoHead from '~/components/seo-head/index.vue'
|
import SeoHead from '~/components/seo-head/index.vue'
|
||||||
import CardPicture from '~/components/kl-card-picture/index.vue'
|
import CardPicture from '~/components/kl-card-picture/index.vue'
|
||||||
|
import { getDictTree } from '~/api/home/index'
|
||||||
import { getDetail, getRelationRecommend, report, getUserInfo, getMainWork, createContent, createUserProject, deleteProject } from '~/api/drawe-detail/index'
|
import { getDetail, getRelationRecommend, report, getUserInfo, getMainWork, createContent, createUserProject, deleteProject } from '~/api/drawe-detail/index'
|
||||||
import KlNavTab from '~/components/kl-nav-tab/index.vue'
|
import KlNavTab from '~/components/kl-nav-tab/index.vue'
|
||||||
import ThumBnail from './components/swiper.vue'
|
import ThumBnail from './components/swiper.vue'
|
||||||
@ -213,6 +224,20 @@
|
|||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// 获取面包屑
|
||||||
|
const { data: breadList } = await useAsyncData(`breadList-detail-${route.params.id}}`, async () => {
|
||||||
|
const res = await getDictTree({ type: 1, id: detail.value?.projectType?.[0] })
|
||||||
|
const all = [
|
||||||
|
{
|
||||||
|
id: -1,
|
||||||
|
name: detail.value?.type === 1 ? '图纸库' : detail.value?.type === 3 ? '模型库' : '文本库',
|
||||||
|
isChildren: false,
|
||||||
|
},
|
||||||
|
]
|
||||||
|
const arr = [...res.data, ...all]
|
||||||
|
return arr.reverse()
|
||||||
|
})
|
||||||
|
|
||||||
// const init = () => {
|
// const init = () => {
|
||||||
// getDetail({ id }).then((res) => {
|
// getDetail({ id }).then((res) => {
|
||||||
// if (res.code === 0) {
|
// if (res.code === 0) {
|
||||||
@ -336,6 +361,7 @@
|
|||||||
comments: value,
|
comments: value,
|
||||||
projectId: detail.value?.projectId,
|
projectId: detail.value?.projectId,
|
||||||
drawId: detail.value?.id,
|
drawId: detail.value?.id,
|
||||||
|
type: detail.value?.type,
|
||||||
}).then((res) => {
|
}).then((res) => {
|
||||||
if (res.code === 0) {
|
if (res.code === 0) {
|
||||||
ElMessage.success('举报成功')
|
ElMessage.success('举报成功')
|
||||||
@ -355,6 +381,7 @@
|
|||||||
: await createContent({
|
: await createContent({
|
||||||
projectId: detail.value?.projectId,
|
projectId: detail.value?.projectId,
|
||||||
drawId: detail.value?.id,
|
drawId: detail.value?.id,
|
||||||
|
type: detail.value?.type,
|
||||||
})
|
})
|
||||||
if (res.code === 0) {
|
if (res.code === 0) {
|
||||||
ElMessage.success(`${detail.value?.favoriteId ? '取消' : '收藏'}成功`)
|
ElMessage.success(`${detail.value?.favoriteId ? '取消' : '收藏'}成功`)
|
||||||
|
|||||||
@ -10,8 +10,8 @@
|
|||||||
<div class="swiper-button-prev"></div>
|
<div class="swiper-button-prev"></div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="mb-[20px] mt-[34px] flex items-center text-[16px] text-[#333333] font-normal">
|
<div class="mb-[20px] mt-[34px] flex items-center text-[14px] text-[#333333] font-normal">
|
||||||
<div class="h-[24px] w-[4px] rounded-[1px] bg-[#1A65FF]"></div>
|
<div class="h-[20px] w-[4px] rounded-[1px] bg-[#1A65FF]"></div>
|
||||||
<span class="ml-[10px]">{{ props.type === 1 ? '图纸' : props.type === 2 ? '文本' : '模型' }}</span>
|
<span class="ml-[10px]">{{ props.type === 1 ? '图纸' : props.type === 2 ? '文本' : '模型' }}</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="box-border h-[126px] w-[1019px] border border-[#EEEEEE] rounded-[6px] border-solid bg-[#FFFFFF] pa-[23px]">
|
<div class="box-border h-[126px] w-[1019px] border border-[#EEEEEE] rounded-[6px] border-solid bg-[#FFFFFF] pa-[23px]">
|
||||||
|
|||||||
@ -1,6 +1,5 @@
|
|||||||
<template>
|
<template>
|
||||||
<!-- 导航 -->
|
<!-- 导航 -->
|
||||||
<SeoHead title="工程设计图纸下载_CAD设计图纸资源库" />
|
|
||||||
<KlNavTab active="图纸" :type="1" />
|
<KlNavTab active="图纸" :type="1" />
|
||||||
<div class="ma-auto w-[1440px]">
|
<div class="ma-auto w-[1440px]">
|
||||||
<!-- 图纸分类 -->
|
<!-- 图纸分类 -->
|
||||||
@ -63,6 +62,7 @@
|
|||||||
source: source.value || -1,
|
source: source.value || -1,
|
||||||
type: 1,
|
type: 1,
|
||||||
title: keywords.value,
|
title: keywords.value,
|
||||||
|
recommend: source.value === -1 ? true : false,
|
||||||
})
|
})
|
||||||
// const result = reactive<pageRes>({
|
// const result = reactive<pageRes>({
|
||||||
// list: [],
|
// list: [],
|
||||||
@ -94,6 +94,7 @@
|
|||||||
editions: query.value.editions === '-1' ? '' : query.value.editions,
|
editions: query.value.editions === '-1' ? '' : query.value.editions,
|
||||||
source: query.value.source === -1 ? '' : query.value.source,
|
source: query.value.source === -1 ? '' : query.value.source,
|
||||||
projectType: query.value.projectType === '-1' ? '' : query.value.projectType,
|
projectType: query.value.projectType === '-1' ? '' : query.value.projectType,
|
||||||
|
recommend: query.value.source === -1 ? true: false,
|
||||||
})
|
})
|
||||||
return res.data
|
return res.data
|
||||||
},
|
},
|
||||||
|
|||||||
@ -1,6 +1,5 @@
|
|||||||
<template>
|
<template>
|
||||||
<!-- 导航 -->
|
<!-- 导航 -->
|
||||||
<SeoHead title="工程设计图纸下载_CAD设计图纸资源库" />
|
|
||||||
<KlNavTab active="图纸" :type="1" />
|
<KlNavTab active="图纸" :type="1" />
|
||||||
<div class="ma-auto w-[1440px]">
|
<div class="ma-auto w-[1440px]">
|
||||||
<!-- 图纸分类 -->
|
<!-- 图纸分类 -->
|
||||||
@ -56,6 +55,7 @@
|
|||||||
source: -1,
|
source: -1,
|
||||||
type: 1,
|
type: 1,
|
||||||
title: keywords.value,
|
title: keywords.value,
|
||||||
|
recommend: true,
|
||||||
})
|
})
|
||||||
// const result = reactive<pageRes>({
|
// const result = reactive<pageRes>({
|
||||||
// list: [],
|
// list: [],
|
||||||
@ -80,13 +80,14 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
const { data: result, refresh: getPage } = useAsyncData(
|
const { data: result, refresh: getPage } = useAsyncData(
|
||||||
`draw-page-list-${query.value.projectType}-${query.value.editions}-${query.value.source}-${query.value.pageNo}-${query.value.pageSize}-${query.value.title}`,
|
`draw-page-list-drawe-${query.value.projectType}-${query.value.editions}-${query.value.source}-${query.value.pageNo}-${query.value.pageSize}-${query.value.title}`,
|
||||||
async () => {
|
async () => {
|
||||||
const res = await page({
|
const res = await page({
|
||||||
...query.value,
|
...query.value,
|
||||||
editions: query.value.editions === '-1' ? '' : query.value.editions,
|
editions: query.value.editions === '-1' ? '' : query.value.editions,
|
||||||
source: query.value.source === -1 ? '' : query.value.source,
|
source: query.value.source === -1 ? '' : query.value.source,
|
||||||
projectType: query.value.projectType === '-1' ? '' : query.value.projectType,
|
projectType: query.value.projectType === '-1' ? '' : query.value.projectType,
|
||||||
|
recommend: query.value.source === -1 ? true: false,
|
||||||
})
|
})
|
||||||
return res.data
|
return res.data
|
||||||
},
|
},
|
||||||
|
|||||||
@ -26,7 +26,6 @@
|
|||||||
</template>
|
</template>
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import KlNavTab from '~/components/kl-nav-tab/index.vue'
|
import KlNavTab from '~/components/kl-nav-tab/index.vue'
|
||||||
import KlWallpaperCategory from '~/components/kl-wallpaper-category/index.vue'
|
|
||||||
import RecommendedColumnsV2 from '~/components/foreign-components/RecommendedColumnsV2.vue'
|
import RecommendedColumnsV2 from '~/components/foreign-components/RecommendedColumnsV2.vue'
|
||||||
import BannerTips from '~/components/foreign-components/BannerTips.vue'
|
import BannerTips from '~/components/foreign-components/BannerTips.vue'
|
||||||
// import FeaturedSpecials from './components/FeaturedSpecials.vue'
|
// import FeaturedSpecials from './components/FeaturedSpecials.vue'
|
||||||
|
|||||||
@ -35,13 +35,19 @@
|
|||||||
import { page } from '~/api/upnew/index'
|
import { page } from '~/api/upnew/index'
|
||||||
import type { pageRes, pageReq } from '~/api/upnew/types'
|
import type { pageRes, pageReq } from '~/api/upnew/types'
|
||||||
|
|
||||||
const query = reactive<pageReq>({
|
const query = reactive<
|
||||||
|
pageReq & {
|
||||||
|
isDomestic: number
|
||||||
|
}
|
||||||
|
>({
|
||||||
pageNo: 1,
|
pageNo: 1,
|
||||||
pageSize: 10,
|
pageSize: 10,
|
||||||
projectType: '-1',
|
projectType: '-1',
|
||||||
editions: '-1',
|
editions: '-1',
|
||||||
source: -1,
|
source: -1,
|
||||||
type: 1,
|
type: 1,
|
||||||
|
/**是否是国内: 1是 0否 */
|
||||||
|
isDomestic: 1,
|
||||||
})
|
})
|
||||||
// const result = reactive<pageRes>({
|
// const result = reactive<pageRes>({
|
||||||
// list: [],
|
// list: [],
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
<div class="login-container flex flex-col justify-between">
|
<div class="login-container flex flex-col justify-between">
|
||||||
<div class="ma-auto mt-[25px] w-[100%] flex flex-col items-center">
|
<div class="ma-auto mt-[25px] w-[100%] flex flex-col items-center">
|
||||||
<el-image
|
<el-image
|
||||||
:src="userStore.userInfoRes.avatar || 'https://tuxixi.oss-cn-chengdu.aliyuncs.com/avater.png'"
|
:src="userStore.userInfoRes.avatar || 'https://static.tuxixi.net/1757297277142/2025/09/08/10/07/57/tuxixi.png'"
|
||||||
alt=""
|
alt=""
|
||||||
srcset=""
|
srcset=""
|
||||||
class="h-[69px] w-[69px] rd-[50%]"
|
class="h-[69px] w-[69px] rd-[50%]"
|
||||||
@ -11,7 +11,7 @@
|
|||||||
@click="handleUserInfo"
|
@click="handleUserInfo"
|
||||||
/>
|
/>
|
||||||
<div class="mt-[10px] text-[16px] text-[#333333] font-normal flex items-center">
|
<div class="mt-[10px] text-[16px] text-[#333333] font-normal flex items-center">
|
||||||
Hi,{{ userStore.userInfoRes.nickname || '欢迎访问~' }}
|
Hi,{{ userStore.userInfoRes.nickname || '欢迎访问图夕夕' }}
|
||||||
<img v-if="userStore.userInfoRes.vipLevel === 1" src="~/assets/svg/vip.svg" alt="" class="relative top-[1px]" />
|
<img v-if="userStore.userInfoRes.vipLevel === 1" src="~/assets/svg/vip.svg" alt="" class="relative top-[1px]" />
|
||||||
<img v-if="userStore.userInfoRes.vipLevel === 2" src="~/assets/svg/svip.svg" alt="" class="relative top-[1px]" />
|
<img v-if="userStore.userInfoRes.vipLevel === 2" src="~/assets/svg/svip.svg" alt="" class="relative top-[1px]" />
|
||||||
</div>
|
</div>
|
||||||
@ -102,19 +102,19 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
const handleLogin = () => {
|
const handleLogin = () => {
|
||||||
app.$openLogin()
|
app.$openLogin()
|
||||||
}
|
}
|
||||||
|
|
||||||
const handleRegister = () => {
|
const handleRegister = () => {
|
||||||
app.$openRegister()
|
app.$openRegister()
|
||||||
}
|
}
|
||||||
|
|
||||||
const handleLoginPhone = () => {
|
const handleLoginPhone = () => {
|
||||||
app.$openLogin('verify')
|
app.$openLogin('verify')
|
||||||
}
|
}
|
||||||
|
|
||||||
const handleLoginEmail = () => {
|
const handleLoginEmail = () => {
|
||||||
app.$openLoginEmail()
|
app.$openLoginEmail()
|
||||||
}
|
}
|
||||||
|
|
||||||
const handleUserInfo = () => {
|
const handleUserInfo = () => {
|
||||||
@ -129,10 +129,9 @@
|
|||||||
|
|
||||||
// 推出登录
|
// 推出登录
|
||||||
const handleLoginOut = () => {
|
const handleLoginOut = () => {
|
||||||
REFRESHTOKEN.removeToken()
|
clearNuxtState(['token', 'userInfo'])
|
||||||
userStore.setToken('')
|
userStore.logout()
|
||||||
userStore.setUserId('')
|
userStore.$reset()
|
||||||
userStore.setRefreshToken('')
|
|
||||||
window.location.reload()
|
window.location.reload()
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@ -2,27 +2,19 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="main-content">
|
<div class="main-content">
|
||||||
<div class="flex">
|
<div class="flex">
|
||||||
<div class="h-424px w-957px">
|
<div class="h-[424px] w-[957px]">
|
||||||
<el-carousel height="424px" indicator-position="none">
|
<el-carousel height="424px" indicator-position="none">
|
||||||
<el-carousel-item v-for="(item, index) in bannerList" :key="index">
|
<el-carousel-item v-for="(item, index) in bannerList" :key="index">
|
||||||
<el-image
|
<el-image :src="item.content" class="w-[100%]" :class="{ 'cursor-pointer': item.url }" fit="cover" @click="handleClick(item.url)" />
|
||||||
:src="item.content"
|
|
||||||
class="w-100%"
|
|
||||||
:class="{ 'cursor-pointer': item.url }"
|
|
||||||
fit="cover"
|
|
||||||
@click="handleClick(item.url)"
|
|
||||||
/>
|
|
||||||
</el-carousel-item>
|
</el-carousel-item>
|
||||||
</el-carousel>
|
</el-carousel>
|
||||||
</div>
|
</div>
|
||||||
<LoginForm />
|
<LoginForm />
|
||||||
</div>
|
</div>
|
||||||
<div
|
<div class="box-border h-[56px] w-[1219px] flex items-center border border-[#EEEEEE] border-solid border-t-none bg-[#FFFFFF] pl-[10px] line-height-[46px]">
|
||||||
class="box-border h-56px w-1219px flex items-center border border-[#EEEEEE] border-solid border-t-none bg-[#FFFFFF] pl-10px line-height-46px"
|
<img src="~/assets/images/voice.png" alt="" srcset="" class="mr-[10px] h-[15px] w-[16px]" />
|
||||||
>
|
|
||||||
<img src="~/assets/images/voice.png" alt="" srcset="" class="mr-10px h-15px w-16px" />
|
|
||||||
<Vue3Marquee :duration="10" direction="normal" pause-on-hover>
|
<Vue3Marquee :duration="10" direction="normal" pause-on-hover>
|
||||||
· 经典来袭,SolidWorks装配经典案例之气动发动机
|
<template v-for="(item, index) in noticeList" :key="index"> {{ item }} </template>
|
||||||
</Vue3Marquee>
|
</Vue3Marquee>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@ -33,7 +25,7 @@
|
|||||||
import LoginForm from './LoginForm.vue'
|
import LoginForm from './LoginForm.vue'
|
||||||
import { Vue3Marquee } from 'vue3-marquee'
|
import { Vue3Marquee } from 'vue3-marquee'
|
||||||
|
|
||||||
import { getSettingPage } from '~/api/home/index'
|
import { getSettingPage, getNoticeList } from '~/api/home/index'
|
||||||
|
|
||||||
const pageReq = reactive({
|
const pageReq = reactive({
|
||||||
type: 1,
|
type: 1,
|
||||||
@ -50,6 +42,9 @@
|
|||||||
navigateTo(url)
|
navigateTo(url)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const { data: noticeList } = await getNoticeList()
|
||||||
|
console.log(noticeList)
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped lang="scss">
|
<style scoped lang="scss">
|
||||||
|
|||||||
@ -169,7 +169,7 @@
|
|||||||
.menu-item {
|
.menu-item {
|
||||||
/* position: relative; */
|
/* position: relative; */
|
||||||
text-align: center;
|
text-align: center;
|
||||||
padding: 10px 24px;
|
padding: 9px 24px;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
/* transition: all 0.3s ease; */
|
/* transition: all 0.3s ease; */
|
||||||
color: #333;
|
color: #333;
|
||||||
|
|||||||
@ -1,5 +1,6 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="ma-auto w-1440px">
|
<div class="ma-auto w-1440px">
|
||||||
|
<SeoHead :title="tdkData?.title" :description="tdkData?.describeText" :keywords="tdkData?.keyword" />
|
||||||
<!-- 搜索 -->
|
<!-- 搜索 -->
|
||||||
<KlSearch></KlSearch>
|
<KlSearch></KlSearch>
|
||||||
<!-- 菜单 -->
|
<!-- 菜单 -->
|
||||||
@ -29,6 +30,12 @@
|
|||||||
import PopularDrawings from '~/pages/home/components/PopularDrawings.vue'
|
import PopularDrawings from '~/pages/home/components/PopularDrawings.vue'
|
||||||
import Leaderboard from '~/pages/home/components/Leaderboard.vue'
|
import Leaderboard from '~/pages/home/components/Leaderboard.vue'
|
||||||
import LearningRecommendations from '~/pages/home/components/LearningRecommendations.vue'
|
import LearningRecommendations from '~/pages/home/components/LearningRecommendations.vue'
|
||||||
|
import { getTDK } from '~/api/home/index'
|
||||||
|
|
||||||
|
const { data: tdkData } = useAsyncData('get-tdk-home', async () => {
|
||||||
|
const res = await getTDK()
|
||||||
|
return res.data
|
||||||
|
})
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped>
|
<style scoped>
|
||||||
|
|||||||
@ -1,11 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div>
|
|
||||||
<h1>Mobile Page</h1>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup lang="ts">
|
|
||||||
// Mobile specific logic can be added here
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style lang="scss" scoped></style>
|
|
||||||
14
pages/mobile/channel/index.vue
Normal file
@ -0,0 +1,14 @@
|
|||||||
|
<template>
|
||||||
|
<div class="page-channel">
|
||||||
|
<div class="text">交流频道</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup lang="ts">
|
||||||
|
definePageMeta({ layout: 'm' })
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
.page-channel { padding: 16px; }
|
||||||
|
.text { font-size: 16px; }
|
||||||
|
</style>
|
||||||
14
pages/mobile/find/index.vue
Normal file
@ -0,0 +1,14 @@
|
|||||||
|
<template>
|
||||||
|
<div class="page-find">
|
||||||
|
<div class="text">发现</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup lang="ts">
|
||||||
|
definePageMeta({ layout: 'm' })
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
.page-find { padding: 16px; }
|
||||||
|
.text { font-size: 16px; }
|
||||||
|
</style>
|
||||||
158
pages/mobile/gloabal-cad-drawings/index.vue
Normal file
@ -0,0 +1,158 @@
|
|||||||
|
<template>
|
||||||
|
<div class="container">
|
||||||
|
<!-- 设计图列表 -->
|
||||||
|
<div class="design-list">
|
||||||
|
<div
|
||||||
|
class="design-item"
|
||||||
|
v-for="(item, index) in designList"
|
||||||
|
:key="index"
|
||||||
|
>
|
||||||
|
<div class="design-preview">
|
||||||
|
<img :src="item.image" alt="preview" />
|
||||||
|
</div>
|
||||||
|
<div class="design-info">
|
||||||
|
<div class="design-title">{{ item.title }}</div>
|
||||||
|
<div class="design-author">by:{{ item.author }}</div>
|
||||||
|
|
||||||
|
<div class="design-stats">
|
||||||
|
<div class="stat-item">
|
||||||
|
<span class="iconfont">👁</span>
|
||||||
|
<span>{{ item.views }}</span>
|
||||||
|
</div>
|
||||||
|
<div class="stat-item">
|
||||||
|
<span class="iconfont">👍</span>
|
||||||
|
<span>{{ item.likes }}</span>
|
||||||
|
</div>
|
||||||
|
<div class="stat-item">
|
||||||
|
<span class="iconfont">💬</span>
|
||||||
|
<span>{{ item.comments }}</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="design-action">
|
||||||
|
<button class="view-btn" @click="viewDesign(index)">查看</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup lang="ts">
|
||||||
|
definePageMeta({ layout: 'm' })
|
||||||
|
import { ref, onMounted } from 'vue'
|
||||||
|
import { useRoute, useRouter } from 'vue-router'
|
||||||
|
|
||||||
|
const router = useRouter()
|
||||||
|
const route = useRoute()
|
||||||
|
|
||||||
|
const designList = ref([
|
||||||
|
{ title: '高压细水雾灭火推车描述', author: '赵其', image: '/static/images/activity1.png', views: 128, likes: 16, comments: 35 },
|
||||||
|
{ title: '高压细水雾灭火推车描述', author: '赵其', image: '/static/images/activity2.png', views: 128, likes: 16, comments: 35 },
|
||||||
|
{ title: '高压细水雾灭火推车描述', author: '赵其', image: '/static/images/activity1.png', views: 128, likes: 16, comments: 35 },
|
||||||
|
{ title: '高压细水雾灭火推车描述', author: '赵其', image: '/static/images/activity2.png', views: 128, likes: 16, comments: 35 },
|
||||||
|
])
|
||||||
|
|
||||||
|
function viewDesign(index: number) {
|
||||||
|
router.push({ path: '/mobile/design-detail', query: { id: String(index) } })
|
||||||
|
}
|
||||||
|
|
||||||
|
onMounted(() => {
|
||||||
|
const titleFromQuery = (route.query.titleName as string) || '详情'
|
||||||
|
if (titleFromQuery) {
|
||||||
|
document.title = decodeURIComponent(titleFromQuery)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
// 变量定义
|
||||||
|
$primary-color: #007aff;
|
||||||
|
$text-color: #333;
|
||||||
|
$secondary-text: #666;
|
||||||
|
$light-text: #999;
|
||||||
|
$bg-color: #fff;
|
||||||
|
$white: #fff;
|
||||||
|
$border-color: #eee;
|
||||||
|
$border-radius: 10rpx;
|
||||||
|
$mask-bg: rgba(0, 0, 0, 0.5);
|
||||||
|
|
||||||
|
.container {
|
||||||
|
padding: 0;
|
||||||
|
background-color: $bg-color;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.design-list {
|
||||||
|
padding: 10rpx 20rpx;
|
||||||
|
|
||||||
|
.design-item {
|
||||||
|
display: flex;
|
||||||
|
margin-bottom: 20rpx;
|
||||||
|
background-color: $white;
|
||||||
|
border-radius: $border-radius;
|
||||||
|
border: 1px solid $border-color;
|
||||||
|
padding: 20rpx;
|
||||||
|
position: relative;
|
||||||
|
box-shadow: 0 0 10rpx rgba(0, 0, 0, 0.1);
|
||||||
|
|
||||||
|
.design-preview {
|
||||||
|
width: 220rpx;
|
||||||
|
height: 160rpx;
|
||||||
|
overflow: hidden;
|
||||||
|
border: 1px solid $border-color;
|
||||||
|
|
||||||
|
image {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.design-info {
|
||||||
|
flex: 1;
|
||||||
|
padding: 0 20rpx;
|
||||||
|
|
||||||
|
.design-title {
|
||||||
|
font-size: 27rpx;
|
||||||
|
margin-bottom: 10rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.design-author {
|
||||||
|
font-size: 25rpx;
|
||||||
|
color: $light-text;
|
||||||
|
margin-bottom: 30rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.design-stats {
|
||||||
|
display: flex;
|
||||||
|
|
||||||
|
.stat-item {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
margin-right: 20rpx;
|
||||||
|
font-size: 24rpx;
|
||||||
|
color: $light-text;
|
||||||
|
|
||||||
|
.iconfont {
|
||||||
|
margin-right: 5rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.design-action {
|
||||||
|
position: absolute;
|
||||||
|
right: 20rpx;
|
||||||
|
bottom: 20rpx;
|
||||||
|
|
||||||
|
.view-btn {
|
||||||
|
background-color: $primary-color;
|
||||||
|
color: $white;
|
||||||
|
font-size: 26rpx;
|
||||||
|
padding: 0rpx 25rpx;
|
||||||
|
border-radius: 5rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
571
pages/mobile/index.vue
Normal file
@ -0,0 +1,571 @@
|
|||||||
|
<template>
|
||||||
|
<div class="contains content">
|
||||||
|
<div class="search-container">
|
||||||
|
<van-search shape="round" class="vant-input" background="#fff" placeholder="请输入搜索关键词" />
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Banner Section -->
|
||||||
|
<div class="banner-section">
|
||||||
|
<div class="banner-swiper">
|
||||||
|
<van-swipe class="my-swipe" :autoplay="3000" indicator-color="white">
|
||||||
|
<van-swipe-item>
|
||||||
|
<img src="~/assets/images/banner.png" alt="banner" />
|
||||||
|
</van-swipe-item>
|
||||||
|
<van-swipe-item>
|
||||||
|
<img src="~/assets/images/banner.png" alt="banner" />
|
||||||
|
</van-swipe-item>
|
||||||
|
<van-swipe-item>
|
||||||
|
<img src="~/assets/images/banner.png" alt="banner" />
|
||||||
|
</van-swipe-item>
|
||||||
|
<van-swipe-item>
|
||||||
|
<img src="~/assets/images/banner.png" alt="banner" />
|
||||||
|
</van-swipe-item>
|
||||||
|
</van-swipe>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Category Grid -->
|
||||||
|
<div class="category-grid">
|
||||||
|
<!-- First Row -->
|
||||||
|
<div class="category-row">
|
||||||
|
<div class="category-item" @click="navigateTo('图纸')">
|
||||||
|
<div class="category-icon">
|
||||||
|
<img src="~/assets/images/tuzhi (3).png" alt="banner" />
|
||||||
|
</div>
|
||||||
|
<span class="category-text">图纸</span>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="category-item" @click="navigateTo('文本')">
|
||||||
|
<div class="category-icon">
|
||||||
|
<img src="~/assets/images/tuzhi (2).png" alt="banner" />
|
||||||
|
</div>
|
||||||
|
<span class="category-text">文本</span>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="category-item" @click="navigateTo('模型')">
|
||||||
|
<div class="category-icon">
|
||||||
|
<img src="~/assets/images/tuzhi (1).png" alt="banner" />
|
||||||
|
</div>
|
||||||
|
<span class="category-text">模型</span>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="category-item" @click="navigateTo('community')">
|
||||||
|
<div class="category-icon">
|
||||||
|
<img src="~/assets/images/tuzhi (4).png" alt="banner" />
|
||||||
|
</div>
|
||||||
|
<span class="category-text">牛人社区</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Second Row -->
|
||||||
|
<div class="category-row mb-[10px]!">
|
||||||
|
<div class="category-item" @click="navigateTo('international')">
|
||||||
|
<div class="category-icon">
|
||||||
|
<img src="~/assets/images/tuzhi (5).png" alt="banner" />
|
||||||
|
</div>
|
||||||
|
<span class="category-text">国外专区</span>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="category-item" @click="navigateTo('channel')">
|
||||||
|
<div class="category-icon">
|
||||||
|
<img src="~/assets/images/tuzhi (6).png" alt="banner" />
|
||||||
|
</div>
|
||||||
|
<span class="category-text">交流频道</span>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="category-item"></div>
|
||||||
|
<div class="category-item"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<!-- -->
|
||||||
|
<div class="divider"></div>
|
||||||
|
<div class="contains content">
|
||||||
|
<!--最新活动 -->
|
||||||
|
<div class="activity-section">
|
||||||
|
<div class="section-header">
|
||||||
|
<span class="section-title">最新活动</span>
|
||||||
|
<a href="/mobile/activity/list" class="view-all">
|
||||||
|
<span>查看全部</span>
|
||||||
|
<span class="chevron">></span>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="activity-scroll">
|
||||||
|
<div class="activity-container">
|
||||||
|
<div
|
||||||
|
class="activity-card"
|
||||||
|
v-for="(item, index) in activityList"
|
||||||
|
:key="index"
|
||||||
|
@click="goToActivity(item)"
|
||||||
|
:style="{ marginRight: index === activityList.length - 1 ? '0px' : '9px' }"
|
||||||
|
>
|
||||||
|
<img :src="item.image" class="activity-image" alt="activity" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="divider"></div>
|
||||||
|
<div class="contains content">
|
||||||
|
<!-- 推荐功能 -->
|
||||||
|
<div class="recommend-section">
|
||||||
|
<div class="tab-navigation">
|
||||||
|
<div v-for="(tab, index) in tabs" :key="index" class="tab-item" :class="{ active: currentTab === index }" @click="switchTab(index)">
|
||||||
|
<span>{{ tab.title }}</span>
|
||||||
|
</div>
|
||||||
|
<button class="view-all" @click="viewAll">
|
||||||
|
<span>查看全部</span>
|
||||||
|
<span class="icon-right">></span>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- 内容区域 -->
|
||||||
|
<div class="design-list">
|
||||||
|
<div class="design-item" v-for="(item, index) in items" :key="index">
|
||||||
|
<div class="design-preview">
|
||||||
|
<img :src="activity2" mode="aspectFit"></img>
|
||||||
|
</div>
|
||||||
|
<div class="design-info">
|
||||||
|
<div class="design-title">{{ item.title }}</div>
|
||||||
|
<div class="design-author">by:{{ item.author }}</div>
|
||||||
|
|
||||||
|
<div class="design-stats">
|
||||||
|
<div class="stat-item">
|
||||||
|
<img class="img1" src="~/assets/images/home-l (2).png" alt="banner" />
|
||||||
|
<span>{{ item.views }}</span>
|
||||||
|
</div>
|
||||||
|
<div class="stat-item">
|
||||||
|
<img class="img2" src="~/assets/images/home-l (3).png" alt="banner" />
|
||||||
|
<span>{{ item.likes }}</span>
|
||||||
|
</div>
|
||||||
|
<div class="stat-item">
|
||||||
|
<img class="img3" src="~/assets/images/home-l (1).png" alt="banner" />
|
||||||
|
<span>{{ item.comments }}</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="design-action">
|
||||||
|
<button class="view-btn">查看</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup lang="ts">
|
||||||
|
import { useRouter } from 'vue-router'
|
||||||
|
import activity1 from '~/assets/images/activity1.png'
|
||||||
|
import activity2 from '~/assets/images/activity2.png'
|
||||||
|
import activity3 from '~/assets/images/activity2.png'
|
||||||
|
definePageMeta({
|
||||||
|
layout: 'm'
|
||||||
|
})
|
||||||
|
|
||||||
|
const router = useRouter()
|
||||||
|
|
||||||
|
function navigateTo(category: string) {
|
||||||
|
router.push({ path: '/mobile/gloabal-cad-drawings', query: { titleName: encodeURIComponent(category) } })
|
||||||
|
}
|
||||||
|
|
||||||
|
const activityList = ref([
|
||||||
|
{ id: 1, title: '积分兑换有好礼', image: activity1, url: '/mobile/activity/detail?id=1' },
|
||||||
|
{ id: 2, title: 'CAD高效学习', image: activity2, url: '/mobile/activity/detail?id=2' },
|
||||||
|
{ id: 3, title: '学习有奖', image: activity3, url: '/mobile/activity/detail?id=3' },
|
||||||
|
])
|
||||||
|
|
||||||
|
function goToActivity(item: { url: string }) {
|
||||||
|
router.push(item.url)
|
||||||
|
}
|
||||||
|
|
||||||
|
const currentTab = ref(0)
|
||||||
|
const tabs = ref([
|
||||||
|
{ title: '推荐图纸', type: 'drawings' },
|
||||||
|
{ title: '推荐模型', type: 'models' },
|
||||||
|
{ title: '推荐文本', type: 'documents' },
|
||||||
|
])
|
||||||
|
|
||||||
|
function switchTab(index: number) {
|
||||||
|
currentTab.value = index
|
||||||
|
}
|
||||||
|
|
||||||
|
function viewAll() {
|
||||||
|
const type = tabs.value[currentTab.value].type
|
||||||
|
router.push(`/mobile/${type}/list`)
|
||||||
|
}
|
||||||
|
|
||||||
|
const items = [
|
||||||
|
{
|
||||||
|
id: 1,
|
||||||
|
title: '高压细水雾灭火推车描述',
|
||||||
|
author: '赵其',
|
||||||
|
image: '/static/images/activity1.png',
|
||||||
|
views: 128,
|
||||||
|
likes: 16,
|
||||||
|
comments: 35,
|
||||||
|
url: '/pages/drawings/detail?id=1',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 2,
|
||||||
|
title: '高压细水雾灭火推车描述',
|
||||||
|
author: '赵其',
|
||||||
|
image: '/static/images/activity2.png',
|
||||||
|
views: 128,
|
||||||
|
likes: 16,
|
||||||
|
comments: 35,
|
||||||
|
url: '/pages/drawings/detail?id=2',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 1,
|
||||||
|
title: '室内CAD模型设计室内CAD模型设计',
|
||||||
|
author: '张泽',
|
||||||
|
image: '/static/images/activity1.png',
|
||||||
|
views: 95,
|
||||||
|
likes: 12,
|
||||||
|
comments: 28,
|
||||||
|
url: '/pages/models/detail?id=1',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 1,
|
||||||
|
title: 'CAD设计规范文档',
|
||||||
|
author: '李华',
|
||||||
|
image: '/static/images/activity2.png',
|
||||||
|
views: 156,
|
||||||
|
likes: 23,
|
||||||
|
comments: 42,
|
||||||
|
url: '/pages/documents/detail?id=1',
|
||||||
|
},
|
||||||
|
]
|
||||||
|
|
||||||
|
const viewDetail = (item: any) => {
|
||||||
|
console.log('View detail for:', item.title)
|
||||||
|
// uni.navigateTo({
|
||||||
|
// url: item.url,
|
||||||
|
// });
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped lang="scss">
|
||||||
|
// 变量定义
|
||||||
|
$primary-color: #007aff;
|
||||||
|
$text-color: #333;
|
||||||
|
$secondary-text: #666;
|
||||||
|
$light-text: #999;
|
||||||
|
$bg-color: #f0f4f9;
|
||||||
|
$white: #fff;
|
||||||
|
$border-color: #eee;
|
||||||
|
$border-radius: 15rpx;
|
||||||
|
.design-list {
|
||||||
|
.design-item {
|
||||||
|
display: flex;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
background-color: $white;
|
||||||
|
border-radius: $border-radius;
|
||||||
|
border: 1px solid $border-color;
|
||||||
|
padding: 17px 10px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
position: relative;
|
||||||
|
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
|
||||||
|
|
||||||
|
.design-preview {
|
||||||
|
width: 220px;
|
||||||
|
height: 168px;
|
||||||
|
overflow: hidden;
|
||||||
|
|
||||||
|
image {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.design-info {
|
||||||
|
flex: 1;
|
||||||
|
padding: 0 20px;
|
||||||
|
|
||||||
|
.design-title {
|
||||||
|
font-size: 27px;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.design-author {
|
||||||
|
font-size: 25px;
|
||||||
|
color: $light-text;
|
||||||
|
margin-bottom: 30px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.design-stats {
|
||||||
|
display: flex;
|
||||||
|
|
||||||
|
.stat-item {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
margin-right: 20px;
|
||||||
|
font-size: 24px;
|
||||||
|
color: $light-text;
|
||||||
|
|
||||||
|
img {
|
||||||
|
margin-right: 4px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.img1 {
|
||||||
|
width: 32px;
|
||||||
|
height: 24px;
|
||||||
|
}
|
||||||
|
.img2 {
|
||||||
|
width: 26px;
|
||||||
|
height: 28px;
|
||||||
|
}
|
||||||
|
.img3 {
|
||||||
|
width: 28px;
|
||||||
|
height: 26px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.design-action {
|
||||||
|
position: absolute;
|
||||||
|
right: 20px;
|
||||||
|
top: 70px;
|
||||||
|
|
||||||
|
.view-btn {
|
||||||
|
background-color: $primary-color;
|
||||||
|
color: $white;
|
||||||
|
font-size: 25px;
|
||||||
|
padding: 10px 26px !important;
|
||||||
|
border-radius: 5px;
|
||||||
|
border:none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.recommend-section {
|
||||||
|
// padding: 0 20rpx;
|
||||||
|
// margin: 30rpx 0 50rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-navigation {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
margin-bottom: 25px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-item {
|
||||||
|
padding: 8px 0;
|
||||||
|
margin-right: 40px;
|
||||||
|
font-size: 29px;
|
||||||
|
color: #333;
|
||||||
|
position: relative;
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
|
||||||
|
&.active {
|
||||||
|
color: #2970ff;
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
&::after {
|
||||||
|
content: '';
|
||||||
|
background-image: url('~/assets/images/bg-yy.png');
|
||||||
|
background-size: 100% 100%;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
position: absolute;
|
||||||
|
bottom: 1px;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 8px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.view-all {
|
||||||
|
margin-left: auto;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
font-size: 25px;
|
||||||
|
color: #666;
|
||||||
|
background: transparent;
|
||||||
|
border: none;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
.view-all .icon-right {
|
||||||
|
margin-left: 4rpx;
|
||||||
|
font-size: 25px;
|
||||||
|
}
|
||||||
|
.activity-section {
|
||||||
|
margin: 21.53rpx 0;
|
||||||
|
// padding: 0 20rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.section-header {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
margin-bottom: 20rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.section-title {
|
||||||
|
font-size: 31px;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #333;
|
||||||
|
}
|
||||||
|
|
||||||
|
.view-all {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
font-size: 25px !important;
|
||||||
|
color: #666;
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
.view-all .chevron {
|
||||||
|
margin-left: 4px;
|
||||||
|
font-size: 20rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.activity-scroll {
|
||||||
|
width: 100%;
|
||||||
|
overflow-x: auto;
|
||||||
|
padding-left: 20rpx; // 左侧padding,与section对齐
|
||||||
|
margin-left: -20rpx; // 抵消父容器的padding
|
||||||
|
}
|
||||||
|
|
||||||
|
.activity-container {
|
||||||
|
display: inline-flex;
|
||||||
|
padding: 10px 0px 0px 0px !important; // 留出阴影空间
|
||||||
|
}
|
||||||
|
|
||||||
|
.activity-card {
|
||||||
|
width: 292px;
|
||||||
|
height: 125px;
|
||||||
|
border-radius: 12rpx;
|
||||||
|
overflow: hidden;
|
||||||
|
box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.08);
|
||||||
|
transition: all 0.2s;
|
||||||
|
|
||||||
|
&:active {
|
||||||
|
transform: scale(0.98);
|
||||||
|
opacity: 0.9;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.activity-image {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
object-fit: contain;
|
||||||
|
}
|
||||||
|
|
||||||
|
.search-container {
|
||||||
|
background-color: #fff;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
flex: 1;
|
||||||
|
.vant-input {
|
||||||
|
flex: 1;
|
||||||
|
padding: 0px !important;
|
||||||
|
/* 设置 Vant Search 内部输入高度 */
|
||||||
|
--van-search-input-height: 65px;
|
||||||
|
:deep(.van-search__content) {
|
||||||
|
min-height: 65px;
|
||||||
|
}
|
||||||
|
:deep(.van-field__control) {
|
||||||
|
height: 65px;
|
||||||
|
line-height: 65px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.divider {
|
||||||
|
height: 17px;
|
||||||
|
background-color: #f8f8f8;
|
||||||
|
border-radius: 1px;
|
||||||
|
}
|
||||||
|
.content {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
background-color: #fff;
|
||||||
|
padding: 21px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
|
||||||
|
.banner-section {
|
||||||
|
margin-top: 25px;
|
||||||
|
border-radius: 20px;
|
||||||
|
overflow: hidden;
|
||||||
|
height: 285px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.banner-swiper {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
.my-swipe {
|
||||||
|
height: 100%;
|
||||||
|
.van-swipe-item {
|
||||||
|
color: #fff;
|
||||||
|
font-size: 20px;
|
||||||
|
height: 100%;
|
||||||
|
text-align: center;
|
||||||
|
background-color: #39a9ed;
|
||||||
|
img {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.slogan-main {
|
||||||
|
font-size: 48rpx;
|
||||||
|
font-weight: bold;
|
||||||
|
margin-bottom: 10rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.slogan-sub {
|
||||||
|
font-size: 38rpx;
|
||||||
|
font-weight: bold;
|
||||||
|
background-color: rgba(109, 200, 255, 0.8);
|
||||||
|
align-self: flex-start;
|
||||||
|
padding: 5rpx 20rpx;
|
||||||
|
border-radius: 5rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.banner-graphics {
|
||||||
|
flex: 1;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.category-grid {
|
||||||
|
margin-top: 33px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.category-row {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
margin-bottom: 40px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.category-item {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
width: 22%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.category-icon {
|
||||||
|
width: 78px;
|
||||||
|
height: 78px;
|
||||||
|
border-radius: 20rpx;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
margin-bottom: 10rpx;
|
||||||
|
img {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
margin-bottom: 17px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.category-text {
|
||||||
|
font-size: 25px;
|
||||||
|
color: #191919;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
245
pages/mobile/message_notice/index.vue
Normal file
@ -0,0 +1,245 @@
|
|||||||
|
<template>
|
||||||
|
<div class="message-notice-container">
|
||||||
|
<div class="tab-navigation">
|
||||||
|
<div
|
||||||
|
v-for="(tab, index) in tabs"
|
||||||
|
:key="index"
|
||||||
|
:class="['tab-item', { active: activeTab === index }]"
|
||||||
|
@click="activeTab = index"
|
||||||
|
>
|
||||||
|
<span v-if="index === 0" class="iconfont icon-system"></span>
|
||||||
|
<span v-else-if="index === 1" class="iconfont icon-transaction"></span>
|
||||||
|
<span v-else class="iconfont icon-forum"></span>
|
||||||
|
{{ tab.name }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="message-content">
|
||||||
|
<template v-if="activeTab === 0">
|
||||||
|
<div
|
||||||
|
class="message-item"
|
||||||
|
v-for="(message, index) in systemMessages"
|
||||||
|
:key="index"
|
||||||
|
>
|
||||||
|
<div class="message-left">
|
||||||
|
<span class="iconfont icon-speaker"></span>
|
||||||
|
<span class="dot"></span>
|
||||||
|
</div>
|
||||||
|
<div class="message-body">
|
||||||
|
<div class="message-header">
|
||||||
|
<div class="message-title text-ellipsis">{{ message.title }}</div>
|
||||||
|
<div class="message-time">{{ message.time }}</div>
|
||||||
|
</div>
|
||||||
|
<div class="message-description">{{ message.content }}</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<template v-if="activeTab === 1">
|
||||||
|
<div class="empty-content">
|
||||||
|
<div class="notice-text">交易消息和论坛社区互动的图标统一下,样式一样</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<template v-if="activeTab === 2">
|
||||||
|
<div class="empty-content">
|
||||||
|
<div class="notice-text">交易消息和论坛社区互动的图标统一下,样式一样</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup lang="ts">
|
||||||
|
definePageMeta({ layout: 'm' })
|
||||||
|
import { ref } from 'vue'
|
||||||
|
|
||||||
|
const activeTab = ref(0)
|
||||||
|
const tabs = ref([
|
||||||
|
{ name: '系统消息', icon: 'icon-system' },
|
||||||
|
{ name: '交易消息', icon: 'icon-transaction' },
|
||||||
|
{ name: '论坛社区互动', icon: 'icon-forum' },
|
||||||
|
])
|
||||||
|
|
||||||
|
const systemMessages = ref([
|
||||||
|
{ title: '图夕夕金币充值有优惠!', content: '图夕夕限时优惠, 微信冲500送50金币, 充200送10金币', time: '2025-03-05 17:00:57' },
|
||||||
|
{ title: '图夕夕金币充值有优惠!', content: '图夕夕限时优惠, 微信冲500送50金币, 充200送10金币图夕夕限时优惠, 微信冲500送50金币, 充200送10金币', time: '2025-03-05 17:00:57' },
|
||||||
|
])
|
||||||
|
|
||||||
|
const transactionMessages = ref<any[]>([])
|
||||||
|
const forumMessages = ref<any[]>([])
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
page {
|
||||||
|
background-color: #f5f7fa;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.message-notice-container {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-navigation {
|
||||||
|
display: flex;
|
||||||
|
background-color: #fff;
|
||||||
|
border-bottom: 1px solid #eee;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-item {
|
||||||
|
flex: 1;
|
||||||
|
padding: 30rpx 0;
|
||||||
|
text-align: center;
|
||||||
|
color: #666;
|
||||||
|
position: relative;
|
||||||
|
font-size: 28rpx;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-item .iconfont {
|
||||||
|
font-size: 32rpx;
|
||||||
|
margin-right: 10rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-item.active {
|
||||||
|
color: #4082ff;
|
||||||
|
font-weight: 500;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-item.active::after {
|
||||||
|
content: "";
|
||||||
|
position: absolute;
|
||||||
|
bottom: 0;
|
||||||
|
left: 25%;
|
||||||
|
width: 50%;
|
||||||
|
height: 6rpx;
|
||||||
|
background-color: #4082ff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-system:before {
|
||||||
|
content: "🔔";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-transaction:before {
|
||||||
|
content: "💰";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-forum:before {
|
||||||
|
content: "💬";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-speaker:before {
|
||||||
|
content: "📢";
|
||||||
|
}
|
||||||
|
|
||||||
|
.message-content {
|
||||||
|
flex: 1;
|
||||||
|
padding: 20rpx;
|
||||||
|
background-color: #f5f7fa;
|
||||||
|
}
|
||||||
|
|
||||||
|
.message-item {
|
||||||
|
display: flex;
|
||||||
|
background-color: #fff;
|
||||||
|
padding: 30rpx;
|
||||||
|
margin-bottom: 16rpx;
|
||||||
|
border-radius: 8rpx;
|
||||||
|
align-items: flex-start;
|
||||||
|
border-left: 6rpx solid transparent;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.message-left {
|
||||||
|
position: relative;
|
||||||
|
margin-right: 20rpx;
|
||||||
|
width: 60rpx;
|
||||||
|
height: 60rpx;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
flex-shrink: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.message-left .iconfont {
|
||||||
|
font-size: 40rpx;
|
||||||
|
color: #4082ff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dot {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
right: 0;
|
||||||
|
width: 16rpx;
|
||||||
|
height: 16rpx;
|
||||||
|
border-radius: 50%;
|
||||||
|
background-color: #ff4d4f;
|
||||||
|
}
|
||||||
|
|
||||||
|
.message-body {
|
||||||
|
flex: 1;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.message-header {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
margin-bottom: 12rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.message-title {
|
||||||
|
font-weight: bold;
|
||||||
|
font-size: 28rpx;
|
||||||
|
color: #333;
|
||||||
|
flex: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.message-time {
|
||||||
|
color: #999;
|
||||||
|
font-size: 24rpx;
|
||||||
|
text-align: right;
|
||||||
|
flex-shrink: 0;
|
||||||
|
margin-left: 20rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.message-description {
|
||||||
|
color: #666;
|
||||||
|
font-size: 26rpx;
|
||||||
|
line-height: 1.5;
|
||||||
|
}
|
||||||
|
|
||||||
|
.empty-content {
|
||||||
|
height: 300rpx;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
background-color: #e6f0ff;
|
||||||
|
margin-top: 20rpx;
|
||||||
|
border-radius: 8rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.notice-text {
|
||||||
|
color: #666;
|
||||||
|
font-size: 28rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.page-title {
|
||||||
|
padding: 20rpx;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 28rpx;
|
||||||
|
background-color: transparent;
|
||||||
|
color: #666;
|
||||||
|
border-top: 2rpx solid #eee;
|
||||||
|
}
|
||||||
|
|
||||||
|
.text-ellipsis {
|
||||||
|
overflow: hidden;
|
||||||
|
white-space: nowrap;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
309
pages/mobile/talent-detail/index.vue
Normal file
@ -0,0 +1,309 @@
|
|||||||
|
<template>
|
||||||
|
<view class="talent-detail">
|
||||||
|
<!-- 个人信息卡片 -->
|
||||||
|
<view class="profile-card">
|
||||||
|
<view class="profile-header">
|
||||||
|
<view class="left-section">
|
||||||
|
<image
|
||||||
|
class="avatar"
|
||||||
|
:src="talentInfo.avatar"
|
||||||
|
mode="aspectFill"
|
||||||
|
></image>
|
||||||
|
<view class="basic-info">
|
||||||
|
<view class="name-row">
|
||||||
|
<text class="name">{{ talentInfo.name }}</text>
|
||||||
|
<view class="tags">
|
||||||
|
<view
|
||||||
|
class="tag"
|
||||||
|
v-for="(tag, index) in talentInfo.tags"
|
||||||
|
:key="index"
|
||||||
|
>{{ tag }}</view
|
||||||
|
>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<text class="education">毕业院校:{{ talentInfo.education }}</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<div class="follow-btn" @click="followTalent">
|
||||||
|
{{ isFollowed ? "已关注" : "+ 关注" }}
|
||||||
|
</div>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- 数据统计 -->
|
||||||
|
<view class="stats">
|
||||||
|
<view class="stat-item works">
|
||||||
|
<text class="stat-number">{{ talentInfo.worksCount }}</text>
|
||||||
|
<text class="stat-label">作品量</text>
|
||||||
|
</view>
|
||||||
|
<!-- 加跟竖线 隔离下 -->
|
||||||
|
<view class="stat-item-line"></view>
|
||||||
|
<view class="stat-item fans">
|
||||||
|
<text class="stat-number">{{ talentInfo.fansCount }}</text>
|
||||||
|
<text class="stat-label">粉丝量</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<!-- 个人简介 -->
|
||||||
|
<view class="section-header">
|
||||||
|
<image class="crown-icon" src="/static/images/crown.png"></image>
|
||||||
|
<text class="section-title">个人简介</text>
|
||||||
|
</view>
|
||||||
|
<text class="intro-text">{{ talentInfo.introduction }}</text>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- 选项卡导航 -->
|
||||||
|
<view class="tab-nav">
|
||||||
|
<view
|
||||||
|
v-for="(tab, index) in tabs"
|
||||||
|
:key="index"
|
||||||
|
class="tab-item"
|
||||||
|
:class="{ active: currentTab === index }"
|
||||||
|
@click="switchTab(index)"
|
||||||
|
>
|
||||||
|
<text>{{ tab }}</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- 技术证书内容 -->
|
||||||
|
<view class="tab-content" v-if="currentTab === 0">
|
||||||
|
<!-- 技术证书列表 图片展示 -->
|
||||||
|
<TechnicalCertificates />
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- 个人履历内容 -->
|
||||||
|
<view class="tab-content" v-if="currentTab === 1">
|
||||||
|
<!-- 个人履历内容 -->
|
||||||
|
<Certificates :talentInfo="talentInfo" />
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- 作品展示内容 -->
|
||||||
|
<view class="tab-content" v-if="currentTab === 2">
|
||||||
|
<!-- 作品展示内容 -->
|
||||||
|
<Works :talentInfo="talentInfo" />
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup lang="ts">
|
||||||
|
definePageMeta({ layout: 'm' })
|
||||||
|
import TechnicalCertificates from "~/components/m/detail-components/technicalCertificates.vue";
|
||||||
|
import Certificates from "~/components/m/detail-components/certificates.vue";
|
||||||
|
import Works from "~/components/m/detail-components/Works.vue";
|
||||||
|
import { reactive, ref } from 'vue'
|
||||||
|
|
||||||
|
const isFollowed = ref(false)
|
||||||
|
const currentTab = ref(0)
|
||||||
|
const tabs = ['技术证书', '个人履历', '作品展示']
|
||||||
|
const talentInfo = reactive({
|
||||||
|
id: 1,
|
||||||
|
name: '王刚',
|
||||||
|
avatar: '/static/images/avater2.png',
|
||||||
|
tags: ['五金工具', '电子产品'],
|
||||||
|
education: '重庆工商大学',
|
||||||
|
worksCount: 876,
|
||||||
|
fansCount: 98,
|
||||||
|
introduction:
|
||||||
|
'你好!我是专注于工业设计和机械设计领域的专业设计师,擅长进行外观设计、结构设计、板金设计等各类工程设计工作。我拥有丰富的经验,能够为客户提供高质量的设计解决方案,包括PCB外壳设计、框架设计、运动仿真、逆向工程等。此外,我熟练使用Creo、CAD等设计软件,能够进行精准的3D建模、渲染、2D工程图绘制、CAD代画以及三维转二维等工作。',
|
||||||
|
certificates: [
|
||||||
|
{ year: '2020年', description: '韩国内基211学府设计的一款月度采样机' },
|
||||||
|
{ year: '2021年', description: '韩国内基211学府设计的一款月度采样机' },
|
||||||
|
{ year: '2022年', description: '韩国内基211学府设计的一款月度采样机' },
|
||||||
|
{ year: '2023年', description: '韩国内基211学府设计的一款月度采样机' },
|
||||||
|
{ year: '2024年', description: '韩国内基211学府设计的一款月度采样机' },
|
||||||
|
{ year: '2025年', description: '韩国内基211学府设计的一款月度采样机' },
|
||||||
|
],
|
||||||
|
})
|
||||||
|
|
||||||
|
function followTalent() {
|
||||||
|
isFollowed.value = !isFollowed.value
|
||||||
|
}
|
||||||
|
function switchTab(index: number) {
|
||||||
|
currentTab.value = index
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.talent-detail {
|
||||||
|
min-height: 100vh;
|
||||||
|
background-color: #fff;
|
||||||
|
padding: 30rpx 30rpx 0;
|
||||||
|
background-image: url("~/assets/images/talent-detail-bg.png");
|
||||||
|
background-size: 100%;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
background-position: top;
|
||||||
|
|
||||||
|
// 个人信息卡片样式
|
||||||
|
.profile-card {
|
||||||
|
background-color: #fff;
|
||||||
|
border-radius: 12rpx;
|
||||||
|
padding: 30rpx;
|
||||||
|
margin-bottom: 20rpx;
|
||||||
|
border: 1px solid #eee;
|
||||||
|
box-shadow: 0 0 10rpx rgba(0, 0, 0, 0.1);
|
||||||
|
margin-top: 164rpx;
|
||||||
|
|
||||||
|
.profile-header {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: flex-start;
|
||||||
|
|
||||||
|
.left-section {
|
||||||
|
display: flex;
|
||||||
|
align-items: flex-start;
|
||||||
|
|
||||||
|
.avatar {
|
||||||
|
width: 120rpx;
|
||||||
|
height: 120rpx;
|
||||||
|
border-radius: 50%;
|
||||||
|
margin-right: 20rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.basic-info {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
|
||||||
|
.name-row {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
margin-bottom: 10rpx;
|
||||||
|
|
||||||
|
.name {
|
||||||
|
font-size: 36rpx;
|
||||||
|
font-weight: bold;
|
||||||
|
margin-right: 20rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tags {
|
||||||
|
display: flex;
|
||||||
|
|
||||||
|
.tag {
|
||||||
|
font-size: 24rpx;
|
||||||
|
color: #1a65ff;
|
||||||
|
background-color: #e6f0ff;
|
||||||
|
padding: 4rpx 16rpx;
|
||||||
|
border-radius: 20rpx;
|
||||||
|
margin-right: 12rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.education {
|
||||||
|
font-size: 28rpx;
|
||||||
|
color: #666;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.follow-btn {
|
||||||
|
width: 89rpx;
|
||||||
|
height: 44rpx;
|
||||||
|
border-radius: 7rpx;
|
||||||
|
border: 1px solid #d7d7d7;
|
||||||
|
text-align: center;
|
||||||
|
line-height: 44rpx;
|
||||||
|
font-size: 21rpx;
|
||||||
|
color: #0a6fff;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 数据统计区域
|
||||||
|
.stats {
|
||||||
|
display: flex;
|
||||||
|
margin-top: 30rpx;
|
||||||
|
margin-left: 140rpx;
|
||||||
|
|
||||||
|
.stat-item {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
.stat-number {
|
||||||
|
font-size: 40rpx;
|
||||||
|
font-weight: bold;
|
||||||
|
color: #333;
|
||||||
|
line-height: 1.2;
|
||||||
|
}
|
||||||
|
|
||||||
|
.stat-label {
|
||||||
|
font-size: 28rpx;
|
||||||
|
color: #999;
|
||||||
|
margin-top: 4rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.stat-item-line {
|
||||||
|
width: 1px;
|
||||||
|
height: 90rpx;
|
||||||
|
background-color: #eee;
|
||||||
|
margin: 0 50rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.section-header {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
margin-top: 40rpx;
|
||||||
|
margin-bottom: 20rpx;
|
||||||
|
width: 100%;
|
||||||
|
justify-content: center;
|
||||||
|
height: 56rpx;
|
||||||
|
background: rgba(26, 101, 255, 0.1);
|
||||||
|
border-radius: 28rpx;
|
||||||
|
|
||||||
|
.crown-icon {
|
||||||
|
width: 40.97rpx;
|
||||||
|
height: 35.42rpx;
|
||||||
|
margin-right: 10rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.section-title {
|
||||||
|
font-size: 29rpx;
|
||||||
|
font-weight: bold;
|
||||||
|
color: #333;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.intro-text {
|
||||||
|
font-size: 24rpx;
|
||||||
|
color: #666;
|
||||||
|
line-height: 1.6;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 选项卡导航
|
||||||
|
.tab-nav {
|
||||||
|
display: flex;
|
||||||
|
background-color: #fff;
|
||||||
|
border-radius: 12rpx 12rpx 0 0;
|
||||||
|
|
||||||
|
.tab-item {
|
||||||
|
padding: 24rpx 0;
|
||||||
|
margin-right: 60rpx;
|
||||||
|
position: relative;
|
||||||
|
font-size: 25rpx;
|
||||||
|
color: #666;
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
|
||||||
|
&.active {
|
||||||
|
color: #1a65ff;
|
||||||
|
|
||||||
|
&::after {
|
||||||
|
content: "";
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
bottom: 14rpx;
|
||||||
|
width: 100%;
|
||||||
|
height: 4rpx;
|
||||||
|
background-color: #1a65ff;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 选项卡内容
|
||||||
|
.tab-content {
|
||||||
|
background-color: #fff;
|
||||||
|
border-radius: 0 0 12rpx 12rpx;
|
||||||
|
padding: 20rpx 0rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
221
pages/mobile/transaction_record/index.vue
Normal file
@ -0,0 +1,221 @@
|
|||||||
|
<template>
|
||||||
|
<div class="transaction-record">
|
||||||
|
<!-- Balance Card -->
|
||||||
|
<div class="balance-card">
|
||||||
|
<div class="balance-title">
|
||||||
|
<span>我的余额 (元)</span>
|
||||||
|
<span class="verify-text">🏅 资产保障中</span>
|
||||||
|
</div>
|
||||||
|
<div class="balance-amount">{{ balance.toFixed(2) }}</div>
|
||||||
|
<div class="action-buttons">
|
||||||
|
<div class="btn-recharge">充值</div>
|
||||||
|
<div class="btn-withdraw">提现</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Transaction Filter -->
|
||||||
|
<div class="transaction-filter">
|
||||||
|
<div class="filter-type">
|
||||||
|
<span>全部</span>
|
||||||
|
</div>
|
||||||
|
<div class="filter-date">
|
||||||
|
<label class="date-picker-trigger">
|
||||||
|
<span>当前时间: <span style="color:#4080ff">{{ currentMonth }}</span></span>
|
||||||
|
<input type="month" v-model="selectedMonth" @change="onMonthChange" />
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Transaction List -->
|
||||||
|
<div class="transaction-list">
|
||||||
|
<div
|
||||||
|
v-for="(transaction, index) in transactions"
|
||||||
|
:key="index"
|
||||||
|
class="transaction-item"
|
||||||
|
>
|
||||||
|
<div class="transaction-info">
|
||||||
|
<span class="transaction-type">{{ transaction.type }}</span>
|
||||||
|
<span class="transaction-date">{{ transaction.date }}</span>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="transaction-amount"
|
||||||
|
:class="{ 'amount-positive': transaction.amount > 0 }"
|
||||||
|
>
|
||||||
|
<span>{{
|
||||||
|
transaction.amount > 0
|
||||||
|
? "+" + transaction.amount
|
||||||
|
: transaction.amount
|
||||||
|
}}</span>
|
||||||
|
<span class="transaction-reference">{{ transaction.reference }}</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Footer -->
|
||||||
|
<div class="transaction-footer">
|
||||||
|
<span>当前仅展示本月明细,切换查看更多</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup lang="ts">
|
||||||
|
definePageMeta({ layout: 'm' })
|
||||||
|
import { ref, onMounted } from 'vue'
|
||||||
|
|
||||||
|
const balance = ref(6357.0)
|
||||||
|
const selectedMonth = ref('')
|
||||||
|
const currentMonth = ref('')
|
||||||
|
const transactions = ref([
|
||||||
|
{ type: '转出到银行卡', date: '2024-03-10 15:38', amount: -3578, reference: '56784' },
|
||||||
|
{ type: '转出到银行卡', date: '2024-03-10 15:38', amount: 3578, reference: '56784' },
|
||||||
|
{ type: '转出到银行卡', date: '2024-03-10 15:38', amount: -3578, reference: '56784' },
|
||||||
|
{ type: '转出到银行卡', date: '2024-03-10 15:38', amount: -3578, reference: '56784' },
|
||||||
|
{ type: '转出到银行卡', date: '2024-03-10 15:38', amount: -3578, reference: '56784' },
|
||||||
|
{ type: '转出到银行卡', date: '2024-03-10 15:38', amount: -3578, reference: '56784' },
|
||||||
|
])
|
||||||
|
|
||||||
|
function onMonthChange(e: Event) {
|
||||||
|
const value = (e.target as HTMLInputElement).value // yyyy-mm
|
||||||
|
if (!value) return
|
||||||
|
const [y, m] = value.split('-')
|
||||||
|
currentMonth.value = `${y}.${m}`
|
||||||
|
}
|
||||||
|
|
||||||
|
onMounted(() => {
|
||||||
|
const now = new Date()
|
||||||
|
const year = now.getFullYear()
|
||||||
|
const month = String(now.getMonth() + 1).padStart(2, '0')
|
||||||
|
currentMonth.value = `${year}.${month}`
|
||||||
|
selectedMonth.value = `${year}-${month}`
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.transaction-record {
|
||||||
|
background-color: #f5f5f5;
|
||||||
|
padding-bottom: 20px;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.balance-card {
|
||||||
|
background-color: white;
|
||||||
|
padding: 20px;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
border-radius: 8px;
|
||||||
|
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
|
||||||
|
}
|
||||||
|
|
||||||
|
.balance-title {
|
||||||
|
display: flex;
|
||||||
|
justify-content: flex-start;
|
||||||
|
align-items: center;
|
||||||
|
color: #666;
|
||||||
|
font-size: 14px;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.verify-text {
|
||||||
|
color: #4080ff;
|
||||||
|
font-size: 12px;
|
||||||
|
border: 1px solid #4080ff;
|
||||||
|
border-radius: 10px;
|
||||||
|
padding: 0 5px;
|
||||||
|
margin-left: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.balance-amount {
|
||||||
|
font-size: 32px;
|
||||||
|
font-weight: bold;
|
||||||
|
margin-bottom: 15px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.action-buttons {
|
||||||
|
display: flex;
|
||||||
|
justify-content: flex-start;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-recharge,
|
||||||
|
.btn-withdraw {
|
||||||
|
border: none;
|
||||||
|
padding: 8px 60rpx;
|
||||||
|
border-radius: 5px;
|
||||||
|
margin-right: 30rpx;
|
||||||
|
font-size: 28rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-recharge {
|
||||||
|
background-color: #4080ff;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-withdraw {
|
||||||
|
background-color: white;
|
||||||
|
border: 1px solid #ddd;
|
||||||
|
color: #333;
|
||||||
|
}
|
||||||
|
|
||||||
|
.transaction-filter {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
padding: 15px;
|
||||||
|
font-size: 14px;
|
||||||
|
color: #666;
|
||||||
|
}
|
||||||
|
|
||||||
|
.transaction-list {
|
||||||
|
background-color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.transaction-item {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
padding: 15px;
|
||||||
|
border-bottom: 1px solid #f0f0f0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.transaction-type {
|
||||||
|
font-size: 14px;
|
||||||
|
color: #333;
|
||||||
|
margin-bottom: 5px;
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.transaction-date {
|
||||||
|
font-size: 12px;
|
||||||
|
color: #999;
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.transaction-amount {
|
||||||
|
font-size: 16px;
|
||||||
|
font-weight: bold;
|
||||||
|
color: #333;
|
||||||
|
text-align: right;
|
||||||
|
}
|
||||||
|
|
||||||
|
.amount-positive {
|
||||||
|
color: #4caf50;
|
||||||
|
}
|
||||||
|
|
||||||
|
.transaction-reference {
|
||||||
|
font-size: 12px;
|
||||||
|
color: #999;
|
||||||
|
font-weight: normal;
|
||||||
|
margin-top: 5px;
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.transaction-footer {
|
||||||
|
text-align: center;
|
||||||
|
color: #999;
|
||||||
|
font-size: 12px;
|
||||||
|
padding: 15px;
|
||||||
|
background-color: white;
|
||||||
|
border-top: 1px solid #f0f0f0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.date-picker-trigger {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
345
pages/mobile/user/index.vue
Normal file
@ -0,0 +1,345 @@
|
|||||||
|
<template>
|
||||||
|
<div class="user-container">
|
||||||
|
<!-- 顶部蓝色背景 -->
|
||||||
|
<div class="top-bg"></div>
|
||||||
|
|
||||||
|
<!-- 用户信息卡片 -->
|
||||||
|
<div class="user-card">
|
||||||
|
<!-- 用户信息 -->
|
||||||
|
<div class="user-info">
|
||||||
|
<img class="avatar" src="~/assets/images/avater2.png" />
|
||||||
|
<div class="login-info">
|
||||||
|
<div class="login-text">登录/注册</div>
|
||||||
|
<div class="login-desc">登录注册后享受更多精彩内容</div>
|
||||||
|
</div>
|
||||||
|
<!-- 设置图标 -->
|
||||||
|
<div class="setting-icon">⚙️</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- 数据统计 -->
|
||||||
|
<div class="data-stats">
|
||||||
|
<div class="stat-item">
|
||||||
|
<div class="stat-num">200</div>
|
||||||
|
<div class="stat-text">金币余额(元)</div>
|
||||||
|
</div>
|
||||||
|
<div class="stat-item">
|
||||||
|
<div class="stat-num">135</div>
|
||||||
|
<div class="stat-text">今日浏览量</div>
|
||||||
|
</div>
|
||||||
|
<div class="stat-item">
|
||||||
|
<div class="stat-num">370</div>
|
||||||
|
<div class="stat-text">今日收益(元)</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- 资源中心区域 -->
|
||||||
|
<div class="resource-section">
|
||||||
|
<div class="section-title">资源中心</div>
|
||||||
|
|
||||||
|
<div class="resource-grid">
|
||||||
|
<div class="resource-item">
|
||||||
|
<div class="resource-icon blue">
|
||||||
|
<img
|
||||||
|
src="~/assets/images/my_release.png"
|
||||||
|
alt=""
|
||||||
|
srcset=""
|
||||||
|
class="w-77rpx h-71rpx"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<span class="resource-text">我的发布</span>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="resource-item">
|
||||||
|
<div class="resource-icon blue">
|
||||||
|
<img
|
||||||
|
src="~/assets/images/my_download.png"
|
||||||
|
alt=""
|
||||||
|
srcset=""
|
||||||
|
class="w-98rpx h-68rpx"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<span class="resource-text">我的下载</span>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="resource-item">
|
||||||
|
<div class="resource-icon blue">
|
||||||
|
<img
|
||||||
|
src="~/assets/images/my_attention.png"
|
||||||
|
alt=""
|
||||||
|
srcset=""
|
||||||
|
class="w-76rpx h-77rpx"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<span class="resource-text">我的关注</span>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="resource-item">
|
||||||
|
<div class="resource-icon blue">
|
||||||
|
<img
|
||||||
|
src="~/assets/images/my_collect.png"
|
||||||
|
alt=""
|
||||||
|
srcset=""
|
||||||
|
class="w-64rpx h-73rpx"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<span class="resource-text">我的收藏</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- 功能列表 -->
|
||||||
|
<div class="function-list">
|
||||||
|
<!-- 安全中心 -->
|
||||||
|
<div class="function-item" @click="navigateTo('/mobile/safety')">
|
||||||
|
<div class="function-left">
|
||||||
|
<div class="function-icon orange">✅</div>
|
||||||
|
<span class="function-text">安全中心</span>
|
||||||
|
</div>
|
||||||
|
<span>›</span>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- 消息中心 -->
|
||||||
|
<div class="function-item" @click="navigateTo('/mobile/message_notice')">
|
||||||
|
<div class="function-left">
|
||||||
|
<div class="function-icon blue">🔔</div>
|
||||||
|
<span class="function-text">消息中心</span>
|
||||||
|
</div>
|
||||||
|
<span>›</span>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- 交易记录 -->
|
||||||
|
<div
|
||||||
|
class="function-item"
|
||||||
|
@click="navigateTo('/mobile/transaction_record')"
|
||||||
|
>
|
||||||
|
<div class="function-left">
|
||||||
|
<div class="function-icon green">🧾</div>
|
||||||
|
<span class="function-text">交易记录</span>
|
||||||
|
</div>
|
||||||
|
<span>›</span>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- 关于我们 -->
|
||||||
|
<div class="function-item" @click="navigateTo('/mobile/about')">
|
||||||
|
<div class="function-left">
|
||||||
|
<div class="function-icon purple">ℹ️</div>
|
||||||
|
<span class="function-text">关于我们</span>
|
||||||
|
</div>
|
||||||
|
<span>›</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup lang="ts">
|
||||||
|
definePageMeta({ layout: 'm' })
|
||||||
|
import { useRouter } from 'vue-router'
|
||||||
|
const router = useRouter()
|
||||||
|
function navigateTo(url: string) {
|
||||||
|
router.push(url)
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
// 颜色变量
|
||||||
|
$primary-color: #0080ff;
|
||||||
|
$orange-color: #ff9500;
|
||||||
|
$green-color: #34c759;
|
||||||
|
$purple-color: #af52de;
|
||||||
|
$text-primary: #333;
|
||||||
|
$text-secondary: #999;
|
||||||
|
$bg-color: #f7f7f7;
|
||||||
|
$card-bg: #ffffff;
|
||||||
|
$border-color: #f5f5f5;
|
||||||
|
|
||||||
|
.user-container {
|
||||||
|
min-height: 100vh;
|
||||||
|
background-color: $bg-color;
|
||||||
|
position: relative;
|
||||||
|
padding-top: 127rpx;
|
||||||
|
|
||||||
|
// 顶部蓝色背景
|
||||||
|
.top-bg {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 200rpx;
|
||||||
|
background-color: $primary-color;
|
||||||
|
z-index: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 用户信息卡片
|
||||||
|
.user-card {
|
||||||
|
position: relative;
|
||||||
|
margin: 0 20rpx;
|
||||||
|
padding: 30rpx;
|
||||||
|
background-color: $card-bg;
|
||||||
|
border-radius: 16rpx;
|
||||||
|
box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05);
|
||||||
|
z-index: 1;
|
||||||
|
|
||||||
|
.user-info {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
.avatar {
|
||||||
|
width: 120rpx;
|
||||||
|
height: 120rpx;
|
||||||
|
border-radius: 60rpx;
|
||||||
|
margin-right: 20rpx;
|
||||||
|
background-color: #f0f0f0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.login-info {
|
||||||
|
flex: 1;
|
||||||
|
|
||||||
|
.login-text {
|
||||||
|
font-size: 34rpx;
|
||||||
|
font-weight: 500;
|
||||||
|
color: $text-primary;
|
||||||
|
margin-bottom: 8rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.login-desc {
|
||||||
|
font-size: 24rpx;
|
||||||
|
color: $text-secondary;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.setting-icon {
|
||||||
|
padding: 10rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 数据统计
|
||||||
|
.data-stats {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
margin-top: 30rpx;
|
||||||
|
|
||||||
|
.stat-item {
|
||||||
|
flex: 1;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
.stat-num {
|
||||||
|
font-size: 36rpx;
|
||||||
|
font-weight: 500;
|
||||||
|
color: $text-primary;
|
||||||
|
margin-bottom: 10rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.stat-text {
|
||||||
|
font-size: 24rpx;
|
||||||
|
color: $text-secondary;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 资源中心
|
||||||
|
.resource-section {
|
||||||
|
margin: 20rpx;
|
||||||
|
padding: 30rpx;
|
||||||
|
background-color: $card-bg;
|
||||||
|
border-radius: 16rpx;
|
||||||
|
|
||||||
|
.section-title {
|
||||||
|
font-size: 30rpx;
|
||||||
|
font-weight: 500;
|
||||||
|
color: $text-primary;
|
||||||
|
margin-bottom: 30rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.resource-grid {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
|
||||||
|
.resource-item {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
width: 25%;
|
||||||
|
|
||||||
|
.resource-icon {
|
||||||
|
width: 100rpx;
|
||||||
|
height: 100rpx;
|
||||||
|
border-radius: 50%;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
margin-bottom: 16rpx;
|
||||||
|
|
||||||
|
&.blue {
|
||||||
|
// background-color: $primary-color;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.resource-text {
|
||||||
|
font-size: 28rpx;
|
||||||
|
color: $text-primary;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 功能列表
|
||||||
|
.function-list {
|
||||||
|
margin: 20rpx;
|
||||||
|
background-color: $card-bg;
|
||||||
|
border-radius: 16rpx;
|
||||||
|
overflow: hidden;
|
||||||
|
|
||||||
|
.function-item {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
padding: 30rpx;
|
||||||
|
border-bottom: 1px solid $border-color;
|
||||||
|
|
||||||
|
&:last-child {
|
||||||
|
border-bottom: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.function-left {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
.function-icon {
|
||||||
|
width: 80rpx;
|
||||||
|
height: 80rpx;
|
||||||
|
border-radius: 50%;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
margin-right: 20rpx;
|
||||||
|
|
||||||
|
&.orange {
|
||||||
|
background-color: $orange-color;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.blue {
|
||||||
|
background-color: $primary-color;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.green {
|
||||||
|
background-color: $green-color;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.purple {
|
||||||
|
background-color: $purple-color;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.function-text {
|
||||||
|
font-size: 30rpx;
|
||||||
|
color: $text-primary;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
152
pages/mobile/user_info/index.vue
Normal file
@ -0,0 +1,152 @@
|
|||||||
|
<template>
|
||||||
|
<div class="user-info-container">
|
||||||
|
<div class="info-item">
|
||||||
|
<div class="label">头像</div>
|
||||||
|
<div class="value">
|
||||||
|
<img :src="userInfo.avatar" alt="User Avatar" class="avatar" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="info-item">
|
||||||
|
<div class="label">用户名</div>
|
||||||
|
<div class="value">{{ userInfo.username }}</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="info-item">
|
||||||
|
<div class="label">真实姓名</div>
|
||||||
|
<div class="value">
|
||||||
|
{{ userInfo.realName }}
|
||||||
|
<span v-if="userInfo.verified" class="verified-badge">已认证</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="info-item">
|
||||||
|
<div class="label">手机号</div>
|
||||||
|
<div class="value">{{ userInfo.phone }}</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="info-item">
|
||||||
|
<div class="label">邮箱</div>
|
||||||
|
<div class="value">{{ userInfo.email }}</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="info-item">
|
||||||
|
<div class="label">城市</div>
|
||||||
|
<div class="value">{{ userInfo.city }}</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="info-item">
|
||||||
|
<div class="label">技能标签</div>
|
||||||
|
<div class="value">
|
||||||
|
<span v-for="(tag, index) in userInfo.tags" :key="index" class="tag">
|
||||||
|
#{{ tag }}
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="info-item">
|
||||||
|
<div class="label">技能证书</div>
|
||||||
|
<div class="value certificates">
|
||||||
|
<img
|
||||||
|
v-for="(cert, index) in userInfo.certificates"
|
||||||
|
:key="index"
|
||||||
|
:src="cert"
|
||||||
|
alt="Certificate"
|
||||||
|
class="certificate-image"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="info-item">
|
||||||
|
<div class="label">个人简介</div>
|
||||||
|
<div class="value bio">{{ userInfo.bio }}</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup lang="ts">
|
||||||
|
definePageMeta({ layout: 'm' })
|
||||||
|
import { reactive } from 'vue'
|
||||||
|
|
||||||
|
const userInfo = reactive({
|
||||||
|
avatar: "/static/images/avater2.png",
|
||||||
|
username: "王刚",
|
||||||
|
realName: "王刚",
|
||||||
|
verified: true,
|
||||||
|
phone: "138******96",
|
||||||
|
email: "651234754@qq.com",
|
||||||
|
city: "重庆",
|
||||||
|
tags: ["五金工具", "电子产品"],
|
||||||
|
certificates: [
|
||||||
|
"/static/images/cert1.jpg",
|
||||||
|
"/static/images/cert2.jpg",
|
||||||
|
"/static/images/cert3.jpg",
|
||||||
|
],
|
||||||
|
bio: "你好!我是专注于工业设计和机械设计领域...",
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
.user-info-container {
|
||||||
|
padding: 20px;
|
||||||
|
background-color: #f9f9f9;
|
||||||
|
}
|
||||||
|
|
||||||
|
.info-item {
|
||||||
|
display: flex;
|
||||||
|
padding: 12px 0;
|
||||||
|
border-bottom: 1px solid #eee;
|
||||||
|
}
|
||||||
|
|
||||||
|
.label {
|
||||||
|
width: 80px;
|
||||||
|
color: #666;
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.value {
|
||||||
|
flex: 1;
|
||||||
|
text-align: right;
|
||||||
|
color: #333;
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.avatar {
|
||||||
|
width: 40px;
|
||||||
|
height: 40px;
|
||||||
|
border-radius: 50%;
|
||||||
|
object-fit: cover;
|
||||||
|
}
|
||||||
|
|
||||||
|
.verified-badge {
|
||||||
|
background-color: #4080ff;
|
||||||
|
color: white;
|
||||||
|
padding: 2px 8px;
|
||||||
|
border-radius: 12px;
|
||||||
|
font-size: 12px;
|
||||||
|
margin-left: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tag {
|
||||||
|
margin-left: 8px;
|
||||||
|
color: #4080ff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.certificates {
|
||||||
|
display: flex;
|
||||||
|
justify-content: flex-end;
|
||||||
|
}
|
||||||
|
|
||||||
|
.certificate-image {
|
||||||
|
width: 60px;
|
||||||
|
height: 80px;
|
||||||
|
margin-left: 10px;
|
||||||
|
object-fit: cover;
|
||||||
|
}
|
||||||
|
|
||||||
|
.bio {
|
||||||
|
text-align: left;
|
||||||
|
line-height: 1.5;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -1,6 +1,5 @@
|
|||||||
<template>
|
<template>
|
||||||
<!-- 导航 -->
|
<!-- 导航 -->
|
||||||
<SeoHead title="工程设计模型下载_CAD设计图纸资源库" />
|
|
||||||
<KlNavTab active="模型" :type="3" />
|
<KlNavTab active="模型" :type="3" />
|
||||||
<div class="ma-auto w-[1440px]">
|
<div class="ma-auto w-[1440px]">
|
||||||
<!-- 图纸分类 -->
|
<!-- 图纸分类 -->
|
||||||
@ -63,6 +62,7 @@
|
|||||||
source: source.value || -1,
|
source: source.value || -1,
|
||||||
type: 3,
|
type: 3,
|
||||||
title: keywords.value,
|
title: keywords.value,
|
||||||
|
recommend: source.value === -1 ? true: false,
|
||||||
})
|
})
|
||||||
// const result = reactive<pageRes>({
|
// const result = reactive<pageRes>({
|
||||||
// list: [],
|
// list: [],
|
||||||
@ -94,6 +94,7 @@
|
|||||||
editions: query.value.editions === '-1' ? '' : query.value.editions,
|
editions: query.value.editions === '-1' ? '' : query.value.editions,
|
||||||
source: query.value.source === -1 ? '' : query.value.source,
|
source: query.value.source === -1 ? '' : query.value.source,
|
||||||
projectType: query.value.projectType === '-1' ? '' : query.value.projectType,
|
projectType: query.value.projectType === '-1' ? '' : query.value.projectType,
|
||||||
|
recommend: query.value.source === -1 ? true: false,
|
||||||
})
|
})
|
||||||
return res.data
|
return res.data
|
||||||
},
|
},
|
||||||
|
|||||||
@ -1,6 +1,5 @@
|
|||||||
<template>
|
<template>
|
||||||
<!-- 导航 -->
|
<!-- 导航 -->
|
||||||
<SeoHead title="工程设计模型下载_CAD设计图纸资源库" />
|
|
||||||
<KlNavTab active="模型" :type="3" />
|
<KlNavTab active="模型" :type="3" />
|
||||||
<div class="ma-auto w-[1440px]">
|
<div class="ma-auto w-[1440px]">
|
||||||
<!-- 图纸分类 -->
|
<!-- 图纸分类 -->
|
||||||
@ -53,6 +52,7 @@
|
|||||||
editions: '-1',
|
editions: '-1',
|
||||||
source: -1,
|
source: -1,
|
||||||
type: 3,
|
type: 3,
|
||||||
|
recommend: true,
|
||||||
})
|
})
|
||||||
// const result = reactive<pageRes>({
|
// const result = reactive<pageRes>({
|
||||||
// list: [],
|
// list: [],
|
||||||
@ -65,13 +65,14 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
const { data: result } = useAsyncData(
|
const { data: result } = useAsyncData(
|
||||||
`draw-page-list-${query.value.projectType}-${query.value.editions}-${query.value.source}-${query.value.pageNo}-${query.value.pageSize}`,
|
`draw-page-list-model-${query.value.projectType}-${query.value.editions}-${query.value.source}-${query.value.pageNo}-${query.value.pageSize}`,
|
||||||
async () => {
|
async () => {
|
||||||
const res = await page({
|
const res = await page({
|
||||||
...query.value,
|
...query.value,
|
||||||
editions: query.value.editions === '-1' ? '' : query.value.editions,
|
editions: query.value.editions === '-1' ? '' : query.value.editions,
|
||||||
source: query.value.source === -1 ? '' : query.value.source,
|
source: query.value.source === -1 ? '' : query.value.source,
|
||||||
projectType: query.value.projectType === '-1' ? '' : query.value.projectType,
|
projectType: query.value.projectType === '-1' ? '' : query.value.projectType,
|
||||||
|
recommend: query.value.source === -1 ? true: false,
|
||||||
})
|
})
|
||||||
return res.data
|
return res.data
|
||||||
},
|
},
|
||||||
|
|||||||
@ -1,6 +1,6 @@
|
|||||||
<template>
|
<template>
|
||||||
<KlNavTab />
|
<KlNavTab />
|
||||||
<div class="ma-auto w-[1198px] flex justify-between">
|
<div class="mx-auto w-[1198px] flex justify-between">
|
||||||
<div
|
<div
|
||||||
class="left mt-[25px] box-border h-[370px] w-[260px] border border-[#EEEEEE] rounded-[4px] border-solid bg-[#FFFFFF] text-[15px] text-[#333333] font-medium"
|
class="left mt-[25px] box-border h-[370px] w-[260px] border border-[#EEEEEE] rounded-[4px] border-solid bg-[#FFFFFF] text-[15px] text-[#333333] font-medium"
|
||||||
>
|
>
|
||||||
@ -15,7 +15,7 @@
|
|||||||
</div>
|
</div>
|
||||||
</nuxt-link>
|
</nuxt-link>
|
||||||
|
|
||||||
<nuxt-link to="/personal-Center/personal-profile" class="flex items-center justify-between py-[14px]">
|
<!-- <nuxt-link to="/personal-Center/personal-profile" class="flex items-center justify-between py-[14px]">
|
||||||
<div class="flex items-center pl-[20px]">
|
<div class="flex items-center pl-[20px]">
|
||||||
<img v-if="!route.path.startsWith('/personal-Center/personal-profile')" src="~/assets/images/user_zl.png" alt="" srcset="" class="h-[16px]" />
|
<img v-if="!route.path.startsWith('/personal-Center/personal-profile')" src="~/assets/images/user_zl.png" alt="" srcset="" class="h-[16px]" />
|
||||||
<img v-else src="~/assets/images/个人资料 (1).png" alt="" srcset="" class="h-[16px]" />
|
<img v-else src="~/assets/images/个人资料 (1).png" alt="" srcset="" class="h-[16px]" />
|
||||||
@ -34,6 +34,16 @@
|
|||||||
<div class="pr-[20px]">
|
<div class="pr-[20px]">
|
||||||
<el-icon><ArrowRight /></el-icon>
|
<el-icon><ArrowRight /></el-icon>
|
||||||
</div>
|
</div>
|
||||||
|
</nuxt-link> -->
|
||||||
|
<nuxt-link to="/personal-Center/account-management" class="flex items-center justify-between py-[14px]">
|
||||||
|
<div class="flex items-center pl-[20px]">
|
||||||
|
<img v-if="!route.path.startsWith('/personal-Center/account-management')" src="~/assets/images/account.png" alt="" srcset="" class="h-[20px]" />
|
||||||
|
<img v-else src="~/assets/images/账户安全.png" alt="" srcset="" class="h-[20px]" />
|
||||||
|
<span class="ml-[14px]">账户管理</span>
|
||||||
|
</div>
|
||||||
|
<div class="pr-[20px]">
|
||||||
|
<el-icon><ArrowRight /></el-icon>
|
||||||
|
</div>
|
||||||
</nuxt-link>
|
</nuxt-link>
|
||||||
<nuxt-link to="/personal-Center/resource-center" class="flex items-center justify-between py-[14px]">
|
<nuxt-link to="/personal-Center/resource-center" class="flex items-center justify-between py-[14px]">
|
||||||
<div class="flex items-center pl-[20px]">
|
<div class="flex items-center pl-[20px]">
|
||||||
@ -49,7 +59,7 @@
|
|||||||
<div class="flex items-center pl-[20px]">
|
<div class="flex items-center pl-[20px]">
|
||||||
<img v-if="!route.path.startsWith('/personal-Center/trading-center')" src="~/assets/images/pay.png" alt="" srcset="" class="h-[20px]" />
|
<img v-if="!route.path.startsWith('/personal-Center/trading-center')" src="~/assets/images/pay.png" alt="" srcset="" class="h-[20px]" />
|
||||||
<img v-else src="~/assets/images/交易管理.png" alt="" srcset="" class="h-[20px]" />
|
<img v-else src="~/assets/images/交易管理.png" alt="" srcset="" class="h-[20px]" />
|
||||||
<span class="ml-[12px]">交易中心</span>
|
<span class="ml-[12px]">交易记录</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="pr-[20px]">
|
<div class="pr-[20px]">
|
||||||
<el-icon><ArrowRight /></el-icon>
|
<el-icon><ArrowRight /></el-icon>
|
||||||
|
|||||||
90
pages/personal-Center/index/account-bind.vue
Normal file
@ -0,0 +1,90 @@
|
|||||||
|
<template>
|
||||||
|
<div class="box-border w-auto border border-[#EEEEEE] rounded-6px border-solid bg-[#FFFFFF] px-30px py-21px mt-10px">
|
||||||
|
<div class="flex flex-col justify-center text-[14px] text-[#333333] font-normal">
|
||||||
|
<div class="mt-[6px] flex items-center justify-between">
|
||||||
|
<div class="flex items-center">
|
||||||
|
<el-icon size="32" color="#007AFF"><Iphone /></el-icon>
|
||||||
|
<!-- <img src="~/assets/images/qq-v2.png" alt="" srcset="" class="h-[35px] w-[34px]" /> -->
|
||||||
|
<div class="ml-[19px] w-fit flex flex-col">
|
||||||
|
<div class="color-#333 text-15px mb-4px">手机号{{ user.mobile ? '(已绑定)' : '' }}</div
|
||||||
|
><div class="color-#999">手机号可以用于登录帐号{{ user.mobile }}</div></div
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
<el-button :type="user.mobile ? 'danger' : 'primary'" class="ml-10px">{{ user.mobile ? '解绑' : '绑定' }}</el-button>
|
||||||
|
</div>
|
||||||
|
<div class="mt-[30px] flex items-center justify-between">
|
||||||
|
<div class="flex items-center">
|
||||||
|
<img src="~/assets/images/qq-v2.png" alt="" srcset="" class="h-[35px] w-[34px]" />
|
||||||
|
<div class="ml-[19px] w-fit flex flex-col">
|
||||||
|
<div class="color-#333 text-15px mb-4px">QQ{{ user.qqOpenId ? '(已绑定)' : '' }}</div
|
||||||
|
><div class="color-#999">QQ可以用于登录帐号</div></div
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
<el-button :type="user.qqOpenId ? 'danger' : 'primary'" class="ml-10px" @click="handleBind('qq')">{{ user.qqOpenId ? '解绑' : '绑定' }}</el-button>
|
||||||
|
</div>
|
||||||
|
<div class="mt-[30px] flex items-center justify-between">
|
||||||
|
<div class="flex items-center">
|
||||||
|
<img src="~/assets/images/weixin-v2.png" alt="" srcset="" class="h-[35px] w-[34px]" />
|
||||||
|
<div class="ml-[19px] w-fit flex flex-col">
|
||||||
|
<div class="color-#333 text-15px mb-4px">微信{{ user.wxOpenId ? '(已绑定)' : '' }}</div
|
||||||
|
><div class="color-#999">微信可以用于登录帐号</div></div
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
<el-button :type="user.wxOpenId ? 'danger' : 'primary'" class="ml-10px" @click="handleBind('wx')">{{ user.wxOpenId ? '解绑' : '绑定' }}</el-button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup lang="ts">
|
||||||
|
import { Iphone } from '@element-plus/icons-vue'
|
||||||
|
import { onMounted } from 'vue'
|
||||||
|
import { handleLoginQQ, handleLoginWechat } from '~/utils/login'
|
||||||
|
import { getUserInfo, cancelSocialBind } from '~/api/personal-center/index'
|
||||||
|
import type { UserExtendRespVO } from '~/api/personal-center/types'
|
||||||
|
import { useMessage } from '~/composables/useMessage'
|
||||||
|
const message = useMessage()
|
||||||
|
onMounted(() => {
|
||||||
|
getUser()
|
||||||
|
})
|
||||||
|
|
||||||
|
const user = ref({} as UserExtendRespVO)
|
||||||
|
const getUser = async () => {
|
||||||
|
const res = await getUserInfo()
|
||||||
|
console.log(res)
|
||||||
|
user.value = res.data
|
||||||
|
}
|
||||||
|
|
||||||
|
const handleBind = async (type: string) => {
|
||||||
|
if (type === 'qq') {
|
||||||
|
if (user.value.qqOpenId) {
|
||||||
|
const res = await message.confirm('确定解绑QQ吗?', '提示')
|
||||||
|
if (!res) return
|
||||||
|
cancelSocialBind({ type: 35, openid: user.value.qqOpenId }).then((res) => {
|
||||||
|
if (res.code === 0) {
|
||||||
|
ElMessage.success('解绑成功')
|
||||||
|
getUser()
|
||||||
|
}
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
handleLoginQQ()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
if (type === 'wx') {
|
||||||
|
if (user.value.wxOpenId) {
|
||||||
|
const res = await message.confirm('确定解绑微信吗?', '提示')
|
||||||
|
if (!res) return
|
||||||
|
cancelSocialBind({ type: 32, openid: user.value.wxOpenId }).then((res) => {
|
||||||
|
if (res.code === 0) {
|
||||||
|
getUser()
|
||||||
|
ElMessage.success('解绑成功')
|
||||||
|
}
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
handleLoginWechat()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped></style>
|
||||||
29
pages/personal-Center/index/account-logout.vue
Normal file
@ -0,0 +1,29 @@
|
|||||||
|
<template>
|
||||||
|
<div class="box-border w-auto border border-[#EEEEEE] rounded-6px border-solid bg-[#FFFFFF] px-30px py-21px mt-10px">
|
||||||
|
<el-button type="danger" @click="handleClick">注销账号</el-button>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup lang="ts">
|
||||||
|
import useUserStore from '~/stores/user'
|
||||||
|
const userStore = useUserStore()
|
||||||
|
import { userLogout } from '~/api/personal-center/index'
|
||||||
|
const handleClick = () => {
|
||||||
|
console.log('注销账号')
|
||||||
|
ElMessageBox.confirm('确定注销账号吗?', '提示', {
|
||||||
|
confirmButtonText: '确定',
|
||||||
|
cancelButtonText: '取消',
|
||||||
|
type: 'warning',
|
||||||
|
}).then(async () => {
|
||||||
|
console.log('注销账号')
|
||||||
|
const res = await userLogout()
|
||||||
|
if (res.code === 0) {
|
||||||
|
ElMessage.success('注销成功')
|
||||||
|
navigateTo('/')
|
||||||
|
clearNuxtState(['token', 'userInfo'])
|
||||||
|
userStore.logout()
|
||||||
|
userStore.$reset()
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
</script>
|
||||||
18
pages/personal-Center/index/account-management.vue
Normal file
@ -0,0 +1,18 @@
|
|||||||
|
<template>
|
||||||
|
<div class="box-border w-913px border border-[#EEEEEE] rounded-6px border-solid bg-[#FFFFFF] px-30px py-21px">
|
||||||
|
<el-tabs v-model="activeName" class="demo-tabs">
|
||||||
|
<el-tab-pane label="个人资料" name="个人资料">
|
||||||
|
<PersonalProfile />
|
||||||
|
</el-tab-pane>
|
||||||
|
<el-tab-pane label="账户安全" name="账户安全">
|
||||||
|
<AccountSecurityV2 />
|
||||||
|
</el-tab-pane>
|
||||||
|
</el-tabs>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script lang="ts" setup>
|
||||||
|
import AccountSecurityV2 from './account-security-v2.vue'
|
||||||
|
import PersonalProfile from './personal-profile.vue'
|
||||||
|
const activeName = ref('个人资料')
|
||||||
|
</script>
|
||||||