提交html界面

Author: 李茂益

application.py

@@ -1,13 +1,12 @@
 import datetime
+import logging
 import uuid
 
-from flask import Flask, request, make_response, render_template, Response
+from flask import Flask, request, make_response, render_template, Response, send_from_directory
+from flask_cors import CORS
 
 from generation.gen_ppt_outline import GenBody, GenTitle, GenOutline
 from mdtree.tree2ppt import Tree2PPT
-import logging
-from flask_cors import CORS
-
 
 app = Flask(__name__)
 # 设置日志级别
@@ -30,12 +29,26 @@
 CORS(app)
 
 
-
 @app.route('/')
 def index():
     return render_template('index.html')
 
 
+@app.route('/static/js/<filename>')
+def serve_js(filename):
+    return send_from_directory('./templates/static/js', filename)
+
+
+@app.route('/static/css/<filename>')
+def serve_css(filename):
+    return send_from_directory('./templates/static/css', filename)
+
+
+@app.route('/static/media/<filename>')
+def serve_media(filename):
+    return send_from_directory('./templates/static/media', filename)
+
+
 @app.route('/auto-ppt/gen-uuid', methods=['GET'])
 def get_uuid():
     random_uuid = str(uuid.uuid4())
@@ -54,7 +67,8 @@ def stream1():
         form = request.json["form"]
         topic_num = request.json["topic_num"]
         gen_title_v2 = GenTitle(uuid)
-        return Response(gen_title_v2.predict_title_v2(form, role, title, topic_num), mimetype='application/octet-stream')
+        return Response(gen_title_v2.predict_title_v2(form, role, title, topic_num),
+                        mimetype='application/octet-stream')
 
 
 @app.route('/generate_outline', methods=['POST'])
@@ -124,4 +138,4 @@ def stream():
 
 
 if __name__ == '__main__':
-    app.run(host='0.0.0.0', port=5000, debug=True)
+    app.run(host='0.0.0.0', port=5000, debug=True)

mdtree/readmd.py

@@ -0,0 +1,5 @@
+# Information about a single table. (A slide might have more than one - or none.)
+class TableInfo:
+    def __init__(self, tableRows, tableCaption):
+        self.tableRows = []
+        self.tableCaption = ""

mdtree/tree2ppt.py

@@ -3,6 +3,7 @@
 from enum import Enum
 from io import BytesIO
 
+import markdown
 from PIL.ImageQt import rgb
 from pptx import Presentation
 from pptx.enum.text import MSO_AUTO_SIZE, MSO_VERTICAL_ANCHOR
@@ -27,9 +28,9 @@ def __init__(self, md_str1):
         self.init_markdown(md_str1)
         self.traverse_tree(self.tree)
         now = datetime.datetime.now().timestamp()
-        path = './../myppt/test' + str(now) + '.pptx'
-        if not os.path.exists('./../myppt'):
-            os.makedirs('./../myppt')
+        path = './myppt/test' + str(now) + '.pptx'
+        if not os.path.exists('./myppt'):
+            os.makedirs('./myppt')
         self.prs.save(path)
         pass
 
@@ -154,13 +155,14 @@ def init_content(self):
         tf.word_wrap = True
         # 添加正文
         paragraph = tf.paragraphs[0]
-        paragraph.text = self.content.replace("<p>", "\t").replace("</p>", "\n")
+        paragraph.text = self.content.replace("<p>", "").replace("</p>", "\n")
+        self.processing_md_str(self.content.replace("<p>", "").replace("</p>", "\n"))
         # TODO 处理正文
         self.get_font(paragraph.font, MarkdownCategory.CONTENT)
         paragraph.vertical_anchor = MSO_VERTICAL_ANCHOR.TOP
 
-
-if __name__ == "__main__":
-    md_content = read_md_file("./txt.md")
-    out = parse_string(md_content)
-    Tree2PPT(md_content)
+    def processing_md_str(self, md_str):
+        print(md_str)
+        md = markdown.Markdown()
+        html1 = md.convert(md_str)
+        print(html1)

templates/asset-manifest.json

