From f77e656729c268db01e101033c6df8820365cfd2 Mon Sep 17 00:00:00 2001 From: WXL <1785969728@qq.com> Date: 星期四, 04 七月 2024 11:07:32 +0800 Subject: [PATCH] 测试完成 --- src/views/knowledge/education/compilequer/index.vue | 111 +++++++++++++++++++++++++++++++++++++++++++++---------- 1 files changed, 91 insertions(+), 20 deletions(-) diff --git a/src/views/knowledge/education/compilequer/index.vue b/src/views/knowledge/education/compilequer/index.vue index ce20fcf..e46e97d 100644 --- a/src/views/knowledge/education/compilequer/index.vue +++ b/src/views/knowledge/education/compilequer/index.vue @@ -313,19 +313,6 @@ </div></el-col > </el-row> - <el-row> - <el-col :span="24"> - <div style="display: flex; margin-left: 66px; margin-bottom: 10px"> - <div - v-for="item in variablelist" - class="tsgname" - @click="tsgnameto(item)" - > - {{ item.variatename }} - </div> - </div> - </el-col></el-row - > <div> <el-form @@ -349,6 +336,16 @@ </el-form> </div> <div> + <el-upload + class="upload-demo" + :action="uploadImgUrlword" + :on-success="uploadEditorSuccessword" + :on-error="uploadEditorErrorword" + :before-upload="beforeEditorUploadword" + :headers="headers" + > + <el-button size="small" type="primary">word鏂囦欢涓婁紶</el-button> + </el-upload> <div id="quillEditorQiniu"> <!-- 鍩轰簬elementUi鐨勪笂浼犵粍浠� el-upload begin--> <el-upload @@ -368,6 +365,9 @@ v-model="content" ref="customQuillEditor" :options="editorOption" + @blur="onEditorBlur" + @focus="onEditorFocus" + @change="onEditorChange" > </quill-editor> </div> @@ -379,6 +379,8 @@ <script> import { quillEditor } from "vue-quill-editor"; +import axios from "axios"; + import { getheLibraryAssort, delheLibraryAssort, @@ -432,6 +434,7 @@ Authorization: "Bearer " + getToken(), }, uploadImgUrl: process.env.VUE_APP_BASE_API + "/common/upload", + uploadImgUrlword: process.env.VUE_APP_BASE_API + "/common/uploadShow", uploadUrlPath: "娌℃湁鏂囦欢涓婁紶", quillUpdateImg: false, fileList: [ @@ -568,8 +571,8 @@ watch: { content(newVal, oldVal) { //this.$emit('input', newVal); - console.log(newVal); - console.log(oldVal); + console.log(newVal, "A"); + console.log(oldVal, "B"); }, }, @@ -584,6 +587,7 @@ if (this.id) { getlibraryinfo({ id: this.id }).then((res) => { this.ruleForm = res.data[0]; + this.content = this.ruleForm.richText; this.ruleForm.campus = this.ruleForm.campus.split(","); this.dynamicTags = res.data[0].heLibraryTagList.map( this.processElement @@ -637,6 +641,7 @@ if (this.illnesslistapi.length) { deltargetillness(this.illnesslistapi.join(",")).then((res) => {}); } + this.ruleForm.richText = this.content; compilelibrary(this.ruleForm).then((res) => { this.$modal.msgSuccess("缂栬緫鎴愬姛"); this.$router.go(-1); @@ -838,7 +843,7 @@ this.illnessVisible = false; this.inputValue = ""; }, - + illnessshowInput() { this.illnessVisible = true; }, @@ -887,10 +892,22 @@ //鍙栨秷涓婁紶鍔ㄧ敾 this.quillUpdateImg = false; }, + // 澶卞幓鐒︾偣浜嬩欢 + onEditorBlur(e) { + console.log("onEditorBlur: ", e); + }, + // 鑾峰緱鐒︾偣浜嬩欢 + onEditorFocus(e) { + console.log("onEditorFocus: ", e); + }, + // 鍐呭鏀瑰彉浜嬩欢 + onEditorChange(e) { + console.log("onEditorChange: ", e); + }, // 涓婁紶(鏂囦欢)鍥剧墖澶辫触 uploadEditorError(res, file) { - console.log(res); - console.log(file); + console.log(res, "word"); + console.log(file, "word"); //椤甸潰鎻愮ず this.$message.error("涓婁紶鍥剧墖澶辫触"); //鍙栨秷涓婁紶鍔ㄧ敾 @@ -899,6 +916,60 @@ //涓婁紶缁勪欢杩斿洖鐨勭粨鏋� uploadResult: function (res) { this.uploadUrlPath = res; + }, + // 涓婁紶(鏂囦欢)鍥剧墖澶辫触 + uploadEditorErrorword(res, file) { + console.log(res); + console.log(file); + //椤甸潰鎻愮ず + this.$message.error("涓婁紶鍥剧墖澶辫触"); + //鍙栨秷涓婁紶鍔ㄧ敾 + this.quillUpdateImg = false; + }, + //涓婁紶鍥剧墖涔嬪墠async + beforeEditorUploadword(res, file) { + //鏄剧ず涓婁紶鍔ㄧ敾 + this.quillUpdateImg = true; + // const res1 = await uploadImage() + // console.log(res1,'====='); + // this.$emit('before',res, file) + console.log(res); + console.log(file); + }, + // 涓婁紶鍥剧墖鎴愬姛 + uploadEditorSuccessword(res, file) { + console.log("涓婁紶鎴愬姛"); + const data = null; + console.log(res, file, "word"); + axios + .get("http://localhost:8089/profile/upload/show/娴嬭瘯/娴嬭瘯.html") + .then((response) => { + console.log(response.data, "鏁版嵁"); // 杈撳嚭鑾峰彇鍒扮殑鏂囦欢鍐呭 + this.content = response.data; + }) + .catch((error) => { + console.error("Failed to fetch file:", error); + }); + console.log(data, "鏁版嵁"); + //鎷兼帴鍑轰笂浼犵殑鍥剧墖鍦ㄦ湇鍔″櫒鐨勫畬鏁村湴鍧� + let imgUrl = res.url; + let type = imgUrl.substring(imgUrl.lastIndexOf(".") + 1); + console.log(type); + // 鑾峰彇瀵屾枃鏈粍浠跺疄渚� + let quill = this.$refs.customQuillEditor.quill; + // 鑾峰彇鍏夋爣鎵�鍦ㄤ綅缃� + let length = quill.getSelection().index; + // 鎻掑叆鍥剧墖||瑙嗛 res.info涓烘湇鍔″櫒杩斿洖鐨勫浘鐗囧湴鍧� + if (type == "mp4" || type == "MP4") { + window.jsValue = imgUrl; + quill.insertEmbed(length, "video", imgUrl); + } else { + quill.insertEmbed(length, "image", imgUrl); + } + // 璋冩暣鍏夋爣鍒版渶鍚� + quill.setSelection(length + 1); + //鍙栨秷涓婁紶鍔ㄧ敾 + this.quillUpdateImg = false; }, }, }; @@ -1068,8 +1139,8 @@ } .editor { line-height: normal !important; - height: 400px; - margin-bottom: 50px; + height: 600px; + margin-bottom: 80px; } .ql-snow .ql-tooltip[data-mode="link"]::before { content: "璇疯緭鍏ラ摼鎺ュ湴鍧�:"; -- Gitblit v1.9.3