<script setup>
import { ref, watch } from 'vue'
import { raiInterface } from "@/api/api.js";

const props = defineProps({
  isShowResearchNumber: {
    type: Boolean,
    default: false,
  },
  dataForm: {
    type: Object,
    default: {},
  },
  isShowDlgType: {
    type: String,
    default: "",
  },
})
const emit = defineEmits(['close'])


// 关闭弹框
function handleClose() {
  emit('close')
  emit("update:isShowResearchNumber", false);
  emit("update:isShowDlgType", "");
}

const tableList = ref([])
// 获取表格数据
async function getDataList() {
  const res =
    props.isShowDlgType == "专项调研" ? await raiInterface.specialPointsBill({ CompanyId: props.dataForm.CompanyId }) : await raiInterface.activityPointsBill({ CompanyId: props.dataForm.CompanyId });
  if (res.Ret === 200) {
    tableList.value = res.Data.List || [];
  }
}


watch(
  () => props.isShowResearchNumber,
  (val) => {
     val ? getDataList() : (tableList.value = []);
  }
)

</script>
<template>
  <!-- banner 详情的弹框 -->
  <el-dialog
    :title="isShowDlgType == '专项调研' ? '专项调研次数明细' : '研选服务点数明细'"
    :model-value="isShowResearchNumber"
    width="1200px"
    draggable
    :close-on-click-modal="false"
    :modal-append-to-body="false"
    center
    @close="handleClose"
  >
    <el-table style="margin-bottom: 30px" :data="tableList" border height="500">
      <el-table-column align="center" prop="Content" label="事项"></el-table-column>
      <el-table-column align="center" prop="CreateTime" label="时间" width="180"></el-table-column>
      <el-table-column align="center" prop="ChartPermissionName" label="行业" width="100" v-if="isShowDlgType == '专项调研'"></el-table-column>
      <el-table-column align="center" prop="RealName" label="参会人" width="100"></el-table-column>
      <el-table-column align="center" prop="minNumber" label="小计" width="80">
        <template #default="{ row }">
          <span :style="{ color: row.BillDetailed > 0 ? '#31c640' : '#ec808d' }"> {{ row.BillDetailed > 0 ? "+" + row.BillDetailed : row.BillDetailed }}</span>
        </template>
      </el-table-column>
      <el-table-column align="center" :prop="isShowDlgType == '专项调研' ? 'Total' : 'Points'" label="合计" :width="isShowDlgType == '专项调研' ? '300' : '100'"></el-table-column>
    </el-table>
  </el-dialog>
</template>
<style scoped lang="scss">

</style>