viewDialog.vue 1.54 KB
<template>
  <div>
    <el-row :gutter="8">
      <el-col :span="16">
        通知标题:
        <el-input v-model="formData.item.noticeTitle"></el-input>
      </el-col>
    </el-row>
    <el-row :gutter="8">
      <el-col :span="24" class="margin-top-middle">
        通知内容:
        <!-- <span v-html="formData.item.noticeContent"></span> -->
        <quill-editor class="ql-editor"
              v-model="formData.item.noticeContent"
              ref="myQuillEditor"
              :options="editorOption"
            >
            </quill-editor>
        <!-- <el-input type="textarea" :rows="20" v-model="formData.item.noticeContent"></el-input> -->
      </el-col>
    </el-row>
    <el-row :gutter="8">
      <el-col :span="24" class="margin-top-middle">
        附件:
        <div @click="handleView(formData.item.noticeFileUrl)" class="pointer">{{ formData.item.noticeFileName }}</div>
      </el-col>
    </el-row>
  </div>
</template>
<script>
import { quillEditor } from "vue-quill-editor";
export default {
    components: { quillEditor },
  data () {
    return {
       // 富文本编辑器配置
      editorOption: {
        theme: "snow", // or 'bubble'
        placeholder: "请输入正文",
      },
    };
  },
  components: {},
  props: {
    formData: {
      type: Object,
      default: () => { }
    },
  },
  created () {
    console.log(this.formData);
  },
  computed: {

  },

  methods: {

  },
};
</script>
<style scoped lang='scss'>
.margin-top-middle {
  margin-top: 10px
}
/deep/.ql-editor {
  padding: 0px;
}  
</style>