97 lines
3.1 KiB
JavaScript
97 lines
3.1 KiB
JavaScript
import React , { useState , useEffect } from 'react';
|
||
import Crown from '../img/crown.png';
|
||
import Nodata from '../../Nodata';
|
||
import { Link } from 'react-router-dom';
|
||
import { Spin, Button, Icon } from 'antd';
|
||
import { tempConfig, tempEnum } from '../tempInfo'
|
||
import MemberApply from '../Component/memberApply';
|
||
import { getVIPLists, getAuditStatus, applyJoin } from '../api';
|
||
import nodata from '../img/nodata.png';
|
||
import MemberList from '../Component/memberList';
|
||
|
||
import '../indexZone1.scss';
|
||
|
||
const memberStatusEnum = {
|
||
applying: '0',
|
||
isMember: '1',
|
||
notMember: '2'
|
||
}
|
||
|
||
function ZoneVIP(props){
|
||
const { deptId } = props.match.params;
|
||
const [ vipLists , setVIPLists ] = useState(undefined);
|
||
const [ isSpin , setIsSpin ] = useState(true);
|
||
const [ applyVisible , setApplyVisible ] = useState(false);
|
||
const [ memberStatus , setMemberStatus] = useState(memberStatusEnum.notMember);
|
||
const { id, showNotification, checkIfLogin, showLoginDialog, temp, sectionMemberTitle } = props;
|
||
|
||
useEffect(()=>{
|
||
if(id){
|
||
setIsSpin(true);
|
||
getLists();
|
||
getMemberStatus();
|
||
}
|
||
},[id])
|
||
|
||
function getLists(){
|
||
getVIPLists(id).then(response=>{
|
||
if(response){
|
||
setVIPLists(response.data.rows);
|
||
setIsSpin(false);
|
||
}
|
||
}).catch(error=>{setIsSpin(false);})
|
||
}
|
||
|
||
function getMemberStatus() {
|
||
getAuditStatus(id).then(res => {
|
||
if (res && res.data && res.data.code === 200) {
|
||
setMemberStatus(res.data.data)
|
||
} else {
|
||
setMemberStatus(memberStatusEnum.notMember)
|
||
}
|
||
}).catch(() => { setMemberStatus(memberStatusEnum.notMember) })
|
||
}
|
||
|
||
function onOk(e) {
|
||
applyJoin(id, e).then(res => {
|
||
if (res && res.data) {
|
||
showNotification(res.data.msg)
|
||
setApplyVisible(!applyVisible)
|
||
if (res.data.code === 200) {
|
||
setMemberStatus(memberStatusEnum.applying)
|
||
}
|
||
}
|
||
})
|
||
}
|
||
|
||
function apply() {
|
||
if(checkIfLogin()===false){
|
||
showLoginDialog()
|
||
return false;
|
||
}
|
||
setApplyVisible(!applyVisible)
|
||
}
|
||
|
||
return(
|
||
<div className={`boxmain ${temp}_VIP_box`}>
|
||
<p className="in_title">{ sectionMemberTitle }</p>
|
||
<p className="vip_sub_title">{ tempConfig[temp].vipDesc }</p>
|
||
{ memberStatus === memberStatusEnum.notMember && <Button className="zone_apply_button" onClick={ apply }>申请加入</Button> }
|
||
{ memberStatus === memberStatusEnum.applying && <div className="mt20 tips" ><Icon type="check-circle" theme="filled" />您的申请已提交，请耐心等待管理员审核!</div> }
|
||
<MemberApply visible={applyVisible} onOk={ onOk } onCancel={() => setApplyVisible(!applyVisible)} current_user={props.current_user}/>
|
||
|
||
<Spin spinning={isSpin}>
|
||
<div style={{minHeight:400}}>
|
||
{
|
||
vipLists && (vipLists.length > 0 ? <MemberList vipLists={vipLists} temp={temp}/> : <div style={{marginTop:30,padding:"20px"}}>
|
||
{
|
||
temp === tempEnum.zone1 ? <Nodata _html="暂无数据" img={ nodata }/> : <Nodata _html="暂无数据" />
|
||
}
|
||
</div>)
|
||
}
|
||
</div>
|
||
</Spin>
|
||
</div>
|
||
)
|
||
}
|
||
export default ZoneVIP; |