Commit 6a0faf2f authored by shilei's avatar shilei

fix: 样式

parent ee79afb1
<template>
<div class="header-view flex items-center justify-between pl-[40px]">
<!-- <div>logo</div> -->
<div class="flex flex-1 justify-start">
<div v-if="route.name === 'home'" class="mr-7 flex w-[224px] items-center">
<img class="w-[49px]" src="@/assets/images/logo.png" alt="" />
<span class="ml-1 font-yahei text-[26px] font-bold text-[#333]">立业云</span>
<div
class="city-space ml-4 flex items-center"
@mouseenter="changeCityStatus(1)"
@mouseleave="changeCityStatus(0)"
>
<p class="city text-sm" :class="{ 'city-active': showCityView }">{{ currentCity }}</p>
<img
v-show="!showCityView"
class="default-icon h-3 w-3"
src="@/assets/images/icon-arrow_down2.png"
alt=""
/>
<img
v-show="showCityView"
class="hover-icon h-3 w-3"
src="@/assets/images/icon-triangle.png"
alt=""
/>
<div class="header-view">
<div class="main-width mx-auto flex items-center justify-between">
<!-- <div>logo</div> -->
<div class="flex flex-1 justify-start">
<div v-if="route.name === 'home'" class="mr-7 flex w-[224px] items-center">
<img class="w-[49px]" src="@/assets/images/logo.png" alt="" />
<span class="ml-1 font-yahei text-[26px] font-bold text-[#333]">立业云</span>
<div
class="city-space ml-4 flex items-center"
@mouseenter="changeCityStatus(1)"
@mouseleave="changeCityStatus(0)"
>
<p class="city text-sm" :class="{ 'city-active': showCityView }">{{ currentCity }}</p>
<img
v-show="!showCityView"
class="default-icon h-3 w-3"
src="@/assets/images/icon-arrow_down2.png"
alt=""
/>
<img
v-show="showCityView"
class="hover-icon h-3 w-3"
src="@/assets/images/icon-triangle.png"
alt=""
/>
</div>
</div>
</div>
<ElMenu
class="!border-none"
mode="horizontal"
:default-active="currentPath"
:ellipsis="false"
>
<template v-for="menu in menuList" :key="menu.path">
<ElSubMenu v-if="menu.subMenus?.length" :index="menu.name">
<template #title>{{ getParentName(menu) }}</template>
<ElMenu
class="!border-none"
mode="horizontal"
:default-active="currentPath"
:ellipsis="false"
>
<template v-for="menu in menuList" :key="menu.path">
<ElSubMenu v-if="menu.subMenus?.length" :index="menu.name">
<template #title>{{ getParentName(menu) }}</template>
<ElMenuItem
v-for="subMenu in menu.subMenus"
:key="subMenu.path"
:index="subMenu.path"
:route="subMenu.path"
@click="handleMenuChange(subMenu)"
>
产业分类
</ElMenuItem>
</ElSubMenu>
<ElMenuItem
v-for="subMenu in menu.subMenus"
:key="subMenu.path"
:index="subMenu.path"
:route="subMenu.path"
@click="handleMenuChange(subMenu)"
v-else-if="!(route.name === 'home' && menu.name === '首页')"
:index="menu.path"
:route="menu.path"
@click="handleMenuChange(menu)"
>
产业分类
{{ menu.name }}
</ElMenuItem>
</ElSubMenu>
<ElMenuItem
v-else-if="!(route.name === 'home' && menu.name === '首页')"
:index="menu.path"
:route="menu.path"
@click="handleMenuChange(menu)"
>
{{ menu.name }}
</ElMenuItem>
</template>
</ElMenu>
</div>
<div class="flex items-center pr-[56px] text-base text-[#333333]">
<div>
<div v-if="userInfo" class="flex items-center">
<ElDropdown
ref="dropdown"
trigger="click"
popper-class="user-menu"
:teleported="false"
@visible-change="(e: boolean) => (showUserCenter = e)"
>
<div class="flex w-[167px] items-center pl-2">
<img src="@/assets/images/icon-avatar.png" class="mr-3 h-[26px] w-[26px]" />
<span class="mr-2 cursor-pointer text-base text-[#333333]">
{{ userInfo.phone }}
</span>
<img
v-show="!showUserCenter"
class="default-icon h-3 w-3"
src="@/assets/images/icon-arrow_down2.png"
alt=""
/>
<img
v-show="showUserCenter"
class="hover-icon h-3 w-3"
src="@/assets/images/icon-triangle.png"
alt=""
/>
</div>
<template #dropdown>
<div
class="h-[45px] w-[167px] cursor-pointer pt-[3px] text-center text-base text-[#333333]"
@click="toUserCenter"
>
个人中心
</template>
</ElMenu>
</div>
<div class="flex items-center pr-[56px] text-base text-[#333333]">
<div>
<div v-if="userInfo" class="flex items-center">
<ElDropdown
ref="dropdown"
trigger="click"
popper-class="user-menu"
:teleported="false"
@visible-change="(e: boolean) => (showUserCenter = e)"
>
<div class="flex w-[167px] items-center pl-2">
<img src="@/assets/images/icon-avatar.png" class="mr-3 h-[26px] w-[26px]" />
<span class="mr-2 cursor-pointer text-base text-[#333333]">
{{ userInfo.phone }}
</span>
<img
v-show="!showUserCenter"
class="default-icon h-3 w-3"
src="@/assets/images/icon-arrow_down2.png"
alt=""
/>
<img
v-show="showUserCenter"
class="hover-icon h-3 w-3"
src="@/assets/images/icon-triangle.png"
alt=""
/>
</div>
</template>
</ElDropdown>
<span class="ml-5 cursor-pointer" @click="handleLogout">退出</span>
<template #dropdown>
<div
class="h-[45px] w-[167px] cursor-pointer pt-[3px] text-center text-base text-[#333333]"
@click="toUserCenter"
>
个人中心
</div>
</template>
</ElDropdown>
<span class="ml-5 cursor-pointer" @click="handleLogout">退出</span>
</div>
<div v-else class="cursor-pointer">
<span @click="handleLogin('loginByPhone')">登录</span>
/
<span @click="handleLogin('register')">注册</span>
</div>
</div>
<div v-else class="cursor-pointer">
<span @click="handleLogin('loginByPhone')">登录</span>
/
<span @click="handleLogin('register')">注册</span>
<div class="ml-4 flex items-center text-base font-medium text-[#C0322B]">
<img class="mr-2 h-4 w-4" src="@/assets/images/icon-phone_call.png" />
<span>400-833-0813</span>
</div>
</div>
<div class="ml-4 flex items-center text-base font-medium text-[#C0322B]">
<img class="mr-2 h-4 w-4" src="@/assets/images/icon-phone_call.png" />
<span>400-833-0813</span>
</div>
</div>
<!-- 城市选择 -->
<div
v-show="showCityView"
class="city-view py-[30px]"
@mouseenter="changeCityStatus(1)"
@mouseleave="changeCityStatus(0)"
>
<div class="flex">
<div
v-for="cities in cityList"
:key="cities.label"
class="color-[#1a1a1a] mr-[41px] shrink-0 text-base"
>
<span class="font-medium">{{ cities.label }}</span>
<p
v-for="city in cities.items"
:key="city"
class="city-item mt-6 cursor-pointer"
:class="{ 'text-[#c03226]': city === currentCity }"
@click="handleCityClick(city)"
<!-- 城市选择 -->
<div
v-show="showCityView"
class="city-view py-[30px]"
@mouseenter="changeCityStatus(1)"
@mouseleave="changeCityStatus(0)"
>
<div class="flex">
<div
v-for="cities in cityList"
:key="cities.label"
class="color-[#1a1a1a] mr-[41px] shrink-0 text-base"
>
{{ city }}
</p>
<span class="font-medium">{{ cities.label }}</span>
<p
v-for="city in cities.items"
:key="city"
class="city-item mt-6 cursor-pointer"
:class="{ 'text-[#c03226]': city === currentCity }"
@click="handleCityClick(city)"
>
{{ city }}
</p>
</div>
</div>
</div>
</div>
......@@ -304,9 +306,11 @@ const handleMenuChange = (menu: HeaderMenuItem) => {
.header-view {
box-shadow: 0 2px 8px 0 rgba(90, 0, 0, 0.1);
position: relative;
// width: 1200px;
// margin: 0 auto;
min-width: 1200px;
::v-deep {
.el-menu-item {
padding: 0 16px;
}
.el-menu--horizontal > .el-menu-item {
color: #333333;
// font-weight: 600;
......
......@@ -8,7 +8,7 @@
<div
class="header-bg__content ml-[56px] mt-[75px] font-yahei text-[40px] font-bold leading-[56px] tracking-[2px] text-[#C0322B]"
>
投资{{ developName }} | 共赢发展未来
立业{{ developName }} | 共赢发展未来
</div>
<div>
<img
......
This diff is collapsed.
......@@ -120,7 +120,7 @@
<span v-else class="w-[134px] px-5 leading-none">{{ interval }}s后重新发送</span>
</div>
</div>
<div class="form-item flex" ref="password">
<div class="form-item flex" ref="passWord">
<ElInput
v-model="password"
type="password"
......@@ -170,7 +170,7 @@
<span v-else class="w-[134px] px-5 leading-none">{{ interval }}s后重新发送</span>
</div>
</div>
<div class="form-item flex" ref="password">
<div class="form-item flex" ref="passWord">
<ElInput
v-model="password"
type="password"
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment