提交 1353d9fa 作者: ZhangLingKun

功能:首页优化

上级 b73b397e
流水线 #7848 已通过 于阶段
in 5 分 10 秒
#请求接口地址
#正式服
#NEXT_PUBLIC_BASE_URL='https://www.iuav.com'
NEXT_PUBLIC_BASE_URL='https://www.iuav.com'
#测试服
NEXT_PUBLIC_BASE_URL='https://test.iuav.com'
#NEXT_PUBLIC_BASE_URL='https://test.iuav.com'
#版本
NODE_ENV='development'
......@@ -53,7 +53,7 @@ const TabView01 = () => {
return (
<TabViewWrap className="animate__animated animate__fast animate__fadeIn">
{tabList.map((i, j) => (
<div key={j}>
<div className="tab-item align-start flex" key={j}>
<div className={'tab-little flex-start'}>
{!!i.icon && (
<img src={i.icon} alt={i.name} className="title-image" />
......@@ -90,20 +90,30 @@ const TabViewWrap = styled.div`
box-sizing: border-box;
padding: 0.79rem 1.58rem;
//background: lightyellow;
.tab-little {
.tab-item {
position: relative;
width: 100%;
box-sizing: border-box;
margin-bottom: 0.68rem;
padding-bottom: 0.68rem;
border-bottom: 0.02rem solid #ededed;
margin-bottom: 0.5rem;
&:last-child {
border: none;
}
}
.tab-little {
position: relative;
box-sizing: border-box;
//padding-bottom: 0.68rem;
//border-bottom: 0.02rem solid #ededed;
//margin-bottom: 0.5rem;
.title-image {
width: 1.68rem;
height: 1.68rem;
margin-right: 0.5rem;
}
.title-name {
font-size: 0.75rem;
font-size: 0.78rem;
font-weight: 550;
color: #333333;
padding: 0;
......@@ -111,13 +121,16 @@ const TabViewWrap = styled.div`
}
.tab-list {
position: relative;
width: 100%;
flex-wrap: wrap;
margin-bottom: 1rem;
transform: translateX(-10px);
max-width: calc(100% - 6rem);
//height: 1.58rem;
//overflow: hidden;
//margin-bottom: 1rem;
//transform: translateX(-10px);
.list-item {
color: #666666;
font-weight: 500;
padding-right: 0;
}
}
`;
......
......@@ -23,7 +23,7 @@ const HomeTabView = () => {
moduleCode: 'HOME_MENU_NEW',
});
if (res && res.code === '200') {
setCategoryList(res.result.slice(0, 1) || []);
setCategoryList(res.result.slice(0, 2) || []);
}
};
// 选择分类
......
......@@ -43,18 +43,17 @@ const QrcodePopover: React.FC<{
}
};
const content = (
<div className="flex-center" style={{ flexDirection: 'column' }}>
<div style={{ width: '12.5rem', height: '12.5rem' }}>
<div className="flex-center flex-col">
<div className="h-[12.5rem] w-[12.5rem]">
{qrCodeData && (
<img
className="animate__animated animate__faster animate__fadeIn"
style={{ width: '12.5rem', height: '12.5rem' }}
className="animate__animated animate__faster animate__fadeIn h-[12.5rem] w-[12.5rem]"
src={qrCodeData}
alt="云享飞小程序"
/>
)}
</div>
<div style={{ marginTop: '1rem' }}>请前往小程序进行继续操作</div>
<div className="mt-[1rem]">请前往小程序进行继续操作</div>
</div>
);
return (
......@@ -63,15 +62,11 @@ const QrcodePopover: React.FC<{
trigger={'click'}
placement={placement || 'bottomRight'}
onOpenChange={handleOpenChange}
style={{ display: 'none' }}
>
<div style={{ display: 'none' }}>
<div>
{children && children}
{text && (
<Button
type="link"
style={{ color: '#3366cc', padding: 0, margin: 0 }}
>
<Button type="link" className="m-0 p-0 text-[#3366cc]">
{text}
</Button>
)}
......
......@@ -3,6 +3,7 @@ import HomeBottomView from '@/components/home-comp/home-bottom';
import HomeMapView from '@/components/home-comp/home-map';
import HomeNewsView from '@/components/home-comp/home-news';
import HomeProductView from '@/components/home-comp/home-product';
import HomeSearchView from '@/components/home-comp/home-search';
import HomeTabView from '@/components/home-comp/home-tab';
import HomeTitleView from '@/components/home-comp/home-title';
import { HomeWrap } from '@/pages/home/styled';
......@@ -21,7 +22,7 @@ const HomeView = () => {
return (
<HomeWrap>
{/* 主页搜索 */}
{/* <HomeSearchView /> */}
<HomeSearchView />
{/* 网格布局 */}
<div className="home-grid">
{/* 主页分类 */}
......
......@@ -4,7 +4,7 @@ import HomeView from '@/pages/home';
const App = () => {
return (
<LayoutView placeholder={true}>
<LayoutView placeholder={false}>
<HomeView></HomeView>
</LayoutView>
);
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论