From 386d381d69e37eb20c553ad76a0e2cd8e2774d87 Mon Sep 17 00:00:00 2001 From: zhangxiaozhuozhuo <7658685+zhangxiaozhuozhuo@user.noreply.gitee.com> Date: Fri, 17 Nov 2023 16:41:03 +0800 Subject: [PATCH] =?UTF-8?q?=E6=96=B0=E5=A2=9E=E6=88=90=E6=9E=9C=E6=A6=82?= =?UTF-8?q?=E8=A7=88=E9=A1=B5=E9=9D=A2?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/military/achievement.js | 11 + src/military/achievement/achivChart/index.jsx | 113 +++++++++ .../achievement/achivChart/index.scss | 125 +++++++++ src/military/achievement/achivList/index.jsx | 12 + src/military/achievement/achivList/index.scss | 5 + src/military/achievement/image/banner_new.svg | 1 + .../achievement/image/left_bot_icon.png | Bin 0 -> 1766 bytes .../achievement/image/left_top_icon.png | Bin 0 -> 1965 bytes src/military/achievement/noticeList/index.jsx | 2 - src/military/achievement/overview/index.jsx | 240 +++--------------- src/military/achievement/overview/index.scss | 238 +++-------------- 11 files changed, 329 insertions(+), 418 deletions(-) create mode 100644 src/military/achievement/achivChart/index.jsx create mode 100644 src/military/achievement/achivChart/index.scss create mode 100644 src/military/achievement/achivList/index.jsx create mode 100644 src/military/achievement/achivList/index.scss create mode 100644 src/military/achievement/image/banner_new.svg create mode 100644 src/military/achievement/image/left_bot_icon.png create mode 100644 src/military/achievement/image/left_top_icon.png diff --git a/src/military/achievement.js b/src/military/achievement.js index b0654a836..c8929bcaf 100644 --- a/src/military/achievement.js +++ b/src/military/achievement.js @@ -17,6 +17,10 @@ const Overview = Loadable({ loading: Loading, }); +const AchivChart = Loadable({ + loader: () => import("./achievement/achivChart"), + loading: Loading, +}); const NoticeList = Loadable({ loader: () => import("./achievement/noticeList"), @@ -42,6 +46,13 @@ class Index extends Component { )} > + ( + + )} + > + ( diff --git a/src/military/achievement/achivChart/index.jsx b/src/military/achievement/achivChart/index.jsx new file mode 100644 index 000000000..eb3b4b41e --- /dev/null +++ b/src/military/achievement/achivChart/index.jsx @@ -0,0 +1,113 @@ +import React, { useEffect } from 'react'; +import echarts from 'echarts'; +import './index.scss'; +import topCountPng from '../image/left_top_icon.png'; +import botCountPng from '../image/left_bot_icon.png'; + +function AchivChart() { + useEffect(() => { + // 基于准备好的dom，初始化echarts实例 + const myChart = echarts.init(document.getElementById('chartBox')); + + // 指定图表的配置项和数据 + const option = { + title: { + text: '成果数量占比统计', + left: 'center', + top: 350, + textStyle: { + fontSize: 18 + } + }, + legend: { + orient: 'vertical', + right: 30, + top: 85, + itemGap: 16, + itemWidth: 32, + itemHeight: 24, + textStyle: { + fontSize: 16 + } + }, + color: [ + 'rgba(183, 88, 255, 1)', + 'rgba(255, 190, 56, 1)', + 'rgba(240, 68, 95, 1)', + 'rgba(88, 113, 255, 1)', + 'rgba(36, 185, 168, 1)', + 'rgba(88, 183, 255, 1)' + ], + series: [ + { + name: 'Nightingale Chart', + type: 'pie', + radius: [35, 160], + center: ['150', '50%'], + roseType: 'area', + clockwise: true, + startAngle: 45, + label: { + show: false + }, + itemStyle: { + borderRadius: 0 + }, + data: [ + { value: 19, name: '开源项目 10%' }, + { value: 28, name: '创客任务 20%' }, + { value: 32, name: '开放竞赛 25%' }, + { value: 45, name: '科研成果 32%' }, + { value: 52, name: '装备成果 40%' }, + { value: 66, name: '其他成果 50%' } + ] + } + ], + graphic: { + type: 'text', + left: '133', + top: 'middle', + style: { + text: '成果\n类型', + fill: '#333', + fontSize: 18, + fontWeight: 'bold', + verticalAlign: 'middle', + lineHeight: 24 + } + } + }; + + // 使用刚指定的配置项和数据显示图表。 + myChart.setOption(option); + }, []); + + return ( +
+
+
+
+ icon +
+
+

5896

+

收录成果数

+
+
+
+
+ icon +
+
+

159

+

成果总浏览数

+
+
+
+
+
+
+ ) +} + +export default AchivChart; diff --git a/src/military/achievement/achivChart/index.scss b/src/military/achievement/achivChart/index.scss new file mode 100644 index 000000000..99f7b4235 --- /dev/null +++ b/src/military/achievement/achivChart/index.scss @@ -0,0 +1,125 @@ + +#mainContent { + margin: 40px auto 0 auto; + width: 1200px; + height: 450px; + display: flex; + background:linear-gradient(97.82deg,#f3f5f8 0%,rgba(255, 255, 255, 0) 100%); + box-shadow:8px 6px 18px rgba(171, 202, 255, 0.24) inset; + + #leftBox { + width: 500px; + height: 450px; + position: relative; + .count-top { + display: flex; + width: 180px; + height: 95px; + position: absolute; + top: 87px; + right: 130px; + background:#f7faff; + box-sizing: border-box; + border:1px solid; + border-color:rgba(13, 94, 248, 0.16); + border-radius:6px; + .count-icon { + width: 80px; + height: 95px; + display: flex; + justify-content: center; + align-items: center; + img { + width: 36px; + height: 36px; + } + } + .count-main { + width: 100px; + height: 95px; + display: flex; + flex-direction: column; + #count-num { + width: 100%; + height: 55px; + line-height: 55px; + // font-family:Alibaba PuHuiTi; + font-weight:600; + color:#283444; + font-size:24px; + letter-spacing:2px; + } + // .count-title { + // width: 100%; + // height: 40px; + // line-height: 40px; + // // font-family:Alibaba PuHuiTi; + // color:#445a7a; + // font-size:15px; + // letter-spacing:50px; + // } + } + } + .count-bot { + display: flex; + width: 180px; + height: 95px; + position: absolute; + top: 227px; + right: 130px; + background:#f7faff; + box-sizing: border-box; + border:1px solid; + border-color:rgba(13, 94, 248, 0.16); + border-radius:6px; + .count-icon { + width: 80px; + height: 95px; + display: flex; + justify-content: center; + align-items: center; + img { + width: 36px; + height: 36px; + } + } + .count-main { + width: 100px; + height: 95px; + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + #count-num { + width: 100%; + height: 55px; + // font-family:Alibaba PuHuiTi; + font-weight:600; + color:#283444; + font-size:24px; + line-height: 30px; + letter-spacing:2px; + } + .count-title { + width: 100%; + height: 40px; + // font-family:Alibaba PuHuiTi; + color:#445a7a; + font-size:15px; + line-height: 20px; + letter-spacing:1px; + } + } + } + } + #chartBox { + width: 500px; + height: 450px; + } + #blankBox { + width: 200px; + height: 450px; + } +} + + diff --git a/src/military/achievement/achivList/index.jsx b/src/military/achievement/achivList/index.jsx new file mode 100644 index 000000000..34d641521 --- /dev/null +++ b/src/military/achievement/achivList/index.jsx @@ -0,0 +1,12 @@ +import React, { useEffect } from 'react'; +import './index.scss'; + +function AchivList() { + useEffect(() => { + console.log('进来成果列表页面了') + }, []); + + return
成果列表页面。。。
; +} + +export default AchivList; diff --git a/src/military/achievement/achivList/index.scss b/src/military/achievement/achivList/index.scss new file mode 100644 index 000000000..34bedafa5 --- /dev/null +++ b/src/military/achievement/achivList/index.scss @@ -0,0 +1,5 @@ + +#listBox { + width: 800px; + height: 600px; +} \ No newline at end of file diff --git a/src/military/achievement/image/banner_new.svg b/src/military/achievement/image/banner_new.svg new file mode 100644 index 000000000..10ea325cc --- /dev/null +++ b/src/military/achievement/image/banner_new.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/military/achievement/image/left_bot_icon.png b/src/military/achievement/image/left_bot_icon.png new file mode 100644 index 0000000000000000000000000000000000000000..45a5d4045d96c0fa92442de9006e170eeadd7e2e GIT binary patch literal 1766 zcmVOMkxv?O9MQhiV( z1QJOk*2mJ~6KTOWFq%N55fgo}7=LOa5+4kdSbq|vMxzLZYFpi(0xbgDc6N{FY&+X_ z*xlK=GrR3>=O&wMcJJJK&o}39?wxxDm?%R*^=XVkvk-V6fbbxKM+hh~(M0yEBHW-( zLm)7OD1H?ReB`Ti_oO=zVN~(zRa|y`Tx|m(c2V6@qx!k0TC?%N>`r9R(@A-{Twg8d3R8qB*k5C+)9!sMWrM}u-fgD&_5TptIxMjtL^6jMv+v(h{N@nc>zh=F|B4{+`; z0sK8xVMq>?=t1i3V@~tgsl%mp|nt@1@qTr9FQGg z^kS6|oaTqJ11h6{PM;TW;0r}sV~p-MgKB*$3L92u&R1mw&_AOLM!>lN!*xj`25J4@ zumTAbLUo1xplk>96FJ`Ys8>`DS55AyJ||fivjsI zwmpiltubmFBijJ6uQ}0gUa)$)o=wgkNR|O{lxqK2k@7d} zH=62G3v!}giTN|Lh5b^;v)0oAOMn>8>mMqH$zCGi(t)F0Cku&_%!4mjgCq^e3LG}8 zw_cpl94%KmJ1~W04b5-rlflCHGD}cD8{XGhN^|SfV zJD(=@WF5ku&F1}(X${hZw4&~MC*493N}oNmDITIor%h{EangEIHRB$n0de$6Bv?9~ z>!S*{#aZ*&>8yFpbap*^&ZmX)Et!X3J?M1CH@l8BAa2A8q--RLR^hOWmH=sx+9*Gf zd1gunl57^uX4OggmerX@%YZa>ly%%}Zv3#?xN7b+MeiR|534d}CF_tAnV)Tdxbaj; zUplt0tzsBWl=B0^*K%!mO=Zfg96HI93Ok?)AmAOw`%Dz$eT!VR*{* z?UMq|keOtotS9s29LK7^$+(H>JK)@feN(2i$y*Mv`-vQ!w4V)1%W=AYun!cQQ}ctg zFN>UeCbY)3JjjgsXrMT3`^U^&Ia8N4rg<&RLe^!*oU(3W$uMw~I!#+fddUQhCg?fY zYov9r4YajpKGy1Ok76>q!A{*jN-r-=FG-it5{{RanKQA@Wp;cE0+883XS2Qo$bhy3 z$N^-{ARP@d(jezW^5lf3UL<$6BBUS`+lt_9W=TdUwwcA*4wcfxjyN0YQaEV=xJlcR z8E|&|%q2w*dcs%bDs?vXCefhyre6Nv??>+>L@tpQW$Eo>Ysp)tuO>KQSFvk(d|Nno zI2f2bNE_-~GTnJ@w2yE4s%~rLvBoEjr%rrPdujhFz4X6$3x)PRUzPhY;t-pBnKP>% z3ZX9?jr7rvwTlrEt;}73Lf5+5axtRGf6KDNzn8HtqDFeD0!?r(qJj`|gKM4FD=yBK zI^nv^-=lcD5>|WYB$!7Q1tNs6qlK>L@2U`&_41}VqDvVLMz#aJO-qL8%}Y=S0Xkh_ zZ?(tOMLs9t%R`1Md+fX?P;Do7^(sNipF`dN4;Kh`N1|i73{5PVw$L$wo9Ud7=jfQg zdjW-q>Ul`JiWjnWQBHG{@;f?FDt1iZFQhTubW9)}L6%;M1&07*qo IM6N<$f`n%@R{#J2 literal 0 HcmV?d00001 diff --git a/src/military/achievement/image/left_top_icon.png b/src/military/achievement/image/left_top_icon.png new file mode 100644 index 0000000000000000000000000000000000000000..1df7cd38147274d5db4a61a33e1fb0b9ede4a172 GIT binary patch literal 1965 zcmV;e2U7TnP)*bBBUlQB;0P{Yf7=^Y zIXF#1Md9(dyBH9*t$8psm3d1bauPzpS7>ON1INj$4O1phz8nnEk}P6Vi{OF+G?3b5I;3Y?W7dHhpoYm?&tN(5-=ZY3loFDt=`D=lz- z>^nJ?4AAiHB1G(^Sq)BHc`@`H^{w;t&zJ?#rFAgB7Lg4at@OTing+NR$HBEpF@Of| z?trXp)5~W=)AQU*>_7R8gF-_3z~Q|lVbV?-H#8#eDQ6R8)ZH5;$zWdr5QI097g<9FA+K*?%iTKFq_- z2WWigJVJr<%o4E>(k19By@=wnX%_NKXv_nM`k5*3W&O*ESsfpWO3s??pUeYjNtBa!5!LQ)BUw^j#sW0{7l~LQ_J}2jJtPtAA-U0c;;)WImE%Z) z=*aB^Cbq%_UGU%&XCiI!UA-iB|PXc>u&188jE0>a_b zO!IR5?{FXbiiuVaK!6YRP0dVv8HtPoXynn2Wj~@dc}`9zs`uU0B8xtsn<>ZavtOBL zDN#{LtC7j0aR7N9+)mh$t7(*K8N{4B^)uz*#a@(EUPR%FP3fek1;M3uD2jG;+~PWi zvZ{V&Ks5-B18Dfckfu%-2%i5_fhxZ*(BvW zB=RXK@+Rljvna2*pFq!&Mi?B)jI$suAEXA5n&qVn(3-U%Er6hs$f<2=D{7k){17!I zmPol~oivN^bk9_<^}7To>Lb2odh!PGEwLk4j)dx*{41!c>sel2)c-tv(yqAyrU|IK zagBy~J&9tfWiUMv+iKYJrcttECc*cxMo2yRm1abV5g6x#D7WEPZxH zonNDB_iv24Gm#k!5KEMyV%coBu>0T@CJC7V;%3NZ^#l`79Yn?g6wOs8dNmU|J?A%* zLuU{Ov}@{Qg7p}`#3)BrUqmjP;B<9H9X8FB1AYoZA-Tlt#;y-K@n+G9moH8u5+X+) z8b1?!PkcsWEhx@aGvsS&tm8S2T*cd4&AQ<*2O!p^rUM66QiC(+_vbMOAUX@ZES#Uc zZ3G6YJoH4vGzBpaASw{6gH20#ZUogeXUw|IFxLmIRM_+9HO(EkUVu#YJ1fO8*MjIw z(VLD5a@)X=K(Yd5Qbdj3k$e0EFD3KNUip5)00000NkvXXu0mjf(lo76 literal 0 HcmV?d00001 diff --git a/src/military/achievement/noticeList/index.jsx b/src/military/achievement/noticeList/index.jsx index e094ad4cc..6d298658a 100644 --- a/src/military/achievement/noticeList/index.jsx +++ b/src/military/achievement/noticeList/index.jsx @@ -5,7 +5,6 @@ import ItemList from '../components/itemList'; import { achieveSource } from '../static'; import Nodata from '../../../forge/Nodata'; import Loading from "../../../Loading"; -import noticePng from '../image/banner.png'; import { getNoticeList } from '../api'; import './index.scss'; @@ -201,7 +200,6 @@ export default (props) => { return ( - 图片加载失败
diff --git a/src/military/achievement/overview/index.jsx b/src/military/achievement/overview/index.jsx index e094ad4cc..27c8ccee1 100644 --- a/src/military/achievement/overview/index.jsx +++ b/src/military/achievement/overview/index.jsx @@ -1,227 +1,47 @@ import React, { useEffect, useState } from 'react'; -import classNames from 'classnames'; -import { Pagination, Icon, Input, Affix, } from 'antd'; -import ItemList from '../components/itemList'; -import { achieveSource } from '../static'; -import Nodata from '../../../forge/Nodata'; -import Loading from "../../../Loading"; -import noticePng from '../image/banner.png'; -import { getNoticeList } from '../api'; - +import noticePng from '../image/banner_new.svg'; import './index.scss'; -const Search = Input.Search; +import AchivChart from '../achivChart'; +import NoticeList from '../noticeList'; export default (props) => { + //记得打开，关闭调试 + const [showChart, setShowChart] = useState(true); + const [showList1, setShowList1] = useState(false); + const [selectedButton, setSelectedButton] = useState('chart'); - const [tab, setTab] = useState('0'); - const [loading, setLoading] = useState(false); - - const [title, setTitle] = useState(undefined); - const [orderBy, setOrderBy] = useState('publishDateDesc'); - - const [curPage, setCurPage] = useState(1); - const [total, setTotal] = useState(0); - const [noticeList, setNoticeList] = useState([]); - - const [callList, setCallList] = useState([]); - const [changeList, setChangeList] = useState([]); - const [checkList, setCheckList] = useState([]); - const [abandonList, setAbandonList] = useState([]); - const [competitionList, setCompetitionList] = useState([]); - const [dealList, setDealList] = useState([]); - - useEffect(() => { - setLoading(true); - if (tab === '0' || tab === '7') { - const params = { - orderBy, - curPage: 1, - isChecked: 1, - pageSize: 5, - status: 1, - type: 7, - title, - flag: 1, //后台管理查询：2；前台展示：1 - }; - getNoticeList({ ...params,achievementSource:'开源项目' }).then(data => { - setCallList(data.rows); - setLoading(false); - }); - getNoticeList({...params,achievementSource:'创客任务'}).then(data => { - setChangeList(data.rows); - }); - getNoticeList({ ...params,achievementSource:'开放竞赛' }).then(data => { - setCompetitionList(data.rows); - }); - getNoticeList({ ...params,achievementSource:'科研成果' }).then(data => { - setCheckList(data.rows); - }); - getNoticeList({ ...params,achievementSource:'其他' }).then(data => { - setAbandonList(data.rows); - setLoading(false); - }); + const handleButtonClick = (button) => { + setSelectedButton(button); + if (button === 'chart') { + showChartComponent(); } else { - const params = { - orderBy, - curPage, - isChecked: 1, - pageSize: 10, - status: 1, - title, - type: 7, - achievementSource:tab, - flag: 1, //后台管理查询：2；前台展示：1 - }; - getNoticeList(params).then(data => { - setNoticeList(data.rows); - setTotal(data.total); - setLoading(false); - }) + showListComponent(); } - }, [tab, title, orderBy, curPage]); + }; - function changeSort(sortType) { - setOrderBy(sortType); - setCurPage(1); - } + const showChartComponent = () => { + setShowChart(true); + setShowList1(false); + }; - function noticeClick(id) { - props.history.push(`/achievement/noticeDetail/${id}`); - } - - function sortNav() { - return
- 搜索} - onSearch={(value) => setTitle(value)} /> -
-
{ changeSort('publishDateDesc') }}>时间降序
- | -
{ changeSort('publishDateAsc') }}>时间升序
-
-
- } - - function handleClick(e) { - setTab(e.key); - setCurPage(1); - setTitle(''); - setOrderBy('publishDateDesc'); - } - - function click(e){ - setTab(e); - setCurPage(1); - setTitle(''); - setOrderBy('publishDateDesc'); - } - - function cont(param, titleStr, key, svgStr) { - return -
-
- - {titleStr} -
- {param.length === 5 && { handleClick({ key: key }) }}>查看更多 } -
- {param.length > 0 ? : } - - } - - // 成果库具体jsx渲染函数 - function content() { - if (tab === '0') { - if(callList.length === 0 && changeList.length === 0 && competitionList.length === 0 && checkList.length === 0 && abandonList.length === 0){ - return - }else{ - return - {cont(callList, "开源项目", '开源项目', "iconfont icon-zhaobiaogonggao")} - {cont(changeList, "创客任务", '创客任务', "iconfont icon-gengzhenggonggao")} - {cont(competitionList, "开放竞赛", '开放竞赛', "iconfont icon-chengjiaogonggao")} - {cont(checkList, "科研成果", '科研成果', "iconfont icon-zhongbiaogonggao")} - {cont(abandonList, "其他", '其他', "iconfont icon-feibiaogonggao")} - - } - } else { - let titleStr; - let svgStr; - switch (tab) { - case '开源项目': - titleStr = "开源项目"; - svgStr = "iconfont icon-gengzhenggonggao" - break; - case '创客任务': - titleStr = "创客任务"; - svgStr = "iconfont icon-zhongbiaogonggao" - break; - case '开放竞赛': - titleStr = "开放竞赛"; - svgStr = "iconfont icon-chengjiaogonggao" - break; - case '科研成果': - titleStr = "科研成果"; - svgStr = "iconfont icon-feibiaogonggao" - break; - case '其他': - titleStr = "其他"; - svgStr = "iconfont icon-zhaobiaogonggao" - break; - } - return -
-
- - {titleStr} -
-
- - {total > 0 ? total> 10 ?
- { setCurPage(page) }} - current={curPage} - total={total} - showTotal={total => `共 ${total} 条`} - /> -
: "" : } - - } - } + const showListComponent = () => { + setShowChart(false); + setShowList1(true) + }; return ( - 图片加载失败 -
-
- -
-
    -
  • click('0')}>成果来源
    • - { - achieveSource.map(item=>{ - return
  • click(item.code)} key={item.code}>{item.name}
    • - }) - } -
