<template>
  <div class="body-but">
    <el-button type="primary" @click="addScenesHandler">添加场景</el-button>
  </div>

  <el-table :data="list" tooltip-effect="dark" style="width: 100%" size="large">
    <el-table-column label="标题" v-slot:default="{ row }">
      {{ row.type === SceneType.SWMX ? row.modelTitle : row.name }}
    </el-table-column>
    <el-table-column label="类型" v-slot:default="{ row }: { row: Scene }">
      {{ SceneTypeDesc[row.type] }}
    </el-table-column>
    <el-table-column label="拍摄/创建时间" prop="createTime" v-slot:default="{ row }">
      {{ row.createTime.substr(0, 16) }}
    </el-table-column>
    <el-table-column label="操作" v-slot:default="{ row }: { row: Scene }">
      <span
        class="oper-span"
        v-pdpath="['view']"
        @click="openSceneUrl(row, OpenType.query)"
        v-if="hasSuccess(row)"
      >
        查看
      </span>
      <span
        v-if="row.type !== SceneType.SWMX && hasSuccess(row)"
        class="oper-span"
        v-pdpath="['edit']"
        @click="openSceneUrl(row, OpenType.edit)"
      >
        编辑
      </span>
      <span class="oper-span delBtn" v-pdscene="row" @click="delCaseScene(row)">
        删除
      </span>
    </el-table-column>
  </el-table>
</template>

<script setup lang="ts">
import comDialog from "@/components/dialog/index.vue";
import { SceneTypeDesc } from "@/constant/scene";
import { confirm } from "@/helper/message";
import { getCaseSceneList, getCaseScenes, replaceCaseScenes } from "@/store/case";
import {
  ModelScene,
  ModelSceneStatus,
  QuoteScene,
  QuoteSceneStatus,
  Scene,
  SceneType,
} from "@/store/scene";
import { onMounted, ref } from "vue";
import { openSceneUrl, OpenType } from "./help";

const props = defineProps<{
  caseId: number;
  onAddScenes: () => any;
}>();

const list = ref<Scene[]>([]);
const hasSuccess = (scene: Scene) => {
  if (scene.type === SceneType.SWMX) {
    return (scene as ModelScene).createStatus === ModelSceneStatus.SUCCESS;
  } else {
    return (scene as QuoteScene).status === QuoteSceneStatus.SUCCESS;
  }
};
const refresh = async () => {
  list.value = await getCaseSceneList(props.caseId);
};

const addScenesHandler = async () => {
  if (await props.onAddScenes()) {
    refresh();
  }
};

const delCaseScene = async (scene: Scene) => {
  if (await confirm("删除该场景，将同时从案件和融合模型中移除，确定要删除吗？")) {
    const scenes = getCaseScenes(list.value.filter((item) => item !== scene));
    await replaceCaseScenes(props.caseId, scenes);
    refresh();
  }
};
onMounted(refresh);
</script>
