diff --git a/src/components/Editor/MarkdownEditor.vue b/src/components/Editor/MarkdownEditor.vue
new file mode 100644
index 00000000..a0c5eb53
--- /dev/null
+++ b/src/components/Editor/MarkdownEditor.vue
@@ -0,0 +1,62 @@
+<template>
+  <div>
+    <halo-editor
+      ref="md"
+      v-model="originalContentData"
+      :boxShadow="false"
+      :toolbars="toolbars"
+      :ishljs="true"
+      :autofocus="false"
+      @imgAdd="handleAttachmentUpload"
+      @save="handleSaveDraft"
+    />
+  </div>
+</template>
+<script>
+import { toolbars } from '@/core/const'
+import { haloEditor } from 'halo-editor'
+import 'halo-editor/dist/css/index.css'
+import attachmentApi from '@/api/attachment'
+export default {
+  name: 'MarkdownEditor',
+  components: {
+    haloEditor
+  },
+  props: {
+    originalContent: {
+      type: String,
+      required: false,
+      default: ''
+    }
+  },
+  data() {
+    return {
+      toolbars,
+      originalContentData: ''
+    }
+  },
+  watch: {
+    originalContent(val) {
+      this.originalContentData = val
+    },
+    originalContentData(val) {
+      this.$emit('onContentChange', val)
+    }
+  },
+  methods: {
+    handleAttachmentUpload(pos, $file) {
+      var formdata = new FormData()
+      formdata.append('file', $file)
+      attachmentApi.upload(formdata).then(response => {
+        var responseObject = response.data
+        var HaloEditor = this.$refs.md
+        HaloEditor.$img2Url(pos, encodeURI(responseObject.data.path))
+        this.$message.success('图片上传成功！')
+      })
+    },
+    handleSaveDraft() {
+      this.$emit('onSaveDraft')
+    }
+  }
+}
+</script>
diff --git a/src/components/Editor/RichTextEditor.vue b/src/components/Editor/RichTextEditor.vue
new file mode 100644
index 00000000..f581e8aa
--- /dev/null
+++ b/src/components/Editor/RichTextEditor.vue
@@ -0,0 +1,34 @@
+<template>
+  <div>
+    <a-input
+      type="textarea"
+      v-model="originalContent"
+      :rows="16"
+    />
+  </div>
+</template>
+<script>
+export default {
+  name: 'RichTextEditor',
+  props: {
+    originalContent: {
+      type: String,
+      required: false,
+      default: ''
+    }
+  },
+  data() {
+    return {
+      originalContentData: ''
+    }
+  },
+  watch: {
+    originalContent(val) {
+      this.originalContentData = val
+    },
+    originalContentData(val) {
+      this.$emit('onContentChange', val)
+    }
+  }
+}
+</script>