@@ -0,0 +1,29 @@
+{
+  "files": {
+    "main.css": "./static/css/main.05987304.css",
+    "main.js": "./static/js/main.aee5e3a4.js",
+    "runtime.js": "./static/js/runtime.1b8d8764.js",
+    "base.js": "./static/js/base.0ec2920c.js",
+    "antd.js": "./static/js/antd.56ea7e9d.js",
+    "lodash.js": "./static/js/lodash.4814a24f.js",
+    "vendors.js": "./static/js/vendors.3862e664.js",
+    "static/media/bg.png": "./static/media/bg.604e6fa22cf577d70726.png",
+    "static/media/icon_ai.svg": "./static/media/icon_ai.be8adbf8c3ed72278120e99796c47095.svg",
+    "static/media/icon_fy.svg": "./static/media/icon_fy.342e439a8976a606aeed62874b278890.svg",
+    "static/media/icon_cxd.svg": "./static/media/icon_cxd.04ebe92419162580d43aecf8a3214e69.svg",
+    "static/media/icon_rs.svg": "./static/media/icon_rs.168efc1c3b1b33c0f7a2b6aba90abedf.svg",
+    "static/media/icon_zjd.svg": "./static/media/icon_zjd.099eabb77e46b48ab586eb8c81830998.svg",
+    "static/media/icon_fuz.svg": "./static/media/icon_fuz.db0be2abae623e6f62fb1cdcdb013dd3.svg",
+    "index.html": "./index.html",
+    "static/media/index.cjs": "./static/media/index.433019db0fc741f26829.cjs"
+  },
+  "entrypoints": [
+    "static/js/runtime.1b8d8764.js",
+    "static/js/base.0ec2920c.js",
+    "static/js/antd.56ea7e9d.js",
+    "static/js/lodash.4814a24f.js",
+    "static/js/vendors.3862e664.js",
+    "static/css/main.05987304.css",
+    "static/js/main.aee5e3a4.js"
+  ]
+}

templates/favicon.ico

