修改issue

This commit is contained in:
何童崇 2022-03-29 16:35:52 +08:00
parent ba93a044d3
commit 8f0abdad2e
4 changed files with 134 additions and 182 deletions

View File

@ -94,13 +94,14 @@ const Qz2022 = (props) => {
}) })
}, [reload]) }, [reload])
console.log(active);
return ( return (
<React.Fragment> <React.Fragment>
{/* banner图+选项 */} {/* banner图+选项 */}
<img src={banner} className="qz_banner"/> <img src={banner} className="qz_banner"/>
<div className="qz2022"> <div className="qz2022">
{paths.indexOf(active) !== -1 && <ul className="qz2022Menu mt20 qz_main"> <ul className="qz2022Menu mt20 qz_main">
<li className={active === "introduce" ? "active" : ""}> <li className={ active==='qz2022' ||active === "introduce"? "active" : ""}>
<Link to={{ pathname: `/competition/qz2022/introduce` }}>大赛介绍</Link> <Link to={{ pathname: `/competition/qz2022/introduce` }}>大赛介绍</Link>
</li> </li>
<li className={active === "fingerpost" ? "active" : ""}> <li className={active === "fingerpost" ? "active" : ""}>
@ -129,8 +130,8 @@ const Qz2022 = (props) => {
<a>后台管理</a> <a>后台管理</a>
</Popover> </Popover>
</li>} </li>}
</ul>} </ul>
{paths.indexOf(active) !== -1 && <div className="menu_border mt20 qz_main"></div>} <div className="menu_border mt20 qz_main"></div>
<Spin spinning={false} wrapperClassName="spinstyle qzCont" tip="正在同步镜像" size="large"> <Spin spinning={false} wrapperClassName="spinstyle qzCont" tip="正在同步镜像" size="large">
<Switch {...props}> <Switch {...props}>
{/* 大赛介绍 */} {/* 大赛介绍 */}
@ -199,6 +200,12 @@ const Qz2022 = (props) => {
() => (<Management {...props} qzDetail={qzDetail}/>) () => (<Management {...props} qzDetail={qzDetail}/>)
} }
></Route> ></Route>
{/* 大赛介绍 */}
<Route path="/competition/qz2022"
render={
() => (<Introduce {...props} />)
}
></Route>
</Switch> </Switch>
</Spin> </Spin>
</div> </div>

View File

