From 3fd0ffe456ebf73d99228721b355309be3d51ffb Mon Sep 17 00:00:00 2001
From: "yang.yongquan" <3395816735@qq.com>
Date: Mon, 3 Jul 2023 20:43:46 +0800
Subject: [PATCH] =?UTF-8?q?=E6=B7=BB=E5=8A=A0=E4=BA=86=E7=AE=80=E5=8D=95?=
 =?UTF-8?q?=20markdown=20=E7=BC=96=E8=BE=91?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 AicsKnowledgeBase/qml/page/NoteEditPage.qml | 164 ++++++++++++++++++++
 1 file changed, 164 insertions(+)
 create mode 100644 AicsKnowledgeBase/qml/page/NoteEditPage.qml

diff --git a/AicsKnowledgeBase/qml/page/NoteEditPage.qml b/AicsKnowledgeBase/qml/page/NoteEditPage.qml
new file mode 100644
index 0000000..70c7cbb
--- /dev/null
+++ b/AicsKnowledgeBase/qml/page/NoteEditPage.qml
@@ -0,0 +1,164 @@
+import QtQuick
+import QtQuick.Layouts
+import QtQuick.Window
+import QtQuick.Controls
+import QtQuick.Controls.Basic
+import QtWebEngine 1.2
+import FluentUI
+
+FluArea {
+    id: edit_area
+    paddings: 0
+    backgroundColor: "#f9f9f9"
+    property string noteId: "234"
+
+    FluScrollablePage {
+        id: edit_page
+        anchors.fill: parent
+        leftPadding: 10
+        topPadding: 10
+        rightPadding: 10
+        bottomPadding: 0
+
+        property string contentMd: "**ssijfdijgo**\ndfdgfdggggggggggggggggggggggggggggggggggggggggggggggggggg"
+        property bool isEditing: false
+        property bool isEditable: false
+
+        Component.onCompleted: {
+            edit_page.isEditable = true
+
+            textArea_edit.text = edit_page.contentMd
+            edit_page.contentMd = Qt.binding(
+                        function() {
+                            return textArea_edit.text
+                        })
+            textArea_preview.text = Qt.binding(
+                        function() {
+                            return edit_page.contentMd
+                        })
+        }
+
+        Item {
+            Layout.fillWidth: true
+            implicitHeight: 50
+
+            FluIconButton {
+                id: button_edit
+                iconSource: FluentIcons.Edit
+                visible: true
+                anchors {
+                    right: parent.right
+                }
+                onClicked: {
+                    button_edit.visible = false
+                    button_save.visible = true
+                    button_preview.visible = true
+                    button_subfield.visible = true
+                    button_editing.visible = true
+                    button_cancel.visible = true
+                }
+            }
+
+            FluIconButton {
+                id: button_cancel
+                iconSource: FluentIcons.Cancel
+                text: "取消"
+                visible: false
+                anchors {
+                    right: parent.right
+                }
+                onClicked: {
+                    button_edit.visible = edit_page.isEditable
+                    button_save.visible = false
+                    button_preview.visible = false
+                    button_subfield.visible = false
+                    button_editing.visible = false
+                    button_cancel.visible = false
+                }
+            }
+
+            FluIconButton {
+                id: button_save
+                iconSource: FluentIcons.Save
+                text: "保存"
+                visible: false
+                anchors {
+                    right: button_cancel.left
+                }
+            }
+
+            FluIconButton {
+                id: button_preview
+                iconSource: FluentIcons.PreviewLink
+                text: "预览"
+                visible: false
+                onClicked: {
+                    md_show_view.isEditShowing = false
+                    md_show_view.isPreviewShowing = true
+                }
+
+                anchors {
+                    right: button_save.left
+                }
+            }
+
+            FluIconButton {
+                id: button_subfield
+                iconSource: md_show_view.isPreviewShowing ? FluentIcons.ClosePane: FluentIcons.OpenPane
+                text: "分栏"
+                visible: false
+                onClicked: {
+                    md_show_view.isEditShowing = true
+                    md_show_view.isPreviewShowing = !md_show_view.isPreviewShowing
+                }
+                anchors {
+                    right: button_preview.left
+                }
+            }
+
+            FluIconButton {
+                id: button_editing
+                iconSource: FluentIcons.ClipboardList
+                text: "编辑"
+                visible: false
+                onClicked: {
+                    md_show_view.isEditShowing = true
+                    md_show_view.isPreviewShowing = false
+                }
+                anchors {
+                    right: button_subfield.left
+                }
+            }
+        }
+        SplitView {
+            id: md_show_view
+            property bool isEditShowing: false
+            property bool isPreviewShowing: true
+
+            Layout.fillWidth: true
+            implicitHeight: 300
+            ScrollView {
+                id: edit_show_view
+                implicitWidth: parent.width / 2
+                height: parent.height
+                visible: md_show_view.isEditShowing
+                TextArea {
+                    id: textArea_edit
+                    wrapMode: TextEdit.Wrap
+                }
+            }
+
+            ScrollView {
+                id: preview_show_view
+                implicitWidth: parent.width / 2
+                height: parent.height
+                visible: md_show_view.isPreviewShowing
+                TextArea {
+                    id: textArea_preview
+                    wrapMode: TextEdit.Wrap
+                    textFormat: TextEdit.MarkdownText
+                }
+            }
+        }
+    }
+}