1st

templates/onlyoffice_editor.html

@@ -0,0 +1,39 @@
+{% extends "base.html" %}
+
+{% block title %}編輯規範 - {{ spec.spec_code }}{% endblock %}
+
+{% block content %}
+<div class="d-flex justify-content-between align-items-center mb-3">
+    <div>
+        <h2 class="mb-0">正在編輯: {{ spec.spec_code }}</h2>
+        <p class="lead text-muted">主題: {{ spec.title }}</p>
+    </div>
+    <a href="{{ url_for('temp_spec.spec_list') }}" class="btn btn-secondary"><i class="bi bi-arrow-left-circle me-2"></i>返回總表</a>
+</div>
+
+<div class="card">
+    <div class="card-body p-0" style="height: 85vh;">
+        <div id="placeholder"></div>
+    </div>
+</div>
+{% endblock %}
+
+{% block scripts %}
+<script type="text/javascript" src="{{ onlyoffice_url }}web-apps/apps/api/documents/api.js"></script>
+
+<script>
+document.addEventListener('DOMContentLoaded', function() {
+    // 從後端接收的設定
+    const config = {{ config|tojson|safe }};
+
+    // 建立 DocEditor 物件
+    const docEditor = new DocsAPI.DocEditor("placeholder", config);
+
+    // 您可以在這裡加入更多事件處理，例如：
+    // config.events = {
+    //     'onAppReady': function() { console.log('Editor is ready'); },
+    //     'onDocumentStateChange': function(event) { console.log('Document state changed'); },
+    // };
+});
+</script>
+{% endblock %}