diff --git a/src/assets/no-data.png b/src/assets/no-data.png new file mode 100644 index 0000000..a7d3e74 Binary files /dev/null and b/src/assets/no-data.png differ diff --git a/src/components/card/CardAgent.tsx b/src/components/card/CardAgent.tsx index fdd1d1d..39d81ef 100644 --- a/src/components/card/CardAgent.tsx +++ b/src/components/card/CardAgent.tsx @@ -6,24 +6,24 @@ import {AgentMedalEnum, IAgent} from "../../interfaces/card/ICardProj.ts"; export default function CardAgent(props: IAgent) { const renderMedal = () => { - if(props.medal == AgentMedalEnum.GOLD) { + if (props.medal == AgentMedalEnum.GOLD) { return 金牌; } - if(props.medal == AgentMedalEnum.SILVER) { + if (props.medal == AgentMedalEnum.SILVER) { return 银牌; } - if(props.medal == AgentMedalEnum.BRONZE) { + if (props.medal == AgentMedalEnum.BRONZE) { return 铜牌; } return 普通; } return ( -
{ +
{ props.handleSelect(); }}>
- {props.logo ? : <>} + {props.logo ? : <>} {props.name} {renderMedal()}
diff --git a/src/components/card/CardProj.tsx b/src/components/card/CardProj.tsx index 158396c..a5c3937 100644 --- a/src/components/card/CardProj.tsx +++ b/src/components/card/CardProj.tsx @@ -1,18 +1,6 @@ import './card-proj.css'; -import {DownOutlined, EditOutlined, SearchOutlined, EyeOutlined, FolderOutlined} from '@ant-design/icons'; -import {MenuProps} from 'antd'; -import {Dropdown, Space} from 'antd'; - -const items: MenuProps['items'] = [ - { - key: '1', - label: ( - - 1st menu item - - ), - }, -]; +import {EditOutlined, SearchOutlined, EyeOutlined, FolderOutlined, SettingOutlined, DownloadOutlined} from '@ant-design/icons'; +import {Button, ConfigProvider, Tag} from 'antd'; export default function CardProj() { return ( @@ -49,30 +37,37 @@ export default function CardProj() {
-
- - - e.preventDefault()}> - 功能管理 - - - - - - e.preventDefault()}> - 资料下载 - - - -
+
- + 目录
+
+
+ +
+ + + +
+
+ + + + +
+
+
) } \ No newline at end of file diff --git a/src/components/card/card-agent.css b/src/components/card/card-agent.css index a6ab169..60c4a27 100644 --- a/src/components/card/card-agent.css +++ b/src/components/card/card-agent.css @@ -1,6 +1,23 @@ .card-agent { } +.selected { + position: relative; +} + +.selected:before { + content: ''; + position: absolute; + width: 10px; + height: 10px; + border: 5px solid var(--color-red); + z-index: 10; + top: 0; + right: 0; + border-left: transparent; + border-bottom: transparent; +} + .card-agent .card-agent-head { padding: 10px 10px 5px 10px; display: flex; diff --git a/src/components/card/card-proj-type.css b/src/components/card/card-proj-type.css index 8fa1de6..2727e07 100644 --- a/src/components/card/card-proj-type.css +++ b/src/components/card/card-proj-type.css @@ -83,13 +83,13 @@ } .proj .proj-body .proj-charge .ant-checkbox-wrapper:hover .ant-checkbox-inner { - border-color: var(--color-orange); + border-color: var(--color-primary); } .proj .proj-body .proj-charge .ant-checkbox-wrapper .ant-checkbox-checked .ant-checkbox-inner, .proj .proj-body .proj-charge .ant-checkbox-wrapper:hover .ant-checkbox-checked .ant-checkbox-inner { - border-color: var(--color-orange); - background-color: var(--color-orange); + border-color: var(--color-primary); + background-color: var(--color-primary); } .proj .proj-foot { @@ -103,7 +103,7 @@ text-align: center; margin: 0 5px; padding: 10px 0; - background-color: var(--color-orange); + background-color: var(--color-primary); color: var(--color-light); flex-basis: 100%; } diff --git a/src/components/card/card-proj.css b/src/components/card/card-proj.css index 4ca9b40..74d0aed 100644 --- a/src/components/card/card-proj.css +++ b/src/components/card/card-proj.css @@ -74,3 +74,10 @@ margin-left: 5px; } +.card-proj .foot { + position: unset; + background-color: transparent; + display: flex; + justify-content: space-between; + align-items: center; +} diff --git a/src/components/list/list-proj-agent.css b/src/components/list/list-proj-agent.css index 9405e30..19ced95 100644 --- a/src/components/list/list-proj-agent.css +++ b/src/components/list/list-proj-agent.css @@ -41,8 +41,8 @@ } .list-proj-agent .body .page .ant-pagination-item-active { - border-color: var(--color-orange); - background-color: var(--color-orange); + border-color: var(--color-primary); + background-color: var(--color-primary); } .list-proj-agent .body .page .ant-pagination-item-active a { diff --git a/src/components/list/list-proj.css b/src/components/list/list-proj.css index 6220e55..04de9b0 100644 --- a/src/components/list/list-proj.css +++ b/src/components/list/list-proj.css @@ -41,8 +41,8 @@ } .list-proj .body .page .ant-pagination-item-active { - border-color: var(--color-orange); - background-color: var(--color-orange); + border-color: var(--color-primary); + background-color: var(--color-primary); } .list-proj .body .page .ant-pagination-item-active a { diff --git a/src/components/step/step-proj-edit.css b/src/components/step/step-proj-edit.css index 046f3e6..4962f67 100644 --- a/src/components/step/step-proj-edit.css +++ b/src/components/step/step-proj-edit.css @@ -23,13 +23,13 @@ } .step-proj .step .complete { - border: 1px solid var(--color-blue); - color: var(--color-blue); + border: 1px solid var(--color-primary); + color: var(--color-primary); } .step-proj .step .processing { - border: 1px solid var(--color-blue); - background-color: var(--color-blue); + border: 1px solid var(--color-primary); + background-color: var(--color-primary); color: var(--color-light); } @@ -77,7 +77,7 @@ } .step-proj .step-line-complete { - border-color: var(--color-blue); + border-color: var(--color-primary); } .step-proj .step-card { diff --git a/src/index.css b/src/index.css index c92c5f5..08de4fe 100644 --- a/src/index.css +++ b/src/index.css @@ -2,7 +2,7 @@ --color-border: rgba(206, 206, 206, 0.4); --color-box-shadow: rgba(206, 206, 206, 0.4); --color-red: #ff5722; - --color-orange: rgba(252, 189, 0, 1); + --color-primary: rgba(252, 189, 0, 1); --color-green: rgba(129, 179, 55, 1); --color-blue: rgba(64, 149, 229, 1); --color-purple: #a233c6; @@ -55,7 +55,7 @@ ul { } .btn-orange { - background-color: var(--color-orange); + background-color: var(--color-primary); color: var(--color-light); } diff --git a/src/route/agent/AgentSelect.tsx b/src/route/agent/AgentSelect.tsx index f5a22b6..6906923 100644 --- a/src/route/agent/AgentSelect.tsx +++ b/src/route/agent/AgentSelect.tsx @@ -5,6 +5,7 @@ import CardAgent from "../../components/card/CardAgent.tsx"; import {errorImage} from "../../util/CommonUtil.ts"; import {useState} from "react"; import {AgentMedalEnum} from "../../interfaces/card/ICardProj.ts"; +import NoData from '../../assets/no-data.png'; export default function AgentSelect() { const [value, setValue] = useState(1); @@ -12,6 +13,121 @@ export default function AgentSelect() { // const params = useParams(); const height = window.innerHeight - 150; + const [selectedAgentId, setSelectedAgentId] = useState('0'); + const [selectedAgent, setSelectedAgent] = useState({}); + + // 列表 + const [agentList, setAgentList] = useState([{ + id: '1', + logo: '1', + name: '标题1', + desc: '描述1', + medal: AgentMedalEnum.GOLD, + certificateImg: '1', + selected: false + }, { + id: '2', + logo: '2', + name: '标题2', + desc: '描述2', + medal: AgentMedalEnum.GOLD, + certificateImg: '1', + selected: false + }]); + + const renderAgent = () => { + return agentList.map((item, index) => { + return ( + { + setSelectedAgentId(item.id); + setSelectedAgent(item); + }} + /> + ) + }) + } + + const renderSelectedAgent = () => { + if (Object.keys(selectedAgent).length == 0) { + return ( + <> +
+ + 请选择左侧机构 +
+ + ) + } + return ( + <> +
+
机构信息
+
+
北京九思恒源科技有限公司
+
+ 雄厚的技术与人才实力,赢得了客户的深厚信赖,获得了政府部门的高度认可,公司先后荣获“全国重合同守信用单位”、“先进施工企业”、“长沙市利税大户”等诸多荣誉称号。与此同时,公司承建的湖南中联重科起重机厂钢结构厂房、三一重工娄底基地车间、北京资源集团宁乡基地车间、双胞胎饲料集团长沙基地厂房、南昌西客站高铁钢结构候客大厅、江西送变电建设中超公司厂房等一大批各类钢结构优质工程,缔造了“鼎盛钢构”卓尔不群的品牌知名度和美誉度。 +
+ +
机构证书
+
+ + + + +
+ +
+
+ 联系人:XXXXXX + 联系电话:13888888888 +
+
+ 联系地址:内蒙古呼和浩特新城区XXXXXX +
+
+
+
+
+ 价格种类: + { + console.log('radio checked', e.target.value); + setValue(e.target.value); + }} value={value}> + 普通件:200 + 加急件:400 + +
+
+ +
+ + ) + } + return ( <>
- { - console.log('1') - }} - /> + {renderAgent()}
- +
-
-
-
机构信息
-
-
北京九思恒源科技有限公司
-
- 雄厚的技术与人才实力,赢得了客户的深厚信赖,获得了政府部门的高度认可,公司先后荣获“全国重合同守信用单位”、“先进施工企业”、“长沙市利税大户”等诸多荣誉称号。与此同时,公司承建的湖南中联重科起重机厂钢结构厂房、三一重工娄底基地车间、北京资源集团宁乡基地车间、双胞胎饲料集团长沙基地厂房、南昌西客站高铁钢结构候客大厅、江西送变电建设中超公司厂房等一大批各类钢结构优质工程,缔造了“鼎盛钢构”卓尔不群的品牌知名度和美誉度。 -
- -
机构证书
-
- - - - -
- -
-
- 联系人:XXXXXX - 联系电话:13888888888 -
-
- 联系地址:内蒙古呼和浩特新城区XXXXXX -
-
-
-
-
- 价格种类: - { - console.log('radio checked', e.target.value); - setValue(e.target.value); - }} value={value}> - 普通件:200 - 加急件:400 - -
-
+
{renderSelectedAgent()}
diff --git a/src/route/agent/agent-select.css b/src/route/agent/agent-select.css index 256eaf3..9ffde20 100644 --- a/src/route/agent/agent-select.css +++ b/src/route/agent/agent-select.css @@ -48,13 +48,27 @@ padding: 15px; height: calc(100% - 30px); overflow: auto; + width: 840px; +} + +.agent-select .agent-select-right .no-data { + height: 100%; + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; +} + +.agent-select .agent-select-right .no-data span { + margin-top: 15px; + color: var(--color-dark); } .agent-select .agent-select-right .agent-info .agent-title { border: 1px solid var(--color-border); background-color: rgba(228,229,238,0.5); padding: 5px 15px; - font-weight: 600; + font-weight: bold; } .agent-select .agent-select-right .agent-info .agent-body { @@ -65,7 +79,7 @@ .agent-select .agent-select-right .agent-info .agent-body .agent-name { padding: 5px 0; - font-weight: 500; + font-weight: bold; } .agent-select .agent-select-right .agent-info .agent-body .agent-desc { @@ -103,6 +117,14 @@ padding: 15px; } +.agent-select .agent-select-right .agent-price .ant-radio-inner { + border: 1px solid var(--color-primary); +} + +.agent-select .agent-select-right .agent-price .ant-radio-checked .ant-radio-inner { + background-color: var(--color-primary); +} + .agent-select .agent-select-right .agent-price .label { font-weight: bold; } \ No newline at end of file diff --git a/src/route/proj/ProjEdit.tsx b/src/route/proj/ProjEdit.tsx index 0fb60d0..dad0dc5 100644 --- a/src/route/proj/ProjEdit.tsx +++ b/src/route/proj/ProjEdit.tsx @@ -74,7 +74,7 @@ export default function ProjEdit() {
-
diff --git a/src/route/proj/ProjNew.tsx b/src/route/proj/ProjNew.tsx index 14e1b5c..c0848db 100644 --- a/src/route/proj/ProjNew.tsx +++ b/src/route/proj/ProjNew.tsx @@ -80,7 +80,7 @@ export default function ProjNew() { -