120 lines
3.5 KiB
Vue
120 lines
3.5 KiB
Vue
<template>
|
||
<div class="app-container">
|
||
<!-- 基本信息卡片 -->
|
||
<el-card class="box-card">
|
||
<div slot="header" class="clearfix">
|
||
<span>基本信息</span>
|
||
</div>
|
||
<el-row :gutter="20">
|
||
<el-col :span="8">
|
||
<div class="info-item">
|
||
<span class="label">设施ID：</span>
|
||
<span>{{ equipmentData.equipmentId }}</span>
|
||
</div>
|
||
<div class="info-item">
|
||
<span class="label">设施名称：</span>
|
||
<span>{{ equipmentData.name }}</span>
|
||
</div>
|
||
<div class="info-item">
|
||
<span class="label">设施类型：</span>
|
||
<dict-tag :options="dict.type.ss_equipment_type" :value="equipmentData.type"/>
|
||
</div>
|
||
</el-col>
|
||
<el-col :span="8">
|
||
<div class="info-item">
|
||
<span class="label">所属店铺：</span>
|
||
<span>{{ equipmentData.storeName }}</span>
|
||
</div>
|
||
<div class="info-item">
|
||
<span class="label">所属房间：</span>
|
||
<span>{{ equipmentData.roomName }}</span>
|
||
</div>
|
||
<div class="info-item">
|
||
<span class="label">状态：</span>
|
||
<dict-tag :options="dict.type.ss_equipment_status" :value="equipmentData.status"/>
|
||
</div>
|
||
</el-col>
|
||
<el-col :span="8">
|
||
<div class="info-item">
|
||
<span class="label">创建时间：</span>
|
||
<span>{{ parseTime(equipmentData.createTime) }}</span>
|
||
</div>
|
||
<div class="info-item">
|
||
<span class="label">更新时间：</span>
|
||
<span>{{ parseTime(equipmentData.updateTime) }}</span>
|
||
</div>
|
||
</el-col>
|
||
</el-row>
|
||
</el-card>
|
||
|
||
<!-- 设备信息卡片 -->
|
||
<el-card class="box-card">
|
||
<div slot="header" class="clearfix">
|
||
<span>设备信息</span>
|
||
</div>
|
||
<el-row :gutter="20">
|
||
<el-col :span="8">
|
||
<div class="info-item">
|
||
<span class="label">设备ID：</span>
|
||
<span>{{ equipmentData.deviceId }}</span>
|
||
</div>
|
||
<div class="info-item">
|
||
<span class="label">MAC地址：</span>
|
||
<span>{{ equipmentData.device ? equipmentData.device.mac : '-' }}</span>
|
||
</div>
|
||
</el-col>
|
||
<el-col :span="8">
|
||
<div class="info-item">
|
||
<span class="label">SN：</span>
|
||
<span>{{ equipmentData.device ? equipmentData.device.sn : '-' }}</span>
|
||
</div>
|
||
<div class="info-item">
|
||
<span class="label">设备状态：</span>
|
||
<dict-tag :options="dict.type.ss_device_status" :value="equipmentData.device ? equipmentData.device.status : ''"/>
|
||
</div>
|
||
</el-col>
|
||
</el-row>
|
||
</el-card>
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
import { getEquipment } from "@/api/system/equipment";
|
||
|
||
export default {
|
||
name: "EquipmentDetail",
|
||
dicts: ['ss_equipment_type', 'ss_equipment_status', 'ss_device_status'],
|
||
data() {
|
||
return {
|
||
equipmentData: {}
|
||
};
|
||
},
|
||
created() {
|
||
const equipmentId = this.$route.params.equipmentId;
|
||
this.getEquipmentData(equipmentId);
|
||
},
|
||
methods: {
|
||
getEquipmentData(equipmentId) {
|
||
getEquipment(equipmentId).then(response => {
|
||
this.equipmentData = response.data;
|
||
});
|
||
}
|
||
}
|
||
};
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
.app-container {
|
||
.box-card {
|
||
margin-bottom: 20px;
|
||
}
|
||
.info-item {
|
||
margin-bottom: 15px;
|
||
.label {
|
||
color: #606266;
|
||
margin-right: 10px;
|
||
font-size: 14px;
|
||
}
|
||
}
|
||
}
|
||
</style> |