fuse-code/src/layout/model-list/index.vue

<template>
  <List
    :title="title"
    rawKey="id"
    :class="['scene-model-list', listClass]"
    :data="modelList"
    :showContent="showContent"
  >
    <template #header v-if="$slots.header"><slot name="header" /></template>
    <template #action>
      <slot name="action" />
    </template>
    <template #atom="{ item }">
      <ModelSign
        :canChange="canChange"
        :model="item.raw"
        @delete="modelDelete(item.raw)"
        @click="(mode: any) => flyModel(item.raw, mode, true)"
      />
    </template>
  </List>
</template>

<script lang="ts" setup>
import { computed, watchEffect } from "vue";
import { custom } from "@/env";
import List from "@/components/list/index.vue";
import ModelSign from "./sign.vue";
import { activeModel, getSupperPanoModel } from "@/sdk/association";
import { fuseModels, getFuseModelShowVariable } from "@/store";
import type { FuseModel } from "@/store";
import { currentModel, fuseModel, loadModel } from "@/model";
import { flyModel } from "@/hook/use-fly";
import { sdk } from "@/sdk/sdk";

watchEffect(
  () => {
    console.error("modeChange", custom.showMode);
  },
  { flush: "sync" }
);
export type ModelListProps = {
  title?: string;
  canChange?: boolean;
  showContent?: boolean;
  listClass?: string;
};
withDefaults(defineProps<ModelListProps>(), {
  title: "数据列表",
  change: false,
  showContent: true,
});
defineEmits<{
  (e: "deleteModel", model: FuseModel): void;
  (e: "clickModel", model: FuseModel): void;
}>();

const modelList = computed(() =>
  fuseModels.value.map((model) => ({
    raw: model,
    select: custom.currentModel === model && currentModel.value === fuseModel,
  }))
);

watchEffect(() => {
  if (custom.currentModel && !getFuseModelShowVariable(custom.currentModel).value) {
    activeModel({ showMode: "fuse" });
  }
});
const modelDelete = (model: FuseModel) => {
  if (custom.currentModel === model) {
    activeModel({ showMode: "fuse" });
  }
  const index = fuseModels.value.indexOf(model);
  if (~index) {
    fuseModels.value.splice(index, 1);
  }
};
</script>

<style lang="scss" scoped src="./style.scss"></style>