130 lines
3.9 KiB
Vue
130 lines
3.9 KiB
Vue
<template>
|
||
<el-select v-model="roomHotelCode"
|
||
value-key="code"
|
||
filterable
|
||
clearable
|
||
remote
|
||
style="width: 150px; margin-right:7px"
|
||
size="small"
|
||
@focus="hotelChange"
|
||
@change="handleHotelForRooms"
|
||
:remote-method="remoteHotel"
|
||
placeholder="选择酒店">
|
||
<template #prefix>
|
||
<el-text size="small">{{ selectedHotelDisplay }}</el-text>
|
||
</template>
|
||
<el-option v-for="hotel in hotels"
|
||
:key="hotel.code"
|
||
:label="hotel.name"
|
||
:value="hotel.code">
|
||
<span style="float: left">{{ hotel.name }}</span>
|
||
<span style="float: right; color: #8492a6; font-size: 13px"> Code:{{ hotel.code }}</span>
|
||
</el-option>
|
||
</el-select>
|
||
|
||
|
||
</template>
|
||
|
||
<script setup>
|
||
import { ref, inject, computed, watch, onMounted, onUnmounted, nextTick, shallowRef } from 'vue';
|
||
import { ElMessage, ElButton, ElTag, ElCheckbox, ElMessageBox, ElLoading } from 'element-plus'
|
||
import { Setting, Refresh, ArrowDownBold, ArrowUpBold } from '@element-plus/icons-vue'
|
||
import dayjs from 'dayjs'
|
||
import config from '../../../public/config.js'
|
||
import { useRouter, useRoute } from 'vue-router'
|
||
import $ from 'jquery'
|
||
import qs from 'qs'
|
||
import { createAxiosInstance } from '../../axios.js'
|
||
|
||
const $http = inject('$http')
|
||
// 注入方法
|
||
const checkLoginStatus = inject('checkLoginStatus');
|
||
const isMobile = inject('isMobile');
|
||
const fullScreen = inject('fullScreen');
|
||
const customHttp = createAxiosInstance(1);
|
||
const rcuHttp = createAxiosInstance(2);
|
||
|
||
const roomHotelCode = ref(null);
|
||
const currentRoomHotelCode = ref('');
|
||
const allHotels = ref([]); // 所有酒店信息
|
||
const allRooms = ref([]); // 当前房间信息
|
||
const hotels = ref([]); // 所有酒店信息
|
||
const hotelRoomCounts = ref({});
|
||
|
||
|
||
|
||
|
||
|
||
|
||
const getPowerLog = async () => {
|
||
const QueryDate = {
|
||
HotelCode: '1003',
|
||
HostNumber: '',
|
||
Mac: '',
|
||
Start_Time: pickerDate.value[0],
|
||
End_Time: pickerDate.value[1],
|
||
PageSize: 1,
|
||
PageIndex: 100000,
|
||
};
|
||
//console.log(QueryDate);
|
||
const rs = await $http.post('Power/GetPowerAnalysis', JSON.stringify(QueryDate));
|
||
console.log(rs.data);
|
||
}
|
||
|
||
const getAllHotels = async () => {
|
||
try {
|
||
const rs = await customHttp.post('LowerMachineLog/GetHotelList');
|
||
if (rs.data.isok) {
|
||
allHotels.value = rs.data.response;
|
||
hotels.value = rs.data.response;
|
||
|
||
// 新增：获取所有酒店的房间数
|
||
try {
|
||
const roomCountRes = await customHttp.get('BlockIP/GetRoomCount');
|
||
roomCountRes.data.response.forEach(item => {
|
||
// 将房间数存储在hotelRoomCounts中，key为酒店code
|
||
hotelRoomCounts.value[item.hotelID] = item.totalCount;
|
||
});
|
||
} catch (roomError) {
|
||
console.error('获取酒店房间数失败:', roomError);
|
||
}
|
||
|
||
// 设置酒店的默认房间数为"-1"（表示未知）
|
||
allHotels.value.forEach(hotel => {
|
||
hotel.count = hotelRoomCounts.value[hotel.id] || "-1";
|
||
});
|
||
}
|
||
} catch (error) {
|
||
// ...错误处理
|
||
}
|
||
};
|
||
|
||
// 搜索hotel
|
||
const remoteHotel = (query) => {
|
||
if (query != "" && (hotelCurrent.value == null || hotelCurrent.value == "")) {
|
||
hotels.value = [];
|
||
const nc = allHotels.value.filter(item => item.code.includes(query) || item.name.includes(query));
|
||
if (nc.length > 0) {
|
||
hotels.value = nc;
|
||
} else {
|
||
hotels.value = JSON.parse(JSON.stringify(allHotels.value));
|
||
}
|
||
} else {
|
||
hotels.value = JSON.parse(JSON.stringify(allHotels.value));
|
||
}
|
||
}
|
||
onMounted(() => {
|
||
localStorage.setItem('url', '/home')
|
||
checkLoginStatus()
|
||
// 同时获取所有房间和监控列表
|
||
getAllHotels();
|
||
})
|
||
</script>
|
||
|
||
<style scoped>
|
||
.container {
|
||
padding: 5px;
|
||
}
|
||
|
||
</style>
|