| | |
| | | <template> |
| | | <div class="Questionnairemanagement"> |
| | | <div class="NotificationManagement"> |
| | | <!-- 左侧栏 --> |
| | | <div class="sidecolumn"> |
| | | <el-steps finish-status="success" :active="Editprogress" simple> |
| | |
| | | > |
| | | </template> |
| | | </el-step> |
| | | <el-step> |
| | | <template slot="title"> |
| | | <span style="cursor: pointer" @click="Editprogress = 2" |
| | | >通知内容</span |
| | | > |
| | | </template> |
| | | </el-step> |
| | | </el-steps> |
| | | </div> |
| | | <!-- 右侧数据 --> |
| | |
| | | <!-- 基本信息 --> |
| | | <div v-if="Editprogress == 1"> |
| | | <div class="leftvlue-jbxx">基本信息</div> |
| | | <el-divider></el-divider> |
| | | <el-form |
| | | :model="ruleForm" |
| | | :rules="rules" |
| | |
| | | <el-col :span="12"> </el-col> |
| | | </el-row> |
| | | <el-form-item label="通知标题" prop="preachname"> |
| | | <div style="width: 30%"> |
| | | <div style="width: 60%"> |
| | | <el-input |
| | | v-model="ruleForm.preachname" |
| | | placeholder="请输入标题" |
| | | ></el-input> |
| | | </div> |
| | | </el-form-item> |
| | | <el-form-item label="通知描述" prop="preachcontent"> |
| | | <div style="width: 60%"> |
| | | <el-form-item label="通知内容" prop="preachcontent"> |
| | | <div style="width: 80%"> |
| | | <el-input |
| | | type="textarea" |
| | | :rows="2" |
| | | :rows="5" |
| | | v-model="ruleForm.preachcontent" |
| | | placeholder="请输入描述" |
| | | placeholder="请输入通知内容" |
| | | ></el-input> |
| | | </div> |
| | | </el-form-item> |
| | |
| | | </div> |
| | | </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 |
| | |
| | | @change="handleInputConfirm" |
| | | filterable |
| | | remote |
| | | allow-create |
| | | reserve-keyword |
| | | default-first-option |
| | | :remote-method="remoteMethodtag" |
| | |
| | | ></el-col> |
| | | <el-col :span="9"> |
| | | <el-form-item label="可用状态" prop="region"> |
| | | <el-select |
| | | v-model="ruleForm.isavailable" |
| | | size="medium" |
| | | filterable |
| | | placeholder="请选择分类" |
| | | > |
| | | <el-option |
| | | class="ruleFormaa" |
| | | v-for="item in usable" |
| | | :key="item.value" |
| | | :label="item.label" |
| | | :value="item.value" |
| | | <el-radio-group v-model="ruleForm.isAvailable"> |
| | | <el-radio |
| | | v-for="(item, index) in usable" |
| | | :label="item.value" |
| | | >{{ item.label }}</el-radio |
| | | > |
| | | </el-option> |
| | | </el-select> </el-form-item |
| | | ></el-col> |
| | | </el-radio-group> |
| | | </el-form-item></el-col |
| | | > |
| | | </el-row> |
| | | <el-form-item label="通知方式" prop="region"> |
| | | <el-select |
| | | v-model="ruleForm.suitway" |
| | | size="medium" |
| | | multiple |
| | | filterable |
| | | placeholder="请选择分类" |
| | | > |
| | | <el-option |
| | | class="ruleFormaa" |
| | | v-for="item in mode" |
| | | :key="item.label" |
| | | :label="item.label" |
| | | :value="item.label" |
| | | > |
| | | </el-option> |
| | | </el-select> |
| | | </el-form-item> |
| | | <!-- <el-form-item label="适用疾病" prop="region"> |
| | | <el-button type="warning" @click="$refs.child.handleAddpatient()" |
| | | >添加疾病</el-button |
| | | > |
| | | </el-form-item> --> |
| | | <el-form-item label="适用院区" prop="region"> |
| | | <el-select |
| | | v-model="ruleForm.campus" |
| | | size="medium" |
| | | multiple |
| | | filterable |
| | | placeholder="请选择分类" |
| | | placeholder="请选择院区" |
| | | > |
| | | <el-option |
| | | class="ruleFormaa" |
| | |
| | | </el-cascader> |
| | | </el-form-item> |
| | | <el-form-item> |
| | | <el-button type="success" @click="nextstep('ruleForm')" |
| | | >下一步</el-button |
| | | > |
| | | <el-button type="success" @click="Departmenttreatment('ruleForm')" |
| | | >保存</el-button |
| | | > |
| | | <el-button type="info" @click="closeFm('ruleForm')">关闭</el-button> |
| | | </el-form-item> |
| | | </el-form> |
| | | </div> |
| | | <!-- 通知内容 --> |
| | | <div v-if="Editprogress == 2"> |
| | | <el-row :gutter="20"> |
| | | <el-col :span="4"><div class="leftvlue-jbxx">通知内容</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-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-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> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | <!-- 添加适用疾病窗口 --> |
| | |
| | | </template> |
| | | |
| | | <script> |
| | | import { quillEditor } from "vue-quill-editor"; |
| | | import axios from "axios"; |
| | | |
| | | import { |
| | | getheLibraryAssort, |
| | | delheLibraryAssort, |
| | |
| | | illnesslistget, |
| | | getillness, |
| | | } from "@/api/AiCentre/index"; |
| | | import OptionalForm from "@/components/OptionalForm"; //正则组件 |
| | | |
| | | 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" 这个代码删掉即可 |
| | | 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: "NotificationManagement", |
| | | components: { OptionalForm }, |
| | | data() { |
| | | return { |
| | | headers: { |
| | | 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: [ |
| | | { |
| | | 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: "", //文件名 |
| | | dynamicTags: [], |
| | | inputVisible: false, |
| | | illnessVisible: false, |
| | | dialogVisiblepatient: 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: [], //多选题选中 |
| | | radioas: "", //填空题答案 |
| | | // 总条数 |
| | | sidecolumnrabs: "left", |
| | | Editprogress: 1, |
| | | currentVersion: "1.2.3", |
| | | loading: false, |
| | | drawer: false, |
| | | radio: "false", |
| | | radios: [], |
| | | radioas: "", |
| | | total: 1, |
| | | hetype: "", |
| | | id: null, |
| | |
| | | deptList: [], |
| | | tempDetpRelevanceslist: [], |
| | | props: { multiple: true, value: "deptId", label: "deptName" }, |
| | | xjxsoptions: [ |
| | | { |
| | | value: "1", |
| | | label: "图文", |
| | | }, |
| | | { |
| | | value: "2", |
| | | label: "视频", |
| | | }, |
| | | { |
| | | value: "3", |
| | | label: "音频", |
| | | }, |
| | | ], |
| | | valssu: [ |
| | | { |
| | | idd: 1, |
| | | wssd: "你最近怎么样", |
| | | sdadd: ["sss", "ssccss", "ssaas", "ss"], |
| | | }, |
| | | ], |
| | | addvalue: "添加题目", |
| | | |
| | | variablelist: [ |
| | | { variatename: "姓名", variate: "${name}", default: 1 }, |
| | | { variatename: "电话", variate: "${phone}", default: 1 }, |
| | | { variatename: "病情", variate: "${illness}", default: 1 }, |
| | | ], |
| | | // 查询参数 |
| | | queryParams: { |
| | | pageNum: 1, |
| | | pageSize: 10, |
| | | }, |
| | | }; |
| | | }, |
| | | |
| | | activated() { |
| | | if (this.id != this.$route.query.id) { |
| | | this.gettabList(); |
| | | this.getList(); |
| | | this.illnessUpdate(); |
| | | } |
| | | }, |
| | | created() { |
| | | this.gettabList(); |
| | | this.getList(); |
| | |
| | | this.precedencetype = store.getters.precedencetype; |
| | | this.courtyardlist = store.getters.courtyardlist; |
| | | }, |
| | | watch: { |
| | | content(newVal, oldVal) { |
| | | //this.$emit('input', newVal); |
| | | console.log(newVal, "A"); |
| | | console.log(oldVal, "B"); |
| | | }, |
| | | }, |
| | | |
| | | methods: { |
| | | processElement(element) { |
| | | return { ...element, isoperation: null }; |
| | | }, |
| | | // 获取页面数据 |
| | | getList() { |
| | | this.loading = true; |
| | |
| | | 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.deptNames) { |
| | | this.tempDetpRelevanceslist = JSON.parse(this.ruleForm.deptNames); |
| | | } |
| | | if (this.ruleForm.suitway) { |
| | | this.ruleForm.suitway = this.ruleForm.suitway.split(","); |
| | | } |
| | | this.variablelist = this.ruleForm.otherdata |
| | | ? JSON.parse(this.ruleForm.otherdata) |
| | |
| | | // 通知分类 |
| | | getheLibraryAssort({ hetype: 2 }).then((res) => { |
| | | this.sortlist = res.rows; |
| | | console.log(this.sortlist); |
| | | }); |
| | | // 部门 |
| | | listDept(this.queryParams).then((response) => { |
| | | this.deptList = this.handleTree(response.data, "deptId"); |
| | | }); |
| | | this.loading = false; |
| | | }, |
| | | |
| | | processElement(element) { |
| | | return { ...element, isoperation: null }; |
| | | }, |
| | | 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 = 2; |
| | | console.log(22); |
| | | this.ruleForm.suitway = |
| | | this.ruleForm.suitway.length != 0 |
| | | ? this.ruleForm.suitway.join(",") |
| | | : ""; |
| | | this.ruleForm.hetype = 2; // 通知类型 |
| | | |
| | | addrichText({ |
| | | content: this.content, |
| | | fileName: this.fileName ? this.fileName : "测试.html", |
| | | }).then((res) => { |
| | | this.ruleForm.richText = res.msg; |
| | | if (this.id) { |
| | | this.ruleForm.isoperation = 2; |
| | | compilelibrary(this.ruleForm).then((res) => { |
| | | 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) => { |
| | | } |
| | | }); |
| | | } 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); |
| | | }); |
| | | } |
| | | }); |
| | | } |
| | | }); |
| | | } |
| | | }, |
| | | // 保存疾病 |
| | | confirmillness(guid) { |
| | |
| | | if (guid) { |
| | | item.outid = guid; |
| | | } else { |
| | | console.log(this.ruleForm); |
| | | item.outid = this.ruleForm.id; |
| | | } |
| | | item.icd10name = item.icdname; |
| | |
| | | }); |
| | | this.illnessVisible = false; |
| | | this.$modal.msgSuccess("编辑成功"); |
| | | }, |
| | | getFileNameFromPath(path) { |
| | | const parts = path.split("/"); |
| | | return parts[parts.length - 1]; |
| | | }, |
| | | // 下一步 |
| | | nextstep() { |
| | | if (this.Editprogress <= 1) { |
| | | return this.Editprogress++; |
| | | } |
| | | }, |
| | | // 上一步 |
| | | laststep() { |
| | | this.Editprogress = this.Editprogress - 1; |
| | | }, |
| | | // 关闭 |
| | | closeFm() { |
| | |
| | | ); |
| | | if (!condition) { |
| | | listDept({ deptId: item }).then((res) => { |
| | | console.log("dept"); |
| | | res.data[0].type = 2; |
| | | this.ruleForm.tempDetpRelevances.push(res.data[0]); |
| | | }); |
| | |
| | | setTimeout(() => { |
| | | this.submitForm(); |
| | | }, 1000); |
| | | // this.submitForm(); |
| | | }, |
| | | // 保存题目信息 |
| | | Saveproblem() {}, |
| | | /** 查询题目列表 */ |
| | | |
| | | // 新增变量 |
| | | addvariable() { |
| | | this.variablelist.push({ |
| | |
| | | delvariable(item) { |
| | | const index = this.variablelist.indexOf(item); |
| | | if (index !== -1) { |
| | | this.variablelist.splice(index, 1); // 从索引位置删除一个元素 |
| | | this.variablelist.splice(index, 1); |
| | | } else { |
| | | console.log("未找到该对象"); |
| | | } |
| | | }, |
| | | // 控制文件 |
| | | handleChange(file, fileList) { |
| | | this.fileList = fileList.slice(-3); |
| | | }, |
| | | // 标签----------------- |
| | | // 标签相关方法 |
| | | gettabList() { |
| | | const tagqueryParams = { |
| | | pageNum: 1, |
| | |
| | | }); |
| | | }, |
| | | handleClosetag(tag) { |
| | | console.log(tag); |
| | | const lindex = this.ruleForm.heLibraryTagList.findIndex( |
| | | (item) => item.tagname == tag.tagname |
| | | ); |
| | | console.log(lindex); |
| | | this.dynamicTags.splice(this.dynamicTags.indexOf(tag), 1); |
| | | this.ruleForm.heLibraryTagList[lindex].isoperation = 3; |
| | | }, |
| | |
| | | showInput() { |
| | | this.inputVisible = true; |
| | | }, |
| | | // 疾病----------------------- |
| | | // 疾病相关方法 |
| | | illnessUpdate() { |
| | | if (this.id) { |
| | | getillness({ outid: this.$route.query.id, type: 6 }).then((res) => { |
| | |
| | | }); |
| | | } |
| | | }, |
| | | |
| | | // -------------------------- |
| | | |
| | | // 预览模板 |
| | | PreviewTemplate() { |
| | | this.drawer = true; |
| | |
| | | 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.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; |
| | | }, |
| | | // 失去焦点事件 |
| | | onEditorBlur(e) { |
| | | console.log("onEditorBlur: ", e); |
| | | }, |
| | | // 获得焦点事件 |
| | | onEditorFocus(e) { |
| | | console.log("onEditorFocus: ", e); |
| | | }, |
| | | // 内容改变事件 |
| | | onEditorChange(e) { |
| | | console.log("onEditorChange: ", e); |
| | | }, |
| | | // 上传(文件)图片失败 |
| | | uploadEditorError(res, file) { |
| | | console.log(res, "word"); |
| | | console.log(file, "word"); |
| | | //页面提示 |
| | | this.$message.error("上传图片失败"); |
| | | //取消上传动画 |
| | | this.quillUpdateImg = false; |
| | | }, |
| | | //上传组件返回的结果 |
| | | 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(res.url) |
| | | .then((response) => { |
| | | console.log(response.data, "数据"); // 输出获取到的文件内容 |
| | | this.content = response.data; |
| | | this.texturl = res.url; |
| | | this.fileName = this.getFileNameFromPath(res.url); |
| | | }) |
| | | .catch((error) => { |
| | | 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(res.url); |
| | | }) |
| | | .catch((error) => { |
| | | console.error("Failed to fetch file:", error); |
| | | }); |
| | | }, |
| | | }, |
| | | }; |
| | | </script> |
| | | |
| | | <style lang="scss" scoped> |
| | | .Questionnairemanagement { |
| | | // display: flex; |
| | | } |
| | | .sidecolumn { |
| | | // width: 300px; |
| | | // min-height: 100vh; |
| | | // text-align: center; |
| | | // display: flex; |
| | | // margin-top: 20px; |
| | | margin: 20px; |
| | | margin-bottom: 0; |
| | | padding: 20px; |
| | |
| | | -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; |
| | | margin: 20px; |
| | | padding: 30px; |
| | | background: #ffff; |
| | | 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; |
| | | span { |
| | | position: absolute; |
| | | right: 80px; |
| | | } |
| | | } |
| | | .demo-cascader { |
| | | margin-right: 20px; |
| | | } |
| | | .PreviewTemplate { |
| | | color: #02a7f0; |
| | | cursor: pointer; |
| | | font-size: 20px; |
| | | margin: 0 20px; |
| | | font-size: 24px; |
| | | height: 30px; |
| | | border-left: 3px solid #41a1be; |
| | | padding-left: 3px; |
| | | } |
| | | } |
| | | |
| | | .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; |
| | |
| | | padding-top: 0; |
| | | padding-bottom: 0; |
| | | } |
| | | |
| | | .input-new-tag { |
| | | width: 90px; |
| | | margin-left: 10px; |
| | | vertical-align: bottom; |
| | | } |
| | | } |
| | | .preview-left { |
| | | margin: 20px; |
| | | // margin: 20px; |
| | | padding: 30px; |
| | | background: #ffff; |
| | | 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; |
| | | padding-left: 5px; |
| | | margin: 15px 0; |
| | | } |
| | | } |
| | | } |
| | | ::v-deep .addtopic-input { |
| | | input { |
| | | background: #02a7f0; |
| | | color: #edf1f7; |
| | | width: 150px; |
| | | } |
| | | } |
| | | ::v-deep.el-step.is-vertical .el-step__title { |
| | | |
| | | ::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 { |
| | | |
| | | ::v-deep.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; |
| | | // } |
| | | |
| | | ::v-deep.el-radio-group { |
| | | span { |
| | | 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> |