71 lines
1.8 KiB
Vue
71 lines
1.8 KiB
Vue
|
<template>
|
||
|
|
<a-button
|
||
|
|
type="outline"
|
||
|
|
size="small"
|
||
|
|
status="success"
|
||
|
|
style="padding: 7px; margin-right: 10px"
|
||
|
|
@click="handleClick"
|
||
|
|
>
|
||
|
|
<template #icon><icon-list /></template>
|
||
|
|
详情
|
||
|
|
</a-button>
|
||
|
|
|
||
|
|
<a-modal
|
||
|
|
width="600px"
|
||
|
|
:visible="visible"
|
||
|
|
@cancel="handleCancel"
|
||
|
|
>
|
||
|
|
<template #title>设备详情</template>
|
||
|
|
<a-descriptions style="margin-top: 20px" :data="formData" size="large" :title=formData.name :column="1">
|
||
|
|
<a-descriptions-item label="产品名称">{{formData.productId}}</a-descriptions-item>
|
||
|
|
<a-descriptions-item label="硬件版本">{{formData.hardwareVersion}}</a-descriptions-item>
|
||
|
|
<a-descriptions-item label="固件版本">{{formData.firmwareVersion}}</a-descriptions-item>
|
||
|
|
<a-descriptions-item label="扩展属性">{{formData.extendParams}}</a-descriptions-item>
|
||
|
|
</a-descriptions>
|
||
|
|
|
||
|
|
<template #footer>
|
||
|
|
<!-- <a-button class="editor-button" @click="handleCancel">取消</a-button>-->
|
||
|
|
<a-button class="editor-button" type="primary" @click="handleCancel">确定</a-button>
|
||
|
|
</template>
|
||
|
|
</a-modal>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script lang="ts" setup>
|
||
|
|
import useVisible from '@/hooks/visible';
|
||
|
|
import { defineEmits, PropType, ref } from 'vue';
|
||
|
|
import { DeviceCreateRecord } from '@/api/device';
|
||
|
|
import '@wangeditor/editor/dist/css/style.css'
|
||
|
|
|
||
|
|
|
||
|
|
const props = defineProps({
|
||
|
|
prem: {
|
||
|
|
type: Object as PropType<DeviceCreateRecord>,
|
||
|
|
},
|
||
|
|
isCreate: Boolean,
|
||
|
|
});
|
||
|
|
const emit = defineEmits(['refresh']);
|
||
|
|
const { visible, setVisible } = useVisible(false);
|
||
|
|
|
||
|
|
const formData = ref<any>({
|
||
|
|
...props.prem,
|
||
|
|
});
|
||
|
|
|
||
|
|
|
||
|
|
// 组件被点击
|
||
|
|
const handleClick = () => {
|
||
|
|
setVisible(true);
|
||
|
|
};
|
||
|
|
|
||
|
|
// 关闭
|
||
|
|
const handleCancel = async () => {
|
||
|
|
setVisible(false);
|
||
|
|
};
|
||
|
|
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style scoped>
|
||
|
|
.editor-button{
|
||
|
|
position: static
|
||
|
|
}
|
||
|
|
</style>
|