<!-- * @Description: * @Author: 王晓颖 * @Date: --> <template> <div class="info-window"> <!--人员详情--> <div v-if="type=='staff'" class="info-header">人员详情</div> <div v-if="type=='staff'&&data!=null" class="info-body"> <div>姓名:{{ data.name }}</div> <div>性别:{{ data.sexName }}</div> <div>联系电话:{{ data.tel }}</div> <div>人员类别:{{ data.postName }}</div> <div>负责片区:{{ data.responseArea }}</div> </div> <div v-if="type=='toilet'" class="info-header">公厕详情</div> <div v-if="type=='toilet'&&data!=null" class="info-body"> <div>公厕编号:{{ data.code }}</div> <div>公厕名称:{{ data.name }}</div> <div>位置:{{ data.position }}</div> <div>建设单位:{{ data.owner }}</div> <div>负责人:{{ data.responsiblePerson }} ( {{ data.responsiblePersonTel }} )</div> <div>占地面积:{{ data.area }}平方米</div> <div>建设时间:{{ data.ts }}</div> </div> <div v-if="type=='wastebin'" class="info-header">垃圾桶详情</div> <div v-if="type=='wastebin'&&data!=null" class="info-body"> <div>垃圾桶编号:{{ data.code }}</div> <div>垃圾桶名称:{{ data.name }}</div> <div>位置:{{ data.position }}</div> <div>负责人:{{ data.responsiblePerson }} ( {{ data.responsiblePersonTel }} )</div> <div>启用时间:{{ data.ts }}</div> </div> <div v-if="type=='transferStation'" class="info-header">中转站详情</div> <div v-if="type=='transferStation'&&data!=null" class="info-body"> <div>中转站编号:{{ data.code }}</div> <div>中转站名称:{{ data.name }}</div> <div>位置:{{ data.position }}</div> <div>建设单位:{{ data.owner }}</div> <div>负责人:{{ data.responsiblePerson }} ( {{ data.responsiblePersonTel }} )</div> <div>占地面积:{{ data.area }}平方米</div> <!--<div>最新垃圾量:{{ data.capacity }}立方米</div>--> <div>建设时间:{{ data.ts }}</div> </div> <div v-if="type=='car'" class="info-header">车辆详情</div> <div v-if="type=='car'&&data!=null" class="info-body"> <div>车牌号:{{ data.carCode }}</div> <div>车辆描述:{{ data.description }}</div> <div>车辆类型:{{ data.carTypeName }}</div> <div>使用单位:{{ data.deptName }} </div> <div>车速:{{ data.speed }}km/h</div> </div> </div> </template> <script> export default { name: 'Popwindow', props: { data: { type: Object, required: true }, // 数据 type: { type: String, required: true }// 弹窗类型 }, data() { return { } }, methods: { } } </script> <style rel="stylesheet/scss" lang="scss" scoped> .info-window{ max-width: 250px; width:230px; /*background-color: lightcyan;*/ .info-header{ padding: 0px 0px 5px 0px; line-height: 30px; font-size:16px; font-weight: bold; /*background-color: #eaf4ff;*/ } .info-body{ padding: 5px 0px 10px 0px; line-height: 23px; font-size: 14px; } } </style>