diff --git a/src/assets/images/head/events.png b/src/assets/images/head/events.png new file mode 100644 index 0000000..4e23937 Binary files /dev/null and b/src/assets/images/head/events.png differ diff --git a/src/assets/images/head/jiankong.png b/src/assets/images/head/jiankong.png new file mode 100644 index 0000000..bc5efa7 Binary files /dev/null and b/src/assets/images/head/jiankong.png differ diff --git a/src/assets/images/head/main.png b/src/assets/images/head/main.png new file mode 100644 index 0000000..fe2a894 Binary files /dev/null and b/src/assets/images/head/main.png differ diff --git a/src/assets/images/head/tuijian.png b/src/assets/images/head/tuijian.png new file mode 100644 index 0000000..542dc39 Binary files /dev/null and b/src/assets/images/head/tuijian.png differ diff --git a/src/assets/images/head/xinxi.png b/src/assets/images/head/xinxi.png new file mode 100644 index 0000000..6d56178 Binary files /dev/null and b/src/assets/images/head/xinxi.png differ diff --git a/src/assets/images/user/79.png b/src/assets/images/user/79.png new file mode 100644 index 0000000..effc8b2 Binary files /dev/null and b/src/assets/images/user/79.png differ diff --git a/src/assets/images/user/bbs.png b/src/assets/images/user/bbs.png new file mode 100644 index 0000000..a625e87 Binary files /dev/null and b/src/assets/images/user/bbs.png differ diff --git a/src/assets/images/user/boss.png b/src/assets/images/user/boss.png new file mode 100644 index 0000000..cb34d21 Binary files /dev/null and b/src/assets/images/user/boss.png differ diff --git a/src/assets/images/user/gaishi.png b/src/assets/images/user/gaishi.png new file mode 100644 index 0000000..d4cb78b Binary files /dev/null and b/src/assets/images/user/gaishi.png differ diff --git a/src/assets/images/user/gg.png b/src/assets/images/user/gg.png new file mode 100644 index 0000000..93fae48 Binary files /dev/null and b/src/assets/images/user/gg.png differ diff --git a/src/assets/images/user/haijing.png b/src/assets/images/user/haijing.png new file mode 100644 index 0000000..bda03f5 Binary files /dev/null and b/src/assets/images/user/haijing.png differ diff --git a/src/assets/images/user/huanqiu.png b/src/assets/images/user/huanqiu.png new file mode 100644 index 0000000..538764e Binary files /dev/null and b/src/assets/images/user/huanqiu.png differ diff --git a/src/assets/images/user/luxian.png b/src/assets/images/user/luxian.png new file mode 100644 index 0000000..da7ac2d Binary files /dev/null and b/src/assets/images/user/luxian.png differ diff --git a/src/assets/images/user/shenhai.png b/src/assets/images/user/shenhai.png new file mode 100644 index 0000000..6def865 Binary files /dev/null and b/src/assets/images/user/shenhai.png differ diff --git a/src/assets/images/user/xinlang.png b/src/assets/images/user/xinlang.png new file mode 100644 index 0000000..db6e39c Binary files /dev/null and b/src/assets/images/user/xinlang.png differ diff --git a/src/views/Main.vue b/src/views/Main.vue index 0d972a7..dfecd42 100644 --- a/src/views/Main.vue +++ b/src/views/Main.vue @@ -1,13 +1,509 @@ - +import { ref } from 'vue'; +import { useRouter } from 'vue-router'; +const router = useRouter(); + +// 动态导入图片 +const importImage = async (path) => { + try { + const module = await import(`@${path}`); + return module.default; + } catch (error) { + console.error('图片导入失败:', error); + return ''; + } +}; + +const handleSearch = () => { + if (inputValue.value === '南海争端系列舆情事件') { + router.push('/Main'); + } else { + alert('请输入正确的事件类别关键词'); + } +}; + +const inputValue = ref(''); +const suggestions = ref([]); + +const allOptions = [ + { value: '南海争端系列舆情事件', link: './Main' }, + { value: '美国大选系列舆情事件', link: '' }, + { value: '涉台系列舆情事件', link: '' }, + { value: '俄乌冲突系列舆情事件', link: '' }, + { value: '中美贸易战系列舆情事件', link: '' }, + { value: '全球供应链系列舆情事件', link: '' }, + { value: '虚拟货币系列舆情事件', link: '' }, + { value: '企业信用危机系列舆情事件', link: '' }, + { value: '金融市场动荡系列舆情事件', link: '' }, + { value: '校园暴力系列舆情事件', link: '' }, + { value: '食品安全系列舆情事件', link: '' }, + { value: '公共卫生系列舆情事件', link: '' }, + { value: '教育公平系列舆情事件', link: '' }, + { value: '劳资纠纷系列舆情事件', link: '' }, + { value: '科技进步系列舆情事件', link: '' }, +]; + +const handleInput = () => { + if (inputValue.value) { + suggestions.value = allOptions.filter((item) => + item.value.toLowerCase().includes(inputValue.value.toLowerCase()) + ); + console.log('过滤后的建议项:', suggestions.value); + } else { + suggestions.value = []; + } +}; + +const selectSuggestion = (item) => { + inputValue.value = item.value; + suggestions.value = []; + console.log('选中项:', item); +}; + +// 定义按钮列表 +const buttonList = ['全部', '新闻媒体', '自媒体', '政府官号']; +// 定义当前激活的按钮索引 +const activeButtonIndex = ref(0); +// 定义不同类型的信息 +// 修正 infoData 里的 img 属性，统一使用 importImage +const infoData = { + '新闻媒体': [ + { name: '新浪军事', fansCount: '1000000', img: await importImage('/assets/images/user/xinlang.png')}, + { name: '环球时报', fansCount: '1500000', img: await importImage('/assets/images/user/huanqiu.png') } + ], + '自媒体': [ + { name: '大侠啊啊啊啊', fansCount: '50000', img: await importImage('/assets/images/user/daxia.png') }, + { name: '外贸发布BBS', fansCount: '30000', img: await importImage('/assets/images/user/waimao.png') }, + { name: '空天砺剑', fansCount: '40000', img: '' }, + { name: '爱锤盾海桃-霆恩启副', fansCount: '20000', img: '' }, + { name: '苍龙飞天79', fansCount: '25000', img: '' }, + { name: '盖世英雄玉椒龙', fansCount: '35000', img: '' }, + { name: '十八子91221', fansCount: '18000', img: '' }, + { name: '江夏云飞', fansCount: '22000', img: '' }, + { name: '唐宁20150903', fansCount: '28000', img: '' }, + { name: '钻石狗Boss', fansCount: '32000', img: '' }, + { name: '乐之567', fansCount: '15000', img: '' }, + { name: '地瓜熊老六', fansCount: '45000', img: '' }, + { name: 'CGTN记者团', fansCount: '60000', img: '' }, + { name: '钱局长本人', fansCount: '55000', img: '' }, + { name: '肥_谍_gg', fansCount: '23000', img: '' }, + { name: '深海一万米', fansCount: '38000', img: '' } + ], + '政府官号': [ + { name: '中国海警', fansCount: '2000000', img: await importImage('/assets/images/user/haijing.png') }, + { name: '平安泸县', fansCount: '1200000', img: await importImage('/assets/images/user/luxian.png') } + ] +}; +// 定义当前显示的信息 +const currentInfo = ref([]); + +// 切换类型的方法 +const changeType = (index) => { + activeButtonIndex.value = index; + if (index === 0) { + // 全部类型 + currentInfo.value = Object.values(infoData).flat(); + } else { + const type = buttonList[index]; + currentInfo.value = infoData[type]; + } +}; + +// 初始化显示全部信息 +changeType(0); + \ No newline at end of file diff --git a/src/views/Navigation.vue b/src/views/Navigation.vue index cf426c5..d2b959d 100644 --- a/src/views/Navigation.vue +++ b/src/views/Navigation.vue @@ -39,6 +39,11 @@ display: block; "> + + +
+ + 2025.06.09 08:18
@@ -189,8 +194,12 @@ const selectSuggestion = (item) => {