562 lines
22 KiB
QML
562 lines
22 KiB
QML
import QtQuick 2.15
|
||
import QtQuick.Controls 2.15
|
||
import QtQuick.Controls.Material 2.15
|
||
import QtQuick.Layouts 1.15
|
||
import QtQuick.Window 2.15
|
||
import Qt.labs.folderlistmodel 2.15
|
||
import QtCore 6.2
|
||
import QtQuick.Dialogs
|
||
import TactileIPC 1.0
|
||
|
||
Window {
|
||
id: root
|
||
width: 980
|
||
height: 640
|
||
minimumWidth: 880
|
||
minimumHeight: 560
|
||
visible: false
|
||
modality: Qt.ApplicationModal
|
||
flags: Qt.Dialog | Qt.WindowTitleHint | Qt.WindowCloseButtonHint
|
||
title: root.tr("导出数据")
|
||
color: windowBg
|
||
|
||
readonly property bool isDark: !Backend.lightMode
|
||
readonly property color windowBg: isDark ? "#1B1F1B" : "#F7F8F9"
|
||
Material.accent: root.accent
|
||
Material.primary: root.accent
|
||
Material.theme: root.isDark ? Material.Dark : Material.Light
|
||
|
||
readonly property color accent: "#21A453"
|
||
readonly property color accentSoft: root.isDark ? "#1F3A2A" : "#E6F6EC"
|
||
readonly property color panel: root.isDark ? "#242924" : "#FFFFFF"
|
||
readonly property color border: root.isDark ? "#343A35" : "#E1E5EA"
|
||
readonly property color text: root.isDark ? "#E6ECE7" : "#1E2A32"
|
||
readonly property color subText: root.isDark ? "#9AA5A0" : "#6E7A86"
|
||
readonly property color fieldBg: root.isDark ? "#1E221E" : "#FFFFFF"
|
||
readonly property color surfaceAlt: root.isDark ? "#202520" : "#F9FAFB"
|
||
readonly property color hoverBg: root.isDark ? "#2C322D" : "#F3F6F8"
|
||
readonly property color iconBg: root.isDark ? "#25362B" : "#E8F3EA"
|
||
readonly property color iconBgAlt: root.isDark ? "#2A302A" : "#EFF2F5"
|
||
readonly property color disabledBg: root.isDark ? "#4B544E" : "#C9D2D8"
|
||
readonly property string uiFont: "Microsoft YaHei UI"
|
||
|
||
property url currentFolder: StandardPaths.writableLocation(StandardPaths.DocumentsLocation) + "/"
|
||
property string chosenFilename: ""
|
||
property string exportFormat: formatBox.currentValue
|
||
property string exportMethod: methodBox.currentValue
|
||
property string lastMethodValue: "overwrite"
|
||
|
||
signal saveTo(url folder, string filename, string format, string method)
|
||
|
||
function open() {
|
||
centerOnScreen_()
|
||
visible = true
|
||
requestActivate()
|
||
}
|
||
|
||
function accept() {
|
||
visible = false
|
||
}
|
||
|
||
function reject() {
|
||
visible = false
|
||
}
|
||
|
||
function centerOnScreen_() {
|
||
x = Math.round((Screen.width - width) / 2)
|
||
y = Math.round((Screen.height - height) / 2)
|
||
}
|
||
|
||
function normalizeFolder_(path) {
|
||
if (!path)
|
||
return path
|
||
if (path.endsWith("/"))
|
||
return path
|
||
return path + "/"
|
||
}
|
||
|
||
function tr(text) {
|
||
I18n.retranslateToken
|
||
return qsTr(text)
|
||
}
|
||
|
||
onVisibleChanged: if (visible) centerOnScreen_()
|
||
|
||
ColumnLayout {
|
||
anchors.fill: parent
|
||
anchors.margins: 16
|
||
spacing: 12
|
||
|
||
Rectangle {
|
||
Layout.fillWidth: true
|
||
height: 54
|
||
radius: 6
|
||
color: root.panel
|
||
border.color: root.border
|
||
|
||
RowLayout {
|
||
anchors.fill: parent
|
||
anchors.margins: 8
|
||
spacing: 8
|
||
|
||
ToolButton {
|
||
id: backBtn
|
||
text: "<"
|
||
font.family: root.uiFont
|
||
onClicked: nav.back()
|
||
background: Rectangle {
|
||
radius: 4
|
||
color: backBtn.hovered ? root.accentSoft : "transparent"
|
||
border.color: backBtn.hovered ? root.accent : root.border
|
||
}
|
||
}
|
||
ToolButton {
|
||
id: forwardBtn
|
||
text: ">"
|
||
font.family: root.uiFont
|
||
onClicked: nav.forward()
|
||
background: Rectangle {
|
||
radius: 4
|
||
color: forwardBtn.hovered ? root.accentSoft : "transparent"
|
||
border.color: forwardBtn.hovered ? root.accent : root.border
|
||
}
|
||
}
|
||
ToolButton {
|
||
id: upBtn
|
||
text: "^"
|
||
font.family: root.uiFont
|
||
onClicked: nav.up()
|
||
background: Rectangle {
|
||
radius: 4
|
||
color: upBtn.hovered ? root.accentSoft : "transparent"
|
||
border.color: upBtn.hovered ? root.accent : root.border
|
||
}
|
||
}
|
||
|
||
TextField {
|
||
id: breadcrumb
|
||
Layout.fillWidth: true
|
||
readOnly: true
|
||
font.family: root.uiFont
|
||
color: root.text
|
||
text: root.currentFolder.toString()
|
||
background: Rectangle {
|
||
radius: 4
|
||
color: root.surfaceAlt
|
||
border.color: root.border
|
||
}
|
||
}
|
||
|
||
TextField {
|
||
id: searchField
|
||
Layout.preferredWidth: 220
|
||
placeholderText: root.tr("在此位置中搜索")
|
||
font.family: root.uiFont
|
||
background: Rectangle {
|
||
radius: 4
|
||
color: root.fieldBg
|
||
border.color: root.border
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
RowLayout {
|
||
Layout.fillWidth: true
|
||
Layout.fillHeight: true
|
||
spacing: 12
|
||
|
||
Rectangle {
|
||
Layout.preferredWidth: 220
|
||
Layout.fillHeight: true
|
||
radius: 6
|
||
color: root.panel
|
||
border.color: root.border
|
||
|
||
ColumnLayout {
|
||
anchors.fill: parent
|
||
anchors.margins: 10
|
||
spacing: 8
|
||
|
||
Label {
|
||
text: root.tr("位置")
|
||
font.bold: true
|
||
font.family: root.uiFont
|
||
color: root.text
|
||
}
|
||
|
||
ListView {
|
||
id: places
|
||
Layout.fillWidth: true
|
||
Layout.fillHeight: true
|
||
clip: true
|
||
model: [
|
||
{ name: root.tr("此电脑"), url: "file:///", icon: root.isDark ? "qrc:/images/computer_dark.png" : "qrc:/images/computer_light.png" },
|
||
{ name: root.tr("桌面"), url: StandardPaths.writableLocation(StandardPaths.DesktopLocation) + "/", icon: root.isDark ? "qrc:/images/desktop_dark.png" : "qrc:/images/desktop_light.png" },
|
||
{ name: root.tr("文档"), url: StandardPaths.writableLocation(StandardPaths.DocumentsLocation) + "/", icon: root.isDark ? "qrc:/images/docs_dark.png" : "qrc:/images/docs_light.png" },
|
||
{ name: root.tr("下载"), url: StandardPaths.writableLocation(StandardPaths.DownloadLocation) + "/", icon: root.isDark ? "qrc:/images/download_dark.png" : "qrc:/images/download_light.png" }
|
||
]
|
||
|
||
delegate: ItemDelegate {
|
||
width: ListView.view.width
|
||
onClicked: {
|
||
places.currentIndex = index
|
||
root.currentFolder = normalizeFolder_(modelData.url)
|
||
}
|
||
|
||
background: Rectangle {
|
||
radius: 4
|
||
color: places.currentIndex === index ? root.accentSoft : "transparent"
|
||
border.color: places.currentIndex === index ? root.accent : "transparent"
|
||
}
|
||
|
||
contentItem: RowLayout {
|
||
spacing: 8
|
||
Image {
|
||
width: 16
|
||
height: 16
|
||
source: modelData.icon
|
||
fillMode: Image.PreserveAspectFit
|
||
smooth: true
|
||
}
|
||
Label {
|
||
text: modelData.name
|
||
font.family: root.uiFont
|
||
color: root.text
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
Rectangle {
|
||
Layout.fillWidth: true
|
||
Layout.fillHeight: true
|
||
radius: 6
|
||
color: root.panel
|
||
border.color: root.border
|
||
|
||
ColumnLayout {
|
||
anchors.fill: parent
|
||
anchors.margins: 10
|
||
spacing: 6
|
||
|
||
RowLayout {
|
||
Layout.fillWidth: true
|
||
Label { text: root.tr("名称"); Layout.fillWidth: true; font.bold: true; font.family: root.uiFont; color: root.text }
|
||
Label { text: root.tr("修改时间"); Layout.preferredWidth: 160; font.bold: true; font.family: root.uiFont; color: root.text }
|
||
}
|
||
Rectangle { Layout.fillWidth: true; height: 1; color: root.border }
|
||
|
||
FolderListModel {
|
||
id: fileModel
|
||
folder: root.currentFolder
|
||
showDotAndDotDot: false
|
||
showDirs: true
|
||
showFiles: false
|
||
sortField: FolderListModel.Name
|
||
nameFilters: searchField.text.trim().length > 0
|
||
? ["*" + searchField.text.trim() + "*"]
|
||
: ["*"]
|
||
}
|
||
|
||
ListView {
|
||
id: fileList
|
||
Layout.fillWidth: true
|
||
Layout.fillHeight: true
|
||
clip: true
|
||
model: fileModel
|
||
|
||
delegate: ItemDelegate {
|
||
id: fileRow
|
||
width: ListView.view.width
|
||
onDoubleClicked: {
|
||
root.currentFolder = normalizeFolder_(fileModel.get(index, "filePath"))
|
||
}
|
||
onClicked: {
|
||
fileList.currentIndex = index
|
||
}
|
||
|
||
background: Rectangle {
|
||
radius: 4
|
||
color: fileRow.hovered ? root.hoverBg : "transparent"
|
||
}
|
||
|
||
contentItem: RowLayout {
|
||
spacing: 8
|
||
Rectangle {
|
||
width: 18
|
||
height: 18
|
||
radius: 3
|
||
color: root.iconBg
|
||
border.color: root.border
|
||
// TODO: replace with folder icons.
|
||
// Text {
|
||
// anchors.centerIn: parent
|
||
// text: "DIR"
|
||
// font.pixelSize: 10
|
||
// color: root.subText
|
||
// }
|
||
Image {
|
||
// anchors.centerIn: parent
|
||
width: 16
|
||
height: 16
|
||
source: root.isDark ? "qrc:/images/folder_dark.png" : "qrc:/images/folder_light.png"
|
||
fillMode: Image.PreserveAspectFit
|
||
smooth: true
|
||
}
|
||
}
|
||
Label {
|
||
Layout.fillWidth: true
|
||
elide: Text.ElideRight
|
||
text: fileModel.get(index, "fileName") || ""
|
||
font.family: root.uiFont
|
||
color: root.text
|
||
}
|
||
Label {
|
||
Layout.preferredWidth: 160
|
||
text: {
|
||
const d = fileModel.get(index, "modified")
|
||
return d ? Qt.formatDateTime(d, "yyyy/MM/dd hh:mm") : ""
|
||
}
|
||
font.family: root.uiFont
|
||
color: root.subText
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
Rectangle {
|
||
Layout.fillWidth: true
|
||
implicitHeight: footerLayout.implicitHeight + 20
|
||
Layout.preferredHeight: implicitHeight
|
||
Layout.minimumHeight: implicitHeight
|
||
radius: 6
|
||
color: root.panel
|
||
border.color: root.border
|
||
|
||
GridLayout {
|
||
id: footerLayout
|
||
anchors.fill: parent
|
||
anchors.margins: 10
|
||
columns: 6
|
||
columnSpacing: 10
|
||
rowSpacing: 8
|
||
|
||
Label { text: root.tr("文件名"); font.family: root.uiFont; color: root.text }
|
||
TextField {
|
||
id: filenameField
|
||
Layout.columnSpan: 3
|
||
Layout.fillWidth: true
|
||
placeholderText: root.tr("输入要保存的文件名")
|
||
font.family: root.uiFont
|
||
background: Rectangle {
|
||
radius: 4
|
||
color: root.fieldBg
|
||
border.color: root.border
|
||
}
|
||
}
|
||
|
||
Label { text: root.tr("文件类型"); font.family: root.uiFont; color: root.text }
|
||
ComboBox {
|
||
id: formatBox
|
||
Layout.fillWidth: true
|
||
implicitHeight: 32
|
||
Layout.preferredHeight: implicitHeight
|
||
textRole: "label"
|
||
valueRole: "value"
|
||
font.family: root.uiFont
|
||
topPadding: 6
|
||
bottomPadding: 6
|
||
contentItem: Item {
|
||
anchors.fill: parent
|
||
Text {
|
||
anchors.fill: parent
|
||
anchors.leftMargin: 8
|
||
anchors.rightMargin: 24
|
||
text: formatBox.displayText
|
||
font: formatBox.font
|
||
color: root.text
|
||
verticalAlignment: Text.AlignVCenter
|
||
elide: Text.ElideRight
|
||
}
|
||
}
|
||
model: [
|
||
{ label: "CSV (*.csv)", value: "csv", suffix: ".csv" },
|
||
{ label: "JSON (*.json)", value: "json", suffix: ".json" },
|
||
{ label: "Excel (*.xlsx)", value: "xlsx", suffix: ".xlsx" }
|
||
]
|
||
background: Rectangle {
|
||
radius: 4
|
||
color: root.fieldBg
|
||
border.color: root.border
|
||
}
|
||
}
|
||
|
||
Label { text: root.tr("导出方式"); font.family: root.uiFont; color: root.text }
|
||
ComboBox {
|
||
id: methodBox
|
||
Layout.columnSpan: 5
|
||
Layout.fillWidth: true
|
||
implicitHeight: 32
|
||
Layout.preferredHeight: implicitHeight
|
||
textRole: "label"
|
||
valueRole: "value"
|
||
font.family: root.uiFont
|
||
topPadding: 6
|
||
bottomPadding: 6
|
||
contentItem: Item {
|
||
anchors.fill: parent
|
||
Text {
|
||
anchors.fill: parent
|
||
anchors.leftMargin: 8
|
||
anchors.rightMargin: 24
|
||
text: methodBox.displayText
|
||
font: methodBox.font
|
||
color: root.text
|
||
verticalAlignment: Text.AlignVCenter
|
||
elide: Text.ElideRight
|
||
}
|
||
}
|
||
model: [
|
||
{ label: root.tr("覆盖导出（同名替换）"), value: "overwrite" },
|
||
{ label: root.tr("追加导出（写入同一文件）"), value: "append" },
|
||
{ label: root.tr("压缩导出（zip）"), value: "zip" }
|
||
]
|
||
function syncMethodIndex() {
|
||
for (let i = 0; i < model.length; i++) {
|
||
if (model[i].value === root.lastMethodValue) {
|
||
currentIndex = i
|
||
break
|
||
}
|
||
}
|
||
}
|
||
Component.onCompleted: syncMethodIndex()
|
||
onModelChanged: syncMethodIndex()
|
||
onCurrentValueChanged: root.lastMethodValue = currentValue
|
||
background: Rectangle {
|
||
radius: 4
|
||
color: root.fieldBg
|
||
border.color: root.border
|
||
}
|
||
}
|
||
|
||
Item { Layout.columnSpan: 4; Layout.fillWidth: true }
|
||
|
||
RowLayout {
|
||
Layout.columnSpan: 2
|
||
Layout.alignment: Qt.AlignRight
|
||
spacing: 10
|
||
|
||
Button {
|
||
id: cancelBtn
|
||
text: root.tr("取消")
|
||
font.family: root.uiFont
|
||
background: Rectangle {
|
||
radius: 4
|
||
color: "transparent"
|
||
border.color: root.border
|
||
}
|
||
contentItem: Text {
|
||
text: cancelBtn.text
|
||
font.family: root.uiFont
|
||
color: root.text
|
||
horizontalAlignment: Text.AlignHCenter
|
||
verticalAlignment: Text.AlignVCenter
|
||
}
|
||
onClicked: root.reject()
|
||
}
|
||
Button {
|
||
id: saveBtn
|
||
text: root.tr("保存")
|
||
enabled: filenameField.text.trim().length > 0
|
||
font.family: root.uiFont
|
||
background: Rectangle {
|
||
radius: 4
|
||
color: saveBtn.enabled ? root.accent : root.disabledBg
|
||
border.color: saveBtn.enabled ? root.accent : root.disabledBg
|
||
}
|
||
contentItem: Text {
|
||
text: saveBtn.text
|
||
font.family: root.uiFont
|
||
color: "#FFFFFF"
|
||
horizontalAlignment: Text.AlignHCenter
|
||
verticalAlignment: Text.AlignVCenter
|
||
}
|
||
onClicked: doSave()
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
MessageDialog {
|
||
id: overwriteDlg
|
||
title: root.tr("文件已存在")
|
||
text: root.tr("目标文件已存在，是否覆盖？")
|
||
buttons: MessageDialog.Yes | MessageDialog.No
|
||
onButtonClicked: function (button, role) {
|
||
switch (button) {
|
||
case MessageDialog.Yes:
|
||
finalizeSave(true)
|
||
break
|
||
case MessageDialog.No:
|
||
break
|
||
}
|
||
}
|
||
}
|
||
|
||
function finalizeSave(forceOverwrite) {
|
||
root.saveTo(root.currentFolder, chosenFilename, exportFormat, exportMethod)
|
||
root.accept()
|
||
}
|
||
function doSave() {
|
||
let name = filenameField.text.trim()
|
||
if (name.length === 0) return
|
||
|
||
const suffix = formatBox.model[formatBox.currentIndex].suffix
|
||
if (!name.endsWith(suffix)) name += suffix
|
||
chosenFilename = name
|
||
|
||
// TODO: check file existence and show overwriteDlg when needed.
|
||
finalizeSave(false)
|
||
}
|
||
|
||
QtObject {
|
||
id: nav
|
||
property var backStack: []
|
||
property var forwardStack: []
|
||
|
||
function push(url) {
|
||
backStack.push(url)
|
||
forwardStack = []
|
||
}
|
||
function back() {
|
||
if (backStack.length === 0) return
|
||
forwardStack.push(root.currentFolder)
|
||
root.currentFolder = backStack.pop()
|
||
}
|
||
function forward() {
|
||
if (forwardStack.length === 0) return
|
||
backStack.push(root.currentFolder)
|
||
root.currentFolder = forwardStack.pop()
|
||
}
|
||
function up() {
|
||
let s = root.currentFolder.toString()
|
||
if (s.endsWith("/")) s = s.slice(0, -1)
|
||
const idx = s.lastIndexOf("/")
|
||
if (idx > 8) root.currentFolder = s.slice(0, idx + 1)
|
||
}
|
||
}
|
||
|
||
onCurrentFolderChanged: {
|
||
if (breadcrumb.text && breadcrumb.text !== root.currentFolder.toString())
|
||
nav.push(breadcrumb.text)
|
||
breadcrumb.text = root.currentFolder.toString()
|
||
}
|
||
}
|