提交 a704b261 作者: 翁进城

加盟modal样式修正

上级 469c00fa
.identityBtn { .identityBtn {
box-sizing: border-box; box-sizing: border-box;
padding: 0 5px; padding: 0 5px;
position: absolute;
bottom: 0;
left: 50%;
transform:translate(-50%, 0);
min-width: 100%; min-width: 100%;
height: 24px;
background: #e26329;
border-radius: 6px; border-radius: 6px;
opacity: 0.95; text-align: center;
display: flex; font-size: 14px;
justify-content: center; font-family: PingFangSC-Regular, PingFang SC;
align-items: center; font-weight: 400;
font-size: 12px; color: #000000;
font-family: PingFangSC-Medium, PingFang SC; flex-wrap: nowrap;
font-weight: 500;
color: #fff;
white-space: nowrap;
} }
.modal { .modal {
:global .ant-modal-content { :global .ant-modal-content {
border-radius: 6px; border-radius: 6px;
.ant-modal-title{ .ant-modal-title {
text-align: center; text-align: center;
} }
} }
......
...@@ -6,6 +6,18 @@ import { useEffect, useState } from "react"; ...@@ -6,6 +6,18 @@ import { useEffect, useState } from "react";
import api, { ListTagResp } from "./api"; import api, { ListTagResp } from "./api";
import { useRouter } from "next/router"; import { useRouter } from "next/router";
const imgs = [
require("./assets/生产制造商.png"),
require("./assets/品牌企业.png"),
require("./assets/商务公关机构.png"),
require("./assets/无人机自媒体.png"),
require("./assets/投资机构.png"),
require("./assets/飞手团队.png"),
require("./assets/二手服务商.png"),
require("./assets/飞手培训机构.png"),
require("./assets/推广合作商.png"),
];
type Props = { type Props = {
open?: boolean; open?: boolean;
onOk?: () => void; onOk?: () => void;
...@@ -16,10 +28,10 @@ export default function JoinModal(props: Props) { ...@@ -16,10 +28,10 @@ export default function JoinModal(props: Props) {
const [tagList, setTagList] = useState<ListTagResp[]>([]); const [tagList, setTagList] = useState<ListTagResp[]>([]);
useEffect(() => { useEffect(() => {
api.listTag().then(res => { api.listTag().then((res) => {
setTagList(res.result || []); setTagList(res.result || []);
}) });
}, []) }, []);
const onClickTag = (item: ListTagResp) => { const onClickTag = (item: ListTagResp) => {
router.replace("/JoinPolicy?tagId=" + item.id); router.replace("/JoinPolicy?tagId=" + item.id);
...@@ -35,15 +47,20 @@ export default function JoinModal(props: Props) { ...@@ -35,15 +47,20 @@ export default function JoinModal(props: Props) {
width={460} width={460}
footer={null} footer={null}
> >
<Row style={{ padding: "22px 16px 20px 16px", gap: "16px 40px" }}> <Row style={{rowGap: 29, paddingTop: 21, paddingBottom: 21}}>
{tagList.map((item) => { {tagList.map((item, i) => {
return ( return (
<Col <Col
key={item.id} key={item.id}
style={{ cursor: "pointer", height: 100, padding: 0 }} span={8}
style={{
cursor: "pointer",
padding: 0,
textAlign: "center",
}}
onClick={() => onClickTag(item)} onClick={() => onClickTag(item)}
> >
<Image src={img} width={100} height={100} alt=""></Image> <Image src={imgs[i]} width={64} height={64} alt=""></Image>
<div className={styles.identityBtn}> <div className={styles.identityBtn}>
{item.tagName} {item.tagName}
{">"} {">"}
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论