监听输入框，支持粘贴上传文件

main.py

@@ -85,7 +85,7 @@ def main():
             with gr_L2(scale=1, elem_id="gpt-panel"):
                 with gr.Accordion("输入区", open=True, elem_id="input-panel") as area_input_primary:
                     with gr.Row():
-                        txt = gr.Textbox(show_label=False, placeholder="Input question here.").style(container=False)
+                        txt = gr.Textbox(show_label=False, placeholder="Input question here.", elem_id='user_input_main').style(container=False)
                     with gr.Row():
                         submitBtn = gr.Button("提交", elem_id="elem_submit", variant="primary")
                     with gr.Row():
@@ -146,7 +146,7 @@ def main():
             with gr.Row():
                 with gr.Tab("上传文件", elem_id="interact-panel"):
                     gr.Markdown("请上传本地文件/压缩包供“函数插件区”功能调用。请注意: 上传文件后会自动把输入区修改为相应路径。")
-                    file_upload_2 = gr.Files(label="任何文件, 推荐上传压缩文件(zip, tar)", file_count="multiple")
+                    file_upload_2 = gr.Files(label="任何文件, 推荐上传压缩文件(zip, tar)", file_count="multiple", elem_id="elem_upload_float")
     
                 with gr.Tab("更换模型 & Prompt", elem_id="interact-panel"):
                     md_dropdown = gr.Dropdown(AVAIL_LLM_MODELS, value=LLM_MODEL, label="更换LLM模型/请求源").style(container=False)
@@ -178,7 +178,8 @@ def main():
                 with gr.Row() as row:
                     row.style(equal_height=True)
                     with gr.Column(scale=10):
-                        txt2 = gr.Textbox(show_label=False, placeholder="Input question here.", lines=8, label="输入区2").style(container=False)
+                        txt2 = gr.Textbox(show_label=False, placeholder="Input question here.",
+                                          elem_id='user_input_float', lines=8, label="输入区2").style(container=False)
                     with gr.Column(scale=1, min_width=40):
                         submitBtn2 = gr.Button("提交", variant="primary"); submitBtn2.style(size="sm")
                         resetBtn2 = gr.Button("重置", variant="secondary"); resetBtn2.style(size="sm")

requirements.txt

@@ -4,7 +4,7 @@ tiktoken>=0.3.3
 requests[socks]
 pydantic==1.10.11
 transformers>=4.27.1
-scipdf_parser>=0.52
+scipdf_parser
 python-markdown-math
 websocket-client
 beautifulsoup4

themes/common.js

@@ -122,7 +122,7 @@ function chatbotAutoHeight(){
             chatbot.style.maxHeight = pixelString; chatbot.style.height = pixelString; 
         }
     }
-
+    monitoring_input_box()
     update_height();
     setInterval(function() {
         update_height_slow()
@@ -161,3 +161,103 @@ function get_elements(consider_state_panel=false) {
     var chatbot_height = parseInt(chatbot_height);
     return { panel_height_target, chatbot_height, chatbot };
 }
+
+
+function add_func_paste(input) {
+    let paste_files = [];
+    if (input) {
+        input.addEventListener("paste", async function (e) {
+            const clipboardData = e.clipboardData || window.clipboardData;
+            const items = clipboardData.items;
+            if (items) {
+                for (i = 0; i < items.length; i++) {
+                    if (items[i].kind === "file") { // 确保是文件类型
+                        const file = items[i].getAsFile();
+                        // 将每一个粘贴的文件添加到files数组中
+                        paste_files.push(file);
+                        e.preventDefault();  // 避免粘贴文件名到输入框
+                    }
+                }
+                if (paste_files.length > 0) {
+                    // 按照文件列表执行批量上传逻辑
+                    await paste_upload_files(paste_files);
+                    paste_files = []
+
+                }
+            }
+        });
+    }
+}
+
+
+async function paste_upload_files(files) {
+    const uploadInputElement = elem_upload_float.querySelector("input[type=file]");
+    let totalSizeMb = 0
+    if (files && files.length > 0) {
+        // 执行具体的上传逻辑
+        if (uploadInputElement) {
+            for (let i = 0; i < files.length; i++) {
+                // 将从文件数组中获取的文件大小(单位为字节)转换为MB，
+                totalSizeMb += files[i].size / 1024 / 1024;
+            }
+            // 检查文件总大小是否超过20MB
+            if (totalSizeMb > 20) {
+                toast_push('⚠️文件夹大于20MB 🚀上传文件中', 2000)
+                // return;  // 如果超过了指定大小, 可以不进行后续上传操作
+            }
+             // 监听change事件， 原生Gradio可以实现
+            // uploadInputElement.addEventListener('change', function(){replace_input_string()});
+            let event = new Event("change");
+            Object.defineProperty(event, "target", {value: uploadInputElement, enumerable: true});
+            Object.defineProperty(event, "currentTarget", {value: uploadInputElement, enumerable: true});
+            Object.defineProperty(uploadInputElement, "files", {value: files, enumerable: true});
+            uploadInputElement.dispatchEvent(event);
+            // toast_push('🎉上传文件成功', 2000)
+        }
+    }
+}
+//提示信息 封装
+function toast_push(msg, duration) {
+    duration = isNaN(duration) ? 3000 : duration;
+    const m = document.createElement('div');
+    m.innerHTML = msg;
+    m.style.cssText = "font-size:  var(--text-md) !important; color: rgb(255, 255, 255);background-color: rgba(0, 0, 0, 0.6);padding: 10px 15px;margin: 0 0 0 -60px;border-radius: 4px;position: fixed;    top: 50%;left: 50%;width: 130px;text-align: center;";
+    document.body.appendChild(m);
+    setTimeout(function () {
+        var d = 0.5;
+        m.style.opacity = '0';
+        setTimeout(function () {
+            document.body.removeChild(m)
+        }, d * 1000);
+    }, duration);
+}
+
+var elem_upload = null;
+var elem_upload_float = null;
+var elem_input_main = null;
+var elem_input_float = null;
+
+
+function monitoring_input_box() {
+    elem_upload = document.getElementById('elem_upload')
+    elem_upload_float = document.getElementById('elem_upload_float')
+    elem_input_main = document.getElementById('user_input_main')
+    elem_input_float = document.getElementById('user_input_float')
+    if (elem_input_main) {
+        if (elem_input_main.querySelector("textarea")) {
+            add_func_paste(elem_input_main.querySelector("textarea"))
+        }
+    }
+    if (elem_input_float) {
+        if (elem_input_float.querySelector("textarea")){
+            add_func_paste(elem_input_float.querySelector("textarea"))
+        }
+    }
+}
+
+
+// 监视页面变化
+window.addEventListener("DOMContentLoaded", function () {
+    // const ga = document.getElementsByTagName("gradio-app");
+    gradioApp().addEventListener("render", monitoring_input_box);
+});