From 04332cb7ab99f5744c79cd70686e86a878a14b7f Mon Sep 17 00:00:00 2001 From: WXL <1785969728@qq.com> Date: 星期五, 15 十二月 2023 11:14:36 +0800 Subject: [PATCH] 完成 --- src/views/knowledge/education/compilequer/index.vue | 1011 +++++++++++++++++++++++++++++++--------------------------- 1 files changed, 542 insertions(+), 469 deletions(-) diff --git a/src/views/knowledge/education/compilequer/index.vue b/src/views/knowledge/education/compilequer/index.vue index 81ced24..c78fba9 100644 --- a/src/views/knowledge/education/compilequer/index.vue +++ b/src/views/knowledge/education/compilequer/index.vue @@ -23,20 +23,6 @@ label-width="100px" class="demo-ruleForm" > - <el-form-item label="瀹f暀鍚嶇О" prop="name"> - <el-input v-model="ruleForm.name"></el-input> - </el-form-item> - <el-form-item label="瀹f暀褰㈠紡" prop="name"> - <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-form-item label="瀹f暀鍒嗙被" prop="region"> <el-select v-model="ruleForm.classify" @@ -44,7 +30,7 @@ multiple filterable placeholder="璇烽�夋嫨鍒嗙被" - > + > <el-option class="ruleFormaa" v-for="item in options" @@ -55,14 +41,123 @@ </el-option> </el-select> </el-form-item> - <el-form-item label="閫傜敤鐤剧梾" prop="sickness"> + <el-form-item label="瀹f暀鏍囬" prop="name"> + <div style="width: 30%"> + <el-input v-model="ruleForm.name"></el-input> + </div> + </el-form-item> + <el-form-item label="閫氱煡鍙橀噺" prop="name"> + <el-row v-for="item in variablelist"> + <el-col :span="4"> + <el-input v-model="item.variable"></el-input> + </el-col> + <el-col :span="8" :offset="1"> + <el-input v-model="item.value"></el-input> + </el-col> + <el-col :span="4" :offset="1"> + <el-button + type="success" + icon="el-icon-plus" + circle + @click="addvariable(item)" + ></el-button> + <el-button + type="danger" + icon="el-icon-delete" + circle + @click="delvariable(item)" + ></el-button> + </el-col> + </el-row> + </el-form-item> + + <el-form-item label="鏂囦欢" prop="sickness"> + <div style="width: 40%"> + <el-upload + class="upload-demo" + action="https://jsonplaceholder.typicode.com/posts/" + :on-change="handleChange" + :file-list="fileList" + > + <el-button size="small" type="primary">鐐瑰嚮涓婁紶</el-button> + <div slot="tip" class="el-upload__tip"> + 鍙兘涓婁紶jpg/png/xsl鏂囦欢锛屼笖涓嶈秴杩�50mb + </div> + </el-upload> + </div> + </el-form-item> + <el-form-item label="鏍囩" prop="desc"> + <div class="xinz-inf"> + <el-tag + :key="tag" + type="success" + v-for="tag in dynamicTags" + closable + :disable-transitions="false" + @close="handleClose(tag)" + > + {{ tag }} + </el-tag> + <el-select + v-model="inputValue" + v-if="inputVisible" + @change="handleInputConfirm" + filterable + placeholder="璇烽�夋嫨" + > + <el-option + v-for="item in options" + :key="item.label" + :label="item.label" + :value="item.label" + > + </el-option> + </el-select> + <el-button + v-else + class="button-new-tag" + size="small" + @click="showInput" + >+ 鏂板鏍囩</el-button + > + </div> + </el-form-item> + <el-row :gutter="20"> + <el-col :span="6"> + <el-form-item label="鐗堟湰鍙�" prop="name"> + <el-input v-model="currentVersion"></el-input> </el-form-item + ></el-col> + <el-col :span="9"> + <el-form-item label="鍙敤鐘舵��" prop="region"> + <el-select + v-model="ruleForm.classify" + size="medium" + multiple + filterable + placeholder="璇烽�夋嫨鍒嗙被" + > + <el-option + class="ruleFormaa" + v-for="item in options" + :key="item.value" + :label="item.label" + :value="item.value" + > + </el-option> + </el-select> </el-form-item + ></el-col> + </el-row> + <el-form-item label="瀹f暀鏂瑰紡" prop="region"> <el-select - v-model="ruleForm.sickness" + v-model="ruleForm.way" + size="medium" + multiple filterable - placeholder="璇烽�夋嫨" + placeholder="璇烽�夋嫨鍒嗙被" > <el-option - v-for="item in sicknessoptions" + class="ruleFormaa" + v-for="item in xjxsoptions" :key="item.value" :label="item.label" :value="item.value" @@ -70,184 +165,232 @@ </el-option> </el-select> </el-form-item> - <el-form-item label="娲诲姩褰㈠紡" prop="desc"> - <el-input - :rows="4" - type="textarea" - v-model="ruleForm.desc" - maxlength="400" - show-word-limit - ></el-input> + <el-form-item label="閫傜敤鐤剧梾" prop="region"> + <el-select + v-model="ruleForm.illness" + size="medium" + multiple + filterable + placeholder="璇烽�夋嫨鍒嗙被" + > + <el-option + class="ruleFormaa" + v-for="item in options" + :key="item.value" + :label="item.label" + :value="item.value" + > + </el-option> + </el-select> + </el-form-item> + <el-form-item label="浣跨敤闄㈠尯" prop="region"> + <el-select + v-model="ruleForm.courtyard" + size="medium" + filterable + placeholder="璇烽�夋嫨鍒嗙被" + > + <el-option + class="ruleFormaa" + v-for="item in options" + :key="item.value" + :label="item.label" + :value="item.value" + > + </el-option> + </el-select> + </el-form-item> + <el-form-item label="閫傜敤绉戝" prop="region"> + <el-select + v-model="ruleForm.administrative" + size="medium" + multiple + filterable + placeholder="璇烽�夋嫨鍒嗙被" + > + <el-option + class="ruleFormaa" + v-for="item in options" + :key="item.value" + :label="item.label" + :value="item.value" + > + </el-option> + </el-select> </el-form-item> <el-form-item> - <el-button type="success" @click="submitForm('ruleForm')" + <el-button type="success" @click="nextstep('ruleForm')" >涓嬩竴姝�</el-button > <el-button @click="resetForm('ruleForm')">閲嶇疆</el-button> + <el-button type="info" @click="closeFm('ruleForm')" + >鍏抽棴</el-button + > </el-form-item> </el-form> </div> <!-- 瀹f暀鍐呭 --> <div v-if="Editprogress == 2"> - <div class="leftvlue-jbxx">瀹f暀鍐呭</div> - <el-form - :model="ruleForm" - :rules="rules" - ref="ruleForm" - label-width="100px" - class="demo-ruleForm" - > - <el-form-item label="瀹f暀浠嬬粛" prop="desc"> - <el-cascader - class="demo-cascader" - v-model="ruleForm.templatevalue" - :options="asoptions" - :props="{ expandTrigger: 'hover' }" - ></el-cascader> - <el-select v-model="ruleForm.data2" placeholder="鎻愪氦鎻愮ず"> - <el-option - v-for="item in asoptions" - :key="item.value" - :label="item.label" - :value="item.value" + <el-row :gutter="20"> + <el-col :span="4"><div class="leftvlue-jbxx">瀹f暀鍐呭</div></el-col> + <el-col :span="12"> + <div> + <el-button @click="laststep('ruleForm')">涓婁竴姝�</el-button> + <el-button type="success" @click="submitForm('ruleForm')" + >淇濆瓨</el-button > - </el-option> - </el-select> - <div style="display: flex; margin-top: 20px"> - <div class="PreviewTemplate" @click="PreviewTemplate()"> - 棰勮妯$増 - </div> - <el-button type="primary">纭寮曠敤</el-button> - </div> - </el-form-item> - <el-form-item label="娲诲姩褰㈠紡" prop="desc"> - <el-input type="textarea" v-model="ruleForm.desc"></el-input> - </el-form-item> - <el-form-item label="娲诲姩褰㈠紡" prop="desc"> - <el-input type="textarea" v-model="ruleForm.desc"></el-input> - <div class="addtopic"> - <el-select - v-model="addvalue" - @change="changeaddtopic" - class="addtopic-input" + <el-button type="warning" @click="submitForm('ruleForm')" + >鍙﹀瓨鏂扮増鏈�</el-button > + <el-button type="info" @click="closeFm('ruleForm')" + >鍏抽棴</el-button + > + </div></el-col + > + </el-row> + + <div> + <el-form + :model="ruleForm" + :rules="rules" + ref="ruleForm" + label-width="100px" + class="demo-ruleForm" + > + <el-form-item label="璧勬枡褰㈠紡" prop="region"> + <el-select v-model="ruleForm.shape" placeholder="璇烽�夋嫨鍐呭褰㈠紡"> <el-option - v-for="item in options" + v-for="item in xjxsoptions" :key="item.value" :label="item.label" :value="item.value" > </el-option> </el-select> - </div> - - <div class="presentation"> - <div class="presentation-left"> - <el-table v-loading="loading" :data="userList"> - <el-table-column - label="搴忓彿" - align="center" - key="userid" - prop="userid" - /> - <el-table-column - label="棰樼洰" - align="center" - key="userName" - prop="userName" - :show-overflow-tooltip="true" - /> - - <el-table-column - label="鎿嶄綔" - align="center" - width="300" - class-name="small-padding fixed-width" - > - <template slot-scope="scope"> - <!-- <el-button - size="medium" - type="text" - @click="goQRCode(scope.row)" - v-hasPermi="['system:user:edit']" - > - <span class="button-text" - ><i class="el-icon-edit"></i>浜岀淮鐮�</span - ></el-button - > - <el-button - size="medium" - type="text" - @click="ViewQuestionnaire(scope.row)" - v-hasPermi="['system:user:edit']" - ><span class="button-textck" - ><i class="el-icon-edit"></i>鏌ョ湅</span - ></el-button - > --> - <el-button - size="medium" - type="text" - @click="handleUpdate(scope.row)" - v-hasPermi="['system:user:edit']" - ><span class="button-textxg" - ><i class="el-icon-scissors"></i>淇敼</span - ></el-button - > - <el-button - size="medium" - type="text" - @click="handleDelete(scope.row)" - v-hasPermi="['system:user:remove']" - ><span class="button-textsc" - ><i class="el-icon-delete"></i>鍒犻櫎</span - ></el-button - > - </template> - </el-table-column> - </el-table> - - <pagination - v-show="total > 0" - :total="total" - :page.sync="queryParams.pageNum" - :limit.sync="queryParams.pageSize" - @pagination="getList" - /> - </div> - <div class="presentation-right"> - <div class="headline">棰樼洰璁剧疆璇︽儏</div> - <div>棰樼洰鏍囬锛�<span>杩欏鏈烘瀯鎬庝箞鏍�</span></div> - <div>鏄惁蹇呯瓟锛�<span>鏄�</span> 鏄惁闅愯棌锛�<span>鍚�</span></div> - <div class="headline">閫夐」璁剧疆</div> - <div> - <p>閫夐」1:<span>鍖荤枟鏈烘瀯</span></p> - <p> - 濉啓鏄庣粏锛�<span>鏃�</span> 寮傚父閫夐」锛�<span>鏃�</span> - 鍒嗗�硷細<span>3</span> - </p> - <p>閫変腑鎻愮ず锛�<span>杩欎釜棰樻湁鐐归毦璇锋敞鎰�</span></p> - <p>閫変腑璺宠浆锛�<span>鏃�</span></p> - </div> - </div> - </div> - </el-form-item> - <el-form-item> - <el-button type="success" @click="submitForm('ruleForm')" - >绔嬪嵆鍒涘缓</el-button + </el-form-item> + </el-form> + </div> + <div> + <div id="quillEditorQiniu"> + <!-- 鍩轰簬elementUi鐨勪笂浼犵粍浠� el-upload begin--> + <el-upload + class="avatar-uploader" + :action="uploadImgUrl" + :accept="'image/*,video/*'" + :show-file-list="false" + :on-success="uploadEditorSuccess" + :on-error="uploadEditorError" + :before-upload="beforeEditorUpload" + :headers="headers" > - <el-button type="primary" @click="laststep()">涓婁竴姝�</el-button> - <el-button @click="resetForm('ruleForm')">閲嶇疆</el-button> - </el-form-item> - </el-form> + </el-upload> + <!-- 鍩轰簬elementUi鐨勪笂浼犵粍浠� el-upload end--> + <quill-editor + class="editor" + v-model="content" + ref="customQuillEditor" + :options="editorOption" + > + </quill-editor> + </div> + </div> </div> </div> </div> </template> <script> +import { quillEditor } from "vue-quill-editor"; +// import * as Quill from "quill"; +import Quill from "quill"; + +// 杩欓噷寮曞叆淇敼杩囩殑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 { data() { return { + headers: { + Authorization: "Bearer " + getToken(), + }, + uploadImgUrl: "/v1/admin/common/upload", + 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: "", //鏈�缁堜繚瀛樼殑鍐呭 + dynamicTags: ["鏍囩涓�", "鏍囩浜�", "鏍囩涓�"], + inputVisible: 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", //褰撳墠鐗堟湰 @@ -342,292 +485,6 @@ label: "闊抽", }, ], - sicknessoptions: [ - { - value: 1, - label: "楂樿鍘�", - }, - { - value: 2, - label: "蹇冭剰鐥�", - }, - { - value: 3, - label: "绯栧翱鐥�", - }, - { - value: 4, - label: "鑴婃鐐�", - }, - ], - asoptions: [ - { - value: "zhinan", - label: "鎸囧崡", - children: [ - { - value: "shejiyuanze", - label: "璁捐鍘熷垯", - children: [ - { - value: "yizhi", - label: "涓�鑷�", - }, - { - value: "fankui", - label: "鍙嶉", - }, - { - value: "xiaolv", - label: "鏁堢巼", - }, - { - value: "kekong", - label: "鍙帶", - }, - ], - }, - { - value: "daohang", - label: "瀵艰埅", - children: [ - { - value: "cexiangdaohang", - label: "渚у悜瀵艰埅", - }, - { - value: "dingbudaohang", - label: "椤堕儴瀵艰埅", - }, - ], - }, - ], - }, - { - value: "zujian", - label: "缁勪欢", - children: [ - { - value: "basic", - label: "Basic", - children: [ - { - value: "layout", - label: "Layout 甯冨眬", - }, - { - value: "color", - label: "Color 鑹插僵", - }, - { - value: "typography", - label: "Typography 瀛椾綋", - }, - { - value: "icon", - label: "Icon 鍥炬爣", - }, - { - value: "button", - label: "Button 鎸夐挳", - }, - ], - }, - { - value: "form", - label: "Form", - children: [ - { - value: "radio", - label: "Radio 鍗曢�夋", - }, - { - value: "checkbox", - label: "Checkbox 澶氶�夋", - }, - { - value: "input", - label: "Input 杈撳叆妗�", - }, - { - value: "input-number", - label: "InputNumber 璁℃暟鍣�", - }, - { - value: "select", - label: "Select 閫夋嫨鍣�", - }, - { - value: "cascader", - label: "Cascader 绾ц仈閫夋嫨鍣�", - }, - { - value: "switch", - label: "Switch 寮�鍏�", - }, - { - value: "slider", - label: "Slider 婊戝潡", - }, - { - value: "time-picker", - label: "TimePicker 鏃堕棿閫夋嫨鍣�", - }, - { - value: "date-picker", - label: "DatePicker 鏃ユ湡閫夋嫨鍣�", - }, - { - value: "datetime-picker", - label: "DateTimePicker 鏃ユ湡鏃堕棿閫夋嫨鍣�", - }, - { - value: "upload", - label: "Upload 涓婁紶", - }, - { - value: "rate", - label: "Rate 璇勫垎", - }, - { - value: "form", - label: "Form 琛ㄥ崟", - }, - ], - }, - { - value: "data", - label: "Data", - children: [ - { - value: "table", - label: "Table 琛ㄦ牸", - }, - { - value: "tag", - label: "Tag 鏍囩", - }, - { - value: "progress", - label: "Progress 杩涘害鏉�", - }, - { - value: "tree", - label: "Tree 鏍戝舰鎺т欢", - }, - { - value: "pagination", - label: "Pagination 鍒嗛〉", - }, - { - value: "badge", - label: "Badge 鏍囪", - }, - ], - }, - { - value: "notice", - label: "Notice", - children: [ - { - value: "alert", - label: "Alert 璀﹀憡", - }, - { - value: "loading", - label: "Loading 鍔犺浇", - }, - { - value: "message", - label: "Message 娑堟伅鎻愮ず", - }, - { - value: "message-box", - label: "MessageBox 寮规", - }, - { - value: "notification", - label: "Notification 閫氱煡", - }, - ], - }, - { - value: "navigation", - label: "Navigation", - children: [ - { - value: "menu", - label: "NavMenu 瀵艰埅鑿滃崟", - }, - { - value: "tabs", - label: "Tabs 鏍囩椤�", - }, - { - value: "breadcrumb", - label: "Breadcrumb 闈㈠寘灞�", - }, - { - value: "dropdown", - label: "Dropdown 涓嬫媺鑿滃崟", - }, - { - value: "steps", - label: "Steps 姝ラ鏉�", - }, - ], - }, - { - value: "others", - label: "Others", - children: [ - { - value: "dialog", - label: "Dialog 瀵硅瘽妗�", - }, - { - value: "tooltip", - label: "Tooltip 鏂囧瓧鎻愮ず", - }, - { - value: "popover", - label: "Popover 寮瑰嚭妗�", - }, - { - value: "card", - label: "Card 鍗$墖", - }, - { - value: "carousel", - label: "Carousel 璧伴┈鐏�", - }, - { - value: "collapse", - label: "Collapse 鎶樺彔闈㈡澘", - }, - ], - }, - ], - }, - { - value: "ziyuan", - label: "璧勬簮", - children: [ - { - value: "axure", - label: "Axure Components", - }, - { - value: "sketch", - label: "Sketch Templates", - }, - { - value: "jiaohu", - label: "缁勪欢浜や簰鏂囨。", - }, - ], - }, - ], valssu: [ { idd: 1, @@ -655,6 +512,12 @@ userName: "鍥涘彿瀹f暀", }, ], + variablelist: [ + { + variable: "paitent", + value: "琛ㄧず鎮h�呯殑鏍囪瘑", + }, + ], // 鏌ヨ鍙傛暟 queryParams: { pageNum: 1, @@ -669,12 +532,17 @@ }, created() {}, + watch: { + content(newVal, oldVal) { + //this.$emit('input', newVal); + console.log(newVal); + console.log(oldVal); + }, + }, methods: { + // 瀹屾垚 submitForm(formName) { - if (this.Editprogress <= 3) { - return this.Editprogress++; - } this.rules = this.rulesa; // 鎻愪氦 this.$refs[formName].validate((valid) => { @@ -686,6 +554,33 @@ } }); }, + // 涓嬩竴姝� + nextstep() { + if (this.Editprogress <= 1) { + return this.Editprogress++; + } + }, + // 涓婁竴姝� + laststep() { + this.Editprogress = this.Editprogress - 1; + }, + // 鍏抽棴 + closeFm(){ + this.$confirm('閫�鍑轰笉浼氫繚鐣欓〉闈㈠唴瀹规洿鏀�, 鏄惁缁х画?', '鎻愮ず', { + confirmButtonText: '纭畾', + cancelButtonText: '鍙栨秷', + type: 'warning' + }).then(() => { + this.$router.go(-1) + }).catch(() => { + this.$message({ + type: 'info', + message: '宸插彇娑�' + }); + }); + }, + // 淇濆瓨棰樼洰淇℃伅 + Saveproblem(){}, /** 鏌ヨ棰樼洰鍒楄〃 */ getList() { // this.loading = true; @@ -700,20 +595,102 @@ // console.log(rows); // this.list = rows; }, - changeaddtopic(val) { - console.log(11); - console.log(val); - this.addvalue = "娣诲姞棰樼洰"; + // 鏂板鍙橀噺 + addvariable() { + this.variablelist.push({ + variable: "", + value: "", + }); }, + // 鍒犻櫎鍙橀噺 + delvariable(item) { + const index = this.variablelist.indexOf(item); + if (index !== -1) { + this.variablelist.splice(index, 1); // 浠庣储寮曚綅缃垹闄や竴涓厓绱� + } else { + console.log("鏈壘鍒拌瀵硅薄"); + } + }, + // 鎺у埗鏂囦欢 + handleChange(file, fileList) { + this.fileList = fileList.slice(-3); + }, + // 鏍囩----------------- + handleClose(tag) { + this.dynamicTags.splice(this.dynamicTags.indexOf(tag), 1); + }, + handleInputConfirm() { + let inputValue = this.inputValue; + if (inputValue) { + this.dynamicTags.push(inputValue); + } + this.inputVisible = false; + this.inputValue = ""; + }, + showInput() { + this.inputVisible = true; + // 鑷姩鑾峰彇鐒︾偣 + // this.$nextTick((_) => { + // this.$refs.saveTagInput.$refs.input.focus(); + // }); + }, + // -------------------------- + // 棰勮妯$増 PreviewTemplate() { this.drawer = true; }, - laststep() { - this.Editprogress--; - }, resetForm(formName) { this.$refs[formName].resetFields(); + }, + + //涓婁紶鍥剧墖涔嬪墠async + beforeEditorUpload(res, file) { + //鏄剧ず涓婁紶鍔ㄧ敾 + this.quillUpdateImg = true; + // const res1 = await uploadImage() + // console.log(res1,'====='); + // this.$emit('before',res, file) + console.log(res); + console.log(file); + }, + // 涓婁紶鍥剧墖鎴愬姛 + uploadEditorSuccess(res, file) { + console.log("涓婁紶鎴愬姛"); + // this.$emit('upload',res, file) + console.log(res, file); + //鎷兼帴鍑轰笂浼犵殑鍥剧墖鍦ㄦ湇鍔″櫒鐨勫畬鏁村湴鍧� + let imgUrl = res.data.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; + }, + // 涓婁紶(鏂囦欢)鍥剧墖澶辫触 + uploadEditorError(res, file) { + console.log(res); + console.log(file); + //椤甸潰鎻愮ず + this.$message.error("涓婁紶鍥剧墖澶辫触"); + //鍙栨秷涓婁紶鍔ㄧ敾 + this.quillUpdateImg = false; + }, + //涓婁紶缁勪欢杩斿洖鐨勭粨鏋� + uploadResult: function (res) { + this.uploadUrlPath = res; }, }, }; @@ -767,6 +744,30 @@ cursor: pointer; font-size: 20px; margin: 0 20px; + } +} +.xinz-inf { + font-size: 18px; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + + line-height: 48px; + + .el-tag + .el-tag { + margin-left: 10px; + } + .button-new-tag { + margin-left: 10px; + height: 32px; + line-height: 30px; + padding-top: 0; + padding-bottom: 0; + } + .input-new-tag { + width: 90px; + margin-left: 10px; + vertical-align: bottom; } } .preview-left { @@ -831,7 +832,7 @@ font-size: 25px; } ::v-deep.el-input--medium { - font-size: 24px !important; + font-size: 18px !important; } ::v-deep.ruleFormaa.el-select { display: inline-block; @@ -859,8 +860,80 @@ font-size: 24px; } } -// ::v-deep.el-form-item--medium .el-form-item__content { -// line-height: 36px; -// display: flex; -// } +.editor { + line-height: normal !important; + height: 400px; + margin-bottom: 50px; +} +.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