@ -15,7 +15,7 @@ function Introduce({ form, showNotification, match, history }) {
return ( return (
<div className="introduce"> <div className="introduce">
<div className="introduce-content clearfix"> <div className="introduce-content clearfix">
<div className="introduce-video"><video src="http://111.8.36.180:8000/preview/93579e3f4bc0ba33075a905c08c79322_1648197024501.mp4" autoPlay controls></video></div> <div className="introduce-video"><video src="http://111.8.36.180:8000/preview/93579e3f4bc0ba33075a905c08c79322_1648197024501.mp4" autoPlay controls muted></video></div>
<div className="introduce-info"> <div className="introduce-info">
<h3 className="info-tit">启智2022作战概念·事需求创新大赛</h3> <h3 className="info-tit">启智2022作战概念·事需求创新大赛</h3>

View File

@ -15,11 +15,10 @@ if (clientWidth < 1000) {
let fontSizeTitle = 1.25 * fontSizeText; let fontSizeTitle = 1.25 * fontSizeText;
const colorArr0 = ['rgba(226, 217, 255, 1)', 'rgba(251, 201, 0, 0.36)', 'rgba(145, 193, 255, 0.61)']; const colorArr0 = ['rgba(226, 217, 255, 1)', 'rgba(251, 201, 0, 0.36)', 'rgba(145, 193, 255, 0.61)'];
const colorArr1= ['rgba(155, 128, 245, 1)', 'rgba(254, 140, 0, 1)', 'rgba(37, 109, 255, 1)']; const colorArr1 = ['rgba(155, 128, 245, 1)', 'rgba(254, 140, 0, 1)', 'rgba(37, 109, 255, 1)'];
export default ({ id, className, title, legendArr, xData, yData }) => { export default ({ id, className, title, legendArr, xData, yData }) => {
console.log(yData);
useEffect(() => { useEffect(() => {
let newEchartBar = document.getElementById(id) && echarts.init(document.getElementById(id)); let newEchartBar = document.getElementById(id) && echarts.init(document.getElementById(id));
let textColor = "#7988a5"; let textColor = "#7988a5";
@ -80,180 +79,126 @@ export default ({ id, className, title, legendArr, xData, yData }) => {
// ]; // ];
// var barWidth = 35; // var barWidth = 35;
// let option = { // let option = {
// title: { // title: {
// text: 'Awesome Chart' // text: 'Awesome Chart'
// }, // },
// xAxis: { // xAxis: {
// data: ['Sun', 'Mon', 'Tue'] // data: ['Sun', 'Mon', 'Tue']
// }, // },
// legend: { // legend: {
// data: ['', '',''], // data: ['', '', ''],
// textStyle: { // textStyle: {
// color: 'white', // // color: 'white', //
// }, // },
// }, // },
// tooltip:{ // tooltip: {
// trigger:'axis', // trigger: 'axis',
// formatter:function(params){ // formatter: function (params) {
// // console.log(params); // // let paramsData=params.filter(i=>{return i.seriesType==='bar'})
// return params // // console.log(paramsData);
// } // // // return (
// },
// yAxis: {},
// series: [
// {
// z:1,
// name:'',
// type: 'bar',
// barWidth:barWidth,
// data:[320, 200, 260],
// itemStyle:{
// normal:{
// color:colors[0]
// }
// },
// }
// ,
// {
// z:3,
// name:'1',
// type:'pictorialBar',
// symbolPosition:'end',
// data:[320, 200, 260],
// symbol :'diamond',
// symbolOffset:['-165%','-50%'],
// symbolSize:[barWidth - 4,10 * (barWidth - 4) / barWidth],
// itemStyle:{
// normal:{
// borderColor: '#218bd1',
// borderWidth: 2,
// color:'#218bd1'
// }
// },
// },
// {
// name:'2',
// type: 'bar',
// label: {
// normal: {
// show: true,
// position: 'top',
// fontSize: 16, // // // )
// color: '#218bd1', // return params.filter(i => { return i.seriesType === 'bar' });
// offset: [-30, -5] // }
// } // },
// }, // yAxis: {},
// itemStyle: { // series: [
// color: 'transparent' // {
// }, // z: 1,
// tooltip: { // name: '',
// }, // type: 'bar',
// data: [320, 200, 260], // barWidth: barWidth,
// }, // data: [320, 200, 260],
// { // itemStyle: {
// z:1, // normal: {
// name:'', // color: colors[0]
// type: 'bar', // }
// barWidth:barWidth, // },
// data:[170, 182, 191], // }
// itemStyle:{ // ,
// normal:{ // {
// color:colors[1] // z: 3,
// } // name: '1',
// }, // type: 'pictorialBar',
// } // symbolPosition: 'end',
// , // data: [320, 200, 260],
// { // symbol: 'diamond',
// z:3, // symbolOffset: ['-150%', '-50%'],
// name:'1', // symbolSize: [barWidth - 4, 10 * (barWidth - 4) / barWidth],
// type:'pictorialBar', // itemStyle: {
// symbolPosition:'end', // normal: {
// data:[170, 182, 191], // borderColor: '#218bd1',
// symbol :'diamond', // borderWidth: 2,
// symbolOffset:['-15%','-50%'], // color: '#218bd1'
// symbolSize:[barWidth - 4,10 * (barWidth - 4) / barWidth], // }
// itemStyle:{ // },
// normal:{ // },
// borderColor: '#2edaf8', // {
// borderWidth: 2, // z: 1,
// color:'#2edaf8' // name: '',
// } // type: 'bar',
// }, // barWidth: barWidth,
// }, // data: [170, 182, 191],
// { // itemStyle: {
// name:'2', // normal: {
// type: 'bar', // color: colors[1]
// label: { // }
// normal: { // },
// show: true, // }
// position: 'top', // ,
// fontSize: 16, // {
// color: '#2edaf8', // z: 3,
// offset: [-30, -5] // name: '1',
// } // type: 'pictorialBar',
// }, // symbolPosition: 'end',
// itemStyle: { // data: [170, 182, 191],
// color: 'transparent' // symbol: 'diamond',
// }, // symbolOffset: ['0%', '-50%'],
// tooltip: { // symbolSize: [barWidth - 4, 10 * (barWidth - 4) / barWidth],
// }, // itemStyle: {
// data:[170, 182, 191], // normal: {
// }, // borderColor: '#2edaf8',
// { // borderWidth: 2,
// z:1, // color: '#2edaf8'
// type: 'bar', // }
// name:'', // },
// barWidth:barWidth, // },
// data:[220, 182, 191], // {
// itemStyle:{ // z: 1,
// normal:{ // type: 'bar',
// color:colors[2] // name: '',
// } // barWidth: barWidth,
// }, // data: [220, 182, 191],
// } // itemStyle: {
// , // normal: {
// { // color: colors[2]
// z:3, // }
// name:'1', // },
// type:'pictorialBar', // },
// symbolPosition:'end', // {
// data:[220, 182, 191], // z: 3,
// symbol :'diamond', // name: '1',
// symbolOffset:['130%','-50%'], // type: 'pictorialBar',
// symbolSize:[barWidth - 4,10 * (barWidth - 4) / barWidth], // symbolPosition: 'end',
// itemStyle:{ // data: [220, 182, 191],
// normal:{ // symbol: 'diamond',
// borderColor: '#7b7be1', // symbolOffset: ['145%', '-50%'],
// borderWidth: 2, // symbolSize: [barWidth - 4, 10 * (barWidth - 4) / barWidth],
// color:'#7b7be1' // itemStyle: {
// } // normal: {
// }, // borderColor: '#7b7be1',
// }, // borderWidth: 2,
// { // color: '#7b7be1'
// name:'2', // }
// type: 'bar', // },
// label: { // },
// normal: {
// show: true, // ]
// position: 'top', // };
// fontSize: 16,
// color: '#7b7be1',
// offset: [-30, -5]
// }
// },
// itemStyle: {
// color: 'transparent'
// },
// tooltip: {
// },
// data:[220, 182, 191],
// },
// ]
// };
let option = { let option = {
grid: { grid: {

View File

@ -27,7 +27,7 @@ const initBarYData = [[0, 0, 0, 0, 0, 0, 0, 0], [0, 0, 0, 0, 0, 0, 0, 0], [0, 0,
function Statistics({ showNotification, qzDetail }) { function Statistics({ showNotification, qzDetail }) {
const is_local= qzDetail &&qzDetail.is_local;
const [pieArr, setPieArr] = useState(initPieArr); const [pieArr, setPieArr] = useState(initPieArr);
const [barXData, setBarXData] = useState(['LJLJLJ', 'HJHJHJ', 'KJKJKJ', 'HJJHJJHJJ', 'ZLZYBD', '联勤保障', 'WJWJWJ']); const [barXData, setBarXData] = useState(['LJLJLJ', 'HJHJHJ', 'KJKJKJ', 'HJJHJJHJJ', 'ZLZYBD', '联勤保障', 'WJWJWJ']);
@ -100,7 +100,7 @@ function Statistics({ showNotification, qzDetail }) {
</div> </div>
{/* 外网 */} {/* 外网 */}
{!qzDetail.is_local && <div className="right-echart outside"> {!is_local && <div className="right-echart outside">
<h3 className="type-name">综合赛区报名数</h3> <h3 className="type-name">综合赛区报名数</h3>
<EchartPie <EchartPie
id="network" id="network"
@ -110,7 +110,7 @@ function Statistics({ showNotification, qzDetail }) {
</div>} </div>}
{/* 内网 */} {/* 内网 */}
{qzDetail.is_local && <div className="right-echart"> {is_local && <div className="right-echart">
<EchartBar <EchartBar
id="newAddedProjects" id="newAddedProjects"
className="echart-box" className="echart-box"