refactor: add computed properties for image and audio cover URLs; refactor file handling and improve character length calculation
This commit is contained in:
jmal
parent
66b7ab35e9
commit
bc9acf1606
@ -771,7 +771,7 @@ import shortcutKeyMixin from './mixins/shortcutKey'
|
||||
import fileTooltipMixin from '@/components/ShowFile/mixins/fileTooltip'
|
||||
import fileDragMixin from '@/components/ShowFile/mixins/fileDrag'
|
||||
import filenameHandleMixin from '@/components/ShowFile/mixins/filenameHandle'
|
||||
import fileHandelMixin from '@/components/ShowFile/mixins/fileHandel'
|
||||
import fileHandleMixin from '@/components/ShowFile/mixins/fileHandle'
|
||||
import filepathHandleMixin from '@/components/ShowFile/mixins/filepathHandle'
|
||||
import fileLoadListMixin from '@/components/ShowFile/mixins/fileList'
|
||||
import searchFileMixin from '@/components/ShowFile/mixins/searchFile'
|
||||
@ -791,7 +791,7 @@ export default {
|
||||
fileTooltipMixin,
|
||||
fileDragMixin,
|
||||
filenameHandleMixin,
|
||||
fileHandelMixin,
|
||||
fileHandleMixin,
|
||||
filepathHandleMixin,
|
||||
searchFileMixin,
|
||||
commonFileMixin,
|
||||
|
||||
@ -1,10 +1,16 @@
|
||||
import { formatSize, formatTime } from '@/utils/number'
|
||||
|
||||
export default {
|
||||
computed: {
|
||||
imageUrl() {
|
||||
return `${process.env.VUE_APP_BASE_API}/view/thumbnail?jmal-token=${this.$store.state.user.token}&name=${this.$store.state.user.name}&id=`
|
||||
},
|
||||
audioCoverUrl() {
|
||||
return `${process.env.VUE_APP_BASE_API}/view/cover?jmal-token=${this.$store.state.user.token}&name=${this.$store.state.user.name}&id=`
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
imageUrl: `${process.env.VUE_APP_BASE_API}/view/thumbnail?jmal-token=${this.$store.state.user.token}&name=${this.$store.state.user.name}&id=`,
|
||||
audioCoverUrl: `${process.env.VUE_APP_BASE_API}/view/cover?jmal-token=${this.$store.state.user.token}&name=${this.$store.state.user.name}&id=`,
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
||||
@ -256,7 +256,8 @@ export default {
|
||||
|
||||
let firstOver = 0 // 是否刚开始拖动
|
||||
let moveTitle = ''
|
||||
setTimeout(function() {
|
||||
|
||||
this.$nextTick(() => {
|
||||
rows = target.childElementCount
|
||||
_this.dragElementList = []
|
||||
for (let i = 0; i < target.childElementCount; i++) {
|
||||
@ -290,7 +291,8 @@ export default {
|
||||
childOfImg.draggable = false
|
||||
}
|
||||
}
|
||||
}, 300)
|
||||
})
|
||||
|
||||
|
||||
// 被拖动的元素正在那个容器里
|
||||
let dragIndex = -1
|
||||
@ -303,10 +305,10 @@ export default {
|
||||
let node = null
|
||||
const className = e.toElement.className
|
||||
if (_this.grid) {
|
||||
if (e.toElement.className === itemClassName) {
|
||||
if (className === itemClassName) {
|
||||
node = e.toElement
|
||||
}
|
||||
if (e.toElement.className === parentClassName) {
|
||||
if (className === parentClassName) {
|
||||
node = e.fromElement
|
||||
}
|
||||
} else {
|
||||
|
||||
@ -249,10 +249,11 @@ export default {
|
||||
cancelButtonText: `使用.${newExt}`,
|
||||
}
|
||||
).then(() => {
|
||||
newFileName = strFileName + '.' + row.suffix
|
||||
}).catch(() => {}).then(() => {
|
||||
this.rename(row, newFileName)
|
||||
})
|
||||
const finalFileName = strFileName + '.' + row.suffix
|
||||
this.rename(row, finalFileName)
|
||||
}).catch(() => {
|
||||
this.rename(row, newFileName)
|
||||
})
|
||||
} else {
|
||||
this.rename(row, newFileName)
|
||||
}
|
||||
@ -152,6 +152,7 @@ export default {
|
||||
const row = this.pathList[this.pathList.length - 1]
|
||||
thisPath = `${row.row.path}${row.folder}`
|
||||
}
|
||||
console.log('fileDoc', fileDoc)
|
||||
const isCurrentPath = (thisPath + '/') === fileDoc
|
||||
if ('deleteFile' === url && (isCurrentPath || this.$route.path.startsWith('/recently'))) {
|
||||
this.getFileListEnter()
|
||||
@ -267,11 +268,11 @@ export default {
|
||||
}
|
||||
this.editingIndex = -1
|
||||
const queryTagId = this.$route.query.tagId ? `&tagId=${this.$route.query.tagId}` : ''
|
||||
const basePath = this.getBasePath().replaceAll('#', '%23')
|
||||
const basePath = this.getBasePath().replace(/#/g, '%23')
|
||||
const keyword = this.$route.query.keyword ? `&keyword=${this.$route.query.keyword}` : ''
|
||||
const folder = this.$route.query.folder ? `&folder=${this.$route.query.folder}` : ''
|
||||
const searchOpenFolder = this.$route.query.searchOpenFolder ? `&searchOpenFolder=${this.$route.query.searchOpenFolder}` : ''
|
||||
this.$router.push(`?vmode=${this.vmode}&path=${this.path.replaceAll('#', '%23')}${folder}${queryTagId}${basePath}${keyword}${searchOpenFolder}`)
|
||||
this.$router.push(`?vmode=${this.vmode}&path=${this.path.replace(/#/g, '%23')}${folder}${queryTagId}${basePath}${keyword}${searchOpenFolder}`)
|
||||
// 改变拖拽目标
|
||||
this.rowDrop()
|
||||
// 画矩形选取
|
||||
|
||||
@ -53,21 +53,48 @@ export default {
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
// 判断给定的字符是否是中文
|
||||
isChineseChar(char) {
|
||||
return char.charCodeAt(0) > 255
|
||||
},
|
||||
// 获取字符的长度。中文字符长度为2，其他字符长度为1
|
||||
getCharLength(char) {
|
||||
//return this.isChineseChar(char) ? 2 : 1
|
||||
// 简单判断字符长度：中文字符和全角字符长度为2，其他为1
|
||||
if (this.isChineseChar(char)) {
|
||||
// 优化的字符长度计算函数
|
||||
// 使用 Unicode 范围来判断字符宽度，更准确且性能更好
|
||||
|
||||
if (!char) return 0; // 处理空字符或 undefined
|
||||
|
||||
const code = char.codePointAt(0);
|
||||
|
||||
// 全角字符范围判断（长度为2）
|
||||
if (
|
||||
// 中日韩统一表意文字 (CJK Unified Ideographs)
|
||||
(code >= 0x4E00 && code <= 0x9FFF) ||
|
||||
// 中日韩扩展A区
|
||||
(code >= 0x3400 && code <= 0x4DBF) ||
|
||||
// 中日韩符号和标点
|
||||
(code >= 0x3000 && code <= 0x303F) ||
|
||||
// 全角ASCII、全角标点
|
||||
(code >= 0xFF00 && code <= 0xFFEF) ||
|
||||
// 平假名
|
||||
(code >= 0x3040 && code <= 0x309F) ||
|
||||
// 片假名
|
||||
(code >= 0x30A0 && code <= 0x30FF) ||
|
||||
// 韩文字母
|
||||
(code >= 0xAC00 && code <= 0xD7AF) ||
|
||||
// 其他可能的宽字符
|
||||
(code >= 0x1100 && code <= 0x11FF) || // 韩文字母扩展
|
||||
(code >= 0x2E80 && code <= 0x2EFF) || // 中日韩部首补充
|
||||
(code >= 0x2F00 && code <= 0x2FDF) || // 康熙部首
|
||||
(code >= 0x31C0 && code <= 0x31EF) || // 中日韩笔画
|
||||
(code >= 0xF900 && code <= 0xFAFF) || // 中日韩兼容表意文字
|
||||
(code >= 0xFE30 && code <= 0xFE4F) || // 中日韩兼容形式
|
||||
// 表情符号和其他宽字符
|
||||
(code >= 0x1F300 && code <= 0x1F9FF) ||
|
||||
// 全角空格
|
||||
code === 0x3000
|
||||
) {
|
||||
return 2;
|
||||
} else if (char === ' ') {
|
||||
return 2; // 空格作为一个字符处理
|
||||
} else {
|
||||
return 1;
|
||||
}
|
||||
|
||||
// 半角字符（包括普通空格、ASCII字符等）
|
||||
return 1;
|
||||
},
|
||||
// 获取有效长度。如果有后缀，则包括后缀和点的长度；否则是基础名称和后7位的长度
|
||||
getEffectiveLength(base, suffix) {
|
||||
|
||||
@ -154,13 +154,9 @@ export default {
|
||||
searchFileAndOpenDir(fileId, onLoad) {
|
||||
this.beforeLoadData(onLoad)
|
||||
|
||||
const queryTagId = this.$route.query.tagId
|
||||
? `&tagId=${this.$route.query.tagId}`
|
||||
: ''
|
||||
const path = this.$route.query.path ? `&path=${this.$route.query.path}`.replaceAll('#', '%23') : ''
|
||||
const keyword = this.$route.query.keyword
|
||||
? `&keyword=${this.$route.query.keyword}`
|
||||
: ''
|
||||
const queryTagId = this.$route.query.tagId ? `&tagId=${this.$route.query.tagId}` : ''
|
||||
const path = this.$route.query.path ? `&path=${this.$route.query.path}`.replace(/#/g, '%23') : ''
|
||||
const keyword = this.$route.query.keyword ? `&keyword=${this.$route.query.keyword}` : ''
|
||||
const basePath = this.getBasePath()
|
||||
const searchOpenFolder = `&searchOpenFolder=${fileId}`
|
||||
const folder = this.$route.query.folder ? `&folder=${this.$route.query.folder}` : ''
|
||||
|
||||
@ -17,6 +17,11 @@ export default {
|
||||
default: true,
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
selectedRowIndices: new Set()
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
sortChangeOfMenu(prop, headerIndex) {
|
||||
let tableHeader = document.querySelector('.el-table__header thead tr')
|
||||
@ -56,8 +61,7 @@ export default {
|
||||
},
|
||||
addClass(el, className) {
|
||||
if (el) {
|
||||
const str = el.className
|
||||
el.className = el.className + ' ' + className
|
||||
el.classList.add(className)
|
||||
}
|
||||
},
|
||||
// 收集选中的index值作为数组 传递给rowRed判断变换样式
|
||||
@ -67,6 +71,7 @@ export default {
|
||||
this.selectOrigin = rows[0].index
|
||||
this.rowContextData = rows[0]
|
||||
}
|
||||
this.selectedRowIndices = new Set(rows.map(row => row.index));
|
||||
this.$refs.fileListTable.tableSelectData = rows
|
||||
this.selectRowData = rows
|
||||
this.changeSelectedStyle(rows)
|
||||
@ -102,7 +107,7 @@ export default {
|
||||
},
|
||||
// cell-style 通过返回值可以实现样式变换利用传递过来的数组index循环改变样式
|
||||
rowStyle({ row, column, rowIndex, columnIndex }) {
|
||||
if (this.$refs.fileListTable.tableSelectData.findIndex(item => item.index === rowIndex) > -1) {
|
||||
if (this.selectedRowIndices.has(rowIndex)) {
|
||||
if (columnIndex === 0) {
|
||||
return {
|
||||
backgroundColor: '#e0f3fc !important',
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user