<template>
  <div class="simditor">
    <textarea :id="id" v-html="plcontent" v-show="showStatus"></textarea>
  </div>
</template>
<script>
import Simditor from "simditor";
import $ from "jquery";
import "simditor/styles/simditor.css";
// import config from '@/config/index'
export default {
  name: "ueditor",
  props: {
    options: {
      // 配置参数
      type: Object,
      default() {
        return {};
      },
    },
    policyContent: {
      type: String,
      default: "",
    },
  },
  watch: {
    policyContent: function (n) {
      this.plcontent = n;
      this.setContentValue(this.policyContent);
    },
  },
  data() {
    return {
      id: Math.floor(Math.random() * 10 * 10), // 这是为了在同一个组件里放多个富文本编辑器，而加的标记
      editor: "",
      plcontent: "",
      showStatus:true
    };
  },
  mounted() {
    let vm = this;
    this.editor = new Simditor(
      Object.assign(
        {},
        {
          textarea: $(`#${vm.id}`),
          pasteImage: true,
        },
        this.options
      )
    );
    // 不知道干什么的
    this.editor.on("valuechanged", (e, src) => {
      this.valueChange(e, src);
    });
    // 修改上传后图片的路径
    // this.editor.uploader.on("uploadsuccess", function (e, file, result) {
    //   let $img, $mask, msg;
    //   if (!file.inline) {
    //     return;
    //   }
    //   $img = file.img;
    //   $img.removeData("file");
    //   $img.removeClass("uploading");
    //   $mask = $img.data("mask");
    //   if ($mask) {
    //     $mask.remove();
    //   }
    //   $img.removeData("mask");
    //   if (result.success === false) {
    //     msg = result.msg || "上传被拒绝了";
    //     this.$message.error(msg);
    //     $img.attr("src", this.defaultImage);
    //   } else {
    //     // 修改图片路径和样式
    //     $img.attr({
    //       src: "http://120.79.209.118:8015/" + result.data, // 路径
    //       // src: config.baseUrl + result.file_path, // 路径
    //     }); // 这里就是成功后的替换，将这个改成了我们所使用的字段名file
    //   }
    // });
    this.setContentValue(this.policyContent);
  },
  methods: {
    // 获取富文本编辑器的值
    valueChange(e, val) {
      this.$emit("editorContentValue", this.editor.getValue());
    },
    // 给富文本编辑期赋值
    setContentValue(val) {
      this.editor.setValue(val);
    },
  },
};
</script>

<style scoped>
</style>
