|
@@ -22,12 +22,13 @@
|
|
|
<div
|
|
|
style="display: flex;justify-content: flex-start;align-items: flex-start;flex-wrap: wrap;height: 75vh;align-content: flex-start;overflow-y: auto;">
|
|
|
<!-- v-for盒子 -->
|
|
|
- <template v-for="(item, index) in fileMenu">
|
|
|
+ <template v-for="(item, index) in fileMenu" :key="index">
|
|
|
<div class="setBox" @click="changeFile(item, index)">
|
|
|
<el-dropdown trigger="click" class="selectChe">
|
|
|
<span class="el-dropdown-link">
|
|
|
...
|
|
|
</span>
|
|
|
+
|
|
|
<template #dropdown>
|
|
|
<el-dropdown-menu>
|
|
|
<el-dropdown-item @click="restName(item, index)">重命名</el-dropdown-item>
|
|
@@ -35,8 +36,14 @@
|
|
|
</el-dropdown-menu>
|
|
|
</template>
|
|
|
</el-dropdown>
|
|
|
- <div class="left_fileBox">
|
|
|
- <img src="../../assets/images/fileStyle.png" style="width: 72px;height: 72px;">
|
|
|
+ <div class="left_fileBox image-container">
|
|
|
+ <el-tooltip
|
|
|
+ class="box-item tool-tip"
|
|
|
+ effect="dark"
|
|
|
+ placement="top-start"
|
|
|
+ >
|
|
|
+ <template #content> 安全级别: {{ item.encryptLevel == 'L1'?'敏感':(item.encryptLevel == 'L2'?'涉密':(item.encryptLevel == 'L3'?'机密':'绝密')) }} </template>
|
|
|
+ <img src="../../assets/images/fileStyle.png" style="width: 72px;height: 72px;"></el-tooltip>
|
|
|
<p class="ellipsis-text">{{ item.dirName }}</p>
|
|
|
<img class="levelImg" v-if="item.isEncrypt === 'Y'" :src="getLevelImg(item.encryptLevel)" alt="">
|
|
|
</div>
|
|
@@ -1575,6 +1582,7 @@ export default {
|
|
|
},500)
|
|
|
|
|
|
})
|
|
|
+
|
|
|
return {
|
|
|
getSpaceList,
|
|
|
folderList,//文件夹的数据
|
|
@@ -1907,6 +1915,7 @@ p {
|
|
|
}
|
|
|
|
|
|
.el-dropdown-link {
|
|
|
+ cursor: pointer;
|
|
|
color: white;
|
|
|
}
|
|
|
|
|
@@ -2084,4 +2093,27 @@ p {
|
|
|
visibility: hidden;
|
|
|
}
|
|
|
}
|
|
|
+.image-container {
|
|
|
+ position: relative;
|
|
|
+ display: inline-block;
|
|
|
+ }
|
|
|
+
|
|
|
+ .image-container img {
|
|
|
+ width: 72px;
|
|
|
+ height: 72px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .tooltip {
|
|
|
+ position: absolute;
|
|
|
+ top: 0;
|
|
|
+ right: -10px;
|
|
|
+ display: none;
|
|
|
+ box-shadow: 2px 2px 2px #d9d9d9;
|
|
|
+ padding: 5px;
|
|
|
+ border-radius: 5px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .image-container:hover .tooltip {
|
|
|
+ display: block;
|
|
|
+ }
|
|
|
</style>
|