From ed9c3d2d0354d493209769f0013de98eb7e443e5 Mon Sep 17 00:00:00 2001 From: WXL (wul) <wl_5969728@163.com> Date: 星期四, 18 九月 2025 16:39:54 +0800 Subject: [PATCH] 电话、详情、表单 --- src/views/knowledge/education/compilequer/index.vue | 674 +++++++++++++++++++++++++++++-------------------------- 1 files changed, 353 insertions(+), 321 deletions(-) diff --git a/src/views/knowledge/education/compilequer/index.vue b/src/views/knowledge/education/compilequer/index.vue index 860ede0..7d0db6e 100644 --- a/src/views/knowledge/education/compilequer/index.vue +++ b/src/views/knowledge/education/compilequer/index.vue @@ -24,6 +24,7 @@ <!-- 鍩烘湰淇℃伅 --> <div v-if="Editprogress == 1"> <div class="leftvlue-jbxx">鍩烘湰淇℃伅</div> + <el-divider></el-divider> <el-form :model="ruleForm" :rules="rules" @@ -252,94 +253,48 @@ </el-form-item> </el-form> </div> - <!-- 瀹f暀鍐呭 --> + <!-- 瀹f暀鍐呭 --> <div v-if="Editprogress == 2"> <el-row :gutter="20"> - <el-col :span="4"><div class="leftvlue-jbxx">瀹f暀鍐呭</div></el-col> - </el-row> - - <div> - <el-form - :model="ruleForm" - :rules="rules" - ref="ruleForm" - label-width="100px" - class="demo-ruleForm" - > - <el-row gutter="20"> - <el-col :span="12"> - <el-form-item label="璧勬枡褰㈠紡" prop="region"> - <el-select - v-model="ruleForm.shape" - placeholder="璇烽�夋嫨鍐呭褰㈠紡" - > - <el-option - v-for="item in xjxsoptions" - :key="item.value" - :label="item.label" - :value="item.value" - > - </el-option> - </el-select> - </el-form-item> - </el-col> - <el-col :span="12"> - <div> - <el-button @click="laststep('ruleForm')">涓婁竴姝�</el-button> - <el-button - type="success" - @click="Departmenttreatment('ruleForm')" - >淇濆瓨</el-button - > - <el-button - type="warning" - @click="Departmenttreatment('ruleForm')" - >鍙﹀瓨鏂扮増鏈�</el-button - > - <el-button type="info" @click="closeFm('ruleForm')" - >鍏抽棴</el-button - > - </div></el-col - > - </el-row> - </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-col :span="4"> + <div class="leftvlue-jbxx">瀹f暀鍐呭</div> + </el-col> + <el-col :offset="16" :span="4"> <el-upload - class="avatar-uploader" - :action="uploadImgUrl" - :accept="'image/*,video/*'" - :show-file-list="false" - :on-success="uploadEditorSuccess" - :on-error="uploadEditorError" - :before-upload="beforeEditorUpload" + 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> - <!-- 鍩轰簬elementUi鐨勪笂浼犵粍浠� el-upload end--> - <quill-editor - class="editor" - v-model="content" - ref="customQuillEditor" - :options="editorOption" - @blur="onEditorBlur" - @focus="onEditorFocus" - @change="onEditorChange" - > - </quill-editor> - </div> + </el-col> + </el-row> + + <!-- WangEditor 瀵屾枃鏈紪杈戝櫒 --> + <div style="border: 1px solid #ccc; margin: 10px"> + <Toolbar + style="border-bottom: 1px solid #ccc" + :editor="editorRef" + :defaultConfig="toolbarConfig" + :mode="mode" + /> + <Editor + style="height: 800px; overflow-y: hidden" + v-model:html="content" + :defaultConfig="editorConfig" + :mode="mode" + @onCreated="handleEditorCreated" + /> + </div> + + <div> + <el-button @click="laststep('ruleForm')">涓婁竴姝�</el-button> + <el-button type="success" @click="Departmenttreatment('ruleForm')">淇濆瓨</el-button> + <el-button type="warning" @click="Departmenttreatment('ruleForm')">鍙﹀瓨鏂扮増鏈�</el-button> + <el-button type="info" @click="closeFm('ruleForm')">鍏抽棴</el-button> </div> </div> </div> @@ -355,129 +310,141 @@ </template> <script> -import { quillEditor } from "vue-quill-editor"; +import { Editor, Toolbar } from "@wangeditor/editor-for-vue"; +import '@wangeditor/editor/dist/css/style.css'; import axios from "axios"; +import { getToken } from "@/utils/auth"; import { getheLibraryAssort, - delheLibraryAssort, - addheLibraryAssort, addtargetillness, - getlibrarylist, - dellibraryinfo, - deltargetillness, compilelibrary, addrichText, getlibraryinfo, getillnesslist, - illnesslistget, - getillness, } from "@/api/AiCentre/index"; -import OptionalForm from "@/components/OptionalForm"; //姝e垯缁勪欢 - +import OptionalForm from "@/components/OptionalForm"; import { listDept } from "@/api/system/dept"; -// import * as Quill from "quill"; -import Quill from "quill"; import { listtag } from "@/api/system/label"; import store from "@/store"; -// 杩欓噷寮曞叆淇敼杩囩殑video妯″潡骞舵敞鍐� -import Video from "./video"; -Quill.register(Video, true); -//鑾峰彇鐧诲綍token锛屽紩鍏ユ枃浠讹紝濡傛灉鍙槸绠�鍗曟祴璇曪紝娌℃湁涓婁紶鏂囦欢鏄惁鐧诲綍鐨勯檺鍒剁殑璇濓紝 -//杩欎釜token鍙互涓嶇敤鑾峰彇锛屾枃浠跺彲浠ヤ笉寮曞叆锛屾妸涓婇潰瀵瑰簲鐨勪笂浼犳枃浠舵惡甯﹁姹傚ご :headers="headers" 杩欎釜浠g爜鍒犳帀鍗冲彲 -import { getToken } from "@/utils/auth"; -const toolbarOptions = [ - ["bold", "italic", "underline", "strike"], // toggled buttons - ["blockquote", "code-block"], - - [{ header: 1 }, { header: 2 }], // custom button values - [{ list: "ordered" }, { list: "bullet" }], - [{ script: "sub" }, { script: "super" }], // superscript/subscript - [{ indent: "-1" }, { indent: "+1" }], // outdent/indent - [{ direction: "rtl" }], // text direction - - [{ size: ["small", false, "large", "huge"] }], // custom dropdown - [{ header: [1, 2, 3, 4, 5, 6, false] }], - - [{ color: [] }, { background: [] }], // dropdown with defaults from theme - [{ font: [] }], - [{ align: [] }], - ["link", "image", "video"], - ["clean"], // remove formatting button -]; - export default { - name: "Educationinfo", - components: { OptionalForm }, + name: "aEducationinfo", + components: { OptionalForm, Editor, Toolbar }, data() { return { - headers: { - Authorization: "Bearer " + getToken(), + // 缂栬緫鍣ㄥ疄渚� + editorRef: null, + + // 缂栬緫鍣ㄥ唴瀹� + content: "<p>娴嬭瘯</p>", + + // 缂栬緫鍣ㄦā寮� + mode: "default", + + // 宸ュ叿鏍忛厤缃� + toolbarConfig: { + excludeKeys: [ + "group-video", + "insertVideo", + "uploadVideo", + "emotion", + "codeBlock", + ] }, - uploadImgUrl: process.env.VUE_APP_BASE_API + "/common/upload", + + // 缂栬緫鍣ㄩ厤缃� + editorConfig: { + placeholder: "璇疯緭鍏ュ鏁欏唴瀹�...", + MENU_CONF: { + uploadImage: { + server: process.env.VUE_APP_BASE_API + "/common/uploadSort", + fieldName: "file", + maxFileSize: 2 * 1024 * 1024, + maxNumberOfFiles: 1, + allowedFileTypes: ["image/*"], + headers: { + Authorization: "Bearer " + getToken() + }, + customUpload: async (file, insertFn) => { + try { + const formData = new FormData(); + formData.append("file", file); + + const response = await axios.post( + process.env.VUE_APP_BASE_API + "/common/uploadSort", + formData, + { + headers: { + "Content-Type": "multipart/form-data", + Authorization: "Bearer " + getToken() + } + } + ); + + if (response.data && response.data.url) { + let imgUrl = response.data.url; + imgUrl = imgUrl.replace( + "http://218.108.11.22:8093/profile-api/upload", + "http://192.168.191.181:8095/profile/upload" + ); + insertFn(imgUrl); + } + } catch (error) { + console.error("鍥剧墖涓婁紶澶辫触", error); + this.$message.error("鍥剧墖涓婁紶澶辫触"); + } + } + } + } + }, + // 涓婁紶閰嶇疆 + headers: { + Authorization: "Bearer " + getToken() + }, uploadImgUrlword: process.env.VUE_APP_BASE_API + "/common/uploadShow", - uploadUrlPath: "娌℃湁鏂囦欢涓婁紶", - quillUpdateImg: false, - fileList: [ - { - name: "food.jpeg", - url: "https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100", - }, - { - name: "food2.jpeg", - url: "https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100", - }, - ], - content: "", //鏈�缁堜繚瀛樼殑鍐呭 - fileName: "", //鏂囦欢鍚� + + // 椤甸潰鐘舵�� + Editprogress: 1, + loading: false, + + // 琛ㄥ崟鏁版嵁 + ruleForm: { + campus: [], + heLibraryTagList: [], + tempDetpRelevances: [], + version: "1.0.1", + preachname: "", + preachcontent: "", + isAvailable: "", + suitway: [] + }, + + // 鍏朵粬鏁版嵁 dynamicTags: [], + sortlist: [], + courtyardlist: [], + illnesslist: [], + deptList: [], + tempDetpRelevanceslist: [], + variablelist: [ + { variatename: "濮撳悕", variate: "${name}", default: 1 }, + { variatename: "鐢佃瘽", variate: "${phone}", default: 1 }, + { variatename: "鐥呮儏", variate: "${illness}", default: 1 } + ], + + props: { + multiple: true, + value: "deptId", + label: "deptName" + }, + fileName: "", //鏂囦欢鍚� inputVisible: false, illnessVisible: false, dialogVisiblepatient: false, //閫傜敤鐤剧梾绐楀彛 inputValue: "", - // 瀵屾枃鏈� - editorOption: { - placeholder: "浣犳兂璇翠粈涔堬紵", - modules: { - imageResize: { - displayStyles: { - backgroundColor: "black", - border: "none", - color: "white", - }, - modules: ["Resize", "DisplaySize", "Toolbar"], - }, - toolbar: { - container: toolbarOptions, // 宸ュ叿鏍� - handlers: { - image: function (value) { - if (value) { - document - .querySelector("#quillEditorQiniu .avatar-uploader input") - .click(); - } else { - this.quill.format("image", false); - } - }, - video: function (value) { - if (value) { - document - .querySelector("#quillEditorQiniu .avatar-uploader input") - .click(); - } else { - this.quill.format("video", false); - } - }, - }, - }, - }, - }, - sidecolumnrabs: "left", //鏂瑰悜 - Editprogress: 1, //缂栬緫杩涘害 currentVersion: "1.2.3", //褰撳墠鐗堟湰 - loading: false, // 閬僵灞� drawer: false, //鎺у埗灞曞紑 radio: "false", //鍗曢�夐閫変腑 radios: [], //澶氶�夐閫変腑 @@ -486,28 +453,23 @@ total: 1, hetype: "", id: null, - ruleForm: { - campus: [], - heLibraryTagList: [], - tempDetpRelevances: [], - version: "1.0.1", - }, rules: {}, rulesa: {}, mode: [], editableTabs: [], - sortlist: [], usable: [], - courtyardlist: [], precedencetype: [], optionsillness: [], illnesslistapi: [], - illnesslist: [], options: [], optionstag: [], - deptList: [], - tempDetpRelevanceslist: [], - props: { multiple: true, value: "deptId", label: "deptName" }, + // 鍐呯綉鐨勯儴鍒嗭紙鏂囦欢锛� + oldPattern: "http://192.168.191.181:8095/profile/upload", + // 鍐呯綉鐨勯儴鍒嗭紙鏂囦欢锛� + oldPatternhtml: "/http:\/\/192\.168\.191\.181:8095\/profile\/upload\//g", + // 澶栫綉閮ㄥ垎锛堟枃浠讹級 + newPattern: "http://218.108.11.22:8093/profile-api/upload", + xjxsoptions: [ { value: "1", @@ -531,11 +493,7 @@ ], addvalue: "娣诲姞棰樼洰", - variablelist: [ - { variatename: "濮撳悕", variate: "${name}", default: 1 }, - { variatename: "鐢佃瘽", variate: "${phone}", default: 1 }, - { variatename: "鐥呮儏", variate: "${illness}", default: 1 }, - ], + // 鏌ヨ鍙傛暟 queryParams: { pageNum: 1, @@ -562,14 +520,44 @@ this.courtyardlist = store.getters.courtyardlist; }, watch: { - content(newVal, oldVal) { - //this.$emit('input', newVal); - console.log(newVal, "A"); - console.log(oldVal, "B"); - }, + // content(newVal, oldVal) { + // //this.$emit('input', newVal); + // console.log(newVal, "A"); + // console.log(oldVal, "B"); + // }, + content(newVal) { + // 鍐呭鍙樺寲鏃惰Е鍙戯紝鍙互鍦ㄨ繖閲屽鐞嗚嚜鍔ㄤ繚瀛樼瓑閫昏緫 + this.$emit('content-change', newVal) + } }, - + beforeDestroy() { + const editor = this.editor; + if (editor == null) return; + editor.destroy(); // 缁勪欢閿�姣佹椂锛屽強鏃堕攢姣佺紪杈戝櫒 + }, methods: { + onCreated(editor) { + this.editor = Object.seal(editor); // 涓�瀹氳鐢� Object.seal()锛屽惁鍒欎細鎶ラ敊 + }, + // 缂栬緫鍣ㄥ垱寤哄洖璋� + handleEditorCreated(editor) { + this.editorRef = editor; + console.log("缂栬緫鍣ㄥ凡鍒涘缓", editor); + }, + + // 閿�姣佺紪杈戝櫒 + destroyEditor() { + if (this.editorRef) { + this.editorRef.destroy(); + this.editorRef = null; + } + }, + + // 鑾峰彇鍐呭HTML + getEditorContent() { + return this.content; + }, + // --------------------------------- processElement(element) { return { ...element, isoperation: null }; }, @@ -581,11 +569,14 @@ if (this.id) { getlibraryinfo({ id: this.id }).then((res) => { this.ruleForm = res.data[0]; - this.ruleForm.campus = this.ruleForm.campus.split(","); + if (this.ruleForm.campus) + this.ruleForm.campus = this.ruleForm.campus.split(","); this.dynamicTags = res.data[0].heLibraryTagList.map( this.processElement ); - this.Getmissioncontent(this.ruleForm.richText); + if (this.ruleForm.htmlRichText) { + this.Getmissioncontent(this.ruleForm.htmlRichText); + } if (this.ruleForm.deptNames) { this.tempDetpRelevanceslist = JSON.parse(this.ruleForm.deptNames); } @@ -598,7 +589,7 @@ }); } // 瀹f暀鍒嗙被 - getheLibraryAssort({}).then((res) => { + getheLibraryAssort({ hetype: 1 }).then((res) => { this.sortlist = res.rows; console.log(this.sortlist); }); @@ -606,15 +597,51 @@ listDept(this.queryParams).then((response) => { this.deptList = this.handleTree(response.data, "deptId"); }); - this.loading = false; - }, + // ------------------ + + // let html = + // '<p>娴嬭瘯</p><video class="ql-video" controls="controls" controlslist="nofullscreen" type="video/mp4" style="object-fit:fill;width: 100%;" preload="auto" playsinline="true" x-webkit-airplay="allow" x5-video-orientation="portraint" x5-playsinline="true" x5-video-player-fullscreen="true" src="http://192.168.191.181:8095/profile/upload/vadio/钀ュ吇娉典粙缁�.mp4"></video><p>娴嬭瘯111</p><video class="ql-video" controls="controls" controlslist="nofullscreen" type="video/mp4" style="object-fit:fill;width: 100%;" preload="auto" playsinline="true" x-webkit-airplay="allow" x5-video-orientation="portraint" x5-playsinline="true" x5-video-player-fullscreen="true" src="http://192.168.191.181:8095/profile/upload/vadio/娉ㄥ皠鍣ㄦ帹娉�.mp4"></video><p><br></p>'; + // // html = html.parserdom(this.oldPattern, this.newPattern); + // html = this.parserdom(html); + // console.log(html, "html"); + + // this.loading = false; + }, + // parser + parserdom(html) { + // 鍒涘缓涓�涓柊鐨凞OM瑙f瀽鍣� + var parser = new DOMParser(); + // 灏嗗瓧绗︿覆瑙f瀽涓烘枃妗e璞� + var doc = parser.parseFromString(html, "text/html"); + + // 瀹氫箟瑕佹浛鎹㈢殑鏂版棫URL + var oldUrlBase = "http://192.168.191.181:8095/profile/upload"; + var newUrlBase = "http://218.108.11.22:8093/profile-api/upload"; + + // 鑾峰彇鎵�鏈夌殑video鍏冪礌 + var videos = doc.querySelectorAll("video"); + + // 閬嶅巻鎵�鏈夌殑video鍏冪礌骞舵浛鎹rc灞炴�� + videos.forEach(function (video) { + var src = video.getAttribute("src"); + if (src.startsWith(oldUrlBase)) { + video.setAttribute("src", src.replace(oldUrlBase, newUrlBase)); + } + }); + + // 灏嗕慨鏀瑰悗鐨勬枃妗h浆鎹㈠洖瀛楃涓� + var newContent = doc.body.innerHTML; + return newContent; + }, submitForm(formName) { let tgs = []; this.dynamicTags.forEach((item) => { tgs.push(item.tagname); }); - this.ruleForm.campus = this.ruleForm.campus.join(","); + if (this.ruleForm.campus) { + this.ruleForm.campus = this.ruleForm.campus.join(","); + } this.ruleForm.labelInfo = tgs.length != 0 ? tgs.join(", ") : ""; this.ruleForm.otherdata = JSON.stringify(this.variablelist); this.ruleForm.hetype = 1; @@ -625,27 +652,58 @@ : ""; addrichText({ - content: this.content, - fileName: this.fileName ? this.fileName : "娴嬭瘯.html", + content: this.parserdom(this.content), + fileName: this.generateRandomHtmlFilename(), }).then((res) => { this.ruleForm.richText = res.msg; - if (this.id) { - this.ruleForm.isoperation = 2; - compilelibrary(this.ruleForm).then((res) => { - this.$modal.msgSuccess("缂栬緫鎴愬姛"); - this.confirmillness(); - this.$router.go(-1); - }); - } else { - this.ruleForm.isoperation = 1; - compilelibrary(this.ruleForm).then((res) => { - this.$modal.msgSuccess("鏂板鎴愬姛"); - this.confirmillness(res.data); - this.$router.go(-1); - }); - } + console.log(this.ruleForm.richText, "this.ruleForm.richText"); + // 澶勭悊鍐呯綉html + addrichText({ + content: this.content, + fileName: this.generateRandomHtmlFilename(), + }).then((resf) => { + this.ruleForm.htmlRichText = resf.msg.replace( + this.newPattern, + this.oldPattern + ); + console.log(this.ruleForm.htmlRichText, "this.ruleForm.htmlRichText"); + + if (this.id) { + this.ruleForm.isoperation = 2; + compilelibrary(this.ruleForm).then((res) => { + if (res.code == 200) { + this.$modal.msgSuccess("缂栬緫鎴愬姛"); + this.confirmillness(); + this.$router.go(-1); + } + }); + } else { + this.ruleForm.isoperation = 1; + compilelibrary(this.ruleForm).then((res) => { + if (res.code == 200) { + this.$modal.msgSuccess("鏂板鎴愬姛"); + this.confirmillness(res.data); + this.$router.go(-1); + } + }); + } + }); }); }, + + generateRandomHtmlFilename() { + // 鐢熸垚涓�涓�0鍒�1涔嬮棿鐨勯殢鏈烘暟锛屽苟灏嗗叾杞崲涓哄瓧绗︿覆 + let randomNumber = Math.random().toString(); + // 绉婚櫎鍓嶉潰鐨�0鍜屽皬鏁扮偣 + randomNumber = randomNumber.substring(6); + // 纭繚鐢熸垚鐨勯殢鏈烘暟鏄竴瀹氶暱搴︾殑锛屼緥濡�8浣� + while (randomNumber.length < 8) { + randomNumber = "0" + randomNumber; + } + // 鎷兼帴涓�.html鍚庣紑 + return randomNumber + ".html"; + }, + // 淇濆瓨鐤剧梾 confirmillness(guid) { this.illnesslist.forEach((item, index) => { @@ -828,7 +886,7 @@ // -------------------------- - // 棰勮妯$増 + // 棰勮妯℃澘 PreviewTemplate() { this.drawer = true; }, @@ -851,6 +909,11 @@ console.log("涓婁紶鎴愬姛"); //鎷兼帴鍑轰笂浼犵殑鍥剧墖鍦ㄦ湇鍔″櫒鐨勫畬鏁村湴鍧� let imgUrl = res.url; + console.log(res.url); + + imgUrl = imgUrl.replace(this.newPattern, this.oldPattern); + console.log(imgUrl, "imgUrl"); + let type = imgUrl.substring(imgUrl.lastIndexOf(".") + 1); this.fileName = this.getFileNameFromPath(res.url); @@ -859,7 +922,7 @@ // 鑾峰彇鍏夋爣鎵�鍦ㄤ綅缃� let length = quill.getSelection().index; // 鎻掑叆鍥剧墖||瑙嗛 res.info涓烘湇鍔″櫒杩斿洖鐨勫浘鐗囧湴鍧� - if (type == "mp4" || type == "MP4") { + if (type == "mp4" || type == "MP4" || type == "avi" || type == "AVI") { window.jsValue = imgUrl; quill.insertEmbed(length, "video", imgUrl); } else { @@ -914,17 +977,18 @@ console.log(res); console.log(file); }, - // 涓婁紶鍥剧墖鎴愬姛 + // 涓婁紶word鎴愬姛 uploadEditorSuccessword(res, file) { - console.log("涓婁紶鎴愬姛"); - const data = null; + console.log("涓婁紶word鏂囦欢鎴愬姛"); console.log(res, file, "word"); + let fileurl = res.url.replace(this.newPattern, this.oldPattern); axios - .get(res.url) + .get(fileurl) .then((response) => { console.log(response.data, "鏁版嵁"); // 杈撳嚭鑾峰彇鍒扮殑鏂囦欢鍐呭 - this.content = response.data; - this.texturl = res.url; + this.$nextTick(() => { + this.content = response.data; + }); this.fileName = this.getFileNameFromPath(response.url); console.log(this.fileName, "this.fileName"); }) @@ -932,27 +996,41 @@ console.error("Failed to fetch file:", error); }); }, + // Getmissioncontent(url) { + // axios + // .get(url) + // .then((response) => { + // console.log(response.data, "鏁版嵁"); // 杈撳嚭鑾峰彇鍒扮殑鏂囦欢鍐呭 + // this.content = response.data; + // this.fileName = this.getFileNameFromPath(response.url); + // console.log(this.fileName, "this.fileName"); + // }) + // .catch((error) => { + // console.error("Failed to fetch file:", error); + // }); + // }, + // 鑾峰彇杩滅▼鍐呭 Getmissioncontent(url) { - axios - .get(url) + axios.get(url) .then((response) => { - console.log(response.data, "鏁版嵁"); // 杈撳嚭鑾峰彇鍒扮殑鏂囦欢鍐呭 this.content = response.data; - this.fileName = this.getFileNameFromPath(response.url); - console.log(this.fileName, "this.fileName"); }) .catch((error) => { - console.error("Failed to fetch file:", error); + console.error("鑾峰彇鍐呭澶辫触:", error); }); }, + // 澶勭悊url + }, + // 鐢熷懡鍛ㄦ湡閽╁瓙 + beforeUnmount() { + this.destroyEditor() }, }; </script> - +<style src="@wangeditor/editor/dist/css/style.css"></style> +<style src="@/assets/styles/global.css"></style> +<style src="@wangeditor/editor/dist/css/style.css"></style> <style lang="scss" scoped> -.Questionnairemanagement { - // display: flex; -} .sidecolumn { // width: 300px; // min-height: 100vh; @@ -967,6 +1045,7 @@ -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12), 0 0 6px 0 rgba(0, 0, 0, 0.04); } + .leftvlue { // display: flex; // flex: 1; @@ -976,20 +1055,27 @@ border: 1px solid #dcdfe6; -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12), 0 0 6px 0 rgba(0, 0, 0, 0.04); + .mulsz { font-size: 20px; } + .leftvlue-jbxx { - margin-bottom: 50px; - font-size: 20px; + font-size: 24px; + height: 30px; + border-left: 3px solid #41a1be; + padding-left: 3px; + span { position: absolute; right: 80px; } } + .demo-cascader { margin-right: 20px; } + .PreviewTemplate { color: #02a7f0; cursor: pointer; @@ -997,6 +1083,7 @@ margin: 0 20px; } } + .xinz-inf { font-size: 18px; white-space: nowrap; @@ -1008,6 +1095,7 @@ .el-tag + .el-tag { margin-left: 10px; } + .button-new-tag { margin-left: 10px; height: 32px; @@ -1015,12 +1103,14 @@ padding-top: 0; padding-bottom: 0; } + .input-new-tag { width: 90px; margin-left: 10px; vertical-align: bottom; } } + .preview-left { margin: 20px; // margin: 20px; @@ -1029,41 +1119,51 @@ border: 1px solid #dcdfe6; -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12), 0 0 6px 0 rgba(0, 0, 0, 0.04); + .topic-dev { margin-bottom: 25px; font-size: 20px !important; + .dev-text { margin-bottom: 10px; } } } + .addtopic { margin-top: 30px; } + .presentation { margin: 20px 0; display: flex; + .presentation-left { width: 50%; height: 500px; + .button-textxg { color: #024df0; } + .button-textsc { color: #f52727; } } + .presentation-right { width: 50%; height: 500px; padding: 20px; font-size: 18px; border: 1px solid #909091; + span { padding: 0 35px; margin-right: 10px; border-bottom: 1px solid #909091; } + .headline { font-size: 20px; border-left: 3px solid #41a1be; @@ -1072,6 +1172,7 @@ } } } + ::v-deep .addtopic-input { input { background: #02a7f0; @@ -1079,25 +1180,31 @@ width: 150px; } } + ::v-deep.el-step.is-vertical .el-step__title { font-size: 25px; } + ::v-deep.el-input--medium { font-size: 18px !important; } + ::v-deep.ruleFormaa.el-select { display: inline-block; position: relative; width: 700px; } + .el-select__tags { font-size: 20px; max-width: 888px !important; } + ::v-deep.el-radio__inner { width: 22px; height: 22px; } + // ::v-deep.topic-dev.el-radio__label { // font-size: 24px; // } @@ -1106,85 +1213,10 @@ font-size: 24px; } } + ::v-deep.el-checkbox-group { span { font-size: 24px; } -} -.editor { - line-height: normal !important; - height: 600px; - margin-bottom: 80px; -} -.ql-snow .ql-tooltip[data-mode="link"]::before { - content: "璇疯緭鍏ラ摼鎺ュ湴鍧�:"; -} -.ql-snow .ql-tooltip.ql-editing a.ql-action::after { - border-right: 0px; - content: "淇濆瓨"; - padding-right: 0px; -} - -.ql-snow .ql-tooltip[data-mode="video"]::before { - content: "璇疯緭鍏ヨ棰戝湴鍧�:"; -} - -.ql-snow .ql-picker.ql-size .ql-picker-label::before, -.ql-snow .ql-picker.ql-size .ql-picker-item::before { - content: "14px"; -} -.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="small"]::before, -.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="small"]::before { - content: "10px"; -} -.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="large"]::before, -.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="large"]::before { - content: "18px"; -} -.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="huge"]::before, -.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="huge"]::before { - content: "32px"; -} - -.ql-snow .ql-picker.ql-header .ql-picker-label::before, -.ql-snow .ql-picker.ql-header .ql-picker-item::before { - content: "鏂囨湰"; -} -.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="1"]::before, -.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="1"]::before { - content: "鏍囬1"; -} -.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="2"]::before, -.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="2"]::before { - content: "鏍囬2"; -} -.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="3"]::before, -.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="3"]::before { - content: "鏍囬3"; -} -.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="4"]::before, -.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="4"]::before { - content: "鏍囬4"; -} -.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="5"]::before, -.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="5"]::before { - content: "鏍囬5"; -} -.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="6"]::before, -.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="6"]::before { - content: "鏍囬6"; -} - -.ql-snow .ql-picker.ql-font .ql-picker-label::before, -.ql-snow .ql-picker.ql-font .ql-picker-item::before { - content: "鏍囧噯瀛椾綋"; -} -.ql-snow .ql-picker.ql-font .ql-picker-label[data-value="serif"]::before, -.ql-snow .ql-picker.ql-font .ql-picker-item[data-value="serif"]::before { - content: "琛嚎瀛椾綋"; -} -.ql-snow .ql-picker.ql-font .ql-picker-label[data-value="monospace"]::before, -.ql-snow .ql-picker.ql-font .ql-picker-item[data-value="monospace"]::before { - content: "绛夊瀛椾綋"; } </style> -- Gitblit v1.9.3