caseEditor/src/view/vrmodel/index.vue

<template>
  <div class="scene">
    <el-button class="w-full" @click="handleAdddyrh">编辑多元融合</el-button>
    <el-button class="w-full my-4" @click="handleAdd" style="margin-left: 0; margin-right: 0">添加场景</el-button>
    <div class="scene-list">
        <div class="scene-title flex justify-between content-center">
          <span class="title1" style="line-height: 32px ">场景列表</span>
          <!-- <el-switch v-model="active" @change="handleActive" /> -->
        </div>
        <div class="list" v-if="active" style="min-height: 630px;">
          <div
            class="listItem flex justify-between py-2"
            v-for="item,index in list"
            :key="index"
          >
            <span class="anmc" :title="item.name">{{ item.name || '多元融合' }}</span>
            <div class="cursor-pointer" quaternary type="primary">
              <span class="mr-4" @click="handlegotoelT(item)">移除</span>
              <span @click="handlegotoEdit(item)">编辑</span>
            </div>
            <!-- <div @click="handlegotoEdit(item)" class="cursor-pointer" quaternary type="primary">编辑</div> -->
          </div>
        </div>
        <!-- <el-button
                class="w-full"
                type="primary"
                @click="submitForm"
              >
                保存
              </el-button> -->
      </div>
  </div>
</template>

<script setup lang="ts">
import { getCaseSceneList, getUrlSrc, getSceneListTree, setCaseaddOrUpdate } from "@/store/case";
import { router } from "@/router";
import comSelect from "@/components/company-select/index.vue";
import List from "./list.vue";
import SceneContent from "./sceneContent.vue";
import { ElMessage } from "element-plus";
import ModelContent from "./modelContent.vue";
import { useScenePaggingParams } from "./pagging";
import { computed, ref, onMounted } from "vue";
import { tableModelScene } from "./quisk";
const active = ref(true);
const list = ref([]);
const isEdit = ref(false)
const showModal = ref(false);
const params = useScenePaggingParams();
const caseId = computed(() => (router.currentRoute.value?.params?.caseId));
onMounted(() => {
  geiList();
  console.log("router.currentRoute.value", caseId);
});
async function geiList() {
  list.value = await getCaseSceneList(caseId.value);
  console.log("res", list.value);
}
function handlegotoEdit(record) {
  let url = record.type == 2 || record.type == 5 ?  `/mega/index.html?m=${record.num}` : `/epg.html?m=${record.num}`
  window.open(url.replace("spg", "epg"));
}
function handleAdddyrh(record) {
  let url = `/code/index.html?caseId=${caseId.value}#/fuseEdit/merge`
  window.open(url);
}
async function handlegotoelT(record) {
  isEdit.value = true;
  if (await confirm("确定要移除当前场景吗？")) {
    list.value = list.value.filter((item) => item.num !== record.num);
    submitForm();
  }
  // console.log("handleActive", params);
}
async function submitForm() {
  isEdit.value = false;
  let sublist = getSceneListTree(list.value)
  const apiData = {
    caseTitle: caseId.value,
    caseId: caseId.value,
    sceneNumParam: sublist,
  };
  await setCaseaddOrUpdate(apiData)
  ElMessage({
      message: '操作成功',
      type: 'success',
    })
  geiList();
  // console.log("handleActive", params);
}

async function handleAdd() {
  if(isEdit.value){
    await confirm("请先保存当前移除的场景信息！")
    return
  }
  let numList = list.value.map((item) => item.num);
  console.log("handleAdd", numList);
  let val = await tableModelScene({numList: numList});
  geiList();
  if (val) {
    console.log("刷新列表");
  }

}
</script>
<style scoped>
.anmc {
  overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 190px;
}
</style>