379 lines
14 KiB
QML
379 lines
14 KiB
QML
import QtQuick
|
||
import QtQuick.Layouts
|
||
import QtQuick.Window
|
||
import QtQuick.Controls
|
||
import QtQuick.Controls.Basic
|
||
import QtWebEngine 1.2
|
||
import FluentUI
|
||
import AicsKB.FileTransferManager
|
||
import SignalFileOperation 1.0
|
||
import "qrc:///AicsKnowledgeBase/qml/page"
|
||
import "qrc:///AicsKnowledgeBase/qml/component"
|
||
import "qrc:///AicsKnowledgeBase/qml/global"
|
||
|
||
FluArea {
|
||
Popup {
|
||
id: popup
|
||
modal: true //模态， 为 true后弹出窗口会叠加一个独特的背景调光效果
|
||
focus: true //焦点, 当弹出窗口实际接收到焦点时，activeFocus将为真
|
||
padding: 0
|
||
closePolicy: Popup.CloseOnEscape | Popup.CloseOnPressOutside
|
||
property var raiseItem: null
|
||
background: Rectangle {
|
||
color: Qt.rgba(0, 0, 0, 0) //背景为无色
|
||
}
|
||
FluArea {
|
||
width: 350
|
||
height: 500
|
||
backgroundColor: "#f9f9f9"
|
||
NoteList {
|
||
id: noteList
|
||
noteListModel: content_page.noteListModel
|
||
onOpen: function handle(noteId, authorId) {
|
||
emit: SignalFileOperation.openNote(noteId, authorId)
|
||
}
|
||
onCreateNote: function handle() {
|
||
emit: SignalFileOperation.createNote(
|
||
content_area.knowledgeFileId, content_area.type,
|
||
content_page.title)
|
||
}
|
||
}
|
||
}
|
||
}
|
||
id: content_area
|
||
paddings: 0
|
||
backgroundColor: "#f9f9f9"
|
||
// visible: false
|
||
property string type: "MD"
|
||
property string knowledgeFileId
|
||
signal back
|
||
signal clickTags(string tagName)
|
||
|
||
// paddings: {
|
||
// top: 10
|
||
// right: 0
|
||
// bottom: 10
|
||
// left: 10
|
||
// }
|
||
FluScrollablePage {
|
||
id: content_page
|
||
anchors.fill: parent
|
||
leftPadding: 10
|
||
topPadding: 10
|
||
rightPadding: 10
|
||
bottomPadding: 0
|
||
|
||
property string fileId
|
||
property int noteCount: 0
|
||
property int favoriteCount: 0
|
||
property int shareCount: 0
|
||
property int browsCount: 555
|
||
property bool isFavorite: false
|
||
property bool isDownload: UserData.downloadedFiles.indexOf(fileId) != -1
|
||
property double fileSize: 0
|
||
property string title: "文章标题"
|
||
property list<string> tags: ["tag 1", "tag 2", "tag 3"]
|
||
property var publishTime
|
||
property string brief: "这是一个简介"
|
||
property string fileUrl: "https://api.hammer-hfut.tk:233/aics/file/"
|
||
property string suffix: "md"
|
||
property ListModel noteListModel
|
||
|
||
function getType(suffix) {
|
||
if (suffix === "md")
|
||
return "MD"
|
||
else if (suffix === "mp4" || suffix === "avi" || suffix === "rmvb"
|
||
|| suffix === "rm" || suffix === "wmv" || suffix === "mkv")
|
||
return "VIDEO"
|
||
else
|
||
return "OTHER"
|
||
}
|
||
|
||
function loadFile(knowledgeFileId) {
|
||
content_area.knowledgeFileId = knowledgeFileId
|
||
console.log(knowledgeFileId)
|
||
Request.get("knowledge/" + knowledgeFileId + "/detail",
|
||
function (response, data) {
|
||
content_page.publishTime = data.createTime
|
||
content_page.title = data.name
|
||
content_page.fileId = data.knowledgeFileAttribute.id
|
||
content_page.suffix = data.knowledgeFileAttribute.suffix
|
||
content_page.fileSize = data.knowledgeFileAttribute.size
|
||
|
||
content_area.type = getType(content_page.suffix)
|
||
console.log(content_area.type)
|
||
|
||
var tagString = ""
|
||
for (var j = 0; j < data.knowledgeFileAttribute.tags.length; j++) {
|
||
if (j != 0)
|
||
tagString = tagString + ","
|
||
tagString = tagString + data.knowledgeFileAttribute.tags[j].name
|
||
}
|
||
content_page.tags = tagString.split(",")
|
||
|
||
content_page.brief = data.knowledgeFileAttribute.brief
|
||
content_page.browsCount = data.knowledgeFileAttribute.pageView
|
||
|
||
isFavorite = false
|
||
var starers = data.knowledgeFileAttribute.starers
|
||
for (var i = 0; i < starers.length; i++) {
|
||
if (starers[i].id === UserData.userId) {
|
||
isFavorite = true
|
||
}
|
||
}
|
||
content_page.favoriteCount = starers.length
|
||
|
||
noteListModel.clear()
|
||
var notes = data.knowledgeFileAttribute.notes
|
||
noteCount = notes.length
|
||
for (var i = 0; i < notes.length; i++) {
|
||
noteListModel.append({
|
||
"uuid": notes[i].id,
|
||
"title": notes[i].title,
|
||
"brief": notes[i].content,
|
||
"author": notes[i].author.username,
|
||
"authorId": notes[i].author.id,
|
||
"pageView": notes[i].pageView,
|
||
"stars": notes[i].starrers.length,
|
||
"date": notes[i].createTime
|
||
})
|
||
}
|
||
|
||
if (content_area.type === "MD") {
|
||
// console.log(content_area.type)
|
||
FileTransferManager.getMarkdown(
|
||
content_page.fileId)
|
||
} else if (content_area.type === "VIDEO") {
|
||
console.log(fileUrl + "static/" + fileId + "." + suffix)
|
||
content_view.push(video_view, {
|
||
"source": fileUrl + "static/" + fileId
|
||
+ "." + suffix
|
||
})
|
||
} else {
|
||
Request.get("knowledge/" + knowledgeFileId + "/preview/external",
|
||
function (res) {
|
||
content_view.push(other_view, {
|
||
"url": res
|
||
})
|
||
})
|
||
}
|
||
})
|
||
}
|
||
|
||
Connections {
|
||
target: FileTransferManager
|
||
onMarkdownData: data => {
|
||
console.log(data)
|
||
content_view.push(text_view, {
|
||
"contentMd": data
|
||
})
|
||
}
|
||
}
|
||
|
||
Component.onCompleted: {
|
||
loadFile(knowledgeFileId)
|
||
console.log(content_area.type)
|
||
}
|
||
|
||
FluText {
|
||
font.pointSize: 12
|
||
Layout.margins: -5
|
||
}
|
||
|
||
Item {
|
||
Layout.fillWidth: true
|
||
implicitHeight: 50
|
||
|
||
FluText {
|
||
id: text_title
|
||
padding: 10
|
||
text: content_page.title.split(".")[0]
|
||
font {
|
||
pointSize: 15
|
||
bold: true
|
||
}
|
||
}
|
||
ColumnLayout {
|
||
id: layout_note
|
||
FluIconButton {
|
||
id: button_note
|
||
iconSize: 15
|
||
iconSource: FluentIcons.QuickNote
|
||
text: "笔记"
|
||
onClicked: {
|
||
popup.open()
|
||
}
|
||
}
|
||
FluText {
|
||
text: content_page.noteCount
|
||
font.pointSize: 8
|
||
Layout.alignment: button_note.Center
|
||
Layout.topMargin: -5
|
||
}
|
||
anchors {
|
||
verticalCenter: text_title.verticalCenter
|
||
right: parent.right
|
||
}
|
||
}
|
||
ColumnLayout {
|
||
id: layout_share
|
||
FluIconButton {
|
||
id: button_share
|
||
iconSize: 15
|
||
iconSource: FluentIcons.Share
|
||
text: content_page.shareCount.toString()
|
||
}
|
||
FluText {
|
||
id: text_share
|
||
text: content_page.shareCount
|
||
font.pointSize: 8
|
||
Layout.alignment: button_share.Center
|
||
Layout.topMargin: -5
|
||
}
|
||
anchors {
|
||
verticalCenter: text_title.verticalCenter
|
||
right: layout_note.left
|
||
}
|
||
}
|
||
ColumnLayout {
|
||
id: layout_favorite
|
||
FluIconButton {
|
||
id: button_favorite
|
||
iconSize: 15
|
||
iconSource: content_page.isFavorite ? FluentIcons.FavoriteStarFill : FluentIcons.FavoriteStar
|
||
onClicked: {
|
||
content_page.isFavorite = !content_page.isFavorite
|
||
content_page.favoriteCount += 1
|
||
Request.put("knowledge/" + knowledgeFileId + "/star", {
|
||
"active": UserData.userId
|
||
})
|
||
}
|
||
}
|
||
FluText {
|
||
id: text_favorite
|
||
text: content_page.favoriteCount
|
||
font.pointSize: 8
|
||
Layout.alignment: button_favorite.Center
|
||
Layout.topMargin: -5
|
||
}
|
||
anchors {
|
||
verticalCenter: text_title.verticalCenter
|
||
right: layout_share.left
|
||
}
|
||
}
|
||
FluIconButton {
|
||
id: button_download
|
||
iconSize: 25
|
||
iconSource: content_page.isDownload ? FluentIcons.OEM : FluentIcons.Download
|
||
anchors {
|
||
verticalCenter: text_title.verticalCenter
|
||
right: layout_favorite.left
|
||
rightMargin: 20
|
||
}
|
||
onClicked: {
|
||
if (!content_page.isDownload)
|
||
FileTransferManager.download(content_page.fileId,
|
||
content_page.title)
|
||
else {
|
||
FileTransferManager.openLocalFile(content_page.title)
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
FluArea {
|
||
Layout.fillWidth: true
|
||
implicitHeight: 100
|
||
ColumnLayout {
|
||
RowLayout {
|
||
width: parent.width
|
||
FluText {
|
||
padding: 10
|
||
text: content_page.publishTime
|
||
}
|
||
FluText {
|
||
padding: 10
|
||
text: content_page.fileSize > 1024
|
||
* 1024 ? (content_page.fileSize / 1024 / 1024).toFixed(
|
||
2) + "MB" : (content_page.fileSize / 1024).toFixed(
|
||
2) + "KB"
|
||
}
|
||
FluText {
|
||
padding: 10
|
||
text: content_page.browsCount.toString() + "浏览量"
|
||
}
|
||
}
|
||
FluText {
|
||
Layout.topMargin: -2
|
||
Layout.leftMargin: 10
|
||
text: content_page.brief
|
||
}
|
||
RowLayout {
|
||
Layout.topMargin: 2
|
||
Layout.leftMargin: 5
|
||
Repeater {
|
||
model: content_page.tags
|
||
delegate: Button {
|
||
Layout.margins: 2
|
||
text: "#" + content_page.tags[index]
|
||
background: Rectangle {
|
||
implicitHeight: 10
|
||
implicitWidth: 10
|
||
color: FluColors.Grey20
|
||
radius: 10
|
||
}
|
||
onClicked: {
|
||
emit: content_area.clickTags(text)
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
// WebEngineView {
|
||
// Layout.fillWidth: true
|
||
// backgroundColor: "transparent"
|
||
// implicitHeight: 200
|
||
// settings.javascriptEnabled: true
|
||
// settings.pluginsEnabled: true
|
||
// url: "https://www.baidu.com"
|
||
// }
|
||
StackView {
|
||
id: content_view
|
||
Layout.fillWidth: true
|
||
height: 500
|
||
//initialItem: video_view
|
||
}
|
||
|
||
Component {
|
||
id: video_view
|
||
FluMediaPlayer {
|
||
width: parent.width
|
||
height: width * 9 / 16.
|
||
source: "https://api.hammer-hfut.tk:233/aics/file/static/3f28fea9-27f1-4a85-9d3e-def187c4456e.mp4"
|
||
}
|
||
}
|
||
Component {
|
||
id: text_view
|
||
NoteEditPage {
|
||
noteId: "255454"
|
||
width: parent.width
|
||
height: width * 9 / 16
|
||
isEditable: true
|
||
}
|
||
}
|
||
Component {
|
||
id: other_view
|
||
WebEngineView {
|
||
width: parent.width
|
||
height: width * 9 / 16
|
||
backgroundColor: "transparent"
|
||
settings.javascriptEnabled: true
|
||
settings.pluginsEnabled: true
|
||
url: "https://www.baidu.com"
|
||
}
|
||
}
|
||
}
|
||
}
|