123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199 |
- let page = 1;
- let pageSize = 10;
- let total = 0;
- let loadedItems = 0;
- let isLoading = false;
- const timeoutDuration = 10000;
- const preLoadDistance = 300;
- const authToken = localStorage.getItem("Authorization");
- const license_info_container = document.getElementById('restaurant-list');
- const license_info_modal = document.getElementById('license-info-modal');
- const license_info_modalContent = document.querySelector('.license-info-modal-content');
- const license_info_modalTitle = document.getElementById('license-info-modal-title');
- const license_info_modalDescription = document.getElementById('license-info-modal-description');
- const license_info_modalPrice = document.getElementById('license-info-modal-price');
- const license_info_modalRating = document.getElementById('license-info-modal-rating');
- const license_info_closeModal = document.querySelector('.license-info-close');
- const license_info_loadingIndicator = document.getElementById('loading-indicator');
- const license_info_mainElement = document.querySelector('main');
- async function fetchLicenseData(page, pageSize) {
- try {
- const response = await fetch(`http://127.0.0.1:8080/api/admin/GetAllLicenseInfo?page=${page}&pageSize=${pageSize}`, {
- method: 'GET',
- headers: {
- 'Authorization': `Bearer ${authToken}`,
- 'Content-Type': 'application/json'
- }
- });
-
- const result = await response.json();
-
-
- if (total === 0 && result.total) {
- total = result.total;
- }
- return result.data || [];
- } catch (error) {
- console.error("加载数据失败", error);
- return [];
- }
- }
- function renderLicenseCards(data, clearContainer = false) {
- if (clearContainer) {
- license_info_container.innerHTML = '';
- }
- data.forEach(group => {
- const firstItem = group[0];
- let statusClass = '';
- if (firstItem.LicenseFlage === '已生成') {
- statusClass = 'license-status-green';
- } else if (firstItem.LicenseFlage === '未生成') {
- statusClass = 'license-status-yellow';
- } else if (firstItem.LicenseFlage === '已失效') {
- statusClass = 'license-status-red';
- }
- const card = document.createElement('div');
- card.className = 'license-info-card';
-
-
-
- card.innerHTML = `
- <div class="license-info-card-header">
- <h3 class="card-title">${firstItem.GlxmName}</h3>
- </div>
- <div class="license-info-card-content">
- <p class="card-text">${firstItem.ApplicationDate} ${firstItem.ApplicationTime}</p> <!-- 显示日期和时间 -->
- <p class="card-text">创建者:${firstItem.Creator}</p>
- <p class="card-text">公司:${firstItem.Company}</p>
- <p class="card-text ${statusClass}">许可证状态:${firstItem.LicenseFlage}</p>
- </div>
- `;
-
- license_info_container.appendChild(card);
- });
- console.log("卡片渲染完成,准备添加监听器");
-
- addCardClickListeners();
- }
- function checkContentHeight() {
- const documentHeight = document.documentElement.scrollHeight;
- const windowHeight = window.innerHeight;
- if (documentHeight <= windowHeight) {
- console.log("页面内容不足,继续加载更多数据");
- loadMoreData();
- }
- }
- async function checkAndLoadMore(scrollHeight, scrollTop, clientHeight) {
- if (isLoading || loadedItems >= total) return;
- console.log(`Scroll Info - scrollHeight: ${scrollHeight}, scrollTop: ${scrollTop}, clientHeight: ${clientHeight}`);
- if (scrollTop + clientHeight >= scrollHeight - preLoadDistance) {
- console.log(`触发加载更多数据:page=${page}, pageSize=${pageSize}`);
- await loadMoreData();
- }
- }
- async function loadMoreData() {
- if (isLoading) return;
- isLoading = true;
- console.log('开始加载更多数据');
-
-
-
-
-
- const timeout = setTimeout(() => {
- license_info_loadingIndicator.innerText = '加载超时,请重试';
- isLoading = false;
- license_info_loadingIndicator.style.display = 'none';
- }, timeoutDuration);
-
- const data = await fetchLicenseData(page, pageSize);
-
- clearTimeout(timeout);
- if (data.length > 0) {
-
- renderLicenseCards(data);
-
- page += 10;
- pageSize += 10;
-
- loadedItems += data.length;
- console.log('数据加载完成,更新页面');
- }
-
-
- isLoading = false;
-
- checkContentHeight();
- }
- window.addEventListener('scroll', () => {
- checkAndLoadMore(document.body.scrollHeight, window.scrollY, window.innerHeight);
- });
- license_info_mainElement.addEventListener('scroll', () => {
- checkAndLoadMore(license_info_mainElement.scrollHeight, license_info_mainElement.scrollTop, license_info_mainElement.clientHeight);
- });
- (async function() {
- const data = await fetchLicenseData(page, pageSize);
- if (data.length > 0) {
- renderLicenseCards(data);
- loadedItems += data.length;
- }
-
-
- checkContentHeight();
- })();
|