jmal
GitHub
commit
641742e4b4
@ -51,6 +51,7 @@
|
||||
"sortablejs": "^1.10.2",
|
||||
"spark-md5": "^3.0.0",
|
||||
"stompjs": "^2.3.3",
|
||||
"tippy.js": "^6.3.7",
|
||||
"v-contextmenu": "^2.9.0",
|
||||
"v-viewer": "^1.5.1",
|
||||
"vditor": "3.10.4",
|
||||
|
||||
@ -1,5 +1,4 @@
|
||||
import request from '@/utils/request'
|
||||
const qs = require('qs')
|
||||
|
||||
export default {
|
||||
logList(params) {
|
||||
@ -9,5 +8,12 @@ export default {
|
||||
params
|
||||
})
|
||||
},
|
||||
getFileOperationHistory(params) {
|
||||
return request({
|
||||
url: '/log/getFileOperationHistory',
|
||||
method: 'get',
|
||||
params
|
||||
})
|
||||
},
|
||||
}
|
||||
|
||||
|
||||
@ -53,10 +53,10 @@
|
||||
<svg-icon v-if="item.isFolder" icon-class="folder"/>
|
||||
<div v-else-if="item.contentType && item.contentType.indexOf('video') > -1">
|
||||
<div v-if="item.mediaCover === undefined || item.mediaCover === 'true'">
|
||||
<div v-if="grid && pc" class="grid-play-icon">
|
||||
<div v-if="grid && pc && !details" class="grid-play-icon">
|
||||
<svg-icon icon-class="play1"/>
|
||||
</div>
|
||||
<el-image :lazy="lazy" v-if="grid" :style="{'height':details?'110px':(gridWidth-50) + 'px'}" fit="contain"
|
||||
<el-image :lazy="lazy" v-if="grid" :style="{'height': videoImageHeight}" fit="contain"
|
||||
:src="item.fileId ? (audioCoverUrl+item.fileId) : (audioCoverUrl+item.id)">
|
||||
<div slot="error" class="image-slot-error">
|
||||
<svg-icon icon-class="video"/>
|
||||
@ -91,7 +91,7 @@
|
||||
<svg-icon v-else icon-class="audio"/>
|
||||
</div>
|
||||
<div v-else-if="(item.contentType && item.contentType.startsWith('image')) || item.showCover">
|
||||
<el-image v-if="grid || grid === 'details'" :style="{'height':details?'110px':(gridWidth-35) + 'px'}"
|
||||
<el-image v-if="grid || grid === 'details'" :style="imageHeightStyle"
|
||||
fit="contain" :src="item.fileId ? (imageUrl+item.fileId) : (imageUrl+item.id)" :class="item.showCover ? 'cover' : ''">
|
||||
<div slot="error" class="image-slot-error">
|
||||
<svg-icon icon-class="image"/>
|
||||
@ -153,6 +153,24 @@ export default {
|
||||
mounted() {
|
||||
},
|
||||
computed: {
|
||||
videoImageHeight() {
|
||||
if (this.details) {
|
||||
return "110px"
|
||||
}
|
||||
if (this.item.video && this.item.video.width > this.item.video.height) {
|
||||
return ""
|
||||
}
|
||||
return this.gridWidth - 35 + "px"
|
||||
},
|
||||
imageHeightStyle() {
|
||||
if (this.details) {
|
||||
return "height: 110px;"
|
||||
}
|
||||
if (this.item.w > this.item.h) {
|
||||
return `max-height: ${this.gridWidth - 35}px`
|
||||
}
|
||||
return `height: ${this.gridWidth - 35}px;`
|
||||
},
|
||||
findIconClass() {
|
||||
let suffix = this.item.suffix;
|
||||
if (!suffix && this.item.fileName) {
|
||||
|
||||
@ -89,6 +89,7 @@
|
||||
<div class="search-content">
|
||||
<div class="search-class">
|
||||
<el-popover
|
||||
popper-class="upload-file"
|
||||
v-if="showUploadButton"
|
||||
v-show="!(isRootPath && homeHidden)"
|
||||
v-model="isShowNewFolder"
|
||||
@ -329,10 +330,7 @@
|
||||
>
|
||||
<div class="popper-arrow"></div>
|
||||
<ul v-for="(item, index) in menus" :key="item.label">
|
||||
<li
|
||||
v-if="
|
||||
item.operation === 'unFavorite' || item.operation === 'favorite'
|
||||
"
|
||||
<li v-if="item.operation === 'unFavorite' || item.operation === 'favorite'"
|
||||
class="menu-option"
|
||||
@click="menusOperations(item.operation, $event)"
|
||||
@mouseover.prevent.stop="
|
||||
@ -342,19 +340,23 @@
|
||||
menuFavoriteLeave(index, rowContextData.isFavorite)
|
||||
"
|
||||
>
|
||||
<label class="menuitem">
|
||||
<div class="menuitem home-contextmenu">
|
||||
<svg-icon :icon-class="item.iconClass" />
|
||||
<span class="menuitem text">{{ item.label }}</span>
|
||||
</label>
|
||||
<div class="home-contextmenu-title">
|
||||
<span class="menuitem text">{{ item.label }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
<li v-else @click="menusOperations(item.operation, $event)">
|
||||
<label class="menuitem">
|
||||
<div class="menuitem home-contextmenu">
|
||||
<svg-icon :icon-class="item.iconClass" />
|
||||
<span class="menuitem text">{{ item.label }}</span>
|
||||
<span v-if="item.shortcut" style="position: absolute;right: 10px;">
|
||||
<div class="home-contextmenu-title">
|
||||
<span class="menuitem text">{{ item.label }}</span>
|
||||
<span v-if="item.shortcut">
|
||||
<kbd v-for="key in item.shortcut" :style="{fontSize: key === '⌘' ? '14px' : '12px'}">{{ key }}</kbd>
|
||||
</span>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</e-vue-contextmenu>
|
||||
@ -527,6 +529,7 @@
|
||||
minHeight: gridMinHeight + 'px',
|
||||
rowGap: '10px',
|
||||
overflow: 'auto',
|
||||
paddingBottom: '12px',
|
||||
'box-shadow':
|
||||
fileListScrollTop > 0
|
||||
? '-1px -1px 4px #00152914'
|
||||
@ -536,26 +539,6 @@
|
||||
<van-grid-item
|
||||
v-for="(item, index) in fileList"
|
||||
:key="item.id"
|
||||
:title="
|
||||
'大小：' +
|
||||
formatSize(item.size) +
|
||||
'\r\n' +
|
||||
(item.w && item.h
|
||||
? '尺寸：' + item.w + 'x' + item.h + '\r\n'
|
||||
: '') +
|
||||
'名称：' +
|
||||
item.name +
|
||||
'\r\n' +
|
||||
'上传时间：' +
|
||||
item.uploadDate +
|
||||
'\r\n' +
|
||||
'修改时间：' +
|
||||
item.updateDate +
|
||||
'\r\n' +
|
||||
'路径：' +
|
||||
item.path +
|
||||
extendedInfo(item)
|
||||
"
|
||||
:style="{paddingTop: 100/gridColumnNum + '%'}"
|
||||
>
|
||||
<div
|
||||
@ -573,6 +556,7 @@
|
||||
? 'solid 1px var(--apple-shadow-color)'
|
||||
: '',
|
||||
}"
|
||||
v-tooltip="tooltipConfig(item)"
|
||||
@click="gridItemClick(item, $event)"
|
||||
@dblclick="fileClick(item, $event)"
|
||||
@contextmenu.prevent="rowContextmenu(item)"
|
||||
@ -846,7 +830,7 @@
|
||||
<div class="el-message-box__container delete-attention el-alert--warning is-light">
|
||||
<div class="el-message-box__status el-icon-warning"></div>
|
||||
<div class="el-message-box__message">
|
||||
<p>所选目录已存在下列文件</p>
|
||||
<p>同名文件如何处理</p>
|
||||
</div>
|
||||
</div>
|
||||
<dialog-file-list class="dialog-file-list" :file-list="existsFileList" :image-url="imageUrl" :audio-cover-url="audioCoverUrl"></dialog-file-list>
|
||||
@ -854,7 +838,7 @@
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button round size="small" @click="copyOrMoveConfirmVisible = false">取 消</el-button>
|
||||
<el-button round type="warning" size="small" @click="copyOrMoveApi(copyOrMoveParams.operating, copyOrMoveParams.froms, copyOrMoveParams.to, true, copyOrMoveParams.targetPath)">覆 盖</el-button>
|
||||
<el-button round type="primary" size="small" @click="copyOrMoveApi(copyOrMoveParams.operating, copyOrMoveParams.froms, copyOrMoveParams.to, false, copyOrMoveParams.targetPath)">不覆盖</el-button>
|
||||
<el-button round type="primary" size="small" @click="copyOrMoveApi(copyOrMoveParams.operating, copyOrMoveParams.froms, copyOrMoveParams.to, false, copyOrMoveParams.targetPath)">跳 过</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
|
||||
@ -1243,7 +1227,9 @@ export default {
|
||||
if (item.isFolder || !this.grid) {
|
||||
return filename;
|
||||
}
|
||||
const singleLine = (item.contentType && item.contentType.startsWith('image')) || item.showCover
|
||||
const verticalImage = item.w && item.h && (item.w / item.h < 1.6)
|
||||
const verticalVideo = item.video && (item.video.width / item.video.height < 1.6)
|
||||
const singleLine = verticalImage || verticalVideo || item.showCover
|
||||
const gridFilenameLength = singleLine ? 13 : 28
|
||||
// 分离文件名和后缀
|
||||
let parts = filename.split('.');
|
||||
@ -1466,6 +1452,49 @@ export default {
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
tooltipConfig(item) {
|
||||
// 使用模板字符串构建更清晰的 HTML
|
||||
const contentHTML = `
|
||||
<div class="apple-tooltip-content">
|
||||
<div class="tooltip-row">
|
||||
<span class="tooltip-label">大小:</span>
|
||||
<span class="tooltip-value">${this.formatSize(item.size)}</span>
|
||||
</div>
|
||||
${item.w && item.h ? `
|
||||
<div class="tooltip-row">
|
||||
<span class="tooltip-label">尺寸:</span>
|
||||
<span class="tooltip-value">${item.w}×${item.h}</span>
|
||||
</div>` : ''}
|
||||
<div class="tooltip-row">
|
||||
<span class="tooltip-label">名称:</span>
|
||||
<span class="tooltip-value tooltip-value-name">${item.name}</span>
|
||||
</div>
|
||||
<div class="tooltip-row">
|
||||
<span class="tooltip-label">上传时间:</span>
|
||||
<span class="tooltip-value tooltip-value-date">${item.uploadDate}</span>
|
||||
</div>
|
||||
<div class="tooltip-row">
|
||||
<span class="tooltip-label">修改时间:</span>
|
||||
<span class="tooltip-value tooltip-value-date">${item.updateDate}</span>
|
||||
</div>
|
||||
<div class="tooltip-row">
|
||||
<span class="tooltip-label">路径:</span>
|
||||
<span class="tooltip-value tooltip-value-path">${item.path}</span>
|
||||
</div>
|
||||
${this.extendedInfo(item)}
|
||||
</div>
|
||||
`;
|
||||
|
||||
return {
|
||||
content: contentHTML,
|
||||
// trigger: 'click',
|
||||
placement: 'left',
|
||||
allowHTML: true,
|
||||
theme: 'light',
|
||||
// appendTo: 'parent',
|
||||
arrow: true
|
||||
};
|
||||
},
|
||||
// 判断给定的字符是否是中文
|
||||
isChineseChar(char) {
|
||||
return char.charCodeAt(0) > 255
|
||||
@ -2144,8 +2173,8 @@ export default {
|
||||
node.firstChild.style.marginRight = '20px'
|
||||
}
|
||||
if (index === 2) {
|
||||
node.style.borderRadius = '0 5px 5px 0'
|
||||
node.style.borderRight = '1px solid #409eff'
|
||||
node.style.borderRadius = '0 12px 12px 0'
|
||||
node.style.borderRight = 'solid 1px var(--apple-shadow-color)'
|
||||
node.firstChild.style.height = '44px'
|
||||
node.firstChild.style.lineHeight = '44px'
|
||||
node.firstChild.style.width = '80px'
|
||||
@ -2397,7 +2426,7 @@ export default {
|
||||
if (!file.exif && !file.video) {
|
||||
return ''
|
||||
}
|
||||
return "\r\n" + formatExif(file.exif) + formatVideo(file.video)
|
||||
return formatExif(file.exif, '<br>') + formatVideo(file.video, '<br>')
|
||||
},
|
||||
upload() {
|
||||
// 打开文件选择框
|
||||
@ -3286,35 +3315,35 @@ export default {
|
||||
if (columnIndex === 0) {
|
||||
return {
|
||||
backgroundColor: '#e0f3fc !important',
|
||||
borderRadius: '50px 0 0 50px',
|
||||
borderLeft: '1px solid #409eff',
|
||||
borderTop: '1px solid #409eff',
|
||||
borderBottom: '1px solid #409eff',
|
||||
borderRadius: '12px 0 0 12px',
|
||||
borderLeft: 'solid 1px var(--apple-shadow-color)',
|
||||
borderTop: 'solid 1px var(--apple-shadow-color)',
|
||||
borderBottom: 'solid 1px var(--apple-shadow-color)',
|
||||
}
|
||||
}
|
||||
if (columnIndex === 3) {
|
||||
return {
|
||||
backgroundColor: '#e0f3fc !important',
|
||||
borderRadius: '0 50px 50px 0',
|
||||
borderRight: '1px solid #409eff',
|
||||
borderTop: '1px solid #409eff',
|
||||
borderBottom: '1px solid #409eff',
|
||||
borderRadius: '0 12px 12px 0',
|
||||
borderRight: 'solid 1px var(--apple-shadow-color)',
|
||||
borderTop: 'solid 1px var(--apple-shadow-color)',
|
||||
borderBottom: 'solid 1px var(--apple-shadow-color)',
|
||||
}
|
||||
}
|
||||
return {
|
||||
backgroundColor: '#e0f3fc !important',
|
||||
borderTop: '1px solid #409eff',
|
||||
borderBottom: '1px solid #409eff',
|
||||
borderTop: 'solid 1px var(--apple-shadow-color)',
|
||||
borderBottom: 'solid 1px var(--apple-shadow-color)',
|
||||
}
|
||||
} else {
|
||||
if (columnIndex === 0) {
|
||||
return {
|
||||
borderRadius: '50px 0 0 50px',
|
||||
borderRadius: '12px 0 0 12px',
|
||||
}
|
||||
}
|
||||
if (columnIndex === 3) {
|
||||
return {
|
||||
borderRadius: '0 50px 50px 0',
|
||||
borderRadius: '0 12px 12px 0',
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -4666,7 +4695,7 @@ export default {
|
||||
|
||||
.is-sortable:hover {
|
||||
background-color: #e0f3fc;
|
||||
border-radius: 40px;
|
||||
border-radius: 12px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
175
src/components/Timeline/index.vue
Normal file
175
src/components/Timeline/index.vue
Normal file
@ -0,0 +1,175 @@
|
||||
<template>
|
||||
<div class="timeline-container">
|
||||
<el-scrollbar wrap-class="scrollbar-wrapper" @scroll="handleScroll">
|
||||
<div class="timeline-container-scrollbar">
|
||||
<div class="scroll-decoration" v-if="scrollDecorationTop"></div>
|
||||
<div v-for="(item, index) in dataList" :key="index" class="timeline-item">
|
||||
<div class="timeline-icon">
|
||||
<el-avatar :src="imageUrl + item.avatar" size="medium" icon="el-icon-user-solid"></el-avatar>
|
||||
</div>
|
||||
<div class="timeline-line" v-if="index !== dataList.length - 1"></div>
|
||||
<div class="timeline-content">
|
||||
<div class="timeline-date">{{ item.createTime }}</div>
|
||||
<div class="timeline-action">
|
||||
<span v-if="item.showName" class="timeline-action-icon">{{ item.showName }}</span>
|
||||
<el-tooltip v-if="isTooltip(item.operationFun)" class="item" effect="dark" :content="item.operationFun" placement="bottom">
|
||||
<span class="timeline-action-text">{{ splitOperationStr(item.operationFun) }}</span>
|
||||
</el-tooltip>
|
||||
<span v-else class="timeline-action-text">{{ item.operationFun }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-scrollbar>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import logApi from '@/api/log'
|
||||
import IconFile from '@/components/Icon/IconFile.vue'
|
||||
|
||||
export default {
|
||||
name: 'TimelineComponent',
|
||||
components: { IconFile },
|
||||
props: {
|
||||
showOperationHistory: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
fileId: {
|
||||
type: String,
|
||||
default: ''
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
scrollDecorationTop: false,
|
||||
imageUrl: `${process.env.VUE_APP_BASE_API}/view/thumbnail?id=`,
|
||||
loading: false,
|
||||
dataList: [],
|
||||
pageIndex: 1,
|
||||
pagination: {
|
||||
pageIndex: 1,
|
||||
pageSize: 10,
|
||||
pageTotal: 0
|
||||
},
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
},
|
||||
watch: {
|
||||
showOperationHistory(newValue) {
|
||||
if (newValue) {
|
||||
this.loading = true
|
||||
logApi.getFileOperationHistory({
|
||||
page: this.pagination.pageIndex,
|
||||
pageSize: this.pagination.pageSize,
|
||||
fileId: this.fileId
|
||||
}).then(res => {
|
||||
this.dataList = res.data
|
||||
this.pagination.pageTotal = res.count
|
||||
this.loading = false
|
||||
})
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
const scrollbarWrapper = document.querySelector('.file-operation-history .scrollbar-wrapper')
|
||||
scrollbarWrapper.onscroll = e => {
|
||||
this.handleScroll(e)
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
handleScroll(e) {
|
||||
// this.scrollDecorationTop = e.target.scrollTop > 0;
|
||||
},
|
||||
isTooltip(str) {
|
||||
return !!(str && str.includes(','));
|
||||
},
|
||||
splitOperationStr(str) {
|
||||
return str.split(',')[0]
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.timeline-container {
|
||||
|
||||
.timeline-container-scrollbar {
|
||||
height: 50vh;
|
||||
min-height: 450px;
|
||||
padding: 0 20px;
|
||||
|
||||
.scroll-decoration {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 6px;
|
||||
box-shadow: #dddddd 0 6px 6px -6px inset;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.timeline-item {
|
||||
position: relative;
|
||||
display: flex;
|
||||
padding: 12px 0;
|
||||
}
|
||||
|
||||
.timeline-icon {
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
border-radius: 50%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
background-color: #f0f0f0;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.timeline-icon img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
.timeline-line {
|
||||
position: absolute;
|
||||
left: 20px;
|
||||
top: 40px;
|
||||
bottom: 0;
|
||||
height: 100%;
|
||||
width: 1px;
|
||||
background-color: #e1e4e8;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.timeline-content {
|
||||
margin-left: 16px;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.timeline-date {
|
||||
font-size: 14px;
|
||||
color: #24292e;
|
||||
font-weight: 500;
|
||||
margin-bottom: 2px;
|
||||
}
|
||||
|
||||
.timeline-action {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 14px;
|
||||
color: #586069;
|
||||
}
|
||||
|
||||
.timeline-action-icon {
|
||||
margin-right: 4px;
|
||||
color: #586069;
|
||||
}
|
||||
</style>
|
||||
@ -23,6 +23,7 @@
|
||||
<icon-file
|
||||
v-else
|
||||
class="drawer-icon-font"
|
||||
:lazy="false"
|
||||
:grid="true"
|
||||
:details="true"
|
||||
:item="file"
|
||||
@ -53,11 +54,11 @@
|
||||
<el-form-item label="名称:">
|
||||
<span>{{ file.name }}</span>
|
||||
</el-form-item>
|
||||
<el-form-item label="类型:">
|
||||
<span>{{
|
||||
file.isFolder ? '文件夹' : file.contentType
|
||||
}}</span>
|
||||
</el-form-item>
|
||||
<!-- <el-form-item label="类型:">-->
|
||||
<!-- <span>{{-->
|
||||
<!-- file.isFolder ? '文件夹' : file.contentType-->
|
||||
<!-- }}</span>-->
|
||||
<!-- </el-form-item>-->
|
||||
<div v-if="file.music">
|
||||
<el-form-item label="🎵 歌手:">
|
||||
<span>{{ file.music.singer }}</span>
|
||||
@ -80,13 +81,22 @@
|
||||
<span> {{ formatSize(file.size) }}</span>
|
||||
</el-form-item>
|
||||
<el-form-item label="位置:" class="details-position">
|
||||
<span><a :href="pathUrl">{{ filepath }}</a></span>
|
||||
<span><a :href="pathUrl" v-tooltip="{content: '文件所在位置', placement: 'bottom'}">{{ filepath }}</a></span>
|
||||
</el-form-item>
|
||||
<el-form-item label="上传时间:">
|
||||
<span>{{ file.uploadDate }}</span>
|
||||
</el-form-item>
|
||||
<el-form-item label="修改时间:">
|
||||
<span>{{ file.updateDate }}</span>
|
||||
<el-popover
|
||||
placement="right"
|
||||
popper-class="file-operation-history"
|
||||
width="400"
|
||||
trigger="click"
|
||||
@show="showOperationHistory"
|
||||
@hide="hideOperationHistory">
|
||||
<timeline-component :show-operation-history="operationHistory" :file-id="file.id"></timeline-component>
|
||||
<span slot="reference" v-tooltip="{content: '文件操作历史', placement: 'bottom'}" class="file-operation-history-btn">{{ file.updateDate }}</span>
|
||||
</el-popover>
|
||||
</el-form-item>
|
||||
<el-form-item v-if="file.exif" label="">
|
||||
<span style="white-space: break-spaces;">{{ formatExif(file.exif) }}</span>
|
||||
@ -98,12 +108,15 @@
|
||||
<el-button round v-if="allowOpenFile" type="primary" size="small" @click="openFile" class="file-detail-btn open-file">打开文件</el-button>
|
||||
<el-button round v-if="onlyOfficeSupportedFormats(file)" type="primary" size="small" @click="openOnlyOffice" class="file-detail-btn open-file">使用OnlyOffice打开</el-button>
|
||||
</el-form>
|
||||
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import tippy from 'tippy.js';
|
||||
import fileApi from '@/api/file-api'
|
||||
import TimelineComponent from '@/components/Timeline'
|
||||
import { onlyOfficeSupportedFormats } from '@/utils/file-type'
|
||||
|
||||
// 引入VueOfficeDocx 组件
|
||||
@ -126,6 +139,7 @@ import settingApi from "@/api/setting-api";
|
||||
export default {
|
||||
name: 'FileDetails',
|
||||
components: {
|
||||
TimelineComponent,
|
||||
IconFile,
|
||||
VueOfficeDocx,
|
||||
VueOfficeExcel
|
||||
@ -166,11 +180,10 @@ export default {
|
||||
excel: window.location.origin + fileConfig.previewUrl(this.$store.state.user.name, this.file, this.$store.getters.token)
|
||||
},
|
||||
filepath: '',
|
||||
pathUrl: ''
|
||||
pathUrl: '',
|
||||
operationHistory: false
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
},
|
||||
computed: {
|
||||
...mapState(['message']),
|
||||
fleUrl() {
|
||||
@ -212,6 +225,19 @@ export default {
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
if (this.$refs.viewOperationHistoryTitle) {
|
||||
tippy(this.$refs.viewOperationHistoryTitle, {
|
||||
content: '这是一个即时显示的提示!',
|
||||
delay: 0, // 关键：设置延迟为 0毫秒
|
||||
placement: 'top', // 提示框位置 (可选)
|
||||
// animation: 'scale', // 动画效果 (可选, 需要引入对应 css)
|
||||
// theme: 'light', // 主题 (可选, 需要引入对应 css)
|
||||
// interactive: true, // 允许鼠标与提示框交互 (可选)
|
||||
// arrow: true, // 显示箭头 (可选)
|
||||
});
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
getLocalPath(path) {
|
||||
if (path === '/') {
|
||||
@ -229,6 +255,12 @@ export default {
|
||||
openFile() {
|
||||
this.$emit('openFile', this.file)
|
||||
},
|
||||
showOperationHistory() {
|
||||
this.operationHistory = true
|
||||
},
|
||||
hideOperationHistory() {
|
||||
this.operationHistory = false
|
||||
},
|
||||
openOnlyOffice() {
|
||||
this.$emit('openOnlyOffice', this.file)
|
||||
},
|
||||
@ -239,10 +271,10 @@ export default {
|
||||
return formatSize(size)
|
||||
},
|
||||
formatExif(exifInfo) {
|
||||
return formatExif(exifInfo)
|
||||
return formatExif(exifInfo, '\r\n')
|
||||
},
|
||||
formatVideo(videoInfo) {
|
||||
return formatVideo(videoInfo)
|
||||
return formatVideo(videoInfo, '\r\n')
|
||||
},
|
||||
getIsSync() {
|
||||
settingApi.isSync({username: this.$store.state.user.name}).then((res) => {
|
||||
@ -255,7 +287,22 @@ export default {
|
||||
}
|
||||
return onlyOfficeSupportedFormats.includes(file.suffix.toLowerCase())
|
||||
},
|
||||
setTip() {
|
||||
if (this.$refs.updateDateTip) {
|
||||
tippy(this.$refs.updateDateTip, {
|
||||
content: '显示文件操作历史!',
|
||||
delay: 0, // 关键：设置延迟为 0毫秒
|
||||
placement: 'top', // 提示框位置 (可选)
|
||||
// animation: 'scale', // 动画效果 (可选, 需要引入对应 css)
|
||||
// theme: 'light', // 主题 (可选, 需要引入对应 css)
|
||||
// interactive: true, // 允许鼠标与提示框交互 (可选)
|
||||
})
|
||||
}
|
||||
},
|
||||
updateSyncStatus(dataPercent) {
|
||||
|
||||
this.setTip()
|
||||
|
||||
if (this.clickSync) {
|
||||
return
|
||||
}
|
||||
@ -494,11 +541,24 @@ $bg-blur: rgba(255, 255, 255, 0.75);
|
||||
background: transparent;
|
||||
}
|
||||
>>> .el-scrollbar__thumb {
|
||||
background: rgba(64,158,255,0.18);
|
||||
background: #7c7c7c2e;
|
||||
border-radius: 4px;
|
||||
transition: background 0.2s;
|
||||
&:hover {
|
||||
background: rgba(64,158,255,0.32);
|
||||
background: #7c7c7c2e;
|
||||
}
|
||||
}
|
||||
|
||||
.file-operation-history-btn {
|
||||
cursor: pointer;
|
||||
color: $primary;
|
||||
text-decoration: none;
|
||||
border-radius: 6px;
|
||||
padding: 2px 4px;
|
||||
transition: background 0.2s;
|
||||
&:hover {
|
||||
background: rgba(64,158,255,0.12);
|
||||
color: #1a73e8;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -445,6 +445,9 @@ $tagMenuBorderRadius: 8px;
|
||||
padding: 0;
|
||||
min-width: 110px;
|
||||
}
|
||||
.tag-menu {
|
||||
padding: 5px 5px;
|
||||
}
|
||||
.tag-menu li:hover {
|
||||
cursor: pointer;
|
||||
border-radius: $tagMenuBorderRadius;
|
||||
|
||||
@ -45,7 +45,6 @@
|
||||
padding-inline-start: 0;
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
padding: 0 5px;
|
||||
}
|
||||
.newFileMenu li {
|
||||
cursor: pointer;
|
||||
@ -63,7 +62,6 @@
|
||||
.newFileMenu li > .menuitem {
|
||||
cursor: pointer;
|
||||
line-height: 38px;
|
||||
margin-left: 10%;
|
||||
}
|
||||
.newFileMenu li > .menuitem > .text {
|
||||
cursor: pointer;
|
||||
@ -137,6 +135,26 @@
|
||||
border: 0 solid rgba(0, 0, 0, 0);
|
||||
min-width: 160px;
|
||||
border-radius: $dialogBorderRadius;
|
||||
padding: 10px 10px;
|
||||
box-shadow: 0 5px 12px #ccc;
|
||||
|
||||
.home-contextmenu {
|
||||
padding: 0 10px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
|
||||
.svg-icon {
|
||||
margin-right: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.home-contextmenu-title {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.menu-triangle-bottom {
|
||||
|
||||
@ -28,13 +28,102 @@ body {
|
||||
border-radius: $popperBorderRadius;
|
||||
}
|
||||
|
||||
.el-message, .el-notification .el-popover, .el-tooltip__popper, .el-dropdown-menu, .el-select-dropdown, .el-picker-panel, .el-picker-panel__body, .el-picker-panel__sidebar {
|
||||
.el-message, .el-notification, .el-popover, .el-tooltip__popper, .el-dropdown-menu, .el-select-dropdown, .el-picker-panel, .el-picker-panel__body, .el-picker-panel__sidebar {
|
||||
border-radius: $popperBorderRadius;
|
||||
}
|
||||
|
||||
.el-popover.el-popper.upload-file {
|
||||
border-radius: 16px;
|
||||
padding: 10px 10px;
|
||||
li {
|
||||
padding: 0 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.v-contextmenu {
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
.el-popper.file-operation-history {
|
||||
padding: 0;
|
||||
border-radius: 16px;
|
||||
width: 300px !important;
|
||||
background-color: rgba(255, 255, 255, .75);
|
||||
-webkit-backdrop-filter: blur(16px) saturate(180%);
|
||||
backdrop-filter: blur(16px) saturate(180%);
|
||||
.el-scrollbar__wrap {
|
||||
border-radius: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
.tippy-box[data-theme~=light] {
|
||||
border-radius: 12px;
|
||||
background-color: rgba(255,255,255,.75);
|
||||
-webkit-backdrop-filter: blur(16px) saturate(180%);
|
||||
backdrop-filter: blur(16px) saturate(180%);
|
||||
/* 推荐放在全局 CSS 或使用 :deep() */
|
||||
|
||||
/* 应用于 Tippy 的浅色主题下的自定义内容容器 */
|
||||
/* 注意：选择器可能需要根据你的具体情况调整 */
|
||||
/* 如果 appendTo: 'parent', 可能不需要 :deep() */
|
||||
/* 如果 appendTo: document.body, 并且样式在 scoped style 中，则需要 :deep() */
|
||||
|
||||
.apple-tooltip-content {
|
||||
padding: 8px 12px; /* 增加内边距 */
|
||||
font-size: 12px; /* 稍小的基础字号 */
|
||||
line-height: 1.5; /* 增加行高提高可读性 */
|
||||
color: #333; /* 深灰色文字 */
|
||||
text-align: left; /* 确保左对齐 */
|
||||
max-width: 300px;
|
||||
}
|
||||
|
||||
.tooltip-row {
|
||||
display: flex; /* 使用 flex 布局方便对齐 */
|
||||
justify-content: space-between; /* 两端对齐，标签在左，值在右 */
|
||||
margin-bottom: 4px; /* 行间距 */
|
||||
/* 如果希望标签和值都左对齐，注释掉 justify-content，并可能给 label 固定宽度 */
|
||||
/* align-items: center; */ /* 如果需要垂直居中 */
|
||||
}
|
||||
|
||||
.tooltip-row:last-child {
|
||||
margin-bottom: 0; /* 最后一行无下边距 */
|
||||
}
|
||||
|
||||
.tooltip-label {
|
||||
color: #666; /* 标签使用浅灰色 */
|
||||
margin-right: 8px; /* 标签和值之间的间距 */
|
||||
/* font-weight: 500; */ /* 可以稍微加粗一点点 */
|
||||
flex-shrink: 0; /* 防止标签被压缩 */
|
||||
/* 如果想让标签右对齐: */
|
||||
/* text-align: right; */
|
||||
/* width: 70px; */ /* 可能需要固定宽度以对齐值 */
|
||||
}
|
||||
|
||||
.tooltip-value {
|
||||
color: #111; /* 值使用更深的颜色 */
|
||||
word-break: break-all; /* 长内容（如路径、名称）自动换行 */
|
||||
text-align: right; /* 值右对齐，配合标签左对齐 */
|
||||
/* 如果标签和值都左对齐，移除 text-align: right */
|
||||
}
|
||||
|
||||
.tooltip-value-path, .tooltip-value-name {
|
||||
word-break: break-all;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.tooltip-divider {
|
||||
border: none;
|
||||
border-top: 1px solid #e0e0e0; /* 浅灰色分隔线 */
|
||||
margin: 8px 0; /* 分隔线上下的间距 */
|
||||
}
|
||||
|
||||
.tooltip-extended {
|
||||
margin-top: 4px;
|
||||
color: #555;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.time-filter-dropdown {
|
||||
|
||||
@ -1,4 +1,7 @@
|
||||
// import Vue from 'vue'
|
||||
import tippy from 'tippy.js';
|
||||
import 'tippy.js/themes/light.css';
|
||||
import 'tippy.js/dist/tippy.css';
|
||||
|
||||
// v-draw-rectangle 画矩形选区
|
||||
Vue.directive('drawRectangle', {
|
||||
@ -249,6 +252,124 @@ Vue.directive('dialogDragWidth', {
|
||||
}
|
||||
})
|
||||
|
||||
const TOOLTIP_INSTANCE_KEY = '_tippyInstance'; // 用于在元素上存储 Tippy 实例
|
||||
|
||||
// 默认 Tippy 配置
|
||||
const defaultTippyOptions = {
|
||||
delay: 0, // 默认即时显示
|
||||
arrow: true,
|
||||
placement: 'top',
|
||||
// 在这里可以添加更多你希望的全局默认配置
|
||||
// theme: 'light',
|
||||
// animation: 'scale',
|
||||
};
|
||||
|
||||
/**
|
||||
* 解析指令的绑定值，返回 Tippy 配置对象
|
||||
* @param {*} value - binding.value
|
||||
* @returns {object | null} - 返回 Tippy 配置对象，如果无效则返回 null
|
||||
*/
|
||||
function parseOptions(value) {
|
||||
let options = {};
|
||||
if (typeof value === 'string') {
|
||||
// 如果值是字符串，将其作为 content
|
||||
options.content = value;
|
||||
} else if (typeof value === 'object' && value !== null) {
|
||||
// 如果值是对象，直接使用（允许覆盖默认值）
|
||||
// 确保至少有 content 属性，除非 Tippy 允许无 content (通常不允许或表现怪异)
|
||||
if (value.content === undefined || value.content === null) {
|
||||
// console.warn('v-tooltip object value must contain a "content" property.');
|
||||
// 允许 content 为空字符串 ''
|
||||
if (value.content !== '') {
|
||||
console.warn('v-tooltip object value is missing a "content" property.');
|
||||
return null;
|
||||
}
|
||||
}
|
||||
options = { ...value }; // 复制对象，避免直接修改原始绑定对象
|
||||
} else {
|
||||
// 无效的值
|
||||
console.warn('v-tooltip directive requires a string or an object value.');
|
||||
return null;
|
||||
}
|
||||
return options;
|
||||
}
|
||||
|
||||
|
||||
Vue.directive('tooltip', {
|
||||
/**
|
||||
* 元素首次插入 DOM 时调用
|
||||
*/
|
||||
inserted(el, binding) {
|
||||
const userOptions = parseOptions(binding.value);
|
||||
if (userOptions === null) return; // 值无效，不初始化
|
||||
|
||||
// 合并默认配置和用户提供的配置
|
||||
const finalOptions = { ...defaultTippyOptions, ...userOptions };
|
||||
|
||||
// 创建 Tippy 实例并存储在元素上
|
||||
el[TOOLTIP_INSTANCE_KEY] = tippy(el, finalOptions);
|
||||
// console.log('Tippy initialized:', el, finalOptions);
|
||||
},
|
||||
|
||||
/**
|
||||
* 组件 VNode 更新后调用 (包括子 VNode)
|
||||
* 这是处理绑定值变化比较可靠的地方
|
||||
*/
|
||||
componentUpdated(el, binding) {
|
||||
const instance = el[TOOLTIP_INSTANCE_KEY];
|
||||
|
||||
// 检查绑定值是否有实际变化
|
||||
// 注意：对于对象，这仍然是浅比较。
|
||||
// 如果对象内部属性变了但引用没变，这里可能判断为 false。
|
||||
// 解决方法是在父组件中确保每次更新都传递新的对象引用。
|
||||
if (binding.value === binding.oldValue && typeof binding.value === 'object') {
|
||||
// 如果值是对象且引用未变，我们仍然尝试更新，以防内部属性变化
|
||||
// （这是对 Vue 浅比较的弥补，但依赖父组件正确传递数据）
|
||||
// console.log('Object reference unchanged, but attempting update');
|
||||
} else if (binding.value === binding.oldValue) {
|
||||
// 如果值是字符串或其他基础类型，且值未变，则无需更新
|
||||
// console.log('Value unchanged, skipping update.');
|
||||
return;
|
||||
}
|
||||
|
||||
|
||||
const userOptions = parseOptions(binding.value);
|
||||
|
||||
if (instance) {
|
||||
// 如果实例存在
|
||||
if (userOptions === null) {
|
||||
// 新值无效，销毁现有实例
|
||||
// console.log('Destroying Tippy due to invalid new value.');
|
||||
instance.destroy();
|
||||
el[TOOLTIP_INSTANCE_KEY] = null; // 清除引用
|
||||
} else {
|
||||
// 新值有效，更新实例的 props
|
||||
// console.log('Updating Tippy props:', userOptions);
|
||||
// setProps 会智能地合并传入的选项与现有选项
|
||||
instance.setProps(userOptions);
|
||||
}
|
||||
} else if (userOptions !== null) {
|
||||
// 如果实例不存在 (可能之前的值无效或被销毁了)，但新值有效，则重新创建
|
||||
// console.log('Re-initializing Tippy with new valid value.');
|
||||
const finalOptions = { ...defaultTippyOptions, ...userOptions };
|
||||
el[TOOLTIP_INSTANCE_KEY] = tippy(el, finalOptions);
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* 元素解绑时调用
|
||||
*/
|
||||
unbind(el) {
|
||||
const instance = el[TOOLTIP_INSTANCE_KEY];
|
||||
if (instance) {
|
||||
// console.log('Destroying Tippy on unbind.');
|
||||
instance.destroy();
|
||||
}
|
||||
// 删除存储的实例引用，防止内存泄漏
|
||||
delete el[TOOLTIP_INSTANCE_KEY];
|
||||
}
|
||||
});
|
||||
|
||||
// 除某元素外的点击事件
|
||||
Vue.directive('clickoutside', { // 初始化指令
|
||||
bind(el, binding, vnode) {
|
||||
|
||||
@ -1,87 +1,89 @@
|
||||
export function formatExif(exifInfo) {
|
||||
export function formatExif(exifInfo, lineBreak) {
|
||||
if (!exifInfo) {
|
||||
return ''
|
||||
}
|
||||
lineBreak = lineBreak || '\r\n'
|
||||
let exifStr = ''
|
||||
if (exifInfo['dateTimeOriginal']) {
|
||||
exifStr += `内容创作时间: ${exifInfo['dateTimeOriginal']}`
|
||||
}
|
||||
if (exifInfo['resolution']) {
|
||||
exifStr += `\r\n分辨率: ${exifInfo['resolution']}`
|
||||
exifStr += `${lineBreak}分辨率: ${exifInfo['resolution']}`
|
||||
}
|
||||
if (exifInfo['make']) {
|
||||
exifStr += `\r\n设备制造商: ${exifInfo['make']}`
|
||||
exifStr += `${lineBreak}设备制造商: ${exifInfo['make']}`
|
||||
}
|
||||
if (exifInfo['model']) {
|
||||
exifStr += `\r\n设备型号: ${exifInfo['model']}`
|
||||
exifStr += `${lineBreak}设备型号: ${exifInfo['model']}`
|
||||
}
|
||||
if (exifInfo['aperture']) {
|
||||
exifStr += `\r\n光圈值: ${exifInfo['aperture']}`
|
||||
exifStr += `${lineBreak}光圈值: ${exifInfo['aperture']}`
|
||||
}
|
||||
if (exifInfo['exposureTime']) {
|
||||
exifStr += `\r\n曝光时间: ${exifInfo['exposureTime']}`
|
||||
exifStr += `${lineBreak}曝光时间: ${exifInfo['exposureTime']}`
|
||||
}
|
||||
if (exifInfo['focalLength']) {
|
||||
exifStr += `\r\n焦距: ${exifInfo['focalLength']} 毫米`
|
||||
exifStr += `${lineBreak}焦距: ${exifInfo['focalLength']} 毫米`
|
||||
}
|
||||
if (exifInfo['isoEquivalent']) {
|
||||
exifStr += `\r\nISO感光度: ${exifInfo['isoEquivalent']}`
|
||||
exifStr += `${lineBreak}ISO感光度: ${exifInfo['isoEquivalent']}`
|
||||
}
|
||||
if (exifInfo['flash']) {
|
||||
exifStr += `\r\n闪光灯: ${exifInfo['flash']}`
|
||||
exifStr += `${lineBreak}闪光灯: ${exifInfo['flash']}`
|
||||
}
|
||||
if (exifInfo['fNumber']) {
|
||||
exifStr += `\r\n光圈数: ${exifInfo['fNumber']}`
|
||||
exifStr += `${lineBreak}光圈数: ${exifInfo['fNumber']}`
|
||||
}
|
||||
if (exifInfo['exposureProgram']) {
|
||||
exifStr += `\r\n曝光程序: ${exifInfo['exposureProgram']}`
|
||||
exifStr += `${lineBreak}曝光程序: ${exifInfo['exposureProgram']}`
|
||||
}
|
||||
if (exifInfo['meteringMode']) {
|
||||
exifStr += `\r\n测光模式: ${exifInfo['meteringMode']}`
|
||||
exifStr += `${lineBreak}测光模式: ${exifInfo['meteringMode']}`
|
||||
}
|
||||
if (exifInfo['whiteBalanceMode']) {
|
||||
exifStr += `\r\n白平衡: ${exifInfo['whiteBalanceMode']}`
|
||||
exifStr += `${lineBreak}白平衡: ${exifInfo['whiteBalanceMode']}`
|
||||
}
|
||||
if (exifInfo['software']) {
|
||||
exifStr += `内容创作者: ${exifInfo['software']}`
|
||||
exifStr += `${lineBreak}内容创作者: ${exifInfo['software']}`
|
||||
}
|
||||
if (exifInfo['longitude']) {
|
||||
exifStr += `\r\n经度: ${exifInfo['longitude']}`
|
||||
exifStr += `${lineBreak}经度: ${exifInfo['longitude']}`
|
||||
}
|
||||
if (exifInfo['latitude']) {
|
||||
exifStr += `\r\n纬度: ${exifInfo['latitude']}`
|
||||
exifStr += `${lineBreak}纬度: ${exifInfo['latitude']}`
|
||||
}
|
||||
return exifStr
|
||||
}
|
||||
|
||||
export function formatVideo(videoInfo) {
|
||||
export function formatVideo(videoInfo, lineBreak) {
|
||||
if (!videoInfo) {
|
||||
return ''
|
||||
}
|
||||
lineBreak = lineBreak || '\r\n'
|
||||
let videoStr = ''
|
||||
if (videoInfo['height'] && videoInfo['width']) {
|
||||
videoStr += `尺寸: ${videoInfo['width']} x ${videoInfo['height']}`
|
||||
}
|
||||
if (videoInfo['bitrate']) {
|
||||
videoStr += `\r\n码率: ${videoInfo['bitrate']}`
|
||||
videoStr += `${lineBreak}码率: ${videoInfo['bitrate']}`
|
||||
}
|
||||
if (videoInfo['frameRate']) {
|
||||
videoStr += `\r\n帧率: ${videoInfo['frameRate']} fps`
|
||||
videoStr += `${lineBreak}帧率: ${videoInfo['frameRate']} fps`
|
||||
}
|
||||
if (videoInfo['format']) {
|
||||
videoStr += `\r\n格式: ${videoInfo['format']}`
|
||||
videoStr += `${lineBreak}格式: ${videoInfo['format']}`
|
||||
}
|
||||
if (videoInfo['duration']) {
|
||||
videoStr += `\r\n时长: ${videoInfo['duration']}`
|
||||
videoStr += `${lineBreak}时长: ${videoInfo['duration']}`
|
||||
}
|
||||
if (videoInfo['toBitrate']) {
|
||||
videoStr += `\r\n转码后的码率: ${videoInfo['toBitrate']} kbps`
|
||||
videoStr += `${lineBreak}转码后的码率: ${videoInfo['toBitrate']} kbps`
|
||||
}
|
||||
if (videoInfo['toFrameRate']) {
|
||||
videoStr += `\r\n转码后的帧率: ${videoInfo['toFrameRate']} fps`
|
||||
videoStr += `${lineBreak}转码后的帧率: ${videoInfo['toFrameRate']} fps`
|
||||
}
|
||||
if (videoInfo['toHeight']) {
|
||||
videoStr += `\r\n转码后的高度: ${videoInfo['toHeight']}`
|
||||
videoStr += `${lineBreak}转码后的高度: ${videoInfo['toHeight']}`
|
||||
}
|
||||
return videoStr
|
||||
}
|
||||
|
||||
@ -50,10 +50,12 @@
|
||||
<div class="popper-arrow"></div>
|
||||
<ul v-for="item in menus" :key="item.label">
|
||||
<li class="menu-option" @click="menusOperations(item.operation)">
|
||||
<label class="menuitem">
|
||||
<div class="menuitem home-contextmenu">
|
||||
<svg-icon :icon-class="item.iconClass"/>
|
||||
<span class="menuitem text">{{ item.label }}</span>
|
||||
</label>
|
||||
<div class="home-contextmenu-title">
|
||||
<span class="menuitem text">{{ item.label }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</e-vue-contextmenu>
|
||||
@ -270,8 +272,8 @@
|
||||
:sharer="sharerUsername"
|
||||
:status.sync="iframePreviewVisible"
|
||||
></iframe-preview>
|
||||
<el-divider v-if="!linkFailed && !showShareCode" class="grid-divider" content-position="center"><i
|
||||
class="el-icon-folder-opened"></i> {{ summaries }}
|
||||
<el-divider v-if="!linkFailed && !showShareCode" class="grid-divider" content-position="center">
|
||||
<i class="el-icon-folder-opened"></i> {{ summaries }}
|
||||
</el-divider>
|
||||
<el-pagination
|
||||
background
|
||||
@ -1144,7 +1146,8 @@ export default {
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@import "src/styles/home-index";
|
||||
@import 'src/styles/index';
|
||||
@import 'src/styles/home-index';
|
||||
/*.el-breadcrumb {*/
|
||||
/*margin: 50px;*/
|
||||
.dashboard-container {
|
||||
@ -1228,9 +1231,10 @@ export default {
|
||||
}
|
||||
|
||||
.grid-divider {
|
||||
height: 0;
|
||||
height: 30px;
|
||||
text-align: center;
|
||||
width: auto;
|
||||
background: unset;
|
||||
|
||||
> > > .el-divider__text {
|
||||
}
|
||||
@ -1315,8 +1319,11 @@ export default {
|
||||
margin-left: 5px !important;
|
||||
}
|
||||
|
||||
>>> .van-grid-item__content .svg-icon{
|
||||
font-size: 4.5rem;
|
||||
>>> .van-grid-item__content {
|
||||
padding: 8px;
|
||||
.svg-icon{
|
||||
font-size: 4.5rem;
|
||||
}
|
||||
}
|
||||
|
||||
>>> .grid-file-text {
|
||||
|
||||
@ -562,7 +562,8 @@
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@import "src/styles/home-index";
|
||||
@import 'src/styles/index';
|
||||
@import 'src/styles/home-index';
|
||||
.container {
|
||||
min-width: 1024px;
|
||||
}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user