<template>
  <ckeditor
    name="content"
    :placeholder="
      $t('household_members_editor.positioning.comment_placeholder')
    "
    :editor="editor"
    :config="editorConfig"
    v-model="content"
    tag-name="textarea"
  />
</template>

<script>
import { Ckeditor } from "@ckeditor/ckeditor5-vue";
import classicEditorConfig from "ChillMainAssets/module/ckeditor5/editor_config";
import { ClassicEditor } from "ckeditor5";

export default {
  name: "PersonComment.vue",
  components: {
    ckeditor: Ckeditor,
  },
  props: ["conc"],
  computed: {
    editor: () => ClassicEditor,
    editorConfig: () => classicEditorConfig,
    content: {
      get() {
        return this.$props.conc.comment || "";
      },
      set(value) {
        console.log("set content", value);
        this.$store.commit("setComment", {
          conc: this.$props.conc,
          comment: value,
        });
      },
    },
  },
};
</script>

<style scoped></style>
