<template>
  <div class="actionsheet" @click.capture.stop="onClick">
    <CommentPlaceholder ref="placeholder" v-bind="$attrs" v-on="$listeners">
      <slot></slot>
    </CommentPlaceholder>
  </div>
</template>


<script>

import { createNamespacedHelpers } from 'vuex';
import CommentPlaceholder from './comment-placeholder';
import { get } from 'lodash';

const { mapActions } = createNamespacedHelpers('comment');

const ITEM = {
  comment: '回复',
  remove: '删除',
  report: '举报'
};

export default {
  name: 'CommentPlaceholderActionSheet',
  components: { CommentPlaceholder },
  data() {
    return {};
  },
  methods: {
    ...mapActions(['setCommentStatus']),
    async onClick() {
      const authorUid = this.$attrs.authorUid;
      const commentUid = this.$attrs.commentUid;
      const uid = get(await this.$sdk.getUser(), 'uid', 0);
      const commentId = this.$attrs['dest-id'];
      let menu = [];

      if (authorUid === uid || commentUid === uid) {
        menu = [
          {
            content: ITEM.comment
          },
          {
            content: ITEM.remove
          },
          {
            content: ITEM.report
          }
        ];
      } else {
        menu = [
          {
            content: ITEM.comment
          },
          {
            content: ITEM.report
          }
        ];
      }

      this.$createActionSheet({
        data: menu,
        zIndex: 200,
        onSelect: (item) => {
          switch (item.content) {
            case ITEM.comment: {
              this.$refs.placeholder.openComentInput();
              break;
            }
            case ITEM.remove: {
              this.setCommentStatus({ type: 1, commentId }).then(result => {
                if (result.code === 200) {
                  this.$createToast({
                    txt: '已删除',
                    type: 'correct',
                    time: 2000,
                  }).show();
                  this.$emit('remove-comment', { commentId });
                } else {
                  this.$createToast({
                    txt: '删除失败，请重试',
                    type: 'warn',
                    time: 2000,
                  }).show();
                }
              });
              break;
            }
            case ITEM.report: {
              this.setCommentStatus({ type: 2, commentId }).then(result => {
                if (result.code === 200) {
                  this.$createToast({
                    txt: '已举报',
                    type: 'correct',
                    time: 2000,
                  }).show();
                } else {
                  this.$createToast({
                    txt: '举报失败，请重试',
                    type: 'warn',
                    time: 2000,
                  }).show();
                }
              });
              break;
            }
          }
        },
      }).show();
    },
  }
};
</script>

<style lang="scss">
.cube-action-sheet-panel {
  margin-left: 15px;
  margin-right: 15px;
  margin-bottom: 17px;
  border-radius: 10px;
  overflow: hidden;
}

.cube-action-sheet-item {
  color: #222 !important;
  font-weight: bold !important;
}

.cube-action-sheet-cancel {
  span {
    color: #222 !important;
    font-weight: bold !important;
  }
}

.cube-action-sheet-space {
  height: 1px !important;
  background-color: rgb(235, 235, 235) !important;
}

</style>