<template>
  <div class="remark-section">
    <div v-if="isPreview" class="icon">
      <i class="iconfont icon-pinglun" @click="openDrawer"></i>
    </div>
  </div>
</template>

<script>
import { defineComponent, ref, computed } from 'vue';
import { useRoute, useRouter } from 'vue-router';
import { storeToRefs } from 'pinia';
// import { useStore } from 'vuex';
// import {} from "@/stores/counter.js"

// 屏蔽 cheerio
// import * as cheerio from 'cheerio';

// import useEmitter from '@/composables/useEmitter';
import { ElMessage as message } from 'element-plus';
import { useCommonStore } from '@/stores/modules/common';

export default defineComponent({
  props: {
    title: {
      type: String,
      default: ''
    },
    type: {
      type: [Number, String],
      default: ''
    },
    questionIndex: {
      type: Number,
      default: undefined
    }
  },
  setup() {
    const { visible } = storeToRefs(useCommonStore());
    const route = useRoute();
    const router = useRouter();
    const sn = computed(() => route.query.sn);
    const isLogin = ref(window.localStorage.getItem('plantToken'));
    const isPreview = computed(() => route.path === '/preview');

    function openDrawer() {
      if (!isLogin.value) {
        message.success('您尚未登陆，请先登陆，再评论');
        router.push({
          name: 'login'
        });
        return;
      }
      // const title = props.title.trim();

      visible.value = true;
    }
    return {
      sn,
      // visible,
      openDrawer,
      isLogin,
      isPreview
    };
  }
});
</script>

<style lang="scss" scoped>
.remark-section {
  cursor: pointer;

  .icon-jieshuyu {
    cursor: pointer;
  }
}
</style>
