<script lang="ts" setup>
/**
 * @Name: index.vue
 * @Description: 评论详情
 * @Author: Cheney
 */

import AverageMonthly from '/@/views/product-manage/comment-detail/component/AverageMonthly.vue';
import TitleCard from './component/TitleCard.vue';


const isShowComment = defineModel({ default: false });

const props = defineProps({
  rowData: <any>Object,
  title: String
});
const { rowData } = props;


</script>

<template>
  <div class="drawer-container">
    <el-drawer
        ref="editDrawer"
        v-model="isShowComment"
        :show-close="false"
        :title="`${title} - 评论详情`"
        direction="btt"
        size="85%"
        style="background-color:#F3F4FB;">
      <div class="sticky top-0" style="background-color:#F3F4FB; min-height: 20px; z-index: 2"></div>
      <div class="px-5">
        <!-- Title Card -->
        <TitleCard :asin="rowData.asin" :img="rowData.img" :title="rowData.title" :url="rowData.url" />
        <!-- Chart -->
        <!--<el-row :gutter="20" class="mt-5" style="z-index: 1">-->
        <!--  <el-col :span="12">-->
        <!--    <NegativeLabel />-->
        <!--  </el-col>-->
        <!--  <el-col :span="12">-->
        <!--    <NegativeClassification />-->
        <!--  </el-col>-->
        <!--</el-row>-->
        <!-- Chart -->
        <div class="mt-5">
          <AverageMonthly :asin="rowData.asin" />
        </div>
      </div>
    </el-drawer>

  </div>

</template>

<style scoped>
.drawer-container :deep(.el-drawer__header) {
  border-bottom: none;
  font-weight: 500;
}

.drawer-container :deep(.el-drawer__title) {
  font-size: 18px;
}
</style>
