// my-component.js
// 引入全局 Vue 对象（因在 HTML 中通过 script 引入，Vue 已挂载到 window）
const { defineComponent, ref, onMounted, onUnmounted, nextTick } = Vue;
// 定义组件（直接使用模板）
export const headTop = defineComponent({
name: "headTop",
props: {
page: {
type: String,
default: "",
},
},
setup(props) {
// 轮播相关状态
let currentIndex = ref(0); // 当前显示的关键词索引
let carouselTimer = ref(null); // 轮播定时器
let isPaused = ref(false); // 是否暂停轮播
onMounted(() => {
getHistorySearch();
// 写一个函数 ，判断本地缓存有没有 wConfig 并判断 是否过一天 如果过了一天 则更新 wConfig
checkWConfig();
// 启动轮播
startCarousel();
});
// 启动轮播函数
const startCarousel = () => {
// 清除已有的定时器
if (carouselTimer.value) {
clearInterval(carouselTimer.value);
}
// 设置新的定时器，每秒滚动一次
carouselTimer.value = setInterval(() => {
if (!searchInputState.value && hotSearchWords.value.length > 1) {
if (currentIndex.value >= hotSearchWords.value.length - 1) {
currentIndex.value++;
setTimeout(() => {
if (!searchInputState.value) currentIndex.value = 0;
}, 2300);
} else currentIndex.value++;
}
}, 2300);
};
// 暂停轮播
const pauseCarousel = () => {
isPaused.value = true;
};
// 恢复轮播
const resumeCarousel = () => {
isPaused.value = false;
};
let hotSearchWords = ref([]);
const checkWConfig = () => {
const wConfig = JSON.parse(localStorage.getItem("wConfig")) || {};
if (wConfig.time) {
const time = new Date(wConfig.time);
const now = new Date();
if (now - time > 24 * 60 * 60 * 1000) getWConfig();
else {
hotSearchWords.value = wConfig.hotSearchWords || [];
}
} else {
getWConfig();
}
};
const getWConfig = () => {
ajaxGet("/v2/api/config/website").then((res) => {
if (res.code == 200) {
let data = res["data"] || {};
hotSearchWords.value = data.hotSearchWords || {};
data.time = new Date().toISOString();
localStorage.setItem("wConfig", JSON.stringify(data));
}
});
};
let state = ref(0); // 是否已经签到
let userInfoWinTimerCount = 0;
const userInfoWinTimer = setInterval(() => {
if (location.host == "127.0.0.1:5501") return;
if (todaysignedState) {
state.value = todaysigned;
clearInterval(userInfoWinTimer);
}
userInfoWinTimerCount++;
if (userInfoWinTimerCount >= 3000) clearInterval(userInfoWinTimer);
}, 50);
const signIn = () => {
SignInComponent.initComponent();
};
let pitchState = ref(false);
let page = ref(props.page);
let input = ref("");
let historySearchList = ref([]); // 历史搜索数据
// 获取历史搜索
const getHistorySearch = () => {
const data = JSON.parse(localStorage.getItem("history-search")) || [];
historySearchList.value = data;
};
// 跳转搜索
const searchEvent = (value) => {
const kw = value || input.value || hotSearchWords.value[currentIndex.value]?.keyword || "";
if (!kw) return;
historySearchList.value.unshift(kw);
historySearchList.value = [...new Set(historySearchList.value)];
if (historySearchList.value.length > 10) historySearchList.value = historySearchList.value.splice(0, 10);
localStorage.setItem("history-search", JSON.stringify(historySearchList.value));
redirectToExternalWebsite("/search/" + kw);
searchInputBlur();
};
let searchHistoryShowState = ref(false); // 历史记录的展开状态
let searchInputState = ref(false); // 搜索框的状态
// 切换历史记录展示状态
const searchInputFocus = () => {
searchInputState.value = true;
if (historySearchList.value.length == 0) return;
searchHistoryShowState.value = true;
};
const searchInputBlur = () => {
setTimeout(() => {
searchInputState.value = false;
searchHistoryShowState.value = false;
}, 200);
};
return { hotSearchWords, historySearchList, searchEvent, searchInputState, searchHistoryShowState, searchInputFocus, searchInputBlur, page, pitchState, state, signIn, input, currentIndex, pauseCarousel, resumeCarousel };
},
template: ` 
已签到，明天再来 `,
});
签到领寄托币 
GO 
