<template>
  <el-table
    class="mybody-head"
    :data="pagging.state.table.rows"
    ref="tableRef"
    tooltip-effect="dark"
    style="width: 100%;height: 250px;"
    :height="250"
    row-key="fusionId"
    size="large"
    @select="changeItem"
    @select-all="changelist"
    @selection-change="changeSelection"
  >
    <!-- -1 计算失败  0 计算中 1 计算成功并可以外网访问，不能编辑 2计算成功只能内网，能编辑 -->
    <el-table-column type="selection" :selectable="selectable" width="55" />
    <el-table-column label="名称" show-overflow-tooltip width="640px" prop="fusionTitle"></el-table-column>
    <!-- <el-table-column label="案件名称" width="320px" prop="caseTitle"></el-table-column> -->
    <el-table-column label="创建时间" prop="createTime" v-slot:default="{ row }">
      {{ dayjs(row.createTime).format("YYYY-MM-DD HH:mm") }}
    </el-table-column>

  </el-table>
</template>

<script setup lang="ts">
import {
  QuoteScene,
  QuoteSceneStatus,
  delQuoteScene,
  SceneType,
  genMeshScene,
  LocationEnum,
} from "@/store/scene";
import { getSceneListTree } from "@/store/case";
import dayjs from "dayjs";
import { QuoteSceneStatusDesc } from "@/constant/scene";
import { OpenType, openSceneUrl } from "../case/help";
import { confirm } from "@/helper/message";
import { ElMessage, ElMessageBox } from "element-plus";
import { router } from "@/router";
import { sceneDownload } from "./quisk";
import { useScenePaggingParams, ScenePagging } from "./pagging";
import { QuiskExpose } from "@/helper/mount";
import { onMounted, ref, watch, watchEffect, computed, nextTick } from "vue";
import {
  getCaseSceneList,
  getCaseScenes,
  getSceneKey,
  replaceCaseScenes,
  setCaseaddOrUpdate,
  setaddFusionIds,
} from "@/store/case";
// const params = useScenePaggingParams();
const props = defineProps<{ pagging: ScenePagging, fusionIds: Array<string>, noEditList:  Array<string> }>();
const caseId = computed(() => (router.currentRoute.value?.params?.caseId));
const tableRef = ref(null);
const fusionIds = ref(JSON.parse(JSON.stringify(props.fusionIds)) || []);
const selectList = ref({
  0: [],
  1: [],
})
const pagScenes = props.pagging.state.table.rows;
console.log('caseScenes', selectList, props.fusionIds);
const submit = async () => {
  console.log('fusionIds', fusionIds.value);
  if(fusionIds.value.length == 0) return confirm('请选择多元融合')
  const apiData = {
    caseId: caseId.value,
    fusionIds: fusionIds.value,
  };
  await setaddFusionIds(apiData)
  // params.pagging.queryReset()
  }
defineExpose<QuiskExpose>({
  submit
});



const isObj = ref(props.pagging.state.query?.isObj);
const delSceneHandler = async (scene: QuoteScene) => {
ElMessageBox.confirm("确定要删除当前场景吗？", "提示", {
    confirmButtonText: "确定",
    cancelButtonText: "取消",
    type: "warning",
  }).then(async () => {
    await delQuoteScene(scene);
    props.pagging.refresh();
  });
  // if (await confirm("确定要删除当前场景吗？")) {
  //   await delQuoteScene(scene);
  //   props.pagging.refresh();
  // }
};
console.log('propsnumList', props.fusionIds);
const selectable = (row) => {
  // let selectlist = selectList.find(item => item.type == params.pagging.state.query?.isObj)?.numList;
console.log('selectable', props.fusionIds, fusionIds.value, row);
  if (props.fusionIds.includes(row.fusionId)) return false;
  return true// && !selectlist.includes(row.num)
}
// 复选框同步
let changIng = false;

watchEffect(() => {
  if (!tableRef.value) return;
  const selectKeys = fusionIds.value;
  const list = props.pagging.state.table.rows
  // console.log('watchEffect', selectKeys);
  // console.log('watchEffect', fusionIds.value, selectKeys,'list', list);
  // changIng = true;
  props.pagging.state.table.rows.forEach((scene) => {
    tableRef.value!.toggleRowSelection(scene, selectKeys.includes(scene.fusionId));
  });
  // changIng = false;
  // console.log(tableRef.value!.getSelectionRows())
  // console.log('watchEffect', props.pagging.state.table.rows);
}, { flush: 'post' });
const changeSelection = async (selectScenes, item) => {
  if (props.pagging.loading) return;
  const selectKeys = selectScenes.map(ele => ele.fusionId);
  if(!selectScenes.length){
    let showList = props.pagging.state.table.rows.map(ele => ele.fusionId)
    let newFusionIds = fusionIds.value.filter(ele => !showList.includes(ele))
    fusionIds.value = newFusionIds
    return
  }
  let arrNew= new Set(selectKeys.concat(fusionIds.value)); //通过set集合去重
  fusionIds.value = [...arrNew]
};
const changeItem = (selectScenes, item) => {
  console.log('changeItem', selectScenes, item);
  fusionIds.value.includes(item.fusionId) ? fusionIds.value.splice(fusionIds.value.indexOf(item.fusionId), 1) : fusionIds.value.push(item.fusionId)
}
const changelist = (selectScenes) => {
  console.log('changelist', selectScenes);

}
const sceneDownloadHandler = (scene: QuoteScene) => {
  sceneDownload({ scene });
};
</script>
<style scoped lang="scss">
.mybody-head{
    flex: auto !important;
}
</style>
