zydx-plus 1.35.613 → 1.35.614

package/src/components/editor2/src/editor.vue

@@ -163,883 +163,883 @@
 <!--  </div>-->
 </template>
 <script>
-import Recorder from 'js-audio-recorder'
-import {html2json, json2html} from '../../utils/html2json.js'
-import {Editor, EditorContent, BubbleMenu} from '@tiptap/vue-3'
-import StarterKit from '@tiptap/starter-kit'
-import Image from '@tiptap/extension-image'
-import TextAlign from '@tiptap/extension-text-align'
-import Heading from '@tiptap/extension-heading'
-import Placeholder from '@tiptap/extension-placeholder'
-import Color from '@tiptap/extension-color'
-import textStyle from '@tiptap/extension-text-style'
-import {sid} from "./sign-id";
-import {FontSize} from "./font-size";
-import {titleId} from "./title-id";
-import {CustomImage} from "./image-size";
-import {Contenteditable} from "./contenteditable";
-import svgs from "./level";
-import Mess from '../../tipBox/index'
-import Paint from '../../paint/src/paint'
-import alignmentModeCenter from './img/center.png'
-import alignmentModeLeft from './img/left.png'
-import alignmentModeRight from './img/right.png'
-
-import zydxChat from '../../chat/src/chat.vue'
-
-export default {
-  name: 'zydx-xiao-editor',
-  components: {
-    EditorContent,
-    BubbleMenu,
-    svgs,
-    Paint,
-    zydxChat
-  },
-  data() {
-    return {
-      alignmentModeLeft: alignmentModeLeft,
-      alignmentModeCenter: alignmentModeCenter,
-      alignmentModeRight: alignmentModeRight,
-      uploadAttData: [],
-      editor: null,
-      heightStyle: {},
-      heightStyleCont: {},
-      voiceStatus: false,
-      showBubble: true,
-      recorder: null,
-      ws: null,
-      audioContext: null,
-      audioData: [],
-      vol: 0,
-      appData: {},
-      error: false,
-      time: {},
-      toolbars: [],
-      left: 0,
-      top: 0,
-      isMove: false,
-      x: 0,
-      y: 0,
-      speech: {},
-      limits: false,
-      voiceShows: false,
-      lock: true,
-      editorRef: null,
-      imgSizeVal: '',
-      currentImgDom: {},
-      paintShow: false,
-      isShowAi: false,
-      lastSelectedText: '',
-      updateInit: false,
-    }
-  },
-  beforeUnmount() {
-    this.editor?.destroy()
-    this.recorder?.destroy()
-    this.ws?.send(JSON.stringify({"type":"CANCEL"}))
-    this.ws?.close()
-    this.ws = null
-    // document.removeEventListener('selectstart', this.selectstartfn);
-    // document.removeEventListener('mouseup', this.getSelectedText)
-  },
-  props: {
-    apiPrefix: {
-      type: String,
-      default: 'zydx'
-    },
-    isShowWhiteboarde: {
-      type: Boolean,
-      default: true
-    },
-    isShowAiTool: {
-      type: Boolean,
-      default: true
-    },
-    titleVertical: {
-      type: Boolean,
-      default: false
-    },
-    data: {
-      type: Object,
-      default: () => {
-      }
-    },
-    toolbar: {
-      type: Array,
-      default: () => []
-    },
-    title: {
-      type: String,
-      default: ''
-    },
-    enclosureText: {
-      type: String,
-      default: '附件列表：'
-    },
-    titleStyle: {
-      type: Object,
-      default: {
-        'font-size': '16px',
-        'font-weight': 'bold',
-        'color': '#333'
-      }
-    },
-    enclosureStyle: {
-      type: Object,
-      default: {
-        'font-size': '16px',
-        'font-weight': 'bold',
-        'color': '#000',
-        'text-indent': '1.9em'
-      }
-    },
-    readOnly: {
-      type: Boolean,
-      default: true
-    },
-    butText: {
-      type: String,
-      default: ''
-    },
-    height: {
-      type: String,
-      default: '200px'
-    },
-    uploadImage: {
-      type: Object,
-      default: () => {}
-    },
-    uploadAttachment: {
-      type: Object,
-      default: () => {}
-    },
-    delShow: {
-      type: Boolean,
-      default: true
-    },
-    titleShow: {
-      type: Boolean,
-      default: true
-    },
-    uploadType: {
-      type: Boolean,
-      default: false
-    },
-    info: {
-      type: String,
-      default: ''
-    },
-    editorShow: {
-      type: Boolean,
-      default: true
-    },
-    borderShow: {
-      type: Boolean,
-      default: true
-    },
-    enclosureShow: {
-      type: Boolean,
-      default: true
-    },
-    downloadShow: {
-      type: Boolean,
-      default: true
-    },
-    placeholder: {
-      type: String,
-      default: '请输入内容'
-    },
-    voiceShow: {
-      type: Boolean,
-      default: true
-    },
-    numberStyle: {
-      type: Boolean,
-      default: false
-    },
-    disabled: {
-      type: Boolean,
-      default: false
-    },
-    enclosureButton: {
-      type: Object,
-      default: () => {}
-    },
-    updateStatus: {
-      type: Boolean,
-      default: false
-    },
-    downName: {
-      type: Array,
-      default: () => []
-    }
-  },
-  emits: ['see', 'del', 'complete', 'update:data', 'enclosureSuccess', 'download', 'updateData', 'syncDel','assets'],
-  watch: {
-    // 强制监听data变化
-    data: {
-      handler: function (e) {
-        if(this.updateInit) return
-        if(this.updateStatus) this.updateInit = true
-        this.editor?.commands.setContent(json2html({node: "root", child: this.dataChange(e).html}))
-        this.uploadAttData = this.dataChange(e).enclosure
-      },
-      deep: true
-    },
-    readOnly: {
-      handler: function (e) {
-        this.editor.setOptions({
-          editable: e
-        })
-      },
-      deep: true
-    },
-    toolbar: {
-      handler: function (e) {
-        let status = null
-        let upload = null
-        let title = null
-        this.toolbars = []
-        e.forEach(x => {
-          if(x.key === 'but') {
-            status = x
-          } else if (x.key === 'uploadAtt') {
-            upload = x
-          }else if(['h1','h2','h3','h4','h5','h6'].includes(x.key)) {
-            title = {key: 'h', title: '标题'}
-          }else {
-            this.toolbars.push(x)
-          }
-        })
-        if(title) this.toolbars.unshift(title) // 标题
-        if(this.isShowWhiteboarde) this.toolbars.push({key: 'paint', title: '插入手写'})
-        if(upload) this.toolbars.push(upload) // 上传附件
-        if(this.voiceShow) this.toolbars.push({key: 'voice', title: '语音输入'})
-        if(status) this.toolbars.push(status) // 之定义按钮
-        if(this.isShowAiTool) this.toolbars.push({key: 'ai', title: 'AI助手'})
-        console.log(this.toolbars)
-      },
-      immediate: true
-    },
-    disabled: {
-      handler: function (e) {
-        this.editor.setOptions({
-          editable: this.readOnly ?(!e):this.readOnly
-        })
-      },
-      deep: true
-    }
-  },
-  mounted() {
-    let _this = this
-    this.uploadAttData = this.dataChange(this.data).enclosure
-    this.heightStyle = (this.height === '100%') ? {height: '100%'} : {'min-height': this.height}
-    const height = this.height.split('px')[0] - 44
-    this.heightStyleCont = (this.height === '100%') ? {height: 'calc(100% - 44px)'} : {'min-height': `${height}px`}
-    this.editor = new Editor({
-      content: json2html({node: "root", child: this.dataChange(this.data).html }),
-      editable: this.readOnly ?(!this.disabled):this.readOnly ,
-      enablePasteRules: true,
-      extensions: [
-        sid,
-        textStyle,
-        FontSize,
-        titleId,
-        CustomImage,
-        Contenteditable,
-        Heading.configure({
-          levels: [1, 2, 3], // 启用 h1/h2/h3（按需调整）
-          // 可选：自定义 H3 的 HTML 属性（如 class）
-          HTMLAttributes: {
-            class: 'tiptap-h3' // 给所有标题添加统一类名（方便样式定制）
-          }
-        }),
-        Color.configure({
-          types: ['textStyle'],
-        }),
-        Placeholder.configure({
-          placeholder: this.placeholder,
-        }),
-        TextAlign.configure({
-          types: ['heading', 'paragraph'],
-        }),
-        Image.configure({
-          inline: true,
-          HTMLAttributes: {
-            class: `editor-img`,
-          }
-        }),
-        StarterKit,
-      ],
-      onUpdate: ({editor}) => {
-        _this.$emit('updateData', {
-          html: html2json(editor.getHTML()).child,
-          enclosure: this.uploadAttData
-        })
-      },
-      onBlur: () => {
-        _this.limits = false
-        _this.close()
-      },
-      // 获取焦点
-      onFocus: () => {
-        this.limits = true
-      },
-    })
-    document.addEventListener('keydown', function (e) {
-      if (e.keyCode === 8 || e.keyCode === 46) {
-        const sid = _this.editor.state.selection.$anchor.parent.attrs.sid
-        if (sid === 'prohibit') {
-          _this.editor.setEditable(false);
-          setTimeout(() => {
-            _this.editor.setEditable(true);
-          }, 0);
-        }
-      }
-    })
-    // 初始化录音
-    this.recorder = new Recorder({
-      sampleBits: 16, // 采样位数，支持 8 或 16，默认是16
-      sampleRate: 16000, // 采样率，支持 11025、16000、22050、24000、44100、48000，根据浏览器默认值，我的chrome是48000
-      numChannels: 1, // 声道，支持 1 或 2， 默认是1
-    })
-    this.recorder.onprogress = function (params) {
-      _this.vol = params.vol
-    }
-    document.addEventListener('mousemove', (event) => {
-      if (!this.isMove) return
-      this.limits = true
-      this.x = event.clientX - this.left;
-      this.y = event.clientY - this.top;
-    })
-    document.addEventListener('click', () => {
-      if(this.limits) return
-      this.close()
-    })
-  },
-  methods: {
-    dataChange(e) {
-      if(!e) return {html: [], enclosure: []}
-      const html = e.html === undefined || e.html === null || e.html === 'null' ? [] : e.html
-      const enclosure = (e.enclosure === undefined || e.enclosure === null || e.enclosure === 'null') ? [] : this.enclosureAction(e.enclosure)
-      return {html: html, enclosure: enclosure}
-    },
-    getSelectedText(e) {
-      const selection = window.getSelection();
-      const selectedText = selection.toString()
-      if (!selectedText || this.lastSelectedText === selectedText) return
-      this.lastSelectedText = selectedText
-    },
-    showAssets() {
-      this.$emit('assets')
-    },
-    showAi() {
-      this.isShowAi = !this.isShowAi
-    },
-    exportImg(e) {
-      this.uploadFile(e, this.uploadImage).then(r => {
-        this.paintShow = false
-        this.imgHtml(r.data)
-      })
-    },
-    paintText() {
-      return this.toolbar.filter(x => x.key === 'paint')[0]?.title
-    },
-    paintCancel() {
-      this.paintShow = false
-    },
-    changeAlign(tag) {
-      // 图片对齐方式
-      this.editor.chain().setTextAlign(tag).run()
-    },
-    changePercent(e) {
-      // 改变图片百分比
-      if(parseInt(e.target.value) > 100) {
-        this.imgSizeVal = 100
-        this.editor.chain().setImageWidth('100%').focus().run()
-      } else if(parseInt(e.target.value) < 10) {
-
-      } else {
-        if(this.lock) {
-          this.lock = false
-          setTimeout(() => {
-            this.editor.chain().setImageWidth(e.target.value + '%').focus().run()
-            this.lock = true
-          }, 500)
-        }
-      }
-    },
-    shouldShowFn({ editor, view, state, oldState, from, to }) {
-      // BubbleMenu是否显示
-      this.$nextTick(() => {
-        this.showBubble =  editor.isActive('image')
-        if(editor.isActive('image')) {
-          this.imgSizeVal = parseInt(this.editor.getAttributes('image').width)
-        } else {
-          this.imgSizeVal = ''
-        }
-      })
-      return editor.isActive('image')
-    },
-    speechDown(e) {
-      this.speech = {
-        x: e.clientX - e.offsetX,
-        y: e.clientY - e.offsetY,
-      }
-    },
-    mousedown(event) {
-      event.preventDefault()
-      //鼠标按下事件
-      this.left = event.offsetX;
-      this.top = event.offsetY;
-      this.isMove = true
-    },
-    mouseup() {
-      this.isMove = false
-      setTimeout(() => {
-        this.limits = false
-      },10)
-    },
-    // 粘贴文本处理
-    preventPaste(event) {
-      if(!this.readOnly) return
-      // 删除选中的文本
-      this.editor.chain().focus().deleteSelection().run()
-      const text = event.clipboardData.getData('text/plain');
-      // const text2 = text.replace(/[\r\n]/g, '').replace(/\s*/g, '')
-      // this.editor.chain().focus().insertContentAt(this.selection(), text2).run()
-      const textArr = text.split(/[\r\n]/g)
-      textArr.forEach((item,index) => {
-        if(index === 0) {
-          this.editor.chain().focus().insertContentAt(this.selection(), item).run()
-        }else {
-          this.editor.chain().focus().insertContentAt(this.selection(), `<p>${item}</p>`).run()
-        }
-      })
-    },
-    addContent(text) {
-      const text2 = text.replace(/[\r\n]/g, '').replace(/\s*/g, '')
-      this.editor.chain().focus().insertContentAt(this.selection(), text2).run()
-    },
-    to16kHz(audioData, sampleRate = 44100) {
-      const data = new Float32Array(audioData);
-      const fitCount = Math.round(data.length * (16000 / sampleRate));
-      const newData = new Float32Array(fitCount);
-      const springFactor = (data.length - 1) / (fitCount - 1);
-      newData[0] = data[0];
-      for (let i = 1; i < fitCount - 1; i++) {
-        const tmp = i * springFactor;
-        const before = Math.floor(tmp).toFixed();
-        const after = Math.ceil(tmp).toFixed();
-        const atPoint = tmp - before;
-        newData[i] = data[before] + (data[after] - data[before]) * atPoint;
-      }
-      newData[fitCount - 1] = data[data.length - 1];
-      return newData;
-    },
-    to16BitPCM(input) {
-      const dataLength = input.length * (16 / 8);
-      const dataBuffer = new ArrayBuffer(dataLength);
-      const dataView = new DataView(dataBuffer);
-      let offset = 0;
-      for (let i = 0; i < input.length; i++, offset += 2) {
-        const s = Math.max(-1, Math.min(1, input[i]));
-        dataView.setInt16(offset, s < 0 ? s * 0x8000 : s * 0x7fff, true);
-      }
-      return dataView;
-    },
-    getAudioSuccess() {
-      let that = this
-      const mediaStreamSource = that.recorder.audioInput
-      // 创建一个音频分析对象，采样的缓冲区大小为0（自动适配），输入和输出都是单声道
-      const scriptProcessor = that.recorder.context.createScriptProcessor(1024, 1, 1);
-      scriptProcessor.onaudioprocess = (e) => {
-        // 去处理音频数据
-        const inputData = e.inputBuffer.getChannelData(0)
-        const output = that.to16kHz(inputData, that.recorder.context.sampleRate);
-        const audioData = that.to16BitPCM(output);
-        that.audioData.push(...new Int8Array(audioData.buffer));
-        if (that.audioData.length > 10240) {
-          const audioDataArray = new Int8Array(that.audioData);
-          that.ws.send(audioDataArray)
-          that.audioData = [];
-        }
-      }
-      mediaStreamSource.connect(scriptProcessor);
-      scriptProcessor.connect(that.recorder.context.destination);
-    },
-    voice() {
-      this.voiceStatus = !this.voiceStatus
-      this.limits = false
-      if(this.voiceStatus) {
-        this.recorder.start().then(() => { // 开始录音
-          this.audioData  = []
-          this.x = this.speech.x - 85
-          const h = this.height.split('px')[0]
-          this.y = this.speech.y + ((this.height === '100%') ? 40 : Number(h) - 10)
-          this.voiceShows = this.voiceStatus
-          this.appID()
-        }, () => {
-          Mess({
-            type: 'text',
-            cancelShow: false,
-            promptContent: '录音失败，请检查麦克风是否可用'
-          })
-        });
-      }else {
-        this.close()
-      }
-    },
-    close() {
-      if(this.ws === null) return
-      // this.toolbar.map(x => {
-      //   if (x.key === 'speech') {
-      //     x.active = false
-      //   }
-      //   return x
-      // })
-      this.voiceStatus = false
-      this.voiceShows = this.voiceStatus
-      this.ws?.send(JSON.stringify({"type":"CANCEL"}))
-      this.ws?.close()
-      this.ws = null
-      this.recorder.stop() // 停止录音
-      this.recorder.destroy()
-    },
-    webSocketInit() {
-      const _this = this
-      this.ws = new WebSocket(`wss://vop.baidu.com/realtime_asr?sn=${this.getRandomCode(15)}`)
-      this.ws.binaryType = 'arraybuffer'
-      this.ws.onopen = function () {
-        _this.error = false
-        const json = {
-          type: 'START',
-          data: {
-            // 百度实时转译 appid appkey
-            appid: Number(_this.appData.appId),
-            appkey: _this.appData.key,
-            // appid: 101913097,
-            // appkey: 'xv9715uwu2jqkTmIzlJl8eGx',
-            dev_pid: 15372,
-            cuid: _this.appData.secret,
-            format: 'pcm',
-            sample: 16000,
-          }
-        }
-        _this.ws.send(JSON.stringify(json))
-        _this.getAudioSuccess()
-      }
-      this.ws.onmessage = function (e) {
-        const data = JSON.parse(e.data)
-        if(data.err_no === 0){
-          const json = _this.editor.getJSON()
-          const index = _this.editor.state.selection.$anchor.path[1]
-          if(data.start_time === _this.time.start_time) {
-            const text = json.content[index].content[0].text
-            json.content[index].content[0].text = text.slice(0, text.length - _this.time.result.length) + data.result
-            _this.editor.commands.setContent(json)
-          }else {
-            _this.editor.chain().focus().insertContentAt(_this.selection(), data.result).run()
-          }
-          _this.time = data
-        }
-      }
-      this.ws.onerror = function () {
-        // 连接失败重连
-        setTimeout(() => {
-          _this.webSocketInit()
-        }, 5000)
-      }
-    },
-    appID() {
-      let token = null
-      let remember = localStorage.getItem('remember')
-      if(remember === '1') {
-        token = localStorage.getItem('sessionId')
-      }else {
-        token = sessionStorage.getItem('sessionId')
-      }
-      const xhr = new XMLHttpRequest()
-      // xhr.open('GET', 'http://192.168.15.124:8888/zydx/voice/getDesKeyId')
-      // xhr.setRequestHeader('Authorization', '7a129186-7e51-431d-b965-735dfed8e459')
-      xhr.open('GET', `/${window.linkApi.apiPrefix?window.linkApi.apiPrefix:'zydx'}/voice/getVoideKey`)
-      xhr.setRequestHeader('Authorization', token)
-      this.error = true
-      xhr.onreadystatechange = () => {
-        if (xhr.readyState === 4) {
-          if (xhr.status === 200) {
-            this.appData = JSON.parse(xhr.responseText).data
-            this.webSocketInit()
-          }
-        }
-      }
-      xhr.send()
-    },
-    enclosureAction(v) {
-      return v.map(x => {
-        x.active = true
-        return x
-      })
-    },
-    randomId() { // 生成随机id
-      const id = Math.random().toString(36).substr(2)
-      return id.replace(/[0-9]/g, '')
-    },
-    del(index) {
-      let that = this
-      that.data.html = html2json(that.editor.getHTML()).child
-      if (!this.uploadAttData[index].name) {
-        that.uploadAttData[index].active = false
-        that.$emit('del', that.uploadAttData[index], (e) => {
-          if (!e) {
-            that.uploadAttData.splice(index, 1)
-          } else {
-            if (e) {
-              that.uploadAttData.splice(index, 1)
-            } else {
-              that.uploadAttData[index].active = true
-            }
-          }
-        })
-      } else {
-        this.$emit('syncDel', {syncDel: true, index: index, data: that.uploadAttData[index] }) // 为了同步当前组件和父组件附件的数据（新加的syncDel，使用原来的del怕有问题）
-        that.uploadAttData.splice(index, 1)
-      }
-    },
-    see(index) {
-      this.$emit('see', this.uploadAttData[index])
-    },
-    uploadFile(file, data) {
-      return new Promise((rl) => {
-        const meta = data.meta ? Object.keys(data.meta) : []
-        const param = new FormData()
-        param.append('file', file)
-        for (let i = 0; i < meta.length; i++) {
-          param.append(meta[i], data.meta[meta[i]])
-        }
-        const xhr = new XMLHttpRequest()
-        xhr.open('POST', data.server)
-        const headers = Object.keys(data.headers)
-        for (let i = 0; i < headers.length; i++) {
-          xhr.setRequestHeader(headers[i], data.headers[headers[i]])
-        }
-        xhr.onreadystatechange = () => {
-          if (xhr.readyState === 4) {
-            if (xhr.status === 200) {
-              const text = JSON.parse(xhr.responseText)
-              if(text.code === '200') {
-                rl(text)
-              }else {
-                Mess({
-                  type: 'text',
-                  cancelShow: false,
-                  promptContent: text.msg
-                })
-              }
-            }
-          }
-        }
-        xhr.send(param)
-      })
-    },
-    upload(e, v) { // 上传文件
-      const file = e.target.files[0]
-      if (this.uploadType) {
-        if (v === 'uploadAtt') {
-          file.active = true
-          this.uploadAttData.push(file)
-          this.$emit('updateData', {
-            html: html2json(this.editor.getHTML()).child,
-            enclosure: this.uploadAttData
-          })
-        } else {
-          this.uploadFile(file, this.uploadImage).then(r => {
-            if (r.code === '200') {
-              this.imgHtml(r.data)
-            } else {
-              this.uploadImage.onFailed(r)
-            }
-          })
-        }
-      } else {
-        this.uploadFile(file, (v === 'uploadAtt') ? this.uploadAttachment : this.uploadImage).then(r => {
-          if (v === 'uploadAtt') {
-            if (r.data.annex) {
-              r.data.annex.active = true
-              this.uploadAttData.push(r.data.annex)
-              this.$emit('enclosureSuccess', r.data.annex, html2json(this.editor.getHTML()).child)
-            } else if (r.data) { // 学生端-生问生答-问答=提问详情及回答-实施回答的上传附件返回r.data
-              r.data.active = true
-              this.uploadAttData.push(r.data)
-              this.$emit('enclosureSuccess', r.data, html2json(this.editor.getHTML()).child)
-            } else {
-              file.active = true
-              this.uploadAttData.push(file)
-              this.$emit('updateData', {
-                html: html2json(this.editor.getHTML()).child,
-                enclosure: this.uploadAttData
-              })
-            }
-          } else {
-            this.imgHtml(r.data)
-          }
-        })
-      }
-      e.target.value = ''
-    },
-    imgHtml(data) { // 插入图片
-      setTimeout(() => {
-        const url = this.uploadImage.url + data
-        const cla = this.randomId()
-        const html = `<p class="imgCont ${cla}"><img src="${url}" alt="" width=""/></p>`
-        this.editor.chain().focus().insertContentAt(this.selection(), html).run()
-        if (this.selection() <= 6 && this.selection() > 2) this.selectionClass2(cla)
-        if (this.selectionClass(cla)) {
-          this.editor.chain().focus().insertContentAt(this.selection(), '<p></p>').run()
-        }
-      }, 100)
-    },
-    // selectImg(cla) {
-    //     this.$nextTick(() => {
-    //         const images = this.$refs.editorRef.rootEl.querySelectorAll('img');
-    //         const claDom = this.$refs.editorRef.rootEl.getElementsByClassName(cla);
-    //         claDom[0].insertAdjacentHTML('beforeend', `<p class="tips ${cla}" style="color: red">新的段落</p>`)
-    //         images.forEach(img => {
-    //             img.addEventListener('mouseenter', this.handleImageClick);
-    //             img.addEventListener('mouseleave', this.handleImageClick);
-    //         });
-    //     });
-    // },
-    // handleImageClick(text) {
-    //     console.log('mouseenter==>>>>',text)
-    // },
-    insertContent(v) {
-      for (let i = 0; i < v.length; i++) {
-        let html = json2html(v[i])
-        this.editor.chain().focus().insertContentAt(this.selection(), html).run()
-      }
-    },
-    // 查询class
-    selectionClass(v) {
-      const json = this.editor.getJSON()
-      for (let i = 0; i < json.content.length; i++) {
-        const val = json.content[i].attrs?.titleId?.split(' ')[1]
-        if (val === v) {
-          if (json.content[i + 1] === undefined) return true
-          break
-        }
-      }
-      return false
-    },
-    selectionClass2(v) {
-      const json = this.editor.getJSON()
-      for (let i = 0; i < json.content.length; i++) {
-        const val = json.content[i].attrs?.titleId?.split(' ')[1]
-        if (val === v) {
-          json.content.splice(i - 1, 1)
-          this.editor?.commands.setContent(json)
-          break
-        }
-      }
-    },
-    enclosureContent(v) {
-      this.uploadAttData = [...this.uploadAttData, ...this.enclosureAction(v)]
-    },
-    download(index) {
-      this.$emit('download', this.uploadAttData[index])
-    },
-    selection() {
-      const {from} = this.editor.state.selection
-      return from
-    },
-    complete() {
-      if (this.uploadAttData.length > 0) {
-        this.$emit('complete', {
-          html: this.getData(),
-          enclosure: this.uploadAttData
-        })
-      } else {
-        this.$emit('complete', {html: this.getData()})
-      }
-    },
-    // 获取编辑器内容
-    getContent(el) {
-      // 编辑器内容转json
-      if (this.uploadAttData.length > 0) {
-        el({
-          html: this.getData(),
-          enclosure: this.uploadAttData
-        })
-      } else {
-        el({html: this.getData()})
-      }
-    },
-    getData() {
-      const html = this.editor.getHTML()
-      const json = html2json(html)
-      return json.child
-    },
-    toolTap(v) {
-      // 获取当前选中的节点
-      const {$anchor} = this.editor.state.selection
-      if ($anchor.path[3].attrs.titleId === 'source') {
-        let html = this.editor.getHTML()
-        html += '<p></p>'
-        this.editor.commands.setContent(html)
-      }
-      if (v === 'add') {
-        let html = this.editor.getHTML()
-        html += '<p class="source" style="text-align: right;"></p>'
-        this.editor.commands.setContent(html)
-      }
-      if (v === 'lookUp') {
-        let html = this.editor.getHTML()
-        html = '<p class="lookUp" style="text-align: left;"></p>' + html
-        this.editor.commands.setContent(html)
-        this.editor.chain().focus().setTextSelection(0).run()
-      }
-      // if (v === 'h1') this.editor.chain().focus().setFontSize('18px').setBold().run()
-      // if (v === 'h2') this.editor.chain().focus().setFontSize('16px').setBold().run()
-      // if (v === 'h3') this.editor.chain().focus().setFontSize('14px').setBold().run()
-      if(v === 'h1') this.editor.chain().focus().setBold().setFontSize('18px').run()
-      if(v === 'h2') this.editor.chain().focus().setBold().setFontSize('16px').run()
-      if(v === 'h3') this.editor.chain().focus().setBold().setFontSize('14px').run()
-
-      if (v === 'p') {
-        this.editor.chain().focus().setFontSize('14px').unsetBold().run()
-      }
-      if (v === 'bold') this.editor.chain().focus().toggleBold().run()
-      if (v === 'center' || v === 'left' || v === 'right') this.editor.chain().focus().setTextAlign(v).run()
-      if (v === 'centerH2') {
-        this.editor.chain().focus().setFontSize('16px').setTextAlign('center').run()
-        this.editor.chain().focus().setBold().run()
-      }
-      if (v === 'leftH2') {
-        this.editor.chain().focus().setFontSize('16px').setTextAlign('left').run()
-        this.editor.chain().focus().setBold().run()
-      }
-      if (v === 'rightH2') {
-        this.editor.chain().focus().setFontSize('16px').setTextAlign('right').run()
-        this.editor.chain().focus().setBold().run()
-      }
-      if(v === 'paint') this.paintShow = true
-    },
-    getRandomCode(length) {
-      if (length > 0) {
-        let data = ["0", "1", "2", "3", "4", "5", "6", "7", "8", "9", "A", "B", "C", "D", "E", "F", "G", "H", "I", "J", "K", "L", "M", "N", "O", "P", "Q", "R", "S", "T", "U", "V", "W", "X", "Y", "Z", "a", "b", "c", "d", "e", "f", "g", "h", "i", "j", "k", "l", "m", "n", "o", "p", "q", "r", "s", "t", "u", "v", "w", "x", "y", "z"];
-        let nums = "";
-        for (let i = 0; i < length; i++) {
-          let r = parseInt(Math.random() * 61);
-          nums += data[r];
-        }
-        return nums.replace(/(.{4})/g, "$1-");
-      } else {
-        return false;
-      }
-    }
-  }
-}
+// import Recorder from 'js-audio-recorder'
+// import {html2json, json2html} from '../../utils/html2json.js'
+// import {Editor, EditorContent, BubbleMenu} from '@tiptap/vue-3'
+// import StarterKit from '@tiptap/starter-kit'
+// import Image from '@tiptap/extension-image'
+// import TextAlign from '@tiptap/extension-text-align'
+// import Heading from '@tiptap/extension-heading'
+// import Placeholder from '@tiptap/extension-placeholder'
+// import Color from '@tiptap/extension-color'
+// import textStyle from '@tiptap/extension-text-style'
+// import {sid} from "./sign-id";
+// import {FontSize} from "./font-size";
+// import {titleId} from "./title-id";
+// import {CustomImage} from "./image-size";
+// import {Contenteditable} from "./contenteditable";
+// import svgs from "./level";
+// import Mess from '../../tipBox/index'
+// import Paint from '../../paint/src/paint'
+// import alignmentModeCenter from './img/center.png'
+// import alignmentModeLeft from './img/left.png'
+// import alignmentModeRight from './img/right.png'
+//
+// import zydxChat from '../../chat/src/chat.vue'
+//
+// export default {
+//   name: 'zydx-xiao-editor',
+//   components: {
+//     EditorContent,
+//     BubbleMenu,
+//     svgs,
+//     Paint,
+//     zydxChat
+//   },
+//   data() {
+//     return {
+//       alignmentModeLeft: alignmentModeLeft,
+//       alignmentModeCenter: alignmentModeCenter,
+//       alignmentModeRight: alignmentModeRight,
+//       uploadAttData: [],
+//       editor: null,
+//       heightStyle: {},
+//       heightStyleCont: {},
+//       voiceStatus: false,
+//       showBubble: true,
+//       recorder: null,
+//       ws: null,
+//       audioContext: null,
+//       audioData: [],
+//       vol: 0,
+//       appData: {},
+//       error: false,
+//       time: {},
+//       toolbars: [],
+//       left: 0,
+//       top: 0,
+//       isMove: false,
+//       x: 0,
+//       y: 0,
+//       speech: {},
+//       limits: false,
+//       voiceShows: false,
+//       lock: true,
+//       editorRef: null,
+//       imgSizeVal: '',
+//       currentImgDom: {},
+//       paintShow: false,
+//       isShowAi: false,
+//       lastSelectedText: '',
+//       updateInit: false,
+//     }
+//   },
+//   beforeUnmount() {
+//     this.editor?.destroy()
+//     this.recorder?.destroy()
+//     this.ws?.send(JSON.stringify({"type":"CANCEL"}))
+//     this.ws?.close()
+//     this.ws = null
+//     // document.removeEventListener('selectstart', this.selectstartfn);
+//     // document.removeEventListener('mouseup', this.getSelectedText)
+//   },
+//   props: {
+//     apiPrefix: {
+//       type: String,
+//       default: 'zydx'
+//     },
+//     isShowWhiteboarde: {
+//       type: Boolean,
+//       default: true
+//     },
+//     isShowAiTool: {
+//       type: Boolean,
+//       default: true
+//     },
+//     titleVertical: {
+//       type: Boolean,
+//       default: false
+//     },
+//     data: {
+//       type: Object,
+//       default: () => {
+//       }
+//     },
+//     toolbar: {
+//       type: Array,
+//       default: () => []
+//     },
+//     title: {
+//       type: String,
+//       default: ''
+//     },
+//     enclosureText: {
+//       type: String,
+//       default: '附件列表：'
+//     },
+//     titleStyle: {
+//       type: Object,
+//       default: {
+//         'font-size': '16px',
+//         'font-weight': 'bold',
+//         'color': '#333'
+//       }
+//     },
+//     enclosureStyle: {
+//       type: Object,
+//       default: {
+//         'font-size': '16px',
+//         'font-weight': 'bold',
+//         'color': '#000',
+//         'text-indent': '1.9em'
+//       }
+//     },
+//     readOnly: {
+//       type: Boolean,
+//       default: true
+//     },
+//     butText: {
+//       type: String,
+//       default: ''
+//     },
+//     height: {
+//       type: String,
+//       default: '200px'
+//     },
+//     uploadImage: {
+//       type: Object,
+//       default: () => {}
+//     },
+//     uploadAttachment: {
+//       type: Object,
+//       default: () => {}
+//     },
+//     delShow: {
+//       type: Boolean,
+//       default: true
+//     },
+//     titleShow: {
+//       type: Boolean,
+//       default: true
+//     },
+//     uploadType: {
+//       type: Boolean,
+//       default: false
+//     },
+//     info: {
+//       type: String,
+//       default: ''
+//     },
+//     editorShow: {
+//       type: Boolean,
+//       default: true
+//     },
+//     borderShow: {
+//       type: Boolean,
+//       default: true
+//     },
+//     enclosureShow: {
+//       type: Boolean,
+//       default: true
+//     },
+//     downloadShow: {
+//       type: Boolean,
+//       default: true
+//     },
+//     placeholder: {
+//       type: String,
+//       default: '请输入内容'
+//     },
+//     voiceShow: {
+//       type: Boolean,
+//       default: true
+//     },
+//     numberStyle: {
+//       type: Boolean,
+//       default: false
+//     },
+//     disabled: {
+//       type: Boolean,
+//       default: false
+//     },
+//     enclosureButton: {
+//       type: Object,
+//       default: () => {}
+//     },
+//     updateStatus: {
+//       type: Boolean,
+//       default: false
+//     },
+//     downName: {
+//       type: Array,
+//       default: () => []
+//     }
+//   },
+//   emits: ['see', 'del', 'complete', 'update:data', 'enclosureSuccess', 'download', 'updateData', 'syncDel','assets'],
+//   watch: {
+//     // 强制监听data变化
+//     data: {
+//       handler: function (e) {
+//         if(this.updateInit) return
+//         if(this.updateStatus) this.updateInit = true
+//         this.editor?.commands.setContent(json2html({node: "root", child: this.dataChange(e).html}))
+//         this.uploadAttData = this.dataChange(e).enclosure
+//       },
+//       deep: true
+//     },
+//     readOnly: {
+//       handler: function (e) {
+//         this.editor.setOptions({
+//           editable: e
+//         })
+//       },
+//       deep: true
+//     },
+//     toolbar: {
+//       handler: function (e) {
+//         let status = null
+//         let upload = null
+//         let title = null
+//         this.toolbars = []
+//         e.forEach(x => {
+//           if(x.key === 'but') {
+//             status = x
+//           } else if (x.key === 'uploadAtt') {
+//             upload = x
+//           }else if(['h1','h2','h3','h4','h5','h6'].includes(x.key)) {
+//             title = {key: 'h', title: '标题'}
+//           }else {
+//             this.toolbars.push(x)
+//           }
+//         })
+//         if(title) this.toolbars.unshift(title) // 标题
+//         if(this.isShowWhiteboarde) this.toolbars.push({key: 'paint', title: '插入手写'})
+//         if(upload) this.toolbars.push(upload) // 上传附件
+//         if(this.voiceShow) this.toolbars.push({key: 'voice', title: '语音输入'})
+//         if(status) this.toolbars.push(status) // 之定义按钮
+//         if(this.isShowAiTool) this.toolbars.push({key: 'ai', title: 'AI助手'})
+//         console.log(this.toolbars)
+//       },
+//       immediate: true
+//     },
+//     disabled: {
+//       handler: function (e) {
+//         this.editor.setOptions({
+//           editable: this.readOnly ?(!e):this.readOnly
+//         })
+//       },
+//       deep: true
+//     }
+//   },
+//   mounted() {
+//     let _this = this
+//     this.uploadAttData = this.dataChange(this.data).enclosure
+//     this.heightStyle = (this.height === '100%') ? {height: '100%'} : {'min-height': this.height}
+//     const height = this.height.split('px')[0] - 44
+//     this.heightStyleCont = (this.height === '100%') ? {height: 'calc(100% - 44px)'} : {'min-height': `${height}px`}
+//     this.editor = new Editor({
+//       content: json2html({node: "root", child: this.dataChange(this.data).html }),
+//       editable: this.readOnly ?(!this.disabled):this.readOnly ,
+//       enablePasteRules: true,
+//       extensions: [
+//         sid,
+//         textStyle,
+//         FontSize,
+//         titleId,
+//         CustomImage,
+//         Contenteditable,
+//         Heading.configure({
+//           levels: [1, 2, 3], // 启用 h1/h2/h3（按需调整）
+//           // 可选：自定义 H3 的 HTML 属性（如 class）
+//           HTMLAttributes: {
+//             class: 'tiptap-h3' // 给所有标题添加统一类名（方便样式定制）
+//           }
+//         }),
+//         Color.configure({
+//           types: ['textStyle'],
+//         }),
+//         Placeholder.configure({
+//           placeholder: this.placeholder,
+//         }),
+//         TextAlign.configure({
+//           types: ['heading', 'paragraph'],
+//         }),
+//         Image.configure({
+//           inline: true,
+//           HTMLAttributes: {
+//             class: `editor-img`,
+//           }
+//         }),
+//         StarterKit,
+//       ],
+//       onUpdate: ({editor}) => {
+//         _this.$emit('updateData', {
+//           html: html2json(editor.getHTML()).child,
+//           enclosure: this.uploadAttData
+//         })
+//       },
+//       onBlur: () => {
+//         _this.limits = false
+//         _this.close()
+//       },
+//       // 获取焦点
+//       onFocus: () => {
+//         this.limits = true
+//       },
+//     })
+//     document.addEventListener('keydown', function (e) {
+//       if (e.keyCode === 8 || e.keyCode === 46) {
+//         const sid = _this.editor.state.selection.$anchor.parent.attrs.sid
+//         if (sid === 'prohibit') {
+//           _this.editor.setEditable(false);
+//           setTimeout(() => {
+//             _this.editor.setEditable(true);
+//           }, 0);
+//         }
+//       }
+//     })
+//     // 初始化录音
+//     this.recorder = new Recorder({
+//       sampleBits: 16, // 采样位数，支持 8 或 16，默认是16
+//       sampleRate: 16000, // 采样率，支持 11025、16000、22050、24000、44100、48000，根据浏览器默认值，我的chrome是48000
+//       numChannels: 1, // 声道，支持 1 或 2， 默认是1
+//     })
+//     this.recorder.onprogress = function (params) {
+//       _this.vol = params.vol
+//     }
+//     document.addEventListener('mousemove', (event) => {
+//       if (!this.isMove) return
+//       this.limits = true
+//       this.x = event.clientX - this.left;
+//       this.y = event.clientY - this.top;
+//     })
+//     document.addEventListener('click', () => {
+//       if(this.limits) return
+//       this.close()
+//     })
+//   },
+//   methods: {
+//     dataChange(e) {
+//       if(!e) return {html: [], enclosure: []}
+//       const html = e.html === undefined || e.html === null || e.html === 'null' ? [] : e.html
+//       const enclosure = (e.enclosure === undefined || e.enclosure === null || e.enclosure === 'null') ? [] : this.enclosureAction(e.enclosure)
+//       return {html: html, enclosure: enclosure}
+//     },
+//     getSelectedText(e) {
+//       const selection = window.getSelection();
+//       const selectedText = selection.toString()
+//       if (!selectedText || this.lastSelectedText === selectedText) return
+//       this.lastSelectedText = selectedText
+//     },
+//     showAssets() {
+//       this.$emit('assets')
+//     },
+//     showAi() {
+//       this.isShowAi = !this.isShowAi
+//     },
+//     exportImg(e) {
+//       this.uploadFile(e, this.uploadImage).then(r => {
+//         this.paintShow = false
+//         this.imgHtml(r.data)
+//       })
+//     },
+//     paintText() {
+//       return this.toolbar.filter(x => x.key === 'paint')[0]?.title
+//     },
+//     paintCancel() {
+//       this.paintShow = false
+//     },
+//     changeAlign(tag) {
+//       // 图片对齐方式
+//       this.editor.chain().setTextAlign(tag).run()
+//     },
+//     changePercent(e) {
+//       // 改变图片百分比
+//       if(parseInt(e.target.value) > 100) {
+//         this.imgSizeVal = 100
+//         this.editor.chain().setImageWidth('100%').focus().run()
+//       } else if(parseInt(e.target.value) < 10) {
+//
+//       } else {
+//         if(this.lock) {
+//           this.lock = false
+//           setTimeout(() => {
+//             this.editor.chain().setImageWidth(e.target.value + '%').focus().run()
+//             this.lock = true
+//           }, 500)
+//         }
+//       }
+//     },
+//     shouldShowFn({ editor, view, state, oldState, from, to }) {
+//       // BubbleMenu是否显示
+//       this.$nextTick(() => {
+//         this.showBubble =  editor.isActive('image')
+//         if(editor.isActive('image')) {
+//           this.imgSizeVal = parseInt(this.editor.getAttributes('image').width)
+//         } else {
+//           this.imgSizeVal = ''
+//         }
+//       })
+//       return editor.isActive('image')
+//     },
+//     speechDown(e) {
+//       this.speech = {
+//         x: e.clientX - e.offsetX,
+//         y: e.clientY - e.offsetY,
+//       }
+//     },
+//     mousedown(event) {
+//       event.preventDefault()
+//       //鼠标按下事件
+//       this.left = event.offsetX;
+//       this.top = event.offsetY;
+//       this.isMove = true
+//     },
+//     mouseup() {
+//       this.isMove = false
+//       setTimeout(() => {
+//         this.limits = false
+//       },10)
+//     },
+//     // 粘贴文本处理
+//     preventPaste(event) {
+//       if(!this.readOnly) return
+//       // 删除选中的文本
+//       this.editor.chain().focus().deleteSelection().run()
+//       const text = event.clipboardData.getData('text/plain');
+//       // const text2 = text.replace(/[\r\n]/g, '').replace(/\s*/g, '')
+//       // this.editor.chain().focus().insertContentAt(this.selection(), text2).run()
+//       const textArr = text.split(/[\r\n]/g)
+//       textArr.forEach((item,index) => {
+//         if(index === 0) {
+//           this.editor.chain().focus().insertContentAt(this.selection(), item).run()
+//         }else {
+//           this.editor.chain().focus().insertContentAt(this.selection(), `<p>${item}</p>`).run()
+//         }
+//       })
+//     },
+//     addContent(text) {
+//       const text2 = text.replace(/[\r\n]/g, '').replace(/\s*/g, '')
+//       this.editor.chain().focus().insertContentAt(this.selection(), text2).run()
+//     },
+//     to16kHz(audioData, sampleRate = 44100) {
+//       const data = new Float32Array(audioData);
+//       const fitCount = Math.round(data.length * (16000 / sampleRate));
+//       const newData = new Float32Array(fitCount);
+//       const springFactor = (data.length - 1) / (fitCount - 1);
+//       newData[0] = data[0];
+//       for (let i = 1; i < fitCount - 1; i++) {
+//         const tmp = i * springFactor;
+//         const before = Math.floor(tmp).toFixed();
+//         const after = Math.ceil(tmp).toFixed();
+//         const atPoint = tmp - before;
+//         newData[i] = data[before] + (data[after] - data[before]) * atPoint;
+//       }
+//       newData[fitCount - 1] = data[data.length - 1];
+//       return newData;
+//     },
+//     to16BitPCM(input) {
+//       const dataLength = input.length * (16 / 8);
+//       const dataBuffer = new ArrayBuffer(dataLength);
+//       const dataView = new DataView(dataBuffer);
+//       let offset = 0;
+//       for (let i = 0; i < input.length; i++, offset += 2) {
+//         const s = Math.max(-1, Math.min(1, input[i]));
+//         dataView.setInt16(offset, s < 0 ? s * 0x8000 : s * 0x7fff, true);
+//       }
+//       return dataView;
+//     },
+//     getAudioSuccess() {
+//       let that = this
+//       const mediaStreamSource = that.recorder.audioInput
+//       // 创建一个音频分析对象，采样的缓冲区大小为0（自动适配），输入和输出都是单声道
+//       const scriptProcessor = that.recorder.context.createScriptProcessor(1024, 1, 1);
+//       scriptProcessor.onaudioprocess = (e) => {
+//         // 去处理音频数据
+//         const inputData = e.inputBuffer.getChannelData(0)
+//         const output = that.to16kHz(inputData, that.recorder.context.sampleRate);
+//         const audioData = that.to16BitPCM(output);
+//         that.audioData.push(...new Int8Array(audioData.buffer));
+//         if (that.audioData.length > 10240) {
+//           const audioDataArray = new Int8Array(that.audioData);
+//           that.ws.send(audioDataArray)
+//           that.audioData = [];
+//         }
+//       }
+//       mediaStreamSource.connect(scriptProcessor);
+//       scriptProcessor.connect(that.recorder.context.destination);
+//     },
+//     voice() {
+//       this.voiceStatus = !this.voiceStatus
+//       this.limits = false
+//       if(this.voiceStatus) {
+//         this.recorder.start().then(() => { // 开始录音
+//           this.audioData  = []
+//           this.x = this.speech.x - 85
+//           const h = this.height.split('px')[0]
+//           this.y = this.speech.y + ((this.height === '100%') ? 40 : Number(h) - 10)
+//           this.voiceShows = this.voiceStatus
+//           this.appID()
+//         }, () => {
+//           Mess({
+//             type: 'text',
+//             cancelShow: false,
+//             promptContent: '录音失败，请检查麦克风是否可用'
+//           })
+//         });
+//       }else {
+//         this.close()
+//       }
+//     },
+//     close() {
+//       if(this.ws === null) return
+//       // this.toolbar.map(x => {
+//       //   if (x.key === 'speech') {
+//       //     x.active = false
+//       //   }
+//       //   return x
+//       // })
+//       this.voiceStatus = false
+//       this.voiceShows = this.voiceStatus
+//       this.ws?.send(JSON.stringify({"type":"CANCEL"}))
+//       this.ws?.close()
+//       this.ws = null
+//       this.recorder.stop() // 停止录音
+//       this.recorder.destroy()
+//     },
+//     webSocketInit() {
+//       const _this = this
+//       this.ws = new WebSocket(`wss://vop.baidu.com/realtime_asr?sn=${this.getRandomCode(15)}`)
+//       this.ws.binaryType = 'arraybuffer'
+//       this.ws.onopen = function () {
+//         _this.error = false
+//         const json = {
+//           type: 'START',
+//           data: {
+//             // 百度实时转译 appid appkey
+//             appid: Number(_this.appData.appId),
+//             appkey: _this.appData.key,
+//             // appid: 101913097,
+//             // appkey: 'xv9715uwu2jqkTmIzlJl8eGx',
+//             dev_pid: 15372,
+//             cuid: _this.appData.secret,
+//             format: 'pcm',
+//             sample: 16000,
+//           }
+//         }
+//         _this.ws.send(JSON.stringify(json))
+//         _this.getAudioSuccess()
+//       }
+//       this.ws.onmessage = function (e) {
+//         const data = JSON.parse(e.data)
+//         if(data.err_no === 0){
+//           const json = _this.editor.getJSON()
+//           const index = _this.editor.state.selection.$anchor.path[1]
+//           if(data.start_time === _this.time.start_time) {
+//             const text = json.content[index].content[0].text
+//             json.content[index].content[0].text = text.slice(0, text.length - _this.time.result.length) + data.result
+//             _this.editor.commands.setContent(json)
+//           }else {
+//             _this.editor.chain().focus().insertContentAt(_this.selection(), data.result).run()
+//           }
+//           _this.time = data
+//         }
+//       }
+//       this.ws.onerror = function () {
+//         // 连接失败重连
+//         setTimeout(() => {
+//           _this.webSocketInit()
+//         }, 5000)
+//       }
+//     },
+//     appID() {
+//       let token = null
+//       let remember = localStorage.getItem('remember')
+//       if(remember === '1') {
+//         token = localStorage.getItem('sessionId')
+//       }else {
+//         token = sessionStorage.getItem('sessionId')
+//       }
+//       const xhr = new XMLHttpRequest()
+//       // xhr.open('GET', 'http://192.168.15.124:8888/zydx/voice/getDesKeyId')
+//       // xhr.setRequestHeader('Authorization', '7a129186-7e51-431d-b965-735dfed8e459')
+//       xhr.open('GET', `/${window.linkApi.apiPrefix?window.linkApi.apiPrefix:'zydx'}/voice/getVoideKey`)
+//       xhr.setRequestHeader('Authorization', token)
+//       this.error = true
+//       xhr.onreadystatechange = () => {
+//         if (xhr.readyState === 4) {
+//           if (xhr.status === 200) {
+//             this.appData = JSON.parse(xhr.responseText).data
+//             this.webSocketInit()
+//           }
+//         }
+//       }
+//       xhr.send()
+//     },
+//     enclosureAction(v) {
+//       return v.map(x => {
+//         x.active = true
+//         return x
+//       })
+//     },
+//     randomId() { // 生成随机id
+//       const id = Math.random().toString(36).substr(2)
+//       return id.replace(/[0-9]/g, '')
+//     },
+//     del(index) {
+//       let that = this
+//       that.data.html = html2json(that.editor.getHTML()).child
+//       if (!this.uploadAttData[index].name) {
+//         that.uploadAttData[index].active = false
+//         that.$emit('del', that.uploadAttData[index], (e) => {
+//           if (!e) {
+//             that.uploadAttData.splice(index, 1)
+//           } else {
+//             if (e) {
+//               that.uploadAttData.splice(index, 1)
+//             } else {
+//               that.uploadAttData[index].active = true
+//             }
+//           }
+//         })
+//       } else {
+//         this.$emit('syncDel', {syncDel: true, index: index, data: that.uploadAttData[index] }) // 为了同步当前组件和父组件附件的数据（新加的syncDel，使用原来的del怕有问题）
+//         that.uploadAttData.splice(index, 1)
+//       }
+//     },
+//     see(index) {
+//       this.$emit('see', this.uploadAttData[index])
+//     },
+//     uploadFile(file, data) {
+//       return new Promise((rl) => {
+//         const meta = data.meta ? Object.keys(data.meta) : []
+//         const param = new FormData()
+//         param.append('file', file)
+//         for (let i = 0; i < meta.length; i++) {
+//           param.append(meta[i], data.meta[meta[i]])
+//         }
+//         const xhr = new XMLHttpRequest()
+//         xhr.open('POST', data.server)
+//         const headers = Object.keys(data.headers)
+//         for (let i = 0; i < headers.length; i++) {
+//           xhr.setRequestHeader(headers[i], data.headers[headers[i]])
+//         }
+//         xhr.onreadystatechange = () => {
+//           if (xhr.readyState === 4) {
+//             if (xhr.status === 200) {
+//               const text = JSON.parse(xhr.responseText)
+//               if(text.code === '200') {
+//                 rl(text)
+//               }else {
+//                 Mess({
+//                   type: 'text',
+//                   cancelShow: false,
+//                   promptContent: text.msg
+//                 })
+//               }
+//             }
+//           }
+//         }
+//         xhr.send(param)
+//       })
+//     },
+//     upload(e, v) { // 上传文件
+//       const file = e.target.files[0]
+//       if (this.uploadType) {
+//         if (v === 'uploadAtt') {
+//           file.active = true
+//           this.uploadAttData.push(file)
+//           this.$emit('updateData', {
+//             html: html2json(this.editor.getHTML()).child,
+//             enclosure: this.uploadAttData
+//           })
+//         } else {
+//           this.uploadFile(file, this.uploadImage).then(r => {
+//             if (r.code === '200') {
+//               this.imgHtml(r.data)
+//             } else {
+//               this.uploadImage.onFailed(r)
+//             }
+//           })
+//         }
+//       } else {
+//         this.uploadFile(file, (v === 'uploadAtt') ? this.uploadAttachment : this.uploadImage).then(r => {
+//           if (v === 'uploadAtt') {
+//             if (r.data.annex) {
+//               r.data.annex.active = true
+//               this.uploadAttData.push(r.data.annex)
+//               this.$emit('enclosureSuccess', r.data.annex, html2json(this.editor.getHTML()).child)
+//             } else if (r.data) { // 学生端-生问生答-问答=提问详情及回答-实施回答的上传附件返回r.data
+//               r.data.active = true
+//               this.uploadAttData.push(r.data)
+//               this.$emit('enclosureSuccess', r.data, html2json(this.editor.getHTML()).child)
+//             } else {
+//               file.active = true
+//               this.uploadAttData.push(file)
+//               this.$emit('updateData', {
+//                 html: html2json(this.editor.getHTML()).child,
+//                 enclosure: this.uploadAttData
+//               })
+//             }
+//           } else {
+//             this.imgHtml(r.data)
+//           }
+//         })
+//       }
+//       e.target.value = ''
+//     },
+//     imgHtml(data) { // 插入图片
+//       setTimeout(() => {
+//         const url = this.uploadImage.url + data
+//         const cla = this.randomId()
+//         const html = `<p class="imgCont ${cla}"><img src="${url}" alt="" width=""/></p>`
+//         this.editor.chain().focus().insertContentAt(this.selection(), html).run()
+//         if (this.selection() <= 6 && this.selection() > 2) this.selectionClass2(cla)
+//         if (this.selectionClass(cla)) {
+//           this.editor.chain().focus().insertContentAt(this.selection(), '<p></p>').run()
+//         }
+//       }, 100)
+//     },
+//     // selectImg(cla) {
+//     //     this.$nextTick(() => {
+//     //         const images = this.$refs.editorRef.rootEl.querySelectorAll('img');
+//     //         const claDom = this.$refs.editorRef.rootEl.getElementsByClassName(cla);
+//     //         claDom[0].insertAdjacentHTML('beforeend', `<p class="tips ${cla}" style="color: red">新的段落</p>`)
+//     //         images.forEach(img => {
+//     //             img.addEventListener('mouseenter', this.handleImageClick);
+//     //             img.addEventListener('mouseleave', this.handleImageClick);
+//     //         });
+//     //     });
+//     // },
+//     // handleImageClick(text) {
+//     //     console.log('mouseenter==>>>>',text)
+//     // },
+//     insertContent(v) {
+//       for (let i = 0; i < v.length; i++) {
+//         let html = json2html(v[i])
+//         this.editor.chain().focus().insertContentAt(this.selection(), html).run()
+//       }
+//     },
+//     // 查询class
+//     selectionClass(v) {
+//       const json = this.editor.getJSON()
+//       for (let i = 0; i < json.content.length; i++) {
+//         const val = json.content[i].attrs?.titleId?.split(' ')[1]
+//         if (val === v) {
+//           if (json.content[i + 1] === undefined) return true
+//           break
+//         }
+//       }
+//       return false
+//     },
+//     selectionClass2(v) {
+//       const json = this.editor.getJSON()
+//       for (let i = 0; i < json.content.length; i++) {
+//         const val = json.content[i].attrs?.titleId?.split(' ')[1]
+//         if (val === v) {
+//           json.content.splice(i - 1, 1)
+//           this.editor?.commands.setContent(json)
+//           break
+//         }
+//       }
+//     },
+//     enclosureContent(v) {
+//       this.uploadAttData = [...this.uploadAttData, ...this.enclosureAction(v)]
+//     },
+//     download(index) {
+//       this.$emit('download', this.uploadAttData[index])
+//     },
+//     selection() {
+//       const {from} = this.editor.state.selection
+//       return from
+//     },
+//     complete() {
+//       if (this.uploadAttData.length > 0) {
+//         this.$emit('complete', {
+//           html: this.getData(),
+//           enclosure: this.uploadAttData
+//         })
+//       } else {
+//         this.$emit('complete', {html: this.getData()})
+//       }
+//     },
+//     // 获取编辑器内容
+//     getContent(el) {
+//       // 编辑器内容转json
+//       if (this.uploadAttData.length > 0) {
+//         el({
+//           html: this.getData(),
+//           enclosure: this.uploadAttData
+//         })
+//       } else {
+//         el({html: this.getData()})
+//       }
+//     },
+//     getData() {
+//       const html = this.editor.getHTML()
+//       const json = html2json(html)
+//       return json.child
+//     },
+//     toolTap(v) {
+//       // 获取当前选中的节点
+//       const {$anchor} = this.editor.state.selection
+//       if ($anchor.path[3].attrs.titleId === 'source') {
+//         let html = this.editor.getHTML()
+//         html += '<p></p>'
+//         this.editor.commands.setContent(html)
+//       }
+//       if (v === 'add') {
+//         let html = this.editor.getHTML()
+//         html += '<p class="source" style="text-align: right;"></p>'
+//         this.editor.commands.setContent(html)
+//       }
+//       if (v === 'lookUp') {
+//         let html = this.editor.getHTML()
+//         html = '<p class="lookUp" style="text-align: left;"></p>' + html
+//         this.editor.commands.setContent(html)
+//         this.editor.chain().focus().setTextSelection(0).run()
+//       }
+//       // if (v === 'h1') this.editor.chain().focus().setFontSize('18px').setBold().run()
+//       // if (v === 'h2') this.editor.chain().focus().setFontSize('16px').setBold().run()
+//       // if (v === 'h3') this.editor.chain().focus().setFontSize('14px').setBold().run()
+//       if(v === 'h1') this.editor.chain().focus().setBold().setFontSize('18px').run()
+//       if(v === 'h2') this.editor.chain().focus().setBold().setFontSize('16px').run()
+//       if(v === 'h3') this.editor.chain().focus().setBold().setFontSize('14px').run()
+//
+//       if (v === 'p') {
+//         this.editor.chain().focus().setFontSize('14px').unsetBold().run()
+//       }
+//       if (v === 'bold') this.editor.chain().focus().toggleBold().run()
+//       if (v === 'center' || v === 'left' || v === 'right') this.editor.chain().focus().setTextAlign(v).run()
+//       if (v === 'centerH2') {
+//         this.editor.chain().focus().setFontSize('16px').setTextAlign('center').run()
+//         this.editor.chain().focus().setBold().run()
+//       }
+//       if (v === 'leftH2') {
+//         this.editor.chain().focus().setFontSize('16px').setTextAlign('left').run()
+//         this.editor.chain().focus().setBold().run()
+//       }
+//       if (v === 'rightH2') {
+//         this.editor.chain().focus().setFontSize('16px').setTextAlign('right').run()
+//         this.editor.chain().focus().setBold().run()
+//       }
+//       if(v === 'paint') this.paintShow = true
+//     },
+//     getRandomCode(length) {
+//       if (length > 0) {
+//         let data = ["0", "1", "2", "3", "4", "5", "6", "7", "8", "9", "A", "B", "C", "D", "E", "F", "G", "H", "I", "J", "K", "L", "M", "N", "O", "P", "Q", "R", "S", "T", "U", "V", "W", "X", "Y", "Z", "a", "b", "c", "d", "e", "f", "g", "h", "i", "j", "k", "l", "m", "n", "o", "p", "q", "r", "s", "t", "u", "v", "w", "x", "y", "z"];
+//         let nums = "";
+//         for (let i = 0; i < length; i++) {
+//           let r = parseInt(Math.random() * 61);
+//           nums += data[r];
+//         }
+//         return nums.replace(/(.{4})/g, "$1-");
+//       } else {
+//         return false;
+//       }
+//     }
+//   }
+// }
 
 </script>