52 lines
1.7 KiB
Vue
52 lines
1.7 KiB
Vue
|
<template>
|
||
|
|
<div class="detail-container">
|
||
|
|
<el-card shadow="hover">
|
||
|
|
<el-descriptions title="基础信息" :column="3">
|
||
|
|
<el-descriptions-item label="服务站名称">{{
|
||
|
|
basicData.mc
|
||
|
|
}}</el-descriptions-item>
|
||
|
|
<el-descriptions-item label="服务站经度">{{
|
||
|
|
basicData.jd
|
||
|
|
}}</el-descriptions-item>
|
||
|
|
<el-descriptions-item label="服务站纬度">{{
|
||
|
|
basicData.wd
|
||
|
|
}}</el-descriptions-item>
|
||
|
|
<el-descriptions-item label="设备数">{{}}</el-descriptions-item>
|
||
|
|
<el-descriptions-item label="物资数">{{}}</el-descriptions-item>
|
||
|
|
<el-descriptions-item label="人员数">{{}}</el-descriptions-item>
|
||
|
|
<el-descriptions-item label="创建日期">{{}}</el-descriptions-item>
|
||
|
|
</el-descriptions>
|
||
|
|
</el-card>
|
||
|
|
<el-card shadow="hover">
|
||
|
|
<el-descriptions title="配置信息" :column="3"> </el-descriptions>
|
||
|
|
<el-tabs v-model="activeTab" class="demo-tabs" @tab-click="handleClick">
|
||
|
|
<el-tab-pane label="人员信息" name="people">人员信息</el-tab-pane>
|
||
|
|
<el-tab-pane label="物资信息" name="second">物资信息</el-tab-pane>
|
||
|
|
<el-tab-pane label="设备信息" name="third">设备信息</el-tab-pane>
|
||
|
|
</el-tabs>
|
||
|
|
</el-card>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script setup>
|
||
|
|
import { h, ref, onMounted, reactive, watch, toRaw, nextTick } from "vue";
|
||
|
|
const props = defineProps({
|
||
|
|
basicData: {
|
||
|
|
type: Object,
|
||
|
|
default: () => ({}),
|
||
|
|
},
|
||
|
|
});
|
||
|
|
|
||
|
|
const activeTab = ref("people");
|
||
|
|
const handleClick = (tab, event) => {
|
||
|
|
console.log("tab", tab, "event", event);
|
||
|
|
};
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style>
|
||
|
|
.detail-container {
|
||
|
|
display: flex;
|
||
|
|
flex-direction: column;
|
||
|
|
gap: 30px;
|
||
|
|
}
|
||
|
|
</style>
|