Skip to content

W
web-ci-test
提交 6785c016 作者: 翁进城
操作

项目资讯样式招投村项目、行业新闻样式改版

上级 5e4dfbf5
正在显示 包含 161 行增加 和 69 行删除
components/layout/index.tsx
import React, { Suspense } from 'react';
import { Layout, Space } from 'antd';
import NavHeader from '~/components/NavHeader';
import FooterView from '~/components/footer';
import React, { Suspense } from "react";
import { Layout, Space } from "antd";
import NavHeader from "~/components/NavHeader";
import FooterView from "~/components/footer";
const { Header, Footer, Content } = Layout;
const headerStyle: React.CSSProperties = {
height: 'auto',
background: 'none',
height: "auto",
background: "none",
padding: 0,
lineHeight: '1',
position: 'relative'
lineHeight: "1",
position: "relative",
};
const contentStyle: React.CSSProperties = {
minHeight: 120,
lineHeight: '1',
color: '',
backgroundColor: '',
width:1200,
position: 'relative',
margin: "0 auto"
lineHeight: "1",
color: "",
backgroundColor: "",
width: 1200,
position: "relative",
margin: "0 auto",
};
const footerStyle: React.CSSProperties = {
color: '',
backgroundColor: '',
lineHeight: '1',
color: "",
backgroundColor: "",
lineHeight: "1",
padding: 0,
position: 'relative',
marginTop: 78
position: "relative",
marginTop: 78,
};
type Props = {
children: React.ReactNode;
layoutStyle: React.CSSProperties;
};
export default function LayoutView(props: Props) {
return (
<Space direction='vertical' style={{ width: '100%' }} size={[0, 48]}>
<Layout style={{ minHeight: '100vh' }}>
<Space direction="vertical" style={{ width: "100%" }} size={[0, 48]}>
<Layout style={Object.assign({ minHeight: "100vh" }, props.layoutStyle)}>
<Header style={headerStyle}>
<NavHeader />
</Header>
<Content style={contentStyle}>
{props.children}
</Content>
<Content style={contentStyle}>{props.children}</Content>
<Footer style={footerStyle}>
<FooterView></FooterView>
</Footer>
......
pages/projectInfo/components/bids/index.module.scss
......@@ -2,12 +2,12 @@
//项目需求
.bids {
padding-top: 20px;
.item {
padding: 24px 14px 24px 16px;
padding: 24px 17px 24px 16px;
display: flex;
border-bottom: 1px dashed RGBA(222, 222, 222, 1);
justify-content: space-between;
align-items: center;
.info {
.title {
......@@ -27,22 +27,41 @@
}
.btn {
width: 120px;
width: 168px;
height: 40px;
background: #ff552d;
border-radius: 6px;
font-size: 14px;
font-family: MicrosoftYaHei;
color: #ffffff;
}
.btnDisabled {
width: 120px;
height: 40px;
background: #c7cacf;
border-radius: 6px;
background: url("./assets/btn.png");
background-size: 100% 100%;
border: none;
color: #fff;
display: flex;
justify-content: space-between;
padding: 0;
align-items: center;
.text1 {
width: 80px;
font-size: 18px;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: #ff4500;
text-align: left;
padding-left: 8px;
}
.text2 {
flex: 1;
text-align: center;
font-size: 16px;
font-family: MicrosoftYaHei;
color: #ffffff;
}
&.disabled {
opacity: 0.6;
}
}
}
}
pages/projectInfo/components/bids/index.tsx
import { Button } from 'antd';
import styles from './index.module.scss';
import { Button } from "antd";
import styles from "./index.module.scss";
const list = [
{
isApply: false
isApply: false,
},
{
isApply: true
}
]
isApply: true,
},
];
export default function requirements(){
export default function requirements() {
return (
<div className={styles.bids}>
{list.map((item, i) => {
return (
<div className={styles.item} key={i}>
<div className={styles.logo}></div>
<div className={styles.info}>
<div className={styles.title}>项目需求：电力巡检需要5名飞手</div>
<div className={styles.desc}>155万元</div>
</div>
{item.isApply ? (
<Button type="primary" disabled className={styles.btnDisabled}>
已申请
<Button
type="primary"
disabled
className={`${styles.btn} ${styles.disabled}`}
>
<div className={styles.text1}>155W</div>
<div className={styles.text2}>已申请</div>
</Button>
) : (
<Button type="primary" className={styles.btn}>
申请合作
<div className={styles.text1}>155W</div>
<div className={styles.text2}>申请合作</div>
</Button>
)}
</div>
......@@ -35,4 +39,4 @@ export default function requirements(){
})}
</div>
);
}
\ No newline at end of file
}
pages/projectInfo/components/cases/index.module.scss
......@@ -8,6 +8,8 @@
padding: 39px 14px 39px 16px;
display: flex;
border-bottom: 1px dashed RGBA(222, 222, 222, 1);
border-bottom: 1px dashed RGBA(222, 222, 222, 1);
justify-content: space-between;
.info {
.title {
......
pages/projectInfo/components/cases/index.tsx
......@@ -16,7 +16,6 @@ export default function requirements() {
{list.map((item, i) => {
return (
<div className={styles.item} key={i}>
<div className={styles.logo}></div>
<div className={styles.info}>
<div className={styles.title}>项目需求：电力巡检需要5名飞手</div>
</div>
......
pages/projectInfo/components/news/index.module.scss
@import "~/styles/mixins.scss";
//项目需求
.requirements {
.layout {
display: flex;
}
.new {
padding-top: 20px;
width: 750px;
.item {
cursor: pointer;
......@@ -31,3 +36,51 @@
}
}
}
.newsBox {
margin-top: 24px;
width: 384px;
height: 491px;
background: url("./assets/bk.png");
background-size: 100% 100%;
.newsHeader {
padding: 24px;
display: flex;
align-items: center;
gap: 16px;
.newsHeaderTitle {
font-size: 20px;
font-family: MicrosoftYaHeiUI-Bold, MicrosoftYaHeiUI;
font-weight: bold;
color: #000000;
}
}
.newList {
.newItem {
cursor: pointer;
padding: 5px 16px 5px 20px;
display: flex;
justify-content: space-between;
align-items: center;
.newItemTitle {
font-size: 16px;
font-family: MicrosoftYaHei;
color: #323232;
line-height: 21px;
@include ellipsis(2);
width: 217px;
}
.newItemImg {
width: 90px;
height: 60px;
background: #d8d8d8;
border-radius: 6px;
}
}
}
}
pages/projectInfo/components/news/index.tsx
import styles from './index.module.scss';
import { RightOutlined } from "@ant-design/icons";
import { Col, Row } from "antd";
import styles from "./index.module.scss";
import Image from "next/image";
export default function requirements(){
export default function requirements() {
return (
<div className={styles.requirements}>
<div className={styles.item}>
<div className={styles.logo}></div>
<div className={styles.info}>
<div className={styles.title}>项目需求：电力巡检需要5名飞手</div>
<Row justify="space-between">
<Col className={styles.new}>
<div className={styles.item}>
<div className={styles.logo}></div>
<div className={styles.info}>
<div className={styles.title}>项目需求：电力巡检需要5名飞手</div>
</div>
</div>
</div>
</div>
</Col>
<Col className={styles.newsBox}>
<div className={styles.newsHeader}>
<div className={styles.newsHeaderTitle}>行业新闻</div>
<RightOutlined style={{ fontSize: 16 }} />
</div>
<ul className={styles.newList}>
<li className={styles.newItem}>
<div className={styles.newItemTitle}>
中国超音速无人机雨燕试飞成功好棒呀
</div>
<Image className={styles.newItemImg} src="" alt=""></Image>
</li>
</ul>
</Col>
</Row>
);
}
\ No newline at end of file
}
pages/projectInfo/index.module.scss
......@@ -19,10 +19,10 @@
height: 60px;
background: #f4f5f7;
border: 1px solid #f0f0f0;
padding-right: 25px;
:global .ant-tabs-nav {
height: 100%;
margin: 0;
.ant-tabs-tab-btn {
width: 100px;
......
pages/projectInfo/index.tsx
......@@ -64,7 +64,7 @@ const onDateChange: DatePickerProps["onChange"] = (date, dateString) => {
};
const operations = (
<Space size={8}>
<Space size={8} style={{ marginRight: 25 }}>
<Cascader
options={options}
onChange={onChange}
......@@ -106,7 +106,7 @@ const items = ["项目需求", "招投标项目", "业务案例", "行业新闻"
export default function Mall() {
return (
<Layout>
<Layout layoutStyle={{ backgroundColor: "#fff" }}>
<div style={{ backgroundColor: "#fff", minHeight: 820 }}>
<div className="page">
<div className={styles.bannerWrap}>
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论