@@ -1,195 +1 @@
-<!DOCTYPE html>
-<html>
-<head>
-    <title>Auto PPT</title>
-    <meta charset="UTF-8">
-    <link rel="icon" href="https://img1.imgtp.com/2023/06/26/2uA6lVi8.png" type="image/png">
-    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css"/>
-    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=yes"/>
-    <meta property="image" content="https://img1.imgtp.com/2023/06/26/2uA6lVi8.png"/>
-    <meta property="title" content="Auto PPTX: chatgpt自动生成pptx"/>
-    <meta
-      name="description"
-      content="Auto generate pptx using gpt-3.5, Free to use online | 通过gpt-3.5生成PPT,免费在线使用"
-    />
-    <style>
-        /**背景图变色动画**/
-        @keyframes background-overlay-animation {
-            0% {
-                background-image: linear-gradient(4deg, rgba(255, 78, 36, 0.3) 50%, rgba(255, 78, 36, 0.3) 100%),
-                url("https://img1.imgtp.com/2023/07/04/sOFsVAlW.jpg");
-            }
-            25% {
-                background-image: linear-gradient(4deg, rgba(213, 49, 127, 0.3) 50%, rgba(213, 49, 127, 0.3) 100%),
-                url("https://img1.imgtp.com/2023/07/04/sOFsVAlW.jpg");
-            }
-            50% {
-                background-image: linear-gradient(4deg, rgba(36, 182, 255, 0.3) 50%, rgba(36, 182, 255, 1) 100%),
-                url("https://img1.imgtp.com/2023/07/04/sOFsVAlW.jpg");
-            }
-
-            100% {
-                background-image: linear-gradient(4deg, rgba(0, 255, 254, 0.3) 50%, rgba(0, 255, 254, 0.3) 100%),
-                url("https://img1.imgtp.com/2023/07/04/sOFsVAlW.jpg");
-            }
-        }
-        canvas{
-            width: 100%;
-            position: absolute;
-            top: 0;
-        }
-        /*** 动画 end****/
-
-
-        body {
-            margin: 0;
-        }
-
-        /* 页面容器 */
-        .container {
-            background-image: url("https://img1.imgtp.com/2023/07/04/sOFsVAlW.jpg");
-            background-size: 100% 100%;
-            background-position: center;
-            background-repeat: no-repeat;
-            height: 100vh;
-            display: flex;
-            flex-direction: column;
-            align-items: center;
-            justify-content: center;
-
-            animation: background-overlay-animation 10s linear infinite;
-        }
-
-        /* 内容样式 */
-        .content {
-            text-align: center;
-            color: #fff;
-            font-size: 24px;
-        }
-
-        /* 大标题样式 */
-        .page-title {
-            color: rgba(58, 209, 73, 0.6);
-            text-align: center;
-            font-size: 48px; /* 调整标题字体大小 */
-            font-weight: 500;
-            margin-top: -20px; /* 调整标题与上方元素的间距 */
-            font-family: "Microsoft YaHei UI";
-        }
-
-        /* 输入行样式 */
-        .input-row {
-            display: flex;
-            align-items: center;
-            margin-bottom: 10px;
-        }
-
-        .page-input {
-            width: 100%;
-            appearance: none;
-            outline: none;
-            padding: 12px 20px;
-            box-sizing: border-box;
-            border-radius: 10px;
-            border: 1px solid rgba(58, 209, 73, 0.2);
-            box-shadow: 0 0 2px rgba(58, 209, 73, 0.2);
-        }
-
-        /* 按钮样式 */
-        .page-btn {
-            min-width: 70px;
-            margin-left: 10px;
-            padding: 12px 20px;
-            box-sizing: border-box;
-            border-radius: 10px;
-            outline: none;
-            border: 0;
-            background: rgba(58, 209, 73, 0.6);
-            color: white;
-            cursor: pointer;
-        }
-
-        /* GitHub 图标样式 */
-        .github-icon {
-            position: absolute;
-            top: 10px;
-            right: 10px;
-        }
-
-        .github-icon svg {
-            fill: white;
-            height: 30px;
-        }
-    </style>
-
-</head>
-<body>
-<script src="./../../pptx_static/particle.min.js"></script>
-<div class="container">
-    <canvas id="my_canvas"></canvas>
-    <a class="github-icon" href="https://github.com/limaoyi1/Auto_PPT">
-        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" width="30" height="30">
-            <path fill="#000"
-                  d="M23.999 2C12.177 2 2 12.179 2 24.001c0 9.086 5.891 16.767 14.06 19.438 1.03.189 1.407-.447 1.407-1.002v-3.91c-5.715 1.23-6.915-2.749-6.915-2.749-.935-2.353-2.283-2.979-2.283-2.979-1.874-1.278.146-1.252.146-1.252 2.071.148 3.154 2.124 3.154 2.124 1.839 3.18 4.828 2.261 5.998 1.728.186-1.327.715-2.26 1.301-2.779-4.552-.514-9.365-2.276-9.365-10.126 0-2.242.8-4.077 2.12-5.502-.212-.515-.918-2.61.201-5.439 0 0 1.72-.553 5.639 2.107a19.293 19.293 0 0 1 5.007-.67c1.7.005 3.41.228 5.006.67 3.916-2.66 5.634-2.107 5.634-2.107 1.12 2.83.416 4.924.204 5.439 1.322 1.425 2.116 3.26 2.116 5.502 0 7.865-4.82 9.604-9.39 10.11.736.63 1.397 1.876 1.397 3.777v5.583c0 .557.373 1.198 1.417.994C40.106 40.767 46 33.086 46 24.001 46 12.179 35.823 2 23.999 2"/>
-        </svg>
-    </a>
-    <div class="content">
-        <h1 class="page-title animate__animated animate__zoomInDown">自动生成你的PPT</h1>
-
-        <div class="input-row">
-            <input type="text" id="titleInput" class="page-input animate__animated animate__backInLeft" placeholder="请输入PPT的主题"/>
-            <button onclick="callAPI()" class="page-btn animate__animated animate__backInRight">生成</button>
-        </div>
-        <div class="input-row">
-            <p id="loadingText" style="display: none;">正在生成 PPT，这大概需要3~5分钟，请稍候...</p>
-        </div>
-    </div>
-</div>
-
-<script>
-    // 初始化粒子（画布id）
-    particle.init('my_canvas');
-    // 调用api
-    function callAPI() {
-        let title = document.getElementById("titleInput").value;
-        let url = "http://www.limaoyi.top:5000/ppt?title=" + encodeURIComponent(title);
-
-        // 显示加载文本
-        let loadingText = document.getElementById("loadingText");
-        loadingText.style.display = "block";
-
-        // 发送 HTTP GET 请求获取流数据
-        fetch(url)
-            .then(response => {
-                if (!response.ok) {
-                    throw new Error('网络请求错误');
-                }
-                return response.blob(); // 获取响应数据的二进制流
-            })
-            .then(blob => {
-                // 创建 URL 对象
-                let url = URL.createObjectURL(blob);
-
-                // 创建一个链接并模拟点击下载
-                let link = document.createElement("a");
-                link.href = url;
-                link.download = "presentation.pptx"; // 下载的文件名
-                link.click();
-
-                // 清除 URL 对象
-                URL.revokeObjectURL(url);
-
-                // 隐藏加载文本
-                loadingText.style.display = "none";
-            })
-            .catch(error => {
-                // 处理错误
-                console.error(error);
-
-                // 隐藏加载文本
-                loadingText.style.display = "none";
-            });
-    }
-</script>
-</body>
-</html>
+<!doctype html><html lang="en"><head><meta charset="utf-8"/><link rel="icon" href="./favicon.ico"/><meta name="viewport" content="width=device-width,initial-scale=1"/><meta name="theme-color" content="#000000"/><meta name="description" content="Web site|AIGC"/><link rel="apple-touch-icon" href="./logo192.png"/><link rel="manifest" href="./manifest.json"/><title>AIGC App</title><script defer="defer" src="./static/js/runtime.1b8d8764.js"></script><script defer="defer" src="./static/js/base.0ec2920c.js"></script><script defer="defer" src="./static/js/antd.56ea7e9d.js"></script><script defer="defer" src="./static/js/lodash.4814a24f.js"></script><script defer="defer" src="./static/js/vendors.3862e664.js"></script><script defer="defer" src="./static/js/main.aee5e3a4.js"></script><link href="./static/css/main.05987304.css" rel="stylesheet"></head><body><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"></div></body></html>