试验数据管理
This commit is contained in:
parent
b94b81c8c7
commit
ff1702c338
@ -7,7 +7,9 @@
|
||||
<meta name="description" content="" />
|
||||
<meta name="keywords" content="" />
|
||||
<script type="text/javascript" type="module" src="./webconfig.js"></script>
|
||||
<title>明眸眼健康智慧管理系统</title>
|
||||
<script src="/lib/pptxjs/pptxjs.js"></script>
|
||||
<link rel="stylesheet" href="/lib/pptxjs/pptxjs.css">
|
||||
<title>文档与数据管理系统</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="app"></div>
|
||||
|
||||
161
web/public/lib/pptxjs/pptxjs.css
Normal file
161
web/public/lib/pptxjs/pptxjs.css
Normal file
@ -0,0 +1,161 @@
|
||||
|
||||
|
||||
.slide {
|
||||
position: relative;
|
||||
border: 1px solid #333;
|
||||
border-radius: 10px;
|
||||
overflow: hidden;
|
||||
margin-bottom: 50px;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
.slide div.block {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
width: 100%;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.slide div.content {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.slide div.diagram-content{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.slide div.content-rtl {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
direction: rtl;
|
||||
}
|
||||
.slide .pregraph-rtl{
|
||||
direction: rtl;
|
||||
}
|
||||
.slide .pregraph-ltr{
|
||||
direction: ltr;
|
||||
}
|
||||
.slide .pregraph-inherit{
|
||||
direction: inherit;
|
||||
}
|
||||
.slide .slide-prgrph{
|
||||
width: 100%;
|
||||
/* overflow-wrap:break-word;
|
||||
word-wrap: break-word; */
|
||||
|
||||
/* word-break: break-word; */
|
||||
/* unicode-bidi: bidi-override; */
|
||||
/* hyphens: auto;
|
||||
overflow-wrap: break-word; */
|
||||
|
||||
}
|
||||
|
||||
.slide .line-break-br::before{
|
||||
content: "\A";
|
||||
white-space: pre;
|
||||
}
|
||||
.slide div.v-up {
|
||||
justify-content: flex-start;
|
||||
}
|
||||
.slide div.v-mid {
|
||||
justify-content: center;
|
||||
}
|
||||
.slide div.v-down {
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.slide div.h-left {
|
||||
justify-content: flex-start;
|
||||
align-items: flex-start;
|
||||
text-align: left;
|
||||
}
|
||||
.slide div.h-left-rtl {
|
||||
justify-content: flex-end;
|
||||
align-items: flex-end;
|
||||
text-align: left;
|
||||
}
|
||||
.slide div.h-mid {
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
}
|
||||
.slide div.h-right {
|
||||
justify-content: flex-end;
|
||||
align-items: flex-end;
|
||||
text-align: right;
|
||||
}
|
||||
.slide div.h-right-rtl {
|
||||
justify-content: flex-start;
|
||||
align-items: flex-start;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.slide div.h-just,
|
||||
.slide div.h-dist {
|
||||
text-align: justify;
|
||||
}
|
||||
|
||||
|
||||
.slide div.up-left {
|
||||
justify-content: flex-start;
|
||||
align-items: flex-start;
|
||||
text-align: left;
|
||||
}
|
||||
.slide div.up-center {
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
}
|
||||
.slide div.up-right {
|
||||
justify-content: flex-start;
|
||||
align-items: flex-end;
|
||||
}
|
||||
.slide div.center-left {
|
||||
justify-content: center;
|
||||
align-items: flex-start;
|
||||
text-align: left;
|
||||
}
|
||||
.slide div.center-center {
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
.slide div.center-right {
|
||||
justify-content: center;
|
||||
align-items: flex-end;
|
||||
}
|
||||
.slide div.down-left {
|
||||
justify-content: flex-end;
|
||||
align-items: flex-start;
|
||||
text-align: left;
|
||||
}
|
||||
.slide div.down-center {
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
}
|
||||
.slide div.down-right {
|
||||
justify-content: flex-end;
|
||||
align-items: flex-end;
|
||||
}
|
||||
|
||||
|
||||
.slide li.slide {
|
||||
margin: 10px 0px;
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
.slide table {
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.slide svg.drawing {
|
||||
position: absolute;
|
||||
overflow: visible;
|
||||
}
|
||||
/*
|
||||
#pptx-thumb {
|
||||
min-width: 240px;
|
||||
height: 180px;
|
||||
}
|
||||
*/
|
||||
14104
web/public/lib/pptxjs/pptxjs.js
Normal file
14104
web/public/lib/pptxjs/pptxjs.js
Normal file
File diff suppressed because one or more lines are too long
@ -118,3 +118,28 @@ export function uploadToBackup(params:any) {
|
||||
params:params,
|
||||
});
|
||||
}
|
||||
//新增试验数据管理文件夹
|
||||
export function addTsFile(params:any) {
|
||||
return request({
|
||||
url: '/experimentalData/ts-files/addTsFile',
|
||||
method: 'post',
|
||||
data:params,
|
||||
});
|
||||
}
|
||||
|
||||
//根据父项编码查询数据字典项数据
|
||||
export function list(params:any){
|
||||
return request ({
|
||||
url:'/system/dictionaryItems/list',
|
||||
method:'post',
|
||||
params:params
|
||||
})
|
||||
}
|
||||
//查询实验数据管理文件夹
|
||||
export function listTsFiles(params:any){
|
||||
return request ({
|
||||
url:'/experimentalData/ts-files/listTsFiles',
|
||||
method:'get',
|
||||
params:params
|
||||
})
|
||||
}
|
||||
BIN
web/src/assets/fileimg/mp3.png
Normal file
BIN
web/src/assets/fileimg/mp3.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 574 B |
BIN
web/src/assets/fileimg/mp4.png
Normal file
BIN
web/src/assets/fileimg/mp4.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 316 B |
BIN
web/src/assets/fileimg/pdf.png
Normal file
BIN
web/src/assets/fileimg/pdf.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 541 B |
BIN
web/src/assets/fileimg/ppt.png
Normal file
BIN
web/src/assets/fileimg/ppt.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 312 B |
BIN
web/src/assets/fileimg/text_line.png
Normal file
BIN
web/src/assets/fileimg/text_line.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 307 B |
BIN
web/src/assets/fileimg/wenjianjia.png
Normal file
BIN
web/src/assets/fileimg/wenjianjia.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 298 B |
BIN
web/src/assets/fileimg/word.png
Normal file
BIN
web/src/assets/fileimg/word.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 446 B |
BIN
web/src/assets/fileimg/zip.png
Normal file
BIN
web/src/assets/fileimg/zip.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 419 B |
BIN
web/src/assets/images/addNew.png
Normal file
BIN
web/src/assets/images/addNew.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 617 B |
BIN
web/src/assets/project/chong.png
Normal file
BIN
web/src/assets/project/chong.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 258 B |
BIN
web/src/assets/project/gai.png
Normal file
BIN
web/src/assets/project/gai.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 333 B |
@ -1,18 +1,17 @@
|
||||
<template>
|
||||
<div class="zfile-file-upload-body">
|
||||
<el-dialog v-if="visible" v-model="visible" :destroy-on-close="true" @close="closeDialog"
|
||||
:title="uploadMode === 'file' ? '上传文件' : '上传文件夹'" draggable top="5vh" width="70%">
|
||||
|
||||
<el-upload drag :http-request="beforeUpload" ref="uploadRef" :show-file-list="false" multiple >
|
||||
<img style="margin: auto;" src="@/assets/images/wendang.png" alt="">
|
||||
<div class="el-upload__text text-gray-400">
|
||||
<span v-show="uploadMode === 'file'">
|
||||
拖拽文件到这里或<em> 点击上传</em>, 上传至 <em>{{ currentPath }}</em>
|
||||
<span >
|
||||
拖拽文件到这里或<em> 点击上传</em>, 上传多个或单个
|
||||
</span>
|
||||
<span v-show="uploadMode === 'folder'">
|
||||
<!-- <span >
|
||||
点击选择文件夹上传, 上传至 <em>{{ currentPath }}</em>
|
||||
<br>
|
||||
<span class="text-gray-400">（此处不支持拖拽文件夹，只支持点击选择文件夹）</span>
|
||||
</span>
|
||||
</span> -->
|
||||
</div>
|
||||
</el-upload>
|
||||
<div class="mt-5 space-y-2.5">
|
||||
@ -88,7 +87,7 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-dialog>
|
||||
|
||||
|
||||
<!-- 文件拖拽提示框-->
|
||||
<div ref="dropBoxRef" id="dropBox" class="drop-view" v-if="storageConfigStore.permission.upload"
|
||||
@ -167,6 +166,7 @@ batchDeleteReq(JSON.stringify(parmas)).then((res)=>{
|
||||
|
||||
<style scoped lang="scss">
|
||||
.zfile-file-upload-body {
|
||||
width:100%;
|
||||
:deep(.el-dialog__header) {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
@ -5,7 +5,7 @@
|
||||
<script setup>
|
||||
import APlayer from "aplayer"; // 引入音乐插件
|
||||
import "APlayer/dist/APlayer.min.css";
|
||||
import { ref,computed, watch } from "vue";
|
||||
import { ref, computed, watch, onBeforeUnmount } from "vue";
|
||||
import { useRoute } from 'vue-router';
|
||||
import useFileDataStore from "@/components/file/stores/file-data";
|
||||
|
||||
@ -47,9 +47,17 @@ let initAudio = (data, index) => {
|
||||
if (data.length === 0) {
|
||||
return;
|
||||
}
|
||||
const initButton = () => {
|
||||
setTimeout(() => {
|
||||
createCloseButton();
|
||||
// 监听窗口变化重新定位
|
||||
window.addEventListener('resize', createCloseButton);
|
||||
}, 500); // 延长等待时间确保DOM渲染完成
|
||||
};
|
||||
|
||||
// 如果已经初始化过，则直接切换播放列表
|
||||
if (ap) {
|
||||
|
||||
// 如果当前播放列表和之前一样，则不重新修改播放列表
|
||||
if (currPath !== route.params.fullpath) {
|
||||
ap.list.clear();
|
||||
@ -58,6 +66,7 @@ let initAudio = (data, index) => {
|
||||
currPath = route.params.fullpath
|
||||
ap.list.switch(index);
|
||||
ap.play();
|
||||
initButton();
|
||||
} else {
|
||||
// 创建一个音乐播放器实例，并挂载到 DOM 上，同时进行相关配置
|
||||
const el = document.getElementById("aplayer");
|
||||
@ -77,12 +86,82 @@ let initAudio = (data, index) => {
|
||||
el.getElementsByClassName('aplayer-icon-lrc')[0].style.display = 'none';
|
||||
ap.play();
|
||||
currPath = route.params.fullpath
|
||||
ap.on('loadeddata', initButton);
|
||||
}
|
||||
};
|
||||
// 关闭按钮相关逻辑
|
||||
let closeBtn = null;
|
||||
|
||||
const createCloseButton = () => {
|
||||
// 关键修改：定位到控制栏容器
|
||||
const controller = document.querySelector('.aplayer-controller');
|
||||
if (!controller) return;
|
||||
|
||||
// 移除已存在的按钮
|
||||
if (closeBtn) {
|
||||
closeBtn.removeEventListener('click', handleClose);
|
||||
closeBtn.remove();
|
||||
}
|
||||
|
||||
// 创建新按钮
|
||||
closeBtn = document.createElement('button');
|
||||
closeBtn.className = 'aplayer-close-btn';
|
||||
closeBtn.innerHTML = '×';
|
||||
closeBtn.style.cssText = `
|
||||
position: absolute;
|
||||
right: -5px;
|
||||
top:-40px;
|
||||
transform: translateY(-50%);
|
||||
z-index: 1001;
|
||||
background: none;
|
||||
border: none;
|
||||
color: #666;
|
||||
font-size: 24px;
|
||||
cursor: pointer;
|
||||
transition: color 0.3s;
|
||||
`;
|
||||
|
||||
// 插入到控制栏
|
||||
controller.appendChild(closeBtn);
|
||||
closeBtn.addEventListener('click', handleClose);
|
||||
};
|
||||
onBeforeUnmount(() => {
|
||||
if (closeBtn) {
|
||||
closeBtn.removeEventListener('click', handleClose);
|
||||
closeBtn.remove();
|
||||
}
|
||||
});
|
||||
const handleClose = () => {
|
||||
if (ap) {
|
||||
ap.pause();
|
||||
ap.destroy();
|
||||
ap = null;
|
||||
}
|
||||
if (closeBtn) {
|
||||
closeBtn.removeEventListener('click', handleClose);
|
||||
closeBtn.remove();
|
||||
closeBtn = null;
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
#aplayer {
|
||||
position: relative !important;
|
||||
z-index: 99999;
|
||||
}
|
||||
|
||||
/* 覆盖APlayer默认样式 */
|
||||
::v-deep .aplayer-body {
|
||||
position: relative;
|
||||
}
|
||||
::v-deep .aplayer-controller {
|
||||
position: relative !important;
|
||||
height: 40px; /* 显式设置控制栏高度 */
|
||||
}
|
||||
|
||||
/* 修复fixed模式下的层级 */
|
||||
::v-deep .aplayer.aplayer-fixed {
|
||||
z-index: 99999 !important;
|
||||
}
|
||||
</style>
|
||||
@ -1,89 +1,6 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="artplayer-app"></div>
|
||||
<div class="zfile-video-switch-tools" v-if="currentVideo && common.isMobile.value">
|
||||
<!-- <el-button :disabled="!getPrevAndNextVideo(currentVideo.name).prev" :icon="IconPrev" @click="playPrevVideo">上一个视频</el-button>
|
||||
<el-button :disabled="!getPrevAndNextVideo(currentVideo.name).next" :icon="IconNext" @click="playNextVideo">下一个视频</el-button> -->
|
||||
</div>
|
||||
<div class="zfile-video-tools" :class="hiddenTools ? 'hidden-important' : ''">
|
||||
<template v-if="storageConfigStore.permission.download">
|
||||
<div class="zfile-video-tools-item" @click="openTarget('download')">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
直接下载
|
||||
</template>
|
||||
<img src="../../../assets/image/video-download.png" alt="下载">
|
||||
</el-tooltip>
|
||||
</div>
|
||||
<div class="zfile-video-tools-item" @click="openTarget('thunder')">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
使用迅雷下载
|
||||
</template>
|
||||
<img src="../../../assets/image/video-thunder.png" alt="迅雷">
|
||||
</el-tooltip>
|
||||
</div>
|
||||
<div class="zfile-video-tools-item" @click="openTarget('motrix')">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
使用 motrix 下载
|
||||
</template>
|
||||
<img src="../../../assets/image/video-motrix.png" alt="motrix">
|
||||
</el-tooltip>
|
||||
</div>
|
||||
</template>
|
||||
<div class="zfile-video-tools-item" @click="openTarget('potplayer')">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
使用 PotPlayer 播放
|
||||
</template>
|
||||
<img src="../../../assets/image/video-potplayer.png" alt="PotPlayer">
|
||||
</el-tooltip>
|
||||
</div>
|
||||
<div class="zfile-video-tools-item" @click="openTarget('iina')">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
使用 IINA 播放
|
||||
</template>
|
||||
<img src="../../../assets/image/video-iina.png" alt="IINA">
|
||||
</el-tooltip>
|
||||
</div>
|
||||
<div class="zfile-video-tools-item" @click="openTarget('vlc')">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
使用 VLC 播放
|
||||
</template>
|
||||
<img src="../../../assets/image/video-vlc.png" alt="VLC">
|
||||
</el-tooltip>
|
||||
</div>
|
||||
<div class="zfile-video-tools-item" @click="openTarget('nplayer')">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
使用 nPlayer 播放
|
||||
</template>
|
||||
<img src="../../../assets/image/video-nplayer.png" alt="nPlayer">
|
||||
</el-tooltip>
|
||||
</div>
|
||||
<div class="zfile-video-tools-item" @click="openTarget('mxplayer')">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
使用 MXPlayer(Free) 播放
|
||||
</template>
|
||||
<img src="../../../assets/image/video-mxplayer.png" alt="MXPlayer(Free)">
|
||||
</el-tooltip>
|
||||
</div>
|
||||
<div class="zfile-video-tools-item" @click="openTarget('mxplayer-pro')">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
使用 MXPlayer(Pro) 播放
|
||||
</template>
|
||||
<img src="../../../assets/image/video-mxplayer-pro.png" alt="MXPlayer(Pro)">
|
||||
</el-tooltip>
|
||||
</div>
|
||||
</div>
|
||||
<div class="zfile-video-tools-tips" :class="hiddenTools ? 'hidden-important' : ''">
|
||||
tips: 可点击上方的软件图标进行下载播放, 本地播放器解码效果更佳.
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -297,7 +214,7 @@ const initArtPlayer = async (name, url) => {
|
||||
fastForward: true,
|
||||
autoOrientation: true,
|
||||
aspectRatio: true,
|
||||
fullscreenWeb: true,
|
||||
// fullscreenWeb: true,
|
||||
theme: '#23ade5',
|
||||
lock: true,
|
||||
subtitleOffset: true,
|
||||
@ -380,44 +297,44 @@ const initArtPlayer = async (name, url) => {
|
||||
return nextState;
|
||||
},
|
||||
},
|
||||
{
|
||||
html: '自动播放下一个视频',
|
||||
tooltip: autoPlayNextVideo.value ? '开启' : '关闭',
|
||||
icon: '<img width="22" heigth="22" src="data:image/svg+xml;base64,Cjxzdmcgdmlld0JveD0iMCAwIDgwIDgwIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj48ZGVmcz48cGF0aCBpZD0icGlkLTY0LXN2Z28tYSIgZD0iTTAgMGg4MHY4MEgweiI+PC9wYXRoPjxwYXRoIGQ9Ik01Mi41NDYgOC4wMTRhMy45OTggMy45OTggMCAwMTQuMjIyIDMuMDc3Yy4xMDQuNDQ2LjA5My44MDguMDM5IDEuMTM4YTIuNzQgMi43NCAwIDAxLS4zMTIuODgxYy0uMDczLjEzMi0uMTYuMjU0LS4yNDYuMzc2bC0uMjU3LjM2Ni0uNTIxLjczYy0uNy45NjktMS40MTUgMS45MjYtMi4xNTQgMi44NjZsLS4wMTUuMDJhMjQwLjk0NSAyNDAuOTQ1IDAgMDE1Ljk4Ni4zNDFsMS42NDMuMTIzLjgyMi4wNjYuNDEuMDM0LjIwNi4wMTguMTAzLjAwOC4xMTUuMDEyYzEuMjY2LjExNiAyLjUxNi40NSAzLjY3Ny45NzVhMTEuNjYzIDExLjY2MyAwIDAxMy4xNjYgMi4xMTRjLjkzMS44NyAxLjcxOSAxLjg5NSAyLjMyMSAzLjAyMmExMS41OTUgMTEuNTk1IDAgMDExLjIyNCAzLjYxM2MuMDMuMTU3LjA0Ni4zMTYuMDY4LjQ3NGwuMDE1LjExOS4wMTMuMTEyLjAyMi4yMDYuMDg1LjgyMi4xNTkgMS42NDZjLjEgMS4wOTguMTkgMi4xOTguMjcgMy4yOTguMzE1IDQuNC40NjMgOC44MjkuMzYgMTMuMjU1YTE2Ni40ODkgMTY2LjQ4OSAwIDAxLS44NDMgMTMuMjEzYy0uMDEyLjEyNy0uMDM0LjI5Ny0uMDUzLjQ1NGE3LjU4OSA3LjU4OSAwIDAxLS4wNzIuNDc1bC0uMDQuMjM3LS4wNS4yMzZhMTEuNzYyIDExLjc2MiAwIDAxLS43NCAyLjI4NyAxMS43NTUgMTEuNzU1IDAgMDEtNS4xMTggNS41NyAxMS43MDUgMTEuNzA1IDAgMDEtMy42MjMgMS4yNjNjLS4xNTguMDI0LS4zMTYuMDUyLS40NzUuMDcybC0uNDc3LjA1My0uODIxLjA3MS0xLjY0NC4xMzRjLTEuMDk2LjA4Ni0yLjE5Mi4xNi0zLjI4OC4yM2EyNjAuMDggMjYwLjA4IDAgMDEtNi41NzguMzI1Yy04Ljc3Mi4zMjQtMTcuNTQ2LjIyLTI2LjMxMy0uMzAyYTI0Mi40NTggMjQyLjQ1OCAwIDAxLTMuMjg3LS4yMmwtMS42NDMtLjEyOS0uODIyLS4wNjktLjQxLS4wMzUtLjIwNi0uMDE4Yy0uMDY4LS4wMDYtLjEzMy0uMDEtLjIxOC0uMDJhMTEuNTY2IDExLjU2NiAwIDAxLTMuNy0uOTkyIDExLjczMiAxMS43MzIgMCAwMS01LjQ5Ny01LjE3OCAxMS43MyAxMS43MyAwIDAxLTEuMjE1LTMuNjI3Yy0uMDI0LS4xNTgtLjA1MS0uMzE2LS4wNjctLjQ3NWwtLjAyNi0uMjM4LS4wMTMtLjExOS0uMDEtLjEwMy0uMDctLjgyMy0uMTMyLTEuNjQ4YTE5MC42MzcgMTkwLjYzNyAwIDAxLS4yMi0zLjI5OGMtLjI1Ni00LjM5OS0uMzU4LTguODE3LS4yNTgtMTMuMjMzLjA5OS00LjQxMi4zNzItOC44MTEuNzg4LTEzLjE5N2ExMS42NSAxMS42NSAwIDAxMy4wMzktNi44MzUgMTEuNTg1IDExLjU4NSAwIDAxNi41NzItMy41NjNjLjE1Ny0uMDIzLjMxMi0uMDUxLjQ3LS4wN2wuNDctLjA1LjgyLS4wNyAxLjY0My0uMTNhMjI4LjQ5MyAyMjguNDkzIDAgMDE2LjY0Ny0uNDA1bC0uMDQxLS4wNWE4OC4xNDUgODguMTQ1IDAgMDEtMi4xNTQtMi44NjdsLS41Mi0uNzMtLjI1OC0uMzY2Yy0uMDg2LS4xMjItLjE3My0uMjQ0LS4yNDYtLjM3NmEyLjc0IDIuNzQgMCAwMS0uMzEyLS44ODEgMi44MDggMi44MDggMCAwMS4wNC0xLjEzOCAzLjk5OCAzLjk5OCAwIDAxNC4yMi0zLjA3NyAyLjggMi44IDAgMDExLjA5My4zMTNjLjI5NC4xNTUuNTM4LjM0Ny43NDIuNTY4LjEwMi4xMS4xOS4yMy4yOC4zNWwuMjcuMzU5LjUzMi43MmE4OC4wNTkgODguMDU5IDAgMDEyLjA2IDIuOTM2IDczLjAzNiA3My4wMzYgMCAwMTEuOTI5IDMuMDNjLjE4Ny4zMTMuMzczLjYyOC41NTYuOTQ1IDIuNzI0LS4wNDcgNS40NDctLjA1NiA4LjE3LS4wMzguNzQ4LjAwNiAxLjQ5Ni4wMTUgMi4yNDQuMDI2LjE4LS4zMTMuMzY0LS42MjQuNTQ5LS45MzRhNzMuMjgxIDczLjI4MSAwIDAxMS45My0zLjAzIDg4LjczNyA4OC43MzcgMCAwMTIuMDU5LTIuOTM1bC41MzMtLjcyLjI2OC0uMzU5Yy4wOS0uMTIuMTc5LS4yNC4yODEtLjM1YTIuOCAyLjggMCAwMTEuODM0LS44ODF6TTMwLjEzIDM0LjYzMWE0IDQgMCAwMC0uNDE4IDEuNDIgOTEuMTU3IDkxLjE1NyAwIDAwLS40NDYgOS4xMjhjMCAyLjgyOC4xMjEgNS42NTYuMzY0IDguNDgzbC4xMSAxLjIxMmE0IDQgMCAwMDUuODU4IDMuMTQzYzIuODItMS40OTggNS41NS0zLjAzMyA4LjE5My00LjYwNmExNzcuNDEgMTc3LjQxIDAgMDA1Ljg5Ni0zLjY2NmwxLjQzNC0uOTQyYTQgNCAwIDAwLjA0Ny02LjYzMiAxMzcuNzAzIDEzNy43MDMgMCAwMC03LjM3Ny00LjcwOCAxNDYuODggMTQ2Ljg4IDAgMDAtNi44NzktMy44NDlsLTEuNC0uNzI1YTQgNCAwIDAwLTUuMzgyIDEuNzQyeiIgaWQ9InBpZC02NC1zdmdvLWQiPjwvcGF0aD48ZmlsdGVyIHg9Ii0xNS40JSIgeT0iLTE2LjMlIiB3aWR0aD0iMTMwLjklIiBoZWlnaHQ9IjEzMi41JSIgZmlsdGVyVW5pdHM9Im9iamVjdEJvdW5kaW5nQm94IiBpZD0icGlkLTY0LXN2Z28tYyI+PGZlT2Zmc2V0IGR5PSIyIiBpbj0iU291cmNlQWxwaGEiIHJlc3VsdD0ic2hhZG93T2Zmc2V0T3V0ZXIxIj48L2ZlT2Zmc2V0PjxmZUdhdXNzaWFuQmx1ciBzdGREZXZpYXRpb249IjEiIGluPSJzaGFkb3dPZmZzZXRPdXRlcjEiIHJlc3VsdD0ic2hhZG93Qmx1ck91dGVyMSI+PC9mZUdhdXNzaWFuQmx1cj48ZmVDb2xvck1hdHJpeCB2YWx1ZXM9IjAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAuMyAwIiBpbj0ic2hhZG93Qmx1ck91dGVyMSIgcmVzdWx0PSJzaGFkb3dNYXRyaXhPdXRlcjEiPjwvZmVDb2xvck1hdHJpeD48ZmVPZmZzZXQgaW49IlNvdXJjZUFscGhhIiByZXN1bHQ9InNoYWRvd09mZnNldE91dGVyMiI+PC9mZU9mZnNldD48ZmVHYXVzc2lhbkJsdXIgc3RkRGV2aWF0aW9uPSIzLjUiIGluPSJzaGFkb3dPZmZzZXRPdXRlcjIiIHJlc3VsdD0ic2hhZG93Qmx1ck91dGVyMiI+PC9mZUdhdXNzaWFuQmx1cj48ZmVDb2xvck1hdHJpeCB2YWx1ZXM9IjAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAuMiAwIiBpbj0ic2hhZG93Qmx1ck91dGVyMiIgcmVzdWx0PSJzaGFkb3dNYXRyaXhPdXRlcjIiPjwvZmVDb2xvck1hdHJpeD48ZmVNZXJnZT48ZmVNZXJnZU5vZGUgaW49InNoYWRvd01hdHJpeE91dGVyMSI+PC9mZU1lcmdlTm9kZT48ZmVNZXJnZU5vZGUgaW49InNoYWRvd01hdHJpeE91dGVyMiI+PC9mZU1lcmdlTm9kZT48L2ZlTWVyZ2U+PC9maWx0ZXI+PC9kZWZzPjxnIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCIgb3BhY2l0eT0iLjgiPjxtYXNrIGlkPSJwaWQtNjQtc3Znby1iIiBmaWxsPSIjZmZmIj48dXNlIHhsaW5rOmhyZWY9IiNwaWQtNjQtc3Znby1hIj48L3VzZT48L21hc2s+PGcgbWFzaz0idXJsKCNwaWQtNjQtc3Znby1iKSI+PHVzZSBmaWxsPSIjMDAwIiBmaWx0ZXI9InVybCgjcGlkLTY0LXN2Z28tYykiIHhsaW5rOmhyZWY9IiNwaWQtNjQtc3Znby1kIj48L3VzZT48dXNlIGZpbGw9IiNGRkYiIHhsaW5rOmhyZWY9IiNwaWQtNjQtc3Znby1kIj48L3VzZT48L2c+PC9nPjwvc3ZnPg==">',
|
||||
switch: autoPlayNextVideo.value,
|
||||
onSwitch: function(item, $dom, event) {
|
||||
const nextState = !item.switch;
|
||||
// {
|
||||
// html: '自动播放下一个视频',
|
||||
// tooltip: autoPlayNextVideo.value ? '开启' : '关闭',
|
||||
// icon: '<img width="22" heigth="22" src="data:image/svg+xml;base64,Cjxzdmcgdmlld0JveD0iMCAwIDgwIDgwIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj48ZGVmcz48cGF0aCBpZD0icGlkLTY0LXN2Z28tYSIgZD0iTTAgMGg4MHY4MEgweiI+PC9wYXRoPjxwYXRoIGQ9Ik01Mi41NDYgOC4wMTRhMy45OTggMy45OTggMCAwMTQuMjIyIDMuMDc3Yy4xMDQuNDQ2LjA5My44MDguMDM5IDEuMTM4YTIuNzQgMi43NCAwIDAxLS4zMTIuODgxYy0uMDczLjEzMi0uMTYuMjU0LS4yNDYuMzc2bC0uMjU3LjM2Ni0uNTIxLjczYy0uNy45NjktMS40MTUgMS45MjYtMi4xNTQgMi44NjZsLS4wMTUuMDJhMjQwLjk0NSAyNDAuOTQ1IDAgMDE1Ljk4Ni4zNDFsMS42NDMuMTIzLjgyMi4wNjYuNDEuMDM0LjIwNi4wMTguMTAzLjAwOC4xMTUuMDEyYzEuMjY2LjExNiAyLjUxNi40NSAzLjY3Ny45NzVhMTEuNjYzIDExLjY2MyAwIDAxMy4xNjYgMi4xMTRjLjkzMS44NyAxLjcxOSAxLjg5NSAyLjMyMSAzLjAyMmExMS41OTUgMTEuNTk1IDAgMDExLjIyNCAzLjYxM2MuMDMuMTU3LjA0Ni4zMTYuMDY4LjQ3NGwuMDE1LjExOS4wMTMuMTEyLjAyMi4yMDYuMDg1LjgyMi4xNTkgMS42NDZjLjEgMS4wOTguMTkgMi4xOTguMjcgMy4yOTguMzE1IDQuNC40NjMgOC44MjkuMzYgMTMuMjU1YTE2Ni40ODkgMTY2LjQ4OSAwIDAxLS44NDMgMTMuMjEzYy0uMDEyLjEyNy0uMDM0LjI5Ny0uMDUzLjQ1NGE3LjU4OSA3LjU4OSAwIDAxLS4wNzIuNDc1bC0uMDQuMjM3LS4wNS4yMzZhMTEuNzYyIDExLjc2MiAwIDAxLS43NCAyLjI4NyAxMS43NTUgMTEuNzU1IDAgMDEtNS4xMTggNS41NyAxMS43MDUgMTEuNzA1IDAgMDEtMy42MjMgMS4yNjNjLS4xNTguMDI0LS4zMTYuMDUyLS40NzUuMDcybC0uNDc3LjA1My0uODIxLjA3MS0xLjY0NC4xMzRjLTEuMDk2LjA4Ni0yLjE5Mi4xNi0zLjI4OC4yM2EyNjAuMDggMjYwLjA4IDAgMDEtNi41NzguMzI1Yy04Ljc3Mi4zMjQtMTcuNTQ2LjIyLTI2LjMxMy0uMzAyYTI0Mi40NTggMjQyLjQ1OCAwIDAxLTMuMjg3LS4yMmwtMS42NDMtLjEyOS0uODIyLS4wNjktLjQxLS4wMzUtLjIwNi0uMDE4Yy0uMDY4LS4wMDYtLjEzMy0uMDEtLjIxOC0uMDJhMTEuNTY2IDExLjU2NiAwIDAxLTMuNy0uOTkyIDExLjczMiAxMS43MzIgMCAwMS01LjQ5Ny01LjE3OCAxMS43MyAxMS43MyAwIDAxLTEuMjE1LTMuNjI3Yy0uMDI0LS4xNTgtLjA1MS0uMzE2LS4wNjctLjQ3NWwtLjAyNi0uMjM4LS4wMTMtLjExOS0uMDEtLjEwMy0uMDctLjgyMy0uMTMyLTEuNjQ4YTE5MC42MzcgMTkwLjYzNyAwIDAxLS4yMi0zLjI5OGMtLjI1Ni00LjM5OS0uMzU4LTguODE3LS4yNTgtMTMuMjMzLjA5OS00LjQxMi4zNzItOC44MTEuNzg4LTEzLjE5N2ExMS42NSAxMS42NSAwIDAxMy4wMzktNi44MzUgMTEuNTg1IDExLjU4NSAwIDAxNi41NzItMy41NjNjLjE1Ny0uMDIzLjMxMi0uMDUxLjQ3LS4wN2wuNDctLjA1LjgyLS4wNyAxLjY0My0uMTNhMjI4LjQ5MyAyMjguNDkzIDAgMDE2LjY0Ny0uNDA1bC0uMDQxLS4wNWE4OC4xNDUgODguMTQ1IDAgMDEtMi4xNTQtMi44NjdsLS41Mi0uNzMtLjI1OC0uMzY2Yy0uMDg2LS4xMjItLjE3My0uMjQ0LS4yNDYtLjM3NmEyLjc0IDIuNzQgMCAwMS0uMzEyLS44ODEgMi44MDggMi44MDggMCAwMS4wNC0xLjEzOCAzLjk5OCAzLjk5OCAwIDAxNC4yMi0zLjA3NyAyLjggMi44IDAgMDExLjA5My4zMTNjLjI5NC4xNTUuNTM4LjM0Ny43NDIuNTY4LjEwMi4xMS4xOS4yMy4yOC4zNWwuMjcuMzU5LjUzMi43MmE4OC4wNTkgODguMDU5IDAgMDEyLjA2IDIuOTM2IDczLjAzNiA3My4wMzYgMCAwMTEuOTI5IDMuMDNjLjE4Ny4zMTMuMzczLjYyOC41NTYuOTQ1IDIuNzI0LS4wNDcgNS40NDctLjA1NiA4LjE3LS4wMzguNzQ4LjAwNiAxLjQ5Ni4wMTUgMi4yNDQuMDI2LjE4LS4zMTMuMzY0LS42MjQuNTQ5LS45MzRhNzMuMjgxIDczLjI4MSAwIDAxMS45My0zLjAzIDg4LjczNyA4OC43MzcgMCAwMTIuMDU5LTIuOTM1bC41MzMtLjcyLjI2OC0uMzU5Yy4wOS0uMTIuMTc5LS4yNC4yODEtLjM1YTIuOCAyLjggMCAwMTEuODM0LS44ODF6TTMwLjEzIDM0LjYzMWE0IDQgMCAwMC0uNDE4IDEuNDIgOTEuMTU3IDkxLjE1NyAwIDAwLS40NDYgOS4xMjhjMCAyLjgyOC4xMjEgNS42NTYuMzY0IDguNDgzbC4xMSAxLjIxMmE0IDQgMCAwMDUuODU4IDMuMTQzYzIuODItMS40OTggNS41NS0zLjAzMyA4LjE5My00LjYwNmExNzcuNDEgMTc3LjQxIDAgMDA1Ljg5Ni0zLjY2NmwxLjQzNC0uOTQyYTQgNCAwIDAwLjA0Ny02LjYzMiAxMzcuNzAzIDEzNy43MDMgMCAwMC03LjM3Ny00LjcwOCAxNDYuODggMTQ2Ljg4IDAgMDAtNi44NzktMy44NDlsLTEuNC0uNzI1YTQgNCAwIDAwLTUuMzgyIDEuNzQyeiIgaWQ9InBpZC02NC1zdmdvLWQiPjwvcGF0aD48ZmlsdGVyIHg9Ii0xNS40JSIgeT0iLTE2LjMlIiB3aWR0aD0iMTMwLjklIiBoZWlnaHQ9IjEzMi41JSIgZmlsdGVyVW5pdHM9Im9iamVjdEJvdW5kaW5nQm94IiBpZD0icGlkLTY0LXN2Z28tYyI+PGZlT2Zmc2V0IGR5PSIyIiBpbj0iU291cmNlQWxwaGEiIHJlc3VsdD0ic2hhZG93T2Zmc2V0T3V0ZXIxIj48L2ZlT2Zmc2V0PjxmZUdhdXNzaWFuQmx1ciBzdGREZXZpYXRpb249IjEiIGluPSJzaGFkb3dPZmZzZXRPdXRlcjEiIHJlc3VsdD0ic2hhZG93Qmx1ck91dGVyMSI+PC9mZUdhdXNzaWFuQmx1cj48ZmVDb2xvck1hdHJpeCB2YWx1ZXM9IjAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAuMyAwIiBpbj0ic2hhZG93Qmx1ck91dGVyMSIgcmVzdWx0PSJzaGFkb3dNYXRyaXhPdXRlcjEiPjwvZmVDb2xvck1hdHJpeD48ZmVPZmZzZXQgaW49IlNvdXJjZUFscGhhIiByZXN1bHQ9InNoYWRvd09mZnNldE91dGVyMiI+PC9mZU9mZnNldD48ZmVHYXVzc2lhbkJsdXIgc3RkRGV2aWF0aW9uPSIzLjUiIGluPSJzaGFkb3dPZmZzZXRPdXRlcjIiIHJlc3VsdD0ic2hhZG93Qmx1ck91dGVyMiI+PC9mZUdhdXNzaWFuQmx1cj48ZmVDb2xvck1hdHJpeCB2YWx1ZXM9IjAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAuMiAwIiBpbj0ic2hhZG93Qmx1ck91dGVyMiIgcmVzdWx0PSJzaGFkb3dNYXRyaXhPdXRlcjIiPjwvZmVDb2xvck1hdHJpeD48ZmVNZXJnZT48ZmVNZXJnZU5vZGUgaW49InNoYWRvd01hdHJpeE91dGVyMSI+PC9mZU1lcmdlTm9kZT48ZmVNZXJnZU5vZGUgaW49InNoYWRvd01hdHJpeE91dGVyMiI+PC9mZU1lcmdlTm9kZT48L2ZlTWVyZ2U+PC9maWx0ZXI+PC9kZWZzPjxnIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCIgb3BhY2l0eT0iLjgiPjxtYXNrIGlkPSJwaWQtNjQtc3Znby1iIiBmaWxsPSIjZmZmIj48dXNlIHhsaW5rOmhyZWY9IiNwaWQtNjQtc3Znby1hIj48L3VzZT48L21hc2s+PGcgbWFzaz0idXJsKCNwaWQtNjQtc3Znby1iKSI+PHVzZSBmaWxsPSIjMDAwIiBmaWx0ZXI9InVybCgjcGlkLTY0LXN2Z28tYykiIHhsaW5rOmhyZWY9IiNwaWQtNjQtc3Znby1kIj48L3VzZT48dXNlIGZpbGw9IiNGRkYiIHhsaW5rOmhyZWY9IiNwaWQtNjQtc3Znby1kIj48L3VzZT48L2c+PC9nPjwvc3ZnPg==">',
|
||||
// switch: autoPlayNextVideo.value,
|
||||
// onSwitch: function(item, $dom, event) {
|
||||
// const nextState = !item.switch;
|
||||
|
||||
autoPlayNextVideo.value = nextState;
|
||||
// autoPlayNextVideo.value = nextState;
|
||||
|
||||
// 改变提示文本
|
||||
item.tooltip = nextState ? '开启' : '关闭';
|
||||
// // 改变提示文本
|
||||
// item.tooltip = nextState ? '开启' : '关闭';
|
||||
|
||||
// 改变按钮状态
|
||||
return nextState;
|
||||
},
|
||||
}
|
||||
// // 改变按钮状态
|
||||
// return nextState;
|
||||
// },
|
||||
// }
|
||||
],
|
||||
controls: [
|
||||
{
|
||||
position: 'right',
|
||||
html: hiddenTools.value ? hiddenIcon : notHiddenIcon,
|
||||
click: function (_, event) {
|
||||
hiddenTools.value = !hiddenTools.value;
|
||||
event.target.parentNode.parentNode.innerHTML = (hiddenTools.value ? hiddenIcon : notHiddenIcon);
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'video-list',
|
||||
position: 'right',
|
||||
html: videoListIcon,
|
||||
selector: getVideoList(name),
|
||||
onSelect: function(item, $dom) {
|
||||
initArtPlayer(item.html, item.url);
|
||||
return videoListIcon;
|
||||
},
|
||||
}
|
||||
]
|
||||
// controls: [
|
||||
// {
|
||||
// position: 'right',
|
||||
// html: hiddenTools.value ? hiddenIcon : notHiddenIcon,
|
||||
// click: function (_, event) {
|
||||
// hiddenTools.value = !hiddenTools.value;
|
||||
// event.target.parentNode.parentNode.innerHTML = (hiddenTools.value ? hiddenIcon : notHiddenIcon);
|
||||
// },
|
||||
// },
|
||||
// {
|
||||
// name: 'video-list',
|
||||
// position: 'right',
|
||||
// html: videoListIcon,
|
||||
// selector: getVideoList(name),
|
||||
// onSelect: function(item, $dom) {
|
||||
// initArtPlayer(item.html, item.url);
|
||||
// return videoListIcon;
|
||||
// },
|
||||
// }
|
||||
// ]
|
||||
};
|
||||
|
||||
let subtitles = getSubtitles(name);
|
||||
|
||||
@ -11,6 +11,7 @@
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {onMounted} from "vue";
|
||||
onMounted(() => {
|
||||
document.querySelector(".el-dialog .el-dialog__title").innerHTML = '加载中...';
|
||||
})
|
||||
|
||||
@ -6,7 +6,7 @@ export default {
|
||||
},
|
||||
// 登录页面国际化
|
||||
login: {
|
||||
title: '明眸眼健康智慧管理系统',
|
||||
title: '文档与数据管理系统',
|
||||
username: '用户名',
|
||||
rulesUsername: '请输入用户名',
|
||||
password: '密码',
|
||||
|
||||
@ -31,6 +31,9 @@
|
||||
<div v-if="props.type === 'bin'" v-loading="loading" class="hex-container">
|
||||
<pre>{{ hexContent }}</pre>
|
||||
</div>
|
||||
<div v-if="props.type === 'pptx'" v-loading="loading" class="ppt-container">
|
||||
<div ref="pptViewer" class="ppt-viewer"></div>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
@ -215,6 +218,35 @@ function init(type) {
|
||||
loading.value = false;
|
||||
// 处理错误
|
||||
});
|
||||
} else if (type === "pptx") {
|
||||
loading.value = true;
|
||||
(async () => { // 添加async立即执行函数
|
||||
try {
|
||||
const response = await axios({
|
||||
method: "GET",
|
||||
url: props.url,
|
||||
responseType: "arraybuffer"
|
||||
});
|
||||
|
||||
const pptx = window.PPTXJS;
|
||||
pptx.verbose = false;
|
||||
|
||||
const viewer = proxy.$refs.pptViewer;
|
||||
viewer.innerHTML = '';
|
||||
|
||||
const pres = new pptx.Presentation(viewer, {
|
||||
slideNumberFormat: pptx.SlideNumberFormat.SLIDE_NUMBER,
|
||||
license: "YOUR_LICENSE_KEY"
|
||||
});
|
||||
|
||||
await pres.load(response.data);
|
||||
pres.render();
|
||||
loading.value = false;
|
||||
} catch (error) {
|
||||
console.error('PPT加载失败:', error);
|
||||
loading.value = false;
|
||||
}
|
||||
})(); // 立即执行
|
||||
}
|
||||
|
||||
dialogVisible.value = true;
|
||||
@ -387,12 +419,14 @@ html body {
|
||||
:deep(.el-loading-spinner .el-loading-text) {
|
||||
color: #079263;
|
||||
}
|
||||
|
||||
.hex-container {
|
||||
height: 600px;
|
||||
overflow: auto;
|
||||
padding: 10px;
|
||||
background: #f8f8f8;
|
||||
border: 1px solid #ddd;
|
||||
|
||||
pre {
|
||||
font-family: monospace;
|
||||
white-space: pre-wrap;
|
||||
@ -401,5 +435,50 @@ html body {
|
||||
color: #333;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
/* 添加PPT预览样式 */
|
||||
.ppt-container {
|
||||
height: 700px;
|
||||
overflow: auto;
|
||||
background: #f0f0f0;
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.ppt-viewer {
|
||||
margin: 0 auto;
|
||||
max-width: 100%;
|
||||
box-shadow: 0 2px 10px rgba(0,0,0,0.2);
|
||||
|
||||
/* 保持PPT原始比例 */
|
||||
:deep(.slide-container) {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 0;
|
||||
padding-top: 75%; /* 默认4:3比例 */
|
||||
|
||||
&.widescreen {
|
||||
padding-top: 56.25%; /* 16:9比例 */
|
||||
}
|
||||
|
||||
.slide-content {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* 适配PPT动画和布局 */
|
||||
:deep(.shape-animation) {
|
||||
animation-duration: 0.5s !important;
|
||||
}
|
||||
|
||||
:deep(.slide-number) {
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
bottom: 10px;
|
||||
font-size: 14px;
|
||||
color: #666;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -300,9 +300,9 @@ $light_gray: #eee;
|
||||
// justify-content: center;
|
||||
// -webkit-justify-content: center;
|
||||
.login-container-title{
|
||||
font-size: 36px;
|
||||
font-size: 60px;
|
||||
font-weight: 700;
|
||||
color: #000;
|
||||
color: #fff;
|
||||
margin: 0 auto;
|
||||
margin-top: 2%;
|
||||
width: 800px;
|
||||
|
||||
@ -8,6 +8,7 @@ export default {
|
||||
import { ref, onMounted, nextTick, defineAsyncComponent } from "vue";
|
||||
import { useAppStore } from '@/store/modules/app';
|
||||
import { ElMessageBox, ElMessage } from "element-plus";
|
||||
import { Search } from '@element-plus/icons-vue'
|
||||
import Page from '@/components/Pagination/page.vue';
|
||||
import AudioPlayer from '@/components/file/preview/AudioPlayer.vue';
|
||||
import { batchDeleteReq } from "@/api/file-operator";
|
||||
@ -25,7 +26,7 @@ import VideoPlayerAsyncLoading from "@/components/file/preview/VideoPlayerAsyncL
|
||||
import TextViewerAsyncLoading from "@/components/file/preview/TextViewerAsyncLoading.vue";
|
||||
import MarkdownViewerDialogAsyncLoading from "@/components/file/preview/MarkdownViewerDialogAsyncLoading.vue";
|
||||
const { dialogVideoVisible, dialogTextVisible, dialogPdfVisible, dialogOfficeVisible, dialog3dVisible } = useFilePreview();
|
||||
const { openUploadDialog, openUploadFolderDialog, uploadProgressInfoStatistics } = useFileUpload();
|
||||
const { openUploadDialog, openUploadFolderDialog, uploadProgressInfoStatistics, clearALlFinishedUploadFile } = useFileUpload();
|
||||
const { currentStorageKey } = useHeaderStorageList();
|
||||
const { openRow } = useFileData();
|
||||
onMounted(() => {
|
||||
@ -289,7 +290,16 @@ function editfile(row: any) {
|
||||
upfile.value = true
|
||||
fileObj.value = JSON.parse(JSON.stringify(row))
|
||||
}
|
||||
// 如果有上传完成的文件，关闭对话框时调用 close 方法刷新文件列表
|
||||
const emit = defineEmits([])
|
||||
const closeDialog = () => {
|
||||
let deleteCount = clearALlFinishedUploadFile();
|
||||
if (deleteCount > 0) {
|
||||
emit('close');
|
||||
}
|
||||
}
|
||||
function fileClose() {
|
||||
closeDialog()
|
||||
upfile.value = false
|
||||
let fileArr = JSON.parse(localStorage.getItem('fileArr'))
|
||||
fileArr.forEach((item: any) => {
|
||||
@ -324,6 +334,7 @@ function submitfile() {
|
||||
if (fileObj.value.id) {
|
||||
updateFiles(fileObj.value).then((res: any) => {
|
||||
if (res.code == 0) {
|
||||
closeDialog()
|
||||
ElMessage.success('修改成功')
|
||||
getdata()
|
||||
upfile.value = false
|
||||
@ -353,6 +364,7 @@ function submitfile() {
|
||||
fileObj.value.fileSize = fileSize.join(',')
|
||||
addFiles(fileObj.value).then((res: any) => {
|
||||
if (res.code == 0) {
|
||||
closeDialog()
|
||||
ElMessage.success('增加成功')
|
||||
getdata()
|
||||
upfile.value = false
|
||||
@ -546,7 +558,7 @@ const isViewfile = ref(false)
|
||||
const fileType = ref('')
|
||||
function openPreview(row: any) {
|
||||
|
||||
if (getFileExtension(row.fileName) == 'pdf' || getFileExtension(row.fileName) == 'xlsx' || getFileExtension(row.fileName) == 'docx' || getFileExtension(row.fileName) == 'doc' || getFileExtension(row.fileName) == 'bin') {
|
||||
if (getFileExtension(row.fileName) == 'pdf' || getFileExtension(row.fileName) == 'xlsx' || getFileExtension(row.fileName) == 'docx' || getFileExtension(row.fileName) == 'doc' || getFileExtension(row.fileName) == 'bin' || getFileExtension(row.fileName) == 'pptx') {
|
||||
title1.value = row.fileName
|
||||
ViewfileUrl.value = row.url
|
||||
isViewfile.value = true
|
||||
@ -616,9 +628,9 @@ function getFileSuffix(name: any) {
|
||||
</el-select>
|
||||
<div class="tree_sou">
|
||||
<el-input v-model="treeForm.nodeName" style="width:100%;margin:10px 9px 10px 0px;"
|
||||
placeholder="节点名称" clearable />
|
||||
<el-button type="primary" @click="gettreedata()">搜索</el-button>
|
||||
<el-button type="primary" @click="addSubItem({ nodeType: '00' })">新增子项目</el-button>
|
||||
placeholder="节点名称" clearable :suffix-icon="Search" @change="gettreedata()" />
|
||||
<img src="@/assets/images/addNew.png" style="cursor: pointer;" title="新增子项目"
|
||||
@click="addSubItem({ nodeType: '00' })" alt="">
|
||||
</div>
|
||||
|
||||
<el-tree ref="treeRef" node-key="id" :data="treedata" :highlight-current="true" :props="defaultProps"
|
||||
@ -627,7 +639,7 @@ function getFileSuffix(name: any) {
|
||||
style="height: calc(100vh - 280px); overflow: auto;margin-top: 10px;">
|
||||
<template #default="{ data }">
|
||||
<span class="custom-tree-node">
|
||||
<span>{{ data.nodeName }}</span>
|
||||
<span class="text">{{ data.nodeName }}</span>
|
||||
<span class="img_tree">
|
||||
<img src="@/assets/project/xiu.png" alt="" title="编辑" @click="editSubItem(data)">
|
||||
<img src="@/assets/project/del.png" alt="" title="删除" @click="delSubItem(data)">
|
||||
@ -715,13 +727,14 @@ function getFileSuffix(name: any) {
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-dialog>
|
||||
<el-dialog title="上传文件" v-model="upfile" width="35%" :before-close="fileClose" top="30px" draggable
|
||||
<el-dialog title="上传文件" v-model="upfile" width="50%" :before-close="fileClose" top="30px" draggable
|
||||
destroy-on-close>
|
||||
<el-form ref="ruleFormRef" style="max-width: 600px" :model="fileObj" :rules="moderules" label-width="auto"
|
||||
class="demo-ruleForm" status-icon>
|
||||
<el-scrollbar height="400px">
|
||||
<el-form ref="ruleFormRef" style="max-width: 100%" :model="fileObj" :rules="moderules"
|
||||
label-width="auto" class="demo-ruleForm" status-icon>
|
||||
<el-form-item v-if="!fileObj.id" label="文件:" prop="taskCode">
|
||||
<el-button @click="openUploadDialog" type="primary">上传文件</el-button>
|
||||
<el-button @click="openUploadFolderDialog" type="primary">上传文件夹</el-button>
|
||||
<!-- <el-button @click="openUploadDialog" type="primary">上传文件</el-button>
|
||||
<el-button @click="openUploadFolderDialog" type="primary">上传文件夹</el-button> -->
|
||||
<ZUpload />
|
||||
</el-form-item>
|
||||
<el-form-item v-else label="文件名称:">
|
||||
@ -740,6 +753,8 @@ function getFileSuffix(name: any) {
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-scrollbar>
|
||||
|
||||
</el-dialog>
|
||||
<!-- 组件预览 -->
|
||||
<!-- 视频播放器 -->
|
||||
@ -862,11 +877,11 @@ function getFileSuffix(name: any) {
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
font-size: 14px;
|
||||
padding-right: 8px;
|
||||
padding:8px;
|
||||
|
||||
.img_tree {
|
||||
display: flex;
|
||||
width: 25%;
|
||||
width: 20%;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
|
||||
@ -875,6 +890,7 @@ function getFileSuffix(name: any) {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.tableHover {
|
||||
cursor: pointer;
|
||||
}
|
||||
@ -883,4 +899,26 @@ function getFileSuffix(name: any) {
|
||||
color: #409eff;
|
||||
}
|
||||
|
||||
//文字换行处理
|
||||
.text {
|
||||
overflow-wrap: break-word;
|
||||
word-break: break-all;
|
||||
white-space: normal;
|
||||
// line-height: 1.5;
|
||||
max-width: 80%;
|
||||
// border: 1px solid #000;
|
||||
// padding: 10px;
|
||||
}
|
||||
|
||||
:deep() {
|
||||
.el-tree-node__content {
|
||||
height: auto !important;
|
||||
line-height: 20px !important;
|
||||
// padding-left: 10px !important;
|
||||
}
|
||||
|
||||
.el-tree-node__content>.el-tree-node__expand-icon {
|
||||
padding: 0px !important;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
789
web/src/views/testdata/datamanagement/index.vue
vendored
789
web/src/views/testdata/datamanagement/index.vue
vendored
File diff suppressed because it is too large
Load Diff
315
web/src/views/testdata/fileSynchronization/index.vue
vendored
Normal file
315
web/src/views/testdata/fileSynchronization/index.vue
vendored
Normal file
@ -0,0 +1,315 @@
|
||||
<script lang="ts">
|
||||
export default {
|
||||
name: "datamanagement",//实验数据管理
|
||||
};
|
||||
</script>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted, nextTick, defineAsyncComponent } from "vue";
|
||||
import { Search } from '@element-plus/icons-vue'
|
||||
import { ElMessageBox, ElMessage } from "element-plus";
|
||||
import { tstaskList, getTsNodesTree, tsFilesPage } from "@/api/datamanagement";
|
||||
|
||||
|
||||
//左侧树的选择框
|
||||
const projectId = ref()
|
||||
const projectArr = ref([])
|
||||
//左侧树配置
|
||||
const pathid = ref()
|
||||
const treeRef = ref();
|
||||
const treedata = ref([])
|
||||
const treeloading = ref(false)
|
||||
const defaultProps = {
|
||||
children: "children",
|
||||
label: "nodeName"
|
||||
};
|
||||
const treeForm = ref({
|
||||
taskId: '',
|
||||
nodeName: '',
|
||||
})
|
||||
//工作空间
|
||||
const props = {
|
||||
label: 'fileName',
|
||||
children: 'zones',
|
||||
}
|
||||
let count = 1
|
||||
const workloading = ref(false)
|
||||
//表格数据配置
|
||||
const queryParams: any = ref({
|
||||
current: 1,
|
||||
size: 20,
|
||||
nodeId: '',//节点ID
|
||||
taskId: '',//项目Id
|
||||
childNode: '1'
|
||||
});
|
||||
const worktree = ref(false)
|
||||
const workdata = ref([])
|
||||
const workTreeArr = ref([])
|
||||
const workId = ref()
|
||||
//获取所有项目
|
||||
function getProject() {
|
||||
tstaskList().then((res: any) => {
|
||||
projectArr.value = res.data
|
||||
projectId.value = projectArr.value[0].id
|
||||
gettreedata()
|
||||
})
|
||||
}
|
||||
//获取树数据
|
||||
function gettreedata() {
|
||||
treeloading.value = true
|
||||
treeForm.value.taskId = projectId.value
|
||||
getTsNodesTree(treeForm.value).then((res: any) => {
|
||||
treedata.value = res.data
|
||||
treeloading.value = false
|
||||
pathid.value = treedata.value[0].nodeId
|
||||
nextTick(() => {
|
||||
treeRef.value?.setCurrentKey(pathid.value);
|
||||
});
|
||||
getdata()
|
||||
})
|
||||
}
|
||||
function handleNodeClick(data: any, node: any) {
|
||||
pathid.value = data.nodeId
|
||||
getdata()
|
||||
}
|
||||
//工作空间数据处理
|
||||
const loadNode = (node: any, resolve: (data: any) => void) => {
|
||||
if (node.level === 0) {
|
||||
return resolve(workdata.value)
|
||||
}
|
||||
let hasChild = false
|
||||
console.log(node)
|
||||
if (node.data.isFile === 'FOLDER') {
|
||||
hasChild = true
|
||||
queryParams.value.id = node.data.id
|
||||
getdata()
|
||||
} else {
|
||||
hasChild = false
|
||||
}
|
||||
let data: any = []
|
||||
if (hasChild) {
|
||||
data = workTreeArr.value
|
||||
} else {
|
||||
data = []
|
||||
}
|
||||
|
||||
resolve(data)
|
||||
|
||||
}
|
||||
//工作空间树点击
|
||||
const handleCheckChange = (
|
||||
data: any,
|
||||
checked: boolean,
|
||||
indeterminate: boolean
|
||||
) => {
|
||||
console.log(data, checked, indeterminate)
|
||||
}
|
||||
//工作空间树获取
|
||||
//获取表格数据
|
||||
function getdata() {
|
||||
// workloading.value = true
|
||||
queryParams.value.nodeId = pathid.value
|
||||
queryParams.value.taskId = projectId.value
|
||||
tsFilesPage(queryParams.value).then((res: any) => {
|
||||
// workloading.value = false
|
||||
workdata.value = res.data.records
|
||||
worktree.value = true
|
||||
workTreeArr.value = workdata.value
|
||||
})
|
||||
|
||||
}
|
||||
onMounted(() => {
|
||||
getProject()
|
||||
});
|
||||
//拖动条
|
||||
const vMove = {
|
||||
mounted(el: any) {
|
||||
el.onmousedown = function (e: any) {
|
||||
var init = e.clientX;
|
||||
var parent: any = document.getElementById("silderLeft");
|
||||
const initWidth: any = parent.offsetWidth;
|
||||
document.onmousemove = function (e) {
|
||||
var end = e.clientX;
|
||||
var newWidth = end - init + initWidth;
|
||||
parent.style.width = newWidth + "px";
|
||||
};
|
||||
document.onmouseup = function () {
|
||||
document.onmousemove = document.onmouseup = null;
|
||||
};
|
||||
};
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="faulttemplate-box">
|
||||
<aside id="silderLeft">
|
||||
<div>
|
||||
<el-select v-model="projectId" placeholder="请选择项目" @change="gettreedata()">
|
||||
<el-option v-for="item in projectArr" :key="item.id" :label="item.taskName" :value="item.id" />
|
||||
</el-select>
|
||||
<div class="tree_sou">
|
||||
<el-input v-model="treeForm.nodeName" style="width:100%;margin:10px 9px 10px 0px;"
|
||||
placeholder="节点名称" clearable :suffix-icon="Search" @change="gettreedata()" />
|
||||
</div>
|
||||
|
||||
<el-tree ref="treeRef" node-key="nodeId" :data="treedata" :highlight-current="true"
|
||||
:props="defaultProps" v-loading="treeloading" @node-click="handleNodeClick"
|
||||
class="silderLeft-default" style="height: calc(100vh - 280px); overflow: auto;margin-top: 10px;">
|
||||
<template #default="{ data }">
|
||||
<span class="custom-tree-node">
|
||||
<span class="text">{{ data.nodeName }}</span>
|
||||
</span>
|
||||
</template>
|
||||
</el-tree>
|
||||
</div>
|
||||
<div class="moveBtn" v-move>
|
||||
<div class="moveBtn-line"></div>
|
||||
</div>
|
||||
</aside>
|
||||
<section class="silderRight">
|
||||
<div class="tree_button"><el-button type="primary">文件差异性对比</el-button></div>
|
||||
<div class="tree_box">
|
||||
<div class="tree_left">
|
||||
<div class="tree_title">工作空间:</div>
|
||||
<div>
|
||||
<el-tree v-if="worktree" style="max-width: 600px" :props="props" :load="loadNode" lazy
|
||||
show-checkbox v-loading="workloading" @check-change="handleCheckChange" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="tree_left"></div>
|
||||
</div>
|
||||
|
||||
</section>
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.faulttemplate-box {
|
||||
height: 100%;
|
||||
display: flex;
|
||||
display: -webkit-flex;
|
||||
background-color: #f2f4f9;
|
||||
|
||||
}
|
||||
|
||||
#silderLeft {
|
||||
width: 300px;
|
||||
padding: 10px;
|
||||
box-sizing: border-box;
|
||||
background: #fff;
|
||||
border-radius: 3px;
|
||||
position: relative;
|
||||
|
||||
.tree_sou {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
.moveBtn {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* 拖动条 */
|
||||
.moveBtn {
|
||||
height: 100%;
|
||||
width: 15px;
|
||||
padding: 0 6px;
|
||||
opacity: 0;
|
||||
position: absolute;
|
||||
right: -15px;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
.moveBtn-line {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
cursor: col-resize;
|
||||
user-select: none;
|
||||
background-color: #60bfff;
|
||||
}
|
||||
|
||||
.silderRight {
|
||||
flex: 1;
|
||||
width: 100%;
|
||||
height: calc(100vh - 130px);
|
||||
overflow: auto;
|
||||
background-color: rgba(255, 255, 255, 1);
|
||||
border-radius: 3px;
|
||||
padding: 15px;
|
||||
// padding-bottom: 0px;
|
||||
box-sizing: border-box;
|
||||
margin-left: 15px;
|
||||
|
||||
.tree_button {
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
.tree_box {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
|
||||
.tree_left {
|
||||
width: 49%;
|
||||
height: calc(78vh);
|
||||
border: 1px solid red;
|
||||
|
||||
.tree_title {
|
||||
font-size: 20px;
|
||||
font-weight: 400;
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
.custom-tree-node {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
font-size: 14px;
|
||||
padding: 5px;
|
||||
}
|
||||
|
||||
:deep() {
|
||||
.el-radio-group {
|
||||
display: block !important;
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
//文字换行处理
|
||||
.text {
|
||||
overflow-wrap: break-word;
|
||||
word-break: break-all;
|
||||
white-space: normal;
|
||||
// line-height: 1.5;
|
||||
max-width: 72%;
|
||||
// border: 1px solid #000;
|
||||
// padding: 10px;
|
||||
}
|
||||
|
||||
:deep() {
|
||||
.el-tree-node__content {
|
||||
height: auto !important;
|
||||
line-height: 20px !important;
|
||||
// padding-left: 10px !important;
|
||||
}
|
||||
|
||||
.el-tree-node__content>.el-tree-node__expand-icon {
|
||||
padding: 0px !important;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in New Issue
Block a user