Refactor API requests and update component styles

This commit is contained in:
wangqiao
2025-08-23 17:14:42 +08:00
parent bf86652ff2
commit 38f6d8c062
15 changed files with 376 additions and 294 deletions

View File

@ -1,16 +1,16 @@
<template>
<div class="w-100% border-b-1px border-b-[#eee] border-b-solid">
<div class="relative ma-auto flex items-center py-20px w-1500px!">
<img src="~/assets/images/logo5.png" alt="图夕夕" srcset="" class="h-51px w-182px cursor-pointer" @click="router.push('/index')" />
<div class="ml-60px flex items-center">
<div class="w-[100%] border-b-[1px] border-b-[#eee] border-b-solid">
<div class="relative ma-auto flex items-center py-[20px] w-[1500px]!">
<img src="~/assets/images/logo5.png" alt="图夕夕" srcset="" class="h-[51px] w-[182px] cursor-pointer" @click="router.push('/index')" />
<div class="ml-[60px] flex items-center">
<span v-for="item in navList" :key="item" class="nav" :class="props.active === item ? 'active' : ''" @click="handleClick(item)">{{ item }}</span>
</div>
<div class="relative ml-30px">
<div class="relative ml-[30px]">
<el-input
v-model="searchQuery"
placeholder="电子产品"
:prefix-icon="Search"
class="search-input h-40px w-328px"
class="search-input h-[40px] w-[328px]"
@focus="handleHot(), (showHotList = true)"
@input="handleInput"
></el-input>
@ -18,31 +18,31 @@
<div
v-if="showHotList"
v-loading="loading"
class="absolute left-16px top-42px z-100 w-276px border-width-1px border-color-#1A65FF rounded-bl-4px rounded-br-4px rounded-tl-0px rounded-tr-0px border-solid bg-[#fff] pa-10px"
class="absolute left-[16px] top-[42px] z-100 w-[276px] border-width-[1px] border-color-[#1A65FF] rounded-bl-[4px] rounded-br-[4px] rounded-tl-[0px] rounded-tr-[0px] border-solid bg-[#fff] pa-[10px]"
>
<!-- 这里放置热门列表的内容 -->
<ul class="flex flex-col gap-6px">
<ul class="flex flex-col gap-[6px]">
<li
v-for="(item, index) in hotItems"
:key="index"
class="flex flex-row cursor-pointer items-center justify-between text-13px"
class="flex flex-row cursor-pointer items-center justify-between text-[13px]"
@click="handleHotItem(item)"
>
<span class="color-#333333">{{ item.projectTypeName }}</span>
<span v-if="item.count" class="color-#999999">{{ item.count }}份图纸</span>
<span class="color-[#333333]">{{ item.projectTypeName }}</span>
<span v-if="item.count" class="color-[#999999]">{{ item.count }}份图纸</span>
</li>
</ul>
<div v-if="!hotItems.length" class="text-12px color-#999">无数据</div>
<div v-if="!hotItems.length" class="text-[12px] color-[#999]">无数据</div>
</div>
</div>
<div class="absolute right-10px flex items-center">
<div class="h-36px w-36px border-rd-[50%] bg-[#F5F5F5] text-center line-height-44px">
<img v-if="!isLogin" src="~/assets/images/user.png" alt="" srcset="" class="h-19px w-17px" />
<img v-else :src="userStore.userInfoRes.avatar" alt="" srcset="" class="h-19px w-17px rd-50%" />
<div class="absolute right-[10px] flex items-center">
<div class="h-[36px] w-[36px] border-rd-[50%] bg-[#F5F5F5] text-center line-height-[44px]">
<img v-if="!isLogin" src="~/assets/images/user.png" alt="" srcset="" class="h-[19px] w-[17px]" />
<img v-else :src="userStore.userInfoRes.avatar" alt="" srcset="" class="h-[19px] w-[17px] rd-[50%]" />
</div>
<span v-if="!isLogin" class="ml-14px cursor-pointer text-14px text-[#1A65FF] font-normal" @click="handleLogin">立即登录</span>
<span v-if="!isLogin" class="ml-[14px] cursor-pointer text-[14px] text-[#1A65FF] font-normal" @click="handleLogin">立即登录</span>
<el-dropdown v-else placement="top-start" @command="handleCommand">
<span class="ml-14px cursor-pointer text-14px text-[#1A65FF] font-normal">{{ userStore.userInfoRes.nickname || '立即登录' }}</span>
<span class="ml-[14px] cursor-pointer text-[14px] text-[#1A65FF] font-normal">{{ userStore.userInfoRes.nickname || '立即登录' }}</span>
<template #dropdown>
<el-dropdown-menu>
<el-dropdown-item command="个人中心"
@ -135,18 +135,18 @@
const level = item.pairs?.filter(Boolean).map((item) => ({ id: item?.id, name: item?.name, isChildren: false })) || []
level.unshift(normal)
if (item.type === 1) {
navigateTo(`/drawe?level=${JSON.stringify(level)}&keywords=${item.title || ''}`, '_blank')
navigateTo(`/drawe?level=${JSON.stringify(level)}&keywords=${item.title || ''}`)
} else if (item.type === 2) {
navigateTo(`/text?level=${JSON.stringify(level)}&keywords=${item.title || ''}`, '_blank')
navigateTo(`/text?level=${JSON.stringify(level)}&keywords=${item.title || ''}`)
} else if (item.type === 3) {
navigateTo(`/model?level=${JSON.stringify(level)}&keywords=${item.title || ''}`, '_blank')
navigateTo(`/model?level=${JSON.stringify(level)}&keywords=${item.title || ''}`)
}
}
const handleClick = (item: string) => {
switch (item) {
case '首页':
navigateTo('/index') // 修改为在新窗口打开
navigateTo('/') // 修改为在新窗口打开
break
case '图纸':
navigateTo('/drawe') // 修改为在新窗口打开
@ -174,7 +174,7 @@
}
}
const handleLogin = () => {
$openLogin()
// $openLogin()
}
const handleCommand = (command: string) => {
if (command === '退出') {