<template>
  <div class="">
    <!-- banner 详情的弹框 -->
    <el-dialog
      :title="isShowDlgType == '专项调研' ? '专项调研次数明细' : '研选服务点数明细'"
      :visible.sync="isShowResearchNumber"
      width="1200px"
      v-dialogDrag
      :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 slot-scope="{ 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>
  </div>
</template>

<script>
import { raiInterface } from "@/api/api.js";
export default {
  name: "",
  props: {
    isShowResearchNumber: {
      type: Boolean,
      default: false,
    },
    dataForm: {
      type: Object,
      default: {},
    },
    isShowDlgType: {
      type: String,
      default: "",
    },
  },
  watch: {
    isShowResearchNumber: {
      handler(val) {
        val ? this.getDataList() : (this.tableList = []);
      },
      deep: true,
    },
  },
  data() {
    return {
      tableList: [],
    };
  },
  methods: {
    // 关闭弹框
    handleClose() {
      this.$emit("update:isShowResearchNumber", false);
      this.$emit("update:isShowDlgType", "");
    },
    // 获取表格数据
    async getDataList() {
      const res =
        this.isShowDlgType == "专项调研" ? await raiInterface.specialPointsBill({ CompanyId: this.dataForm.CompanyId }) : await raiInterface.activityPointsBill({ CompanyId: this.dataForm.CompanyId });
      if (res.Ret === 200) {
        this.tableList = res.Data.List || [];
      }
    },
  },
};
</script>
<style scoped lang="scss"></style>
