zhuhao_dev #23
|
@ -8,3 +8,9 @@ export const getSmarttalkPage = (params) => {
|
|||
params
|
||||
})
|
||||
}
|
||||
export function deleteSmarttalk(id) {
|
||||
return request({
|
||||
url: '/smarttalk/file/' + id,
|
||||
method: 'delete'
|
||||
})
|
||||
}
|
||||
|
|
|
@ -0,0 +1,78 @@
|
|||
// 判断是不是昨天
|
||||
const isYestday = (date) => {
|
||||
var yesterday = new Date(new Date() - 1000 * 60 * 60 * 24)
|
||||
return (
|
||||
yesterday.getYear() === date.getYear() &&
|
||||
yesterday.getMonth() === date.getMonth() &&
|
||||
yesterday.getDate() === date.getDate()
|
||||
)
|
||||
}
|
||||
|
||||
// 判断是不是今年
|
||||
const isYear = (date) => {
|
||||
return date.getYear() === new Date().getYear()
|
||||
}
|
||||
|
||||
//将时间转为 yy/mm/dd hh:mm:ss
|
||||
const formatDateTime = (date) => {
|
||||
if (!date) {
|
||||
return ''
|
||||
}
|
||||
var dateObject = new Date(date)
|
||||
var y = dateObject.getFullYear()
|
||||
var m = dateObject.getMonth() + 1
|
||||
m = m < 10 ? '0' + m : m
|
||||
var d = dateObject.getDate()
|
||||
d = d < 10 ? '0' + d : d
|
||||
var h = dateObject.getHours()
|
||||
h = h < 10 ? '0' + h : h
|
||||
var minute = dateObject.getMinutes()
|
||||
minute = minute < 10 ? '0' + minute : minute
|
||||
var second = dateObject.getSeconds()
|
||||
second = second < 10 ? '0' + second : second
|
||||
return y + '/' + m + '/' + d + ' ' + h + ':' + minute + ':' + second
|
||||
}
|
||||
|
||||
/**
|
||||
* 将时间戳转换为文本描述。
|
||||
*
|
||||
* 此函数旨在将时间戳转换为更易读的文本格式,以便用户可以更直观地理解时间信息。
|
||||
* 通过传入的时间,函数将生成对应的时间文本,如"刚刚"、"5分钟前"、"昨天"等。
|
||||
* 如果设置了simple参数为true,则会返回更简单的23/06/25,只显示年月日,如果是今年只返回月和日。
|
||||
*
|
||||
* @param {string} timeStamp - 需要转换的时间。
|
||||
* @param {boolean} simple - 是否使用简单的格式,默认为false,如:23/06/25、06/25。
|
||||
* @returns {string} - 转换后的时间文本。
|
||||
*/
|
||||
export const toTimeText = (timeStamp, simple) => {
|
||||
if (!timeStamp) {
|
||||
return ''
|
||||
}
|
||||
var dateTime = new Date(timeStamp)
|
||||
var currentTime = Date.parse(new Date()) //当前时间
|
||||
var timeDiff = currentTime - dateTime //与当前时间误差
|
||||
var timeText = ''
|
||||
if (timeDiff <= 60000) {
|
||||
//一分钟内
|
||||
timeText = '刚刚'
|
||||
} else if (timeDiff > 60000 && timeDiff < 3600000) {
|
||||
//1小时内
|
||||
timeText = Math.floor(timeDiff / 60000) + '分钟前'
|
||||
} else if (timeDiff >= 3600000 && timeDiff < 86400000 && !isYestday(dateTime)) {
|
||||
//今日
|
||||
timeText = formatDateTime(dateTime).substr(11, 5)
|
||||
} else if (isYestday(dateTime)) {
|
||||
//昨天
|
||||
timeText = '昨天' + formatDateTime(dateTime).substr(11, 5)
|
||||
} else if (isYear(dateTime)) {
|
||||
//今年
|
||||
timeText = formatDateTime(dateTime).substr(5, simple ? 5 : 14)
|
||||
} else {
|
||||
//不属于今年
|
||||
timeText = formatDateTime(dateTime)
|
||||
if (simple) {
|
||||
timeText = timeText.substr(2, 8)
|
||||
}
|
||||
}
|
||||
return timeText
|
||||
}
|
|
@ -8,30 +8,24 @@
|
|||
<el-popover placement="top-start" :width="250" trigger="hover">
|
||||
<template #default>
|
||||
<div>
|
||||
<el-button type="success" size="small" :icon="Check" circle /> 2024-07-11 16:15
|
||||
<el-button type="success" size="small" :icon="Check" circle />
|
||||
2024-07-11 16:15
|
||||
同步成功
|
||||
</div>
|
||||
</template>
|
||||
<template #reference>
|
||||
<el-button size="small" text
|
||||
><el-icon><Refresh /></el-icon>云同步</el-button
|
||||
>
|
||||
<el-icon>
|
||||
<Refresh />
|
||||
</el-icon>
|
||||
云同步
|
||||
</el-button
|
||||
>
|
||||
</template>
|
||||
</el-popover>
|
||||
</div>
|
||||
<div style="display: flex">
|
||||
<!-- <el-upload
|
||||
ref="choosefile"
|
||||
v-model:file-list="fileList"
|
||||
name="file"
|
||||
:show-file-list="false"
|
||||
:auto-upload="false"
|
||||
:multiple="true"
|
||||
:on-change="chooseFile"
|
||||
class="editor-img-uploader"
|
||||
>
|
||||
<el-button @click="isDialogOpen=true">上传资料</el-button>
|
||||
</el-upload>-->
|
||||
<el-button @click="isDialogOpen=true">上传资料</el-button>
|
||||
<el-button type="primary" style="margin-left: 10px">新建课件</el-button>
|
||||
</div>
|
||||
|
@ -44,38 +38,51 @@
|
|||
</svg>
|
||||
</div>
|
||||
<div class="prepare-body-main-item-info">
|
||||
<div class="prepare-item-info-title">{{item.fileShowName}}</div>
|
||||
<div class="prepare-item-info-title">{{ item.fileShowName }}</div>
|
||||
<div class="prepare-item-info-message">
|
||||
<div>
|
||||
<div style="width: 80px">
|
||||
<el-icon
|
||||
style="background-color: green; border-radius: 20px; color: white; top: 2px"
|
||||
><Check /></el-icon
|
||||
>已同步
|
||||
>
|
||||
<Check />
|
||||
</el-icon
|
||||
>
|
||||
已同步
|
||||
</div>
|
||||
|
|
||||
<div style="width: 80px">{{ formatFileSize(item.fileSize) }}</div>
|
||||
|
|
||||
<div style="width: 100px">{{ toTimeText(item.uploadTime, true) }}</div>
|
||||
|
|
||||
<div style="white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;" :title="item.levelFirstName + (item.levelSecondName ? ' > ' + item.levelSecondName : '') + (item.levelThirdNmae ? ' > ' + item.levelThirdNmae : '')">
|
||||
{{ item.levelFirstName + (item.levelSecondName ? ' > ' + item.levelSecondName : '') + (item.levelThirdNmae ? ' > ' + item.levelThirdNmae : '') }}
|
||||
</div>
|
||||
|
|
||||
<div>{{item.fileSize}}</div>
|
||||
|
|
||||
<div>{{item.uploadTime}}</div>
|
||||
|
|
||||
<div>古诗词诵读 > 静女</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="prepare-body-main-item-tool">
|
||||
<el-popover placement="left-start" popper-class="prepare-popper" trigger="click">
|
||||
<template #default>
|
||||
<div style="width: 100%; height: 100px;">
|
||||
<div style="width: 100%;">
|
||||
<div class="item-popover">
|
||||
<div class="item-popover-item">
|
||||
<el-button text>
|
||||
<i class="iconfont icon-bianji"></i>
|
||||
<span>编辑</span>
|
||||
</el-button>
|
||||
</div>
|
||||
<div class="item-popover-item">
|
||||
<el-button text @click="deleteSmarttalk(item.id)">
|
||||
<i class="iconfont icon-shanchu"></i>
|
||||
<span>删除</span>
|
||||
</el-button>
|
||||
</div>
|
||||
<div class="item-popover-item">
|
||||
<el-button text>
|
||||
<i class="iconfont icon-xiazai"></i>
|
||||
<span>下载</span>
|
||||
</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -88,12 +95,13 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<uploadDialog v-model="isDialogOpen" @submitFile="submitFile"/>
|
||||
<uploadDialog v-model="isDialogOpen" @submitFile="submitFile" />
|
||||
</div>
|
||||
</template>
|
||||
<script setup>
|
||||
import { Check } from '@element-plus/icons-vue'
|
||||
import ChooseTextbook from '@/components/choose-textbook/index.vue'
|
||||
import { deleteSmarttalk } from '@/api/file'
|
||||
</script>
|
||||
<script>
|
||||
import FileUpload from '@/components/file-upload/index.vue'
|
||||
|
@ -104,6 +112,7 @@ import uploadDialog from '@/components/upload-dialog/index.vue'
|
|||
import { Refresh } from '@element-plus/icons-vue'
|
||||
import uploaderState from '@/store/modules/uploader'
|
||||
import { getSmarttalkPage } from '@/api/file'
|
||||
import { toTimeText } from '@/utils/date'
|
||||
// import { getSmarttalkPage } from '@/api/file'
|
||||
const { ipcRenderer } = window.electron || {}
|
||||
export default {
|
||||
|
@ -113,7 +122,7 @@ export default {
|
|||
return {
|
||||
isLoading: false,
|
||||
isDialogOpen: false,
|
||||
fileList:[],
|
||||
fileList: [],
|
||||
currentNode: {},
|
||||
currentFileList: [],
|
||||
// fileUrl:
|
||||
|
@ -124,7 +133,7 @@ export default {
|
|||
levelFirstId: 39103,
|
||||
levelSecondId: null,
|
||||
fileSource: '个人',
|
||||
fileRoot: "备课"
|
||||
fileRoot: '备课'
|
||||
}
|
||||
}
|
||||
},
|
||||
|
@ -147,21 +156,34 @@ export default {
|
|||
// })
|
||||
},
|
||||
methods: {
|
||||
getFileByCata() {
|
||||
getSmarttalkPage({}).then(res=>{
|
||||
|
||||
})
|
||||
formatFileSize(fileSize) {
|
||||
if (fileSize < 1024) {
|
||||
return fileSize + 'B'
|
||||
} else if (fileSize < (1024 * 1024)) {
|
||||
var temp = fileSize / 1024
|
||||
temp = temp.toFixed(2)
|
||||
return temp + 'KB'
|
||||
} else if (fileSize < (1024 * 1024 * 1024)) {
|
||||
var temp = fileSize / (1024 * 1024)
|
||||
temp = temp.toFixed(2)
|
||||
return temp + 'MB'
|
||||
} else {
|
||||
var temp = fileSize / (1024 * 1024 * 1024)
|
||||
temp = temp.toFixed(2)
|
||||
return temp + 'GB'
|
||||
}
|
||||
},
|
||||
submitFile(files) {
|
||||
files.filter(file=>{
|
||||
file.fileData = Object.assign(this.uploadData,file.fileData)
|
||||
file.callback = function(res){
|
||||
console.log(res)
|
||||
let _this = this;
|
||||
files.filter(file => {
|
||||
file.fileData = Object.assign(this.uploadData, file.fileData)
|
||||
file.callback = function(res) {
|
||||
_this.currentFileList.unshift(res.resData);
|
||||
}
|
||||
})
|
||||
console.log(files)
|
||||
uploaderState().pushFile(files)
|
||||
this.fileList = [];
|
||||
this.fileList = []
|
||||
},
|
||||
callback({ error, filePath }) {
|
||||
if (error) {
|
||||
|
@ -171,20 +193,35 @@ export default {
|
|||
console.log('File copied to:', filePath)
|
||||
},
|
||||
changeBook(data) {
|
||||
console.log(data)
|
||||
this.nodeClick(data)
|
||||
},
|
||||
nodeClick(data) {
|
||||
console.log(data)
|
||||
this.currentNode = data.node;
|
||||
this.uploadData.levelFirstId = data.node.id;
|
||||
let cata = this.parseCataByNode(data.node)
|
||||
this.currentNode = data.node
|
||||
this.uploadData.levelFirstId = cata.length > 0 ? cata[0] : null
|
||||
this.uploadData.levelSecondId = cata.length > 1 ? cata[1] : null
|
||||
this.uploadData.levelThirdId = cata.length > 2 ? cata[2] : null
|
||||
this.uploadData.textbookId = data.textBook.curBookId
|
||||
this.isLoading = true;
|
||||
getSmarttalkPage({...this.uploadData,orderByColumn:'uploadTime',isAsc:'desc',fileSuffix:'mp4'}).then(res=>{
|
||||
this.isLoading = true
|
||||
getSmarttalkPage({
|
||||
...this.uploadData,
|
||||
orderByColumn: 'uploadTime',
|
||||
isAsc: 'desc'
|
||||
}).then(res => {
|
||||
this.currentFileList = [...res.rows]
|
||||
this.isLoading = false;
|
||||
}).catch(res=>{
|
||||
this.isLoading = false;
|
||||
this.isLoading = false
|
||||
}).catch(res => {
|
||||
this.isLoading = false
|
||||
})
|
||||
},
|
||||
parseCataByNode(node) {
|
||||
if (node.parentNode) {
|
||||
let arr = this.parseCataByNode(node.parentNode)
|
||||
arr.push(node.id)
|
||||
return arr
|
||||
} else {
|
||||
return [node.id]
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -195,6 +232,7 @@ export default {
|
|||
min-width: 80px !important;
|
||||
padding: 5px !important;
|
||||
}
|
||||
|
||||
.item-popover-item {
|
||||
padding: 5px 0;
|
||||
display: flex;
|
||||
|
@ -202,6 +240,7 @@ export default {
|
|||
justify-content: center;
|
||||
font-size: 12px;
|
||||
cursor: pointer;
|
||||
|
||||
.iconfont {
|
||||
margin-right: 5px;
|
||||
color: #a2a2a2;
|
||||
|
@ -223,6 +262,7 @@ export default {
|
|||
box-shadow: 0px 0px 20px 0px rgba(99, 99, 99, 0.06);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.prepare-body-header {
|
||||
height: 60px;
|
||||
width: 100%;
|
||||
|
@ -232,34 +272,41 @@ export default {
|
|||
justify-content: space-between;
|
||||
padding: 0 20px;
|
||||
}
|
||||
|
||||
.prepare-body-main {
|
||||
flex: 1;
|
||||
width: 100%;
|
||||
overflow: auto;
|
||||
padding: 0 30px;
|
||||
|
||||
.prepare-body-main-item {
|
||||
&:hover{
|
||||
&:hover {
|
||||
background-color: rgba(144, 147, 153, 0.2);
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
display: flex;
|
||||
align-items: center;
|
||||
border-bottom: 1px solid rgba(131, 131, 127, 0.17);
|
||||
padding: 10px 0;
|
||||
|
||||
.prepare-body-main-item-icon {
|
||||
width: 80px;
|
||||
}
|
||||
|
||||
.prepare-body-main-item-tool {
|
||||
font-size: 18px !important;
|
||||
font-weight: bold;
|
||||
text-align: right;
|
||||
padding-right: 30px;
|
||||
}
|
||||
|
||||
.prepare-body-main-item-info {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
min-width: 0;
|
||||
flex: 1;
|
||||
|
||||
.prepare-item-info-title {
|
||||
text-align: left;
|
||||
font-size: 16px;
|
||||
|
@ -267,6 +314,7 @@ export default {
|
|||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.prepare-item-info-message {
|
||||
font-size: 12px;
|
||||
line-height: 23px;
|
||||
|
|
Loading…
Reference in New Issue