<template>
  <a
    v-if="row.note"
    @click="showNote()"
  >
    <SvgIcon v-bind="{ name: 'edit2.svg', type: 'findata', size: 20 }"></SvgIcon>
  </a>
  <a
    v-else
    @click="showNote()"
  >
    <span class="tooltip">
      <span class="dot-twitter">+</span>
      <span
        class="tooltiptext to-left"
        style="min-width: max-content"
        >{{ label }}</span
      >
    </span>
  </a>
</template>
<script>
import { useStore } from "@/stores/index";
export default {
  setup() {
    const store = useStore();
    return { store };
  },
  props: ["row", "pagename"],
  data() {
    return {
      label: this.store.lang === "en" ? "Note" : "Ghi chú",
    };
  },
  methods: {
    showNote() {
      this.$emit("clickevent", {
        name: "dataevent",
        data: {
          modal: {
            title: this.label,
            height: "330px",
            width: "700px",
            component: "common/Note",
            vbind: { row: this.row, pagename: this.pagename },
          },
        },
      });
    },
  },
};
</script>
