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


const props = defineProps({
  isPermissionDetailShow: {
    default: false,
    type: Boolean,
  },
  researchDetailId: {
    default: 0,
    type: Number,
  },
})
const emit = defineEmits(['close'])

watch(
  () => props.isPermissionDetailShow,
  (newVal) => {
    newVal && getDetailList();
  }
)

// 弹框关闭的事件
function cancelHandle() {
  emit('close')
  tableData.value = [];
}


const tableData = ref([])
const Points = ref("")
/* 获取客户详情 */
async function getDetailList() {
  tableData.value = [];
  const res = await customInterence.customDetail({
    CompanyId: props.researchDetailId,
  });
  if (res.Ret !== 200) return;
  Points.value = res.Data.RaiItem.Points || "";
  let auth = [];
  res.Data.RaiItem.PermissionList.forEach((item) => {
    let obj = {
      checkAll: item.CheckList && item.CheckList.length === item.Items.length ? true : false,
      isIndeterminate: item.CheckList && item.CheckList.length > 0 && item.CheckList.length < item.Items.length,
      ...item,
    };
    auth.push(obj);
  });
  tableData.value = auth;
}



const isShowResearchNumber = ref(false) // 研选服务点数明细 弹框
const tableListResearch = ref([]) // 严选数据
// 查看
function lookNumber() {
  isShowResearchNumber.value = true;
  getDataList();
}
// 明细弹框关闭
function handleClose() {
  isShowResearchNumber.value = false;
  tableListResearch.value = [];
}
// 获取表格数据
async function getDataList() {
  const res = await raiInterface.activityPointsBill({
    CompanyId: props.researchDetailId,
  });
  if (res.Ret === 200) {
    tableListResearch.value = res.Data.List || [];
  }
}

</script>
<template>
  <el-dialog title="权限详情" draggable :model-value="isPermissionDetailShow" :close-on-click-modal="false" :modal-append-to-body="false" @close="cancelHandle" center width="800px">
      <CpessionTableEquity v-if="tableData.length" fromType="detail" :authList="tableData" style="margin-bottom: 20px" />
      <div style="margin: 20px 0" v-if="Points">
        <span>研选服务点数</span>
        <span>{{ Points }}</span>
        <span class="editsty" @click="lookNumber">明细>></span>
      </div>
    </el-dialog>
    <el-dialog title="研选服务点数明细" :model-value="isShowResearchNumber" width="80%" draggable :close-on-click-modal="false" :modal-append-to-body="false" center @close="handleClose">
      <el-table style="margin-bottom: 30px" :data="tableListResearch" border height="500">
        <el-table-column align="center" prop="Content" label="事项"></el-table-column>
        <el-table-column align="center" prop="CreateTime" label="时间"></el-table-column>
        <el-table-column align="center" prop="RealName" label="参会人" width="150"></el-table-column>
        <el-table-column align="center" prop="minNumber" label="小计" width="100">
          <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="Points" label="合计" width="100"></el-table-column>
      </el-table>
    </el-dialog>
</template>
<style scoped lang="scss">

</style>