diff --git a/public/react/src/modules/competitions/Competitioncommon/CompetitionCommonChild/CompetitionContentspdfChild/CompetitionContentspdfpeopledata.js b/public/react/src/modules/competitions/Competitioncommon/CompetitionCommonChild/CompetitionContentspdfChild/CompetitionContentspdfpeopledata.js index 9b5f13050..906c4a7bb 100644 --- a/public/react/src/modules/competitions/Competitioncommon/CompetitionCommonChild/CompetitionContentspdfChild/CompetitionContentspdfpeopledata.js +++ b/public/react/src/modules/competitions/Competitioncommon/CompetitionCommonChild/CompetitionContentspdfChild/CompetitionContentspdfpeopledata.js @@ -1,119 +1,820 @@ import React, { Component } from 'react'; -import {Button,Layout,Input} from 'antd'; +import {Button, Layout, Input, Form} from 'antd'; import axios from 'axios'; import {getImageUrl} from 'educoder'; import mycompetotionchild from './mycompetotionchild.css'; +import {getHiddenName} from "../../../../user/account/AccountBasicEdit"; +import '../../../../courses/css/Courses.css' +import RealNameCertificationModal from "../../../../user/modal/RealNameCertificationModal"; +export const identityMap = {"teacher": "教师", "student": "学生", "professional": "专业人士"} class CompetitionContentspdfpeopledata extends Component{ constructor(props) { super(props) - this.state={ - + this.state = { + basicInfo: {}, + updating: '', + secondsFlag: false, + seconds: 60, + phonebool: false, + emailbool: false, + formationdata: [], + bank_account_editable: false, + leader: false, + bank_account: undefined, + certification: 1 } } componentDidMount(){ window.document.title = '竞赛'; + console.log("获取用户信息"); + console.log(this.props); + this.getdata(); + this.GetawardinformationAPI(); } - render() { + GetawardinformationAPI = () => { + let url = `/competitions/${this.props.match.params.identifier}/prize.json`; + axios.get(url).then((result) => { + if (result.data) { + this.setState({ + formationdata: result.data.formationdata, + bank_account_editable: result.data.bank_account_editable, //队长是否可以编辑 + leader: result.data.leader, //是否是队长 + bank_account: result.data.bank_account, //队长银行卡号信息 + }) + } + }).catch((error) => { + console.log(error); + }) + } + + + getdata = () => { + let url = `/users/accounts/${this.props.current_user.login}.json`; + axios.get(url).then((result) => { + if (result.data) { + // if(result.data && result.data.base_info_completed == false){ + // this.props.history.push(`/account/profile/edit`); + // } + // "authentication": "uncertified", // "uncertified" | "applying" | "certified" + this.setState({ + basicInfo: Object.assign({}, {...result.data}, { + avatar_url: `${result.data.avatar_url}`, + gender: result.data.gender == null || result.data.gender == undefined ? 0 : result.data.gender + }) + }) + } + }).catch((error) => { + console.log(error); + }) + }; + // 绑定手机 + onPhoneSubmit = () => { + this.props.form.validateFieldsAndScroll((err, values) => { + if (!err) { + let {login} = this.props.current_user; + let reg = /^1\d{10}$/; + if (reg.test(values.phone)) { + let url = `/users/accounts/${login}/phone_bind.json` + axios.post((url), { + phone: values.phone, + code: values.phoneValidateCode + }).then((result) => { + if (result) { + this.props.showNotification("手机号码绑定成功!"); + this.setState({ + phonebool: false + }) + this.getdata(); + } + }).catch((error) => { + console.log(error); + }) + } else { + this.props.showNotification("请输入有效的11位手机号码"); + } + } + }) + } + // 绑定邮箱 + onEmailSubmit = () => { + this.props.form.validateFieldsAndScroll((err, values) => { + if (!err) { + let {login} = this.props.current_user; + let reg = /^[a-zA-Z0-9]+([.\-_\\]*[a-zA-Z0-9])*@([a-z0-9]+[-a-z0-9]*[a-z0-9]+.){1,63}[a-z0-9]+$/; + if (reg.test(values.email)) { + let url = `/users/accounts/${login}/email_bind.json` + axios.post((url), { + email: values.email, + code: values.emailValidateCode + }).then((result) => { + if (result) { + this.props.showNotification("邮箱地址绑定成功!"); + this.setState({ + updating: '' + }) + this.getdata(); + } + }).catch((error) => { + console.log(error); + }) + } else { + this.props.showNotification("请输入正确的邮箱地址"); + } + } + }) + } + //取消编辑 + hideUpdating = (i) => { + if (i === 1) { + this.setState({ + phonebool: false + }) + } else if (i === 2) { + this.setState({ + emailbool: false + }) + + } else if (i === 3) { + + } + + } + + // 获取验证码 + getCode = (index) => { + let url = `/accounts/get_verification_code.json` + let login = ''; + let values = this.props.form.getFieldsValue(); + if (index == 3) { + //绑定手机号码 + login = values.phone; + let reg = /^1\d{10}$/; + if (reg.test(login) == false) { + this.props.showNotification(`请先输入正确的手机号码`); + return; + } + } else if (index == 4) { + // 绑定邮箱 + login = values.email; + let reg = /^[a-zA-Z0-9]+([.\-_\\]*[a-zA-Z0-9])*@([a-z0-9]+[-a-z0-9]*[a-z0-9]+.){1,63}[a-z0-9]+$/; + if (reg.test(login) == false) { + this.props.showNotification(`请先输入正确的邮箱地址`); + return; + } + } + let type = index; + if (!login) { + this.props.showNotification(`请先输入${index == 3 ? "手机号码" : "邮箱地址"}`); + return; + } + axios.get((url), { + params: { + login, type + } + }).then((result) => { + if (result) { + // 倒计时 + this.setState({ + secondsFlag: true + }) + this.remainTime(); + } + }).catch((error) => { + console.log(error); + }) + } + + // 获取验证码倒计时 + remainTime = () => { + this.setState({ + seconds: 60 + }) + this.timer = setInterval(() => { + let {seconds} = this.state; + let s = parseInt(seconds) - 1; + if (s > -1) { + this.setState({ + seconds: s + }) + } else { + this.setState({ + secondsFlag: false + }) + clearInterval(this.timer); + } + }, 1000) + } + + phonebools = () => { + this.setState({ + phonebool: true + }) + } + + emailbools = () => { + console.log("点击了邮箱"); + this.setState({ + emailbool: true + }) + } + + //立即认证 + checkBasicInfo = (index) => { + if (this.state.basicInfo.base_info_completed == true) { + this.showRealNameCertificationModal(index) + } else { + this.props.confirm({ + okText: `立即完善`, + content: `请先完善基本信息`, + onOk: () => { + this.props.history.push('/account/profile/edit') + } + }) + } + + } + showRealNameCertificationModal = (index) => { + this.setState({ + certification: index, + }, () => { + if (index == 1) { + this.realNameCertificationModal1.setVisible(true) + } else if (index == 2) { + this.realNameCertificationModal2.setVisible(true) + } + }) + } + //绑定银行确认 + yhBankstrue = () => { + this.props.form.validateFieldsAndScroll((err, values) => { + if (!err) { + let url = `/competitions/${this.props.match.params.identifier}/prize_leader_account.json`; + axios.patch(url, { + bank: values.openingbank, + second_bank: values.subbranchs, + card_no: values.subbranch + }) + .then((result) => { + try { + if (result.data.status == 0) { + // console.log(JSON.stringify(result)); + this.props.showNotification(`提交成功成功`); + this.getdata(); + this.GetawardinformationAPI(); + } + } catch (e) { + + } + + }).catch((error) => { + console.log(error); + }) + } + }) + + } + //撤销认证 + Cancellationofapplication = (index) => { + let url = "" + if (index === 1) { + url = `/users/accounts/${this.props.user.user_id}/authentication_apply.json`; + } else if (index === 2) { + url = `/users/accounts/${this.props.user.user_id}/professional_auth_apply.json`; + } + axios.delete(url) + .then((response) => { + try { + if (response.data.status == 0) { + if (index === 1) { + this.props.showNotification('撤销实名认证成功') + } else if (index === 2) { + this.props.showNotification('撤销职业认证成功') + } + + + } + } catch (e) { + + } + + }) + .catch(function (error) { + console.log(error); + }); + } + + + render() { + const {getFieldDecorator} = this.props.form; + const {updating, seconds, secondsFlag, basicInfo, phonebool, emailbool, certification, formationdata, bank_account_editable, leader, bank_account} = this.state + console.log(emailbool); return (
+ {this.state.certification === 1 ? this.realNameCertificationModal1 = form} + certification={certification} + > : ""} + + {this.state.certification === 2 ? this.realNameCertificationModal2 = form} + certification={certification} + > : ""}

*实名信息

-

通过实名认证后才能获得证书

-

立即认证

+ {basicInfo && basicInfo.authentication == "uncertified" ? +

通过实名认证后才能获得证书

: "" + } + {basicInfo && basicInfo.authentication == "uncertified" ? +

this.checkBasicInfo(1)}>立即认证

: "" + } +

姓名：

-

胡志勇

已认证

待审核！

撤销认证

+

{basicInfo && basicInfo.name} + + { + basicInfo && basicInfo.authentication == "uncertified" ? "" : + basicInfo && basicInfo.authentication == "applying" ? +

待审核！

this.Cancellationofapplication(1)}>撤销认证

+ : +

+

已认证

+

+ } +

性别：

-

男

+

{basicInfo && basicInfo.gender == 0 ? "男" : "女"}

*职业信息

-

通过职业认证后才能获得证书

-

立即认证

+ { + basicInfo && basicInfo.professional_certification == "uncertified" ? +

通过职业认证后才能获得证书

+ + : ""} + { + basicInfo && basicInfo.professional_certification == "uncertified" ? +

this.checkBasicInfo(2)}>立即认证

+ + : ""}

职业：

-

教师

已认证

待审核！

撤销认证

+

{basicInfo && basicInfo.identity && identityMap[basicInfo.identity]} + { + basicInfo && basicInfo.professional_certification == "uncertified" ? + "" : + basicInfo && basicInfo.professional_certification == "applying" ? +

+

待审核！

this.Cancellationofapplication(2)}>撤销认证

+

+ : +

+

已认证

+

this.checkBasicInfo(2)}>重新认证

+ +

+ } +

职称：

-

副教授

+

{basicInfo && basicInfo.technical_title}

学校：

-

国防科技大学

+

{basicInfo && basicInfo.school_name}

院系：

-

计算机学院

+

{basicInfo && basicInfo.department_name}

-

*联系方式

手机号：

-

未绑定

-

立即绑定

+ { + basicInfo && basicInfo.phone ? +

{basicInfo && basicInfo.phone}

+ : +

未绑定

+ } +

this.phonebools()}>{basicInfo && basicInfo.phone ? (phonebool === false ? "更换" : "") : (phonebool === false ? "立即绑定" : "")}

+ {/*手机号绑定*/} + { + phonebool === true ? +
+ +
+ + + {getFieldDecorator('phone', { + rules: [{ + // initialValue: this.state.cityDefaultValue, + required: true, + message: `请输入要${basicInfo.phone ? '更换' : '绑定'}的手机号码`, + }], + })( + + )} + + + + {getFieldDecorator('phoneValidateCode', { + rules: [{ + // initialValue: this.state.cityDefaultValue, + required: true, + message: '请输入手机获取的验证码', + }], + })( + + )} + + + +
+ + +
+ +
+
+ : "" + } + +

Email：

-

163@163.com

-

更换

+

{basicInfo && basicInfo.mail}

+

this.emailbools()}>{basicInfo && basicInfo.mail ? (emailbool === false ? "更换" : "") : (emailbool === false ? "立即绑定" : "")}

+ { + emailbool === false ? "" : +
+ +
+ + + {getFieldDecorator('email', { + rules: [{ + // initialValue: this.state.cityDefaultValue, + required: true, + message: basicInfo && basicInfo.mail ? '请输入要更换的新邮箱地址' : '请输入邮箱地址', + }], + })( + + )} + + + + {getFieldDecorator('emailValidateCode', { + rules: [{ + // initialValue: this.state.cityDefaultValue, + required: true, + message: '请输入邮箱收到的验证码', + }], + })( + + )} + + -
-

签/领/开户行及银行卡号

-

为保障奖金的及时发放，请队长如实填写你名下的银行卡信息

+
+ + +
+ +
+ } + { + leader === true ? +
+ { + bank_account_editable === true ? +
+
+

签/领/开户行及银行卡号

+

为保障奖金的及时发放，请队长如实填写你名下的银行卡信息

+
+
+ + + // class="ant-col ant-form-item-label" + `} +
+ + + {getFieldDecorator('openingbank', { + rules: [{ + // initialValue: this.state.cityDefaultValue, + required: true, + message: '请输入开户行', + }], + })( + + )} + -
-

开户行：

- -
+ + {getFieldDecorator('subbranch', { + rules: [{ + // initialValue: this.state.cityDefaultValue, + required: true, + message: '请输入支行', + }], + })( + + )} + -
-

支行：

- -
+ + {getFieldDecorator('subbranchs', { + rules: [{ + // initialValue: this.state.cityDefaultValue, + required: true, + message: '请输入账号', + }], + })( + + )} + -
-

账号：

- -
+
+

+
+ {/*
this.yhBanksfalse()}>

取消

*/} + +
+
+ +
-
-

-
-

取消

-

确认

+
+
+ + : +
+
+

签/领/开户行及银行卡号

+

为保障奖金的及时发放，请队长如实填写你名下的银行卡信息

+
+ { + bank_account && bank_account ? +
+
+

开户行：

+

{bank_account && bank_account.bank}

+
+
+

支行：

+

{bank_account && bank_account.second_bank}

+
+
+

账号：

+

{bank_account && bank_account.card_no}

+
+
+ : + "" + } + +
+ } + +
+ : "" + } -
-
) } } -export default CompetitionContentspdfpeopledata; + +const CompetitionContentspdfpeopledatas = Form.create({name: 'CompetitionContentspdfpeopledata'})(CompetitionContentspdfpeopledata); + +export default CompetitionContentspdfpeopledatas; + diff --git a/public/react/src/modules/competitions/Competitioncommon/CompetitionCommonChild/CompetitionContentspdfChild/mycompetotionchild.css b/public/react/src/modules/competitions/Competitioncommon/CompetitionCommonChild/CompetitionContentspdfChild/mycompetotionchild.css index bf73dc59d..9f62759df 100644 --- a/public/react/src/modules/competitions/Competitioncommon/CompetitionCommonChild/CompetitionContentspdfChild/mycompetotionchild.css +++ b/public/react/src/modules/competitions/Competitioncommon/CompetitionCommonChild/CompetitionContentspdfChild/mycompetotionchild.css @@ -128,8 +128,8 @@ .buttongo2{ background: #4CACFF; border: 1px solid #4CACFF; - width: 60px; - height: 30px; + width: 64px; + height: 32px; border-radius: 4px; color: #FFFFFF; font-size: 16px; @@ -181,3 +181,117 @@ text-align: center; } + +.mycompitcursor { + cursor: pointer; +} + +.basicForm { + background: #fff; + padding: 30px; + margin-bottom: 10px; + box-sizing: border-box; + width: 100%; + min-height: 390px; +} + +.basicForm .title { + font-size: 16px; + padding-left: 30px; + margin-bottom: 10px; +} + +.flexTable { + display: flex; + flex-direction: column; +} + +.flexRow { + display: flex; +} + +.mb15 { + margin-bottom: 15px !important; +} + +/* BUTTOn */ +.ant-btn { + border-radius: 2px; +} + +button.ant-btn.ant-btn-primary.grayBtn { + background: #CBCBCB; + border-color: #CBCBCB; +} + +.borderBottom { + border-bottom: 1px solid #4CACFF; +} + +/* form ---------------- START */ +.formItemInline { + display: flex; +} + +.formItemInline .ant-form-item-control-wrapper { + display: inline-block; +} + +.hideRequireTag .ant-form-item-required:before { + display: none; +} + + +/* .basicForm .ant-form-item-label { + width: 100px; + padding-right: 10px; +} + .basicForm .ant-form-item-label label { + color: #979797 + } */ + + +.courseNormalForm .ant-select-show-search { + height: 40px; +} + +.courseNormalForm .ant-select-auto-complete.ant-select .ant-input { + height: 40px; +} + +.courseNormalForm .ant-select-search__field__mirror { + height: 40px; +} + +.courseNormalForm .ant-input-lg { + height: 40px; +} + +.courseNormalForm .ant-select-selection--single { + height: 40px; +} + +.courseNormalForm .ant-select-auto-complete.ant-select .ant-select-selection--single { + height: 40px +} + +.courseNormalForm .ant-input-affix-wrapper { + height: 40px; +} + +/* 职业 */ +.courseNormalForm .ant-select-selection-selected-value { + line-height: 38px +} + +.courseNormalForm input { + height: 40px; +} + +.w300 { + width: 300px; +} + +.w56 { + width: 56px; +}