<template>
    <!--    <div class="c-mta-comment">-->
    <!--<MtaRate code="readOnly" :myData="myData"></MtaRate>
    <MtaRate code="editor" @change="handleRateChange"></MtaRate>-->
    <!--    评论    -->
    <MtaCommentBase
            :my-data="myData"
            @comment-list="handleCommentList"
            @delete="handleDelete"
            @reply="handleReply"
            @reply-delete="handleReplyDelete"
            v-if="code !== 'reply'"
    ></MtaCommentBase>
    <MtaCommentReply
            :my-data="myData"
            @delete="handleDelete"
            v-else
    ></MtaCommentReply>
    <!--    </div>-->
</template>

<script>
    import MtaRate        from '../MtaRate/MtaRate';
    import MtaCommentBase from './MtaCommentBase';
    import MtaCommentReply from './MtaCommentReply';


    export default {
        name:       'MtaComment',
        components: {
            MtaRate,
            MtaCommentBase,
            MtaCommentReply,
        },
        props:      {
            myData: {
                type:     Object,
                required: true,
            },
            code: {
                type: String,
                default: ''
            }
        },
        data() {
            return {};
        },
        methods:    {
           /* handleRateChange(data) {
                console.log('评分：', data);
            },*/
            handleDelete(data) {
                this.$emit('delete', data);
            },
            handleReply(data) {
                this.$emit('reply', data);
            },
            handleReplyDelete(data) {
                this.$emit('reply-delete', data);
            },
            handleCommentList(data) {
                this.$emit('comment-list', data);
            },
        },
    };
</script>

<style lang="scss" scoped>
    .c-mta-comment {

    }
</style>
