💄 分享界面加入提取码功能

This commit is contained in:
jmal 2023-03-06 18:15:53 +08:00
parent c96ea30787
commit 031d72682c
14 changed files with 112 additions and 66 deletions

View File

@ -180,6 +180,14 @@ export default {
params
})
},
// 验证提取码
validShareCode: function(data) {
return request({
url: 'public/valid-share-code',
method: 'post',
data
})
},
// 访问分享链接
accessShare: function(params) {
return request({

View File

@ -10,7 +10,7 @@
<svg-icon v-if="grid" class="mobile grid icon-favorite" icon-class="Favoritestarrate"/>
</div>
</div>
<div v-if="item.isShare && item.shareId && !public">
<div v-if="item.isShare && item.shareBase && !public">
<div v-if="pc">
<svg-icon v-if="!grid" class="pc list icon-share" icon-class="share"/>
<svg-icon v-if="grid" class="pc grid icon-share" icon-class="share"/>

View File

@ -2891,38 +2891,16 @@ export default {
}
this.shareDialogObject = row
this.shareDialogObject.fileId = row.id
this.shareDialogObject.shareId = undefined
this.shareDialogObject.shareBase = undefined
this.shareDialogVisible = true
// this.shareFileName = row.name
// api.generate({
// userId: row.userId,
// fileId: row.id,
// isFolder: row.isFolder
// }).then(res => {
// this.shareDialog = true
// // 这3行代码是为了让vue刷新数据
// const isFavorite = this.rowContextData.isFavorite
// this.rowContextData.isFavorite = !isFavorite
// this.rowContextData.isFavorite = isFavorite
// if (res.data) {
// let shareId = res.data
// this.shareLink = window.location.origin + '/s?s=' + shareId
// this.generateShareLinkLoading = false
// this.rowContextData.shareId = shareId
// }
// this.rowContextData.isShare = true
// }).catch(() => {
// this.shareDialog = false
// this.generateShareLinkLoading = false
// })
},
shareSuccess(shareId) {
console.log('shareSuccess', shareId)
shareSuccess(shareBase) {
console.log('shareSuccess', shareBase)
// 这3行代码是为了让vue刷新数据
const isFavorite = this.rowContextData.isFavorite
this.rowContextData.isFavorite = !isFavorite
this.rowContextData.isFavorite = isFavorite
this.rowContextData.shareId = shareId
this.rowContextData.shareBase = shareBase
this.rowContextData.isShare = true
},
downloadFile() {

View File

@ -122,7 +122,7 @@ export default {
}
this.fileUrl = window.location.origin + fileConfig.previewUrl(this.$store.state.user.name, this.file, this.$store.getters.token)
if(this.readOnly && window.shareId){
this.fileUrl = window.location.origin + fileConfig.publicPreviewUrl(this.file.id, window.shareId)
this.fileUrl = window.location.origin + fileConfig.publicPreviewUrl(this.file.id, window.shareId, this.$store.getters.shareToken)
}
let fileKey = `${new Date(this.file.updateDate).getTime()}-${this.file.id}`

View File

@ -63,7 +63,7 @@ export default {
}
let url = fileConfig.previewUrl(this.$store.state.user.name, newFile, this.$store.getters.token)
if(!this.$store.state.user.token){
url = fileConfig.publicPreviewUrl(newFile.id, window.shareId);
url = fileConfig.publicPreviewUrl(newFile.id, window.shareId, this.$store.getters.shareToken);
}
let music = newFile.music
let fileName = newFile.name.substring(0,newFile.name.length - newFile.suffix.length-1)

View File

@ -116,7 +116,7 @@ export default {
getImageUrl(element) {
let url = fileConfig.previewUrl(this.$store.state.user.name, element, this.$store.getters.token)
if (this.shareId) {
url = fileConfig.publicPreviewUrl(element.id, window.shareId);
url = fileConfig.publicPreviewUrl(element.id, window.shareId, this.$store.getters.shareToken);
}
return url
},

View File

@ -225,7 +225,7 @@ export default {
}
this.fileUrl = window.location.origin + fileConfig.previewUrl(this.$store.state.user.name, this.file, this.$store.getters.token)
if(this.readOnly && window.shareId){
this.fileUrl = window.location.origin + fileConfig.publicPreviewUrl(this.file.id, window.shareId)
this.fileUrl = window.location.origin + fileConfig.publicPreviewUrl(this.file.id, window.shareId, this.$store.getters.shareToken)
}
},
}

View File

@ -100,7 +100,7 @@ export default {
if(visible){
let url = fileConfig.previewUrl(this.$store.state.user.name, this.file, this.$store.getters.token)
if(this.shareId){
url = fileConfig.publicPreviewUrl(this.file.id, window.shareId);
url = fileConfig.publicPreviewUrl(this.file.id, window.shareId, this.$store.getters.shareToken);
}
this.playerOptions.sources = [{
//类型

View File

@ -2,6 +2,7 @@ const getters = {
sidebar: state => state.app.sidebar,
device: state => state.app.device,
token: state => state.user.token,
shareToken: state => state.user.shareToken,
avatar: state => state.user.avatar,
name: state => state.user.name,
showName: state => state.user.showName,

View File

@ -1,15 +1,29 @@
import { login, logout, getInfo } from '@/api/user'
import fileApi from '@/api/file-api'
import menuApi from '@/api/menu'
import { getToken, setToken, getConsumerId, setConsumerId, removeToken, removeConsumerId , setRememberName, removeRememberName } from '@/utils/auth'
import {
getToken,
setToken,
getConsumerId,
setConsumerId,
removeToken,
removeConsumerId,
setRememberName,
removeRememberName,
setShareToken,
getShareToken
} from '@/utils/auth'
import { setLogo } from '@/utils/logo'
import { resetRouter } from '@/router'
import router from '@/router'
import Layout from '@/layout'
import ParentView from '@/components/ParentView'
import api from "@/api/file-api";
const getDefaultState = () => {
return {
token: getToken(),
shareToken: getShareToken(),
name: '',
showName: '',
userInfo: {},
@ -30,6 +44,9 @@ const mutations = {
SET_TOKEN: (state, token) => {
state.token = token
},
SET_SHARE_TOKEN: (state, token) => {
state.shareToken = token
},
SET_NAME: (state, name) => {
state.name = name
},
@ -93,7 +110,19 @@ const actions = {
})
})
},
// 验证提取码
validShareCode({commit}, {shareId, shareCode}) {
return new Promise((resolve, reject) => {
fileApi.validShareCode({ shareId: shareId, shareCode: shareCode }).then(response => {
const { data } = response
commit('SET_SHARE_TOKEN', data)
setShareToken(data)
resolve()
}).catch(error => {
reject(error)
})
})
},
// set logo
setLogo({ commit }, logoInfo) {
const { netdiskName, netdiskLogo } = logoInfo

View File

@ -1,6 +1,7 @@
import Cookies from 'js-cookie'
const TokenKey = 'jmal_token'
const tokenKey = 'jmal_token'
const shareTokenKey = 'share-token'
const consumerId = 'consumerId'
const rememberName = 'rememberName'
@ -17,15 +18,23 @@ export function removeRememberName() {
}
export function getToken() {
return Cookies.get(TokenKey)
return Cookies.get(tokenKey)
}
export function getShareToken() {
return Cookies.get(shareTokenKey)
}
export function setShareToken(token) {
return Cookies.set(shareTokenKey, token)
}
export function setToken(token) {
return Cookies.set(TokenKey, token)
return Cookies.set(tokenKey, token)
}
export function removeToken() {
return Cookies.remove(TokenKey)
return Cookies.remove(tokenKey)
}
export function getConsumerId() {

View File

@ -19,11 +19,14 @@ export default {
return `${window.location.origin}${this.baseUrl}/office/track?jmal-token=${token}&fileId=${fileId}`
},
// 预览文件的url
previewUrl: function(username, file, token) {
previewUrl: function(username, file, token, shareToken) {
let fileUrl = `${this.baseUrl}/file/${username}${encodeURI(file.path)}${encodeURI(file.name)}`
if (token) {
return `${fileUrl}?jmal-token=${token}`
}
if (shareToken) {
return `${fileUrl}?share-token=${shareToken}`
}
return fileUrl
},
// mardown里上传图片后的图片预览地址
@ -43,34 +46,40 @@ export default {
})
},
// 打包下载文件
packageDownload: function(fileIds, token) {
packageDownload: function(fileIds, token, shareToken) {
fileApi.isAllowDownload().then(() => {
window.open(`${this.baseUrl}/packageDownload?fileIds=${fileIds}&jmal-token=${token}`, '_self')
})
},
// 共享文件下载
publicDownload: function(shareId, file) {
window.open(this.publicDownloadUrl(shareId, file), '_self')
publicDownload: function(shareId, file, shareToken) {
window.open(this.publicDownloadUrl(shareId, file, shareToken), '_self')
},
// 共享文件预览
publicPreview: function(fileId, shareId) {
const url = this.publicPreviewUrl(fileId, shareId)
publicPreview: function(fileId, shareId, shareToken) {
const url = this.publicPreviewUrl(fileId, shareId, shareToken)
window.open(url, '_blank')
},
// 共享文件预览Url
publicPreviewUrl: function(fileId, shareId) {
return `${this.baseUrl}/public/s/preview/${fileId}/${shareId}`
publicPreviewUrl: function(fileId, shareId, shareToken) {
if (!shareToken) {
shareToken = "none"
}
return `${this.baseUrl}/public/s/preview/${fileId}/${shareId}/${shareToken}`
},
// 共享文件打包下载
publicPackageDownload: function(shareId, fileIds) {
window.open(this.publicPackageDownloadUrl(shareId, fileIds), '_self')
publicPackageDownload: function(shareId, fileIds, shareToken) {
window.open(this.publicPackageDownloadUrl(shareId, fileIds, shareToken), '_self')
},
// 共享文件下载Url
publicDownloadUrl: function(shareId, file) {
return window.location.origin + `${this.baseUrl}/public/s/download/${file.id}/${shareId}`
publicDownloadUrl: function(shareId, file, shareToken) {
if (!shareToken) {
shareToken = "none"
}
return window.location.origin + `${this.baseUrl}/public/s/download/${file.id}/${shareId}/${shareToken}`
},
// 共享文件打包下载Url
publicPackageDownloadUrl: function(shareId, fileIds) {
return window.location.origin + `${this.baseUrl}/public/s/packageDownload?shareId=${shareId}&fileIds=${fileIds}`
publicPackageDownloadUrl: function(shareId, fileIds, shareToken) {
return window.location.origin + `${this.baseUrl}/public/s/packageDownload?shareId=${shareId}&fileIds=${fileIds}$share-token=${shareToken}`
},
}

View File

@ -1,6 +1,6 @@
// import { MessageBox, Message } from 'element-ui'
import store from '@/store'
import { getToken } from '@/utils/auth'
import {getShareToken, getToken} from '@/utils/auth'
// create an axios instance
const service = axios.create({
@ -14,10 +14,11 @@ service.interceptors.request.use(
config => {
// do something before request is sent
if (store.getters.token) {
// let each request carry token
// ['X-Token'] is a custom headers key
// please modify it according to the actual situation
config.headers['jmal-token'] = getToken()
console.log(config.headers)
}
if (store.getters.shareToken) {
config.headers['share-token'] = getShareToken()
}
return config
},

View File

@ -226,10 +226,10 @@
<span>{{ shareData.fileName }}</span>
</div>
<div class="share-code">
<el-input v-model="extractionCode" placeholder="请输入提取码" clearable></el-input>
<el-input v-model="extractionCode" placeholder="请输入提取码" clearable @keyup.enter.native="validShareCode(extractionCode)"></el-input>
</div>
<div class="share-code-valid">
<el-button type="primary" :disabled="extractionCode.length === 0">查看文件</el-button>
<el-button type="primary" :disabled="extractionCode.length === 0" @click="validShareCode(extractionCode)">查看文件</el-button>
</div>
</div>
@ -276,6 +276,7 @@ import fileConfig from "@/utils/file-config";
import Clipboard from "clipboard";
import OfficePreview from "@/components/preview/OfficePreview";
import Logo from "@/components/Logo";
import getPageTitle from "@/utils/get-page-title";
export default {
components: {
@ -606,7 +607,6 @@ export default {
this.showShareCode = true
userId = res.data.userId
this.shareData = res.data
console.log('shareData', this.shareData)
} else {
this.fileList = res.data
this.fileList.map((item, index) => {
@ -661,7 +661,6 @@ export default {
getSharer(userId) {
api.getSharer({userId: userId}).then(res => {
this.sharer = res.data
console.log('this.sharer', this.sharer)
this.sharerAvatarUrl = window.location.origin + this.imageUrl + res.data.avatar
if (this.sharer.netdiskName) {
this.netdiskName = this.sharer.netdiskName
@ -937,20 +936,20 @@ export default {
}
if (fileIds.length > 1 || this.rowContextData.isFolder) {
if (copy) {
this.copyDownloadLink(fileConfig.publicPackageDownloadUrl(this.shareId, fileIds))
this.copyDownloadLink(fileConfig.publicPackageDownloadUrl(this.shareId, fileIds, this.$store.getters.shareToken))
} else {
fileConfig.publicPackageDownload(this.shareId, fileIds)
fileConfig.publicPackageDownload(this.shareId, fileIds, this.$store.getters.shareToken)
}
return
}
if (copy) {
if (this.rowContextData.isShare) {
this.copyDownloadLink(window.location.origin + fileConfig.previewUrl(this.sharer.username, this.rowContextData))
this.copyDownloadLink(window.location.origin + fileConfig.previewUrl(this.sharer.username, this.rowContextData,undefined, this.$store.getters.shareToken))
} else {
this.copyDownloadLink(fileConfig.publicPackageDownloadUrl(this.shareId, fileIds))
this.copyDownloadLink(fileConfig.publicPackageDownloadUrl(this.shareId, fileIds, this.$store.getters.shareToken))
}
} else {
fileConfig.publicDownload(this.shareId, this.rowContextData)
fileConfig.publicDownload(this.shareId, this.rowContextData, this.$store.getters.shareToken)
}
} else {
this.$message({
@ -976,6 +975,7 @@ export default {
this.$message({message: '该浏览器不支持自动复制', type: 'warning', duration: 1000});
clipboard.destroy()
})
console.log('url', url)
},
// 点击文件或文件夹
fileClick(row) {
@ -1022,8 +1022,19 @@ export default {
return
}
// 打开文件
fileConfig.publicPreview(row.id, this.shareId)
fileConfig.publicPreview(row.id, this.shareId, this.$store.getters.shareToken)
}
},
/**
* 验证提取码
* @param shareCode 提取码
*/
validShareCode(shareCode) {
this.$store.dispatch('user/validShareCode', {shareId: this.shareId, shareCode: shareCode}).then(()=> {
this.showShareCode = false
// 验证成功
this.getFileList()
})
}
}
}