ed2a4f78ff
- 支持控制是否同步路由参数 - 支持配置允许的事件类型 (select/manage) - 支持自定义设备节点前缀按钮文字 - 支持向外暴露设备选择逻辑 - 不再封装跳转设备逻辑，由外部实现 - 在车站模式下也支持选择设备
44 lines
1.3 KiB
Vue
44 lines
1.3 KiB
Vue
<script setup lang="ts">
|
|
import type { Station } from '@/apis';
|
|
import { DeviceTree, type DeviceTreeProps } from '@/components';
|
|
import { tryGetDeviceType } from '@/enums';
|
|
import { NModal } from 'naive-ui';
|
|
import { toRefs } from 'vue';
|
|
import { useRoute, useRouter } from 'vue-router';
|
|
|
|
const props = defineProps<{
|
|
station?: Station;
|
|
}>();
|
|
|
|
const show = defineModel<boolean>('show', { default: false });
|
|
|
|
const route = useRoute();
|
|
const router = useRouter();
|
|
|
|
const { station } = toRefs(props);
|
|
|
|
const onAfterSelectDevice: DeviceTreeProps['onAfterSelectDevice'] = (device, stationCode) => {
|
|
const deviceDbId = device.id;
|
|
const deviceType = tryGetDeviceType(device.deviceType);
|
|
router.push({
|
|
path: '/device',
|
|
query: {
|
|
stationCode,
|
|
deviceType,
|
|
deviceDbId,
|
|
fromPage: route.path,
|
|
},
|
|
});
|
|
};
|
|
</script>
|
|
|
|
<template>
|
|
<NModal v-model:show="show" preset="card" style="width: 600px; height: 600px" :title="`${station?.name} - 设备详情`" :content-style="{ height: '100%', overflow: 'hidden' }">
|
|
<template #default>
|
|
<DeviceTree :station="station" :events="['select', 'manage']" :device-prefix-label="'查看'" @after-select-device="onAfterSelectDevice" />
|
|
</template>
|
|
</NModal>
|
|
</template>
|
|
|
|
<style scoped lang="scss"></style>
|