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

<template>
  <div
    @click="!model.error && $emit('click', 'fuse')"
    class="sign-layout"
    :class="{ disabled: model.error }"
  >
    <div class="model-header">
      <p>{{ model.title }}</p>
      <div class="model-action">
        <ui-icon
          ctrl
          type="show_roaming_n"
          @click.stop="$emit('click', 'pano')"
          class="icon"
          :class="{ active: custom.showMode === 'pano' && active }"
          v-if="supportPano"
        />
        <ui-input
          v-if="!search"
          type="checkbox"
          v-model="show"
          @click.stop
          :class="{
            disabled: model.error || custom.showMode === 'pano',
          }"
        />
        <ui-icon
          v-if="custom.modelsChangeStore"
          type="del"
          ctrl
          @click="$emit('delete')"
        />
      </div>
    </div>
    <div class="model-desc" v-if="active">
      <p><span>数据来源：</span>{{ SceneTypeDesc[model.type] }}</p>
      <p v-if="![SceneType.SWSS, SceneType.SWYDSS].includes(model.type)">
        <span>数据大小：</span>{{ model.size }}
      </p>
      <p v-if="model.type !== SceneType.SWMX"><span>拍摄时间：</span>{{ model.time }}</p>
    </div>
  </div>
</template>

<script lang="ts" setup>
import { getFuseModelShowVariable, SceneTypeDesc, SceneType } from "@/store";
import { custom } from "@/env";
import { getSceneModel } from "@/sdk";

import type { FuseModel } from "@/store";
import { computed, ref } from "vue";
import { currentModel, fuseModel } from "@/model";

type ModelProps = { model: FuseModel; canChange?: boolean; search?: boolean };
const props = defineProps<ModelProps>();

const active = computed(
  () => custom.currentModel === props.model && currentModel.value === fuseModel
);
const sceneModel = getSceneModel(props.model);
const supportPano = ref(sceneModel?.supportPano());
if (sceneModel) {
  sceneModel.bus.on("loadDone", () => {
    console.error(sceneModel.supportPano());
    supportPano.value = sceneModel.supportPano();
  });
}

type ModelEmits = {
  (e: "changeSelect", selected: boolean): void;
  (e: "delete"): void;
  (e: "click", mode: "pano" | "fuse"): void;
};
defineEmits<ModelEmits>();

const show = getFuseModelShowVariable(props.model);
</script>

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