-
- -
- {sortNav()} - {loading ? : content()} -
+ +
+ 图片加载失败 +
+ +
+ {showChart && } + {showList1 && < NoticeList />} + ) } \ No newline at end of file diff --git a/src/military/achievement/overview/index.scss b/src/military/achievement/overview/index.scss index 2c2eabe92..7b25048a3 100644 --- a/src/military/achievement/overview/index.scss +++ b/src/military/achievement/overview/index.scss @@ -1,215 +1,41 @@ -.notice-list{ - .ant-tabs { - .ant-tabs-left-bar{ - border: 1px solid #E5E5E5; - .ant-tabs-nav-container{ - margin-right: 0; - } - .ant-tabs-nav-wrap{ - margin-right: 0; - } - - svg{ - margin-right:.75em; - } - } - .ant-tabs-tab{ - display: flex; - justify-content: start; - align-items: center; - margin-bottom: 0.5rem; - width: 13.5rem; - height: 2.8125rem; - background: #fff; - font-size: 1.125rem; - - } - .ant-tabs-left-content{ - border: 0; - } - .ant-tabs-tab-active{ - background: #1890FF; - color: #fff; - } - .ant-tabs-ink-bar{ - display: none !important; - } - } - - .notice-sort-nav{ - display: flex; - justify-content: space-between; - padding: .3rem 2rem 1.5rem; - margin: 0px -1.25rem; - border-bottom: 1px solid #E0E0E0; - .ant-input:hover{ - border-color: #4154f1; - } - .ant-btn-primary{ - background-color: #4154f1; - &:hover{ - opacity: 0.8; - } - } - } - - .notice-center-content{ - padding:1.25rem; - background: #fff; - flex: auto; - } - - .item-head-title{ - display: flex; - justify-content: space-between; - align-items: center; - padding: 1.25rem 0 .6rem 0; - .item-head-title-content{ - display: flex; - align-items: center; - font-size: 1rem; - span{ - font-weight: bold; - } - i{ - margin-right: .25em; - color: #4154f1; - } - } - } - - .ant-input-group-addon{ - border: 0 !important; - } - - .item-head-title{ - border-bottom: 1px solid #E5E5E5; - } - -} - -.center-right-but{ - caret-color: rgba(0, 0, 0, 0); - .piece{ - margin:0 .8rem; - color: #aaa; - } - .sortLink{ - color: #333; - cursor: pointer; - &:hover{ - color: #4154f1; - } - &.active{ - color: #4154f1; - } - } -} - -.body{ +.banner { display: flex; - justify-content: space-between; - margin-top: -20px; - - .navigationMenu{ - margin-right: 20px; - width: 20.8em; - caret-color: rgba(0, 0, 0, 0); - .menu-ul:last-child{ - margin-top: 12px; - } + justify-content: center; + align-items: center; + height: 622px; + position: relative; + .banner-img { + width: 1200px; + height: 572px; + max-width: 100%; + max-height: 100%; } - - .none_p_title{ - text-align: center; - } -} - -.menu-ul{ - background-color: white; - margin-bottom: 12px; - border-radius:2px; - - .MenuTitle{ - border-bottom: 1px solid #E0E0E0; - - span{ - display: block; + .button-container { + height: 50px; + width: 520px; + display: flex; + justify-content: center; + position: absolute; + bottom: 0px; + .button { width: 50%; - height: 100%; - cursor: pointer; - border-bottom: 0px solid; - i{ - color: #afaaae; - } + background:#f6f7fa; + border:2px solid; + border-color:#ffffff; + border-radius:4px 0px 0px 4px; + box-shadow:0px 0px 15px rgba(30, 47, 162, 0.09); } - - span:hover{ - color: #4154f1; - .iconfont{ - color: #4154f1 !important; - } + .button:hover { + background:#2a3ee9; + color: white; } - } - - li{ - padding:0px 0px 0px 20px; - position: relative; - height: 62px; - line-height: 62px; - font-size: 16px; - color: #333; - span{ - display: block; - height: 62px; - cursor: pointer; - border-bottom: 1px solid #eee; + .button:active { + background:#2a3ee9; + color: white; } - - &:last-child > span{ - border-bottom: none; + .button.selected { + background:#2a3ee9; + color: white; } } - - li:hover{ - background: #fafafa; - } - - .active{ - background-color: #fafafa; - & ::before{ - position: absolute; - left: 0px; - top: 15px; - width: 6px; - content: ''; - height: 30px; - background: #4154f1; - } - } - - & i{ - margin-right: 5px; - } } - -.ant-input-group-addon .ant-btn-lg { - height: 40px; -} - -.edu-txt-center .ant-pagination { - margin: 2rem auto; - text-align: center; - .ant-pagination-item:focus, .ant-pagination-item:hover, .ant-pagination-item-active, .ant-pagination-prev:hover a, .ant-pagination-next:hover a, .ant-pagination-options-quick-jumper input:focus, .ant-pagination-options-quick-jumper input:hover{ - border-color: #4154f1; - } - .ant-pagination-disabled{ - & a, & :hover a, & :focus a, & .ant-pagination-item-link, &:hover .ant-pagination-item-link , &:focus .ant-pagination-item-link { - color: rgba(0, 0, 0, 0.25) !important; - border-color: #d9d9d9; - } - } - .ant-pagination-item-active a{ - color: #4154f1 - } -} \ No newline at end of file