fe_service_ebtp_frontend/src/pages/BidEvaluation/Jury.js

import React, {PureComponent} from 'react';
import {Divider,Button,Form,Card,Tabs,Table,Tooltip,Input,Select,Row,Col,message,Modal,Descriptions,Checkbox } from 'antd';
import './index.less';
import { connect } from "dva";
import { history } from "umi"
// import bookt from "../../assets/bookt.doc";

const FormItem=Form.Item;
const formRef = React.createRef();
const DescriptionsItem=Descriptions.Item;
@connect(({ bidev,loading }) => ({
  ...bidev,
  JurylistLoading:loading.effects['bidev/fetchJuryList'],
  bidslistLoading:loading.effects['bidev/fetchbidslist'],
}))
class Jury extends PureComponent {
  state={
    pageNo:1,
    pageSize:10,
    tpId:'',
    ratevisible:false,
    room:[],
    bookflag:false,
    display:false,
  }
  componentDidMount(){
    // console.log(this.props.match.params.roomType)
    this.setState({
      bookflag:true
    })
    const { dispatch }=this.props;
    // const {pageNo,pageSize}=this.state;
    const params={
      pageNo:1,
      pageSize:10,
      // roomType:this.props.match.params.roomType,
      // tpId: getProId(),//项目id
      checked:false
    }
    dispatch({
      type:"bidev/fetchJuryList",
      payload:{...params}
    })
  }

  columns=[
    { title: '序号', dataIndex: 'id', width: '10%',
      render:(text, record, index)=>{
        return (index+1)
    }},
    { title: '项目名称', dataIndex: 'projectName', width: '10%'},
    { title: '标段名称', dataIndex: 'sectionName', width: '10%'},
    { title: '标段编号', dataIndex: 'sectionNum', width: '10%'},
    { title: '评标次数', dataIndex: 'roomSort', width: '10%',
      render:(text, record, index)=>{
      return <>第{text}次评标</>
    }},
    { title: '评标开始时间', dataIndex: 'openTime', width: '10%'},
    { title: '操作', dataIndex: 'operation', width: '10%',
      render:(text, record, index)=>{
      return <><a className="buttont"onClick={()=>{this.onRateShow(record)}}>进入评审室</a></>
  }}
  ]

  bidscolumns=[
    { title: '序号', dataIndex: 'id', width: '10%',
      align:"center",
      render:(text, record, index)=>{
        return (index+1)
    }},
    { title: '投标人名称', dataIndex: 'bidUserName',align:"center", width: '90%'}
  ]

  onRateShow=(record)=>{
    this.setState({
      room:record
    })
    const params={
      roomId:record.id
    }
    const roomId={
      assessRoomId:record.id
    }
    this.props.dispatch({
      type:"bidev/getCheckedByRoomId",
      payload: {...roomId},
      callback:(response) => {
        console.log(response)
        if(response.data == false) {
          this.setState({display: true})
        } else {
          this.setState({display: false})
        }
      }
    })
    this.props.dispatch({
      type:"bidev/fetchJuryMemInfo",
      payload:{...params},
      callback:(response,txt)=>{
        if(txt=="success"){
          sessionStorage.setItem('projectData',JSON.stringify(record))
          sessionStorage.setItem('roomId',record.id)
          this.setState({
            ratevisible:true,
            tpId:record.tpId
          })
        }
      }
    })
  }
  // 校验验证码及修改用户信息
  onRe2ndPageOut=()=>{
    const { validateFields,getFieldValue }=formRef.current;
    const { JuryInfo,checked }=this.props;
    validateFields(['name','phone',
                    // 'certificate',
    'verificationCode']).then(
      (values) => {
        console.log(values);
        const params={
          name:values.name,
          phone:values.phone,
          id:JuryInfo.id
        }
        this.props.dispatch({
          type:"bidev/updateJuryMemInfo",
          payload:{...params},
          callback:(response,txt)=>{
            if(txt=="success"){
              const { room,tpId }=this.state;
              const paramst={
                id:room.id,
                verificationCode:values.verificationCode
              }
              // 校验验证码
              this.props.dispatch({
                type:"bidev/validateVerificationCode",
                payload:{...paramst},
                callback:(response,txt)=>{
                  if(txt=="success"){
                    const { display }=this.state;
                    console.log(display)
                    if(display == true) {
                      history.push('/EvaRoom')
                      this.setState({
                        ratevisible:false,
                      })
                    } else {
                      // message.success("完美成功！")
                      const paramskt={
                        assessRoomId:room.id,
                        // assessRoomId:"1331563852780797952",
                        projectId:tpId,
                        // projectId:"4419993030303037111"
                      }
                      const params={
                        roomId:room.id
                      }
                      this.props.dispatch({
                        type:"bidev/fetchbidslist",
                        payload:{...paramskt}
                      })
                      this.props.dispatch({
                        type:"bidev/fetchJuryMemInfo",
                        payload:{...params},
                        callback:(response,txt)=>{
                          if(txt=="success"){
                            const { resetFields }=formRef.current;
                            resetFields();
                            this.setState({
                              ratevisible:false,
                              bookflag:false
                            })
                          }
                        }
                      })
                    }
                  }
                }
              })
            }
          }
        })
      }
    )
  }
  onRateOut(){
    const { resetFields }=formRef.current;
    resetFields();
    this.setState({
      ratevisible:false
    })
  }
  onChange=(e)=>{
    this.setState({
      checked:e.target.checked
    })
  }
  windowopen=()=>{
    // window.open(response.data, '_blank')
  }
  handleRedirect=(txt)=>{
    const { checked,room }=this.state;
    const { JuryInfo }=this.props;
    if(txt==1 && !checked){
      return message.warn("请您先阅读专家承诺书！")
    }
    const params={
      assessRoomId:room.id,
      attitude:txt,
      juryMemberId:JuryInfo.id,
      sectionId:room.sectionId,
    }
    this.props.dispatch({
      type:"bidev/pushRedirectRe",
      payload:{...params},
      callback:(response,t)=>{
        if(t=="success"){
          // 再跳转
          if(txt==1){
            // sessionStorage.setItem("roomId",record.id)
            // this.props.dispatch(routerRedux.push('/ProjectLayout/EvaRoom'))
            history.push('/EvaRoom')
          }else{
            this.setState({
              ratevisible:false
            })
          }
        }else{
          message.error(response.message)
        }
      }
    })
  }
  handleBack=()=>{
    this.setState({
      bookflag:true
    })
  }
  render(){
    const { JuryList,JurylistLoading,JuryInfo,bidslistLoading,bidslist}=this.props;
    const { pageNo,pageSize,tpId,ratevisible,bookflag,checked,display }=this.state;
    const pagination = {
      current: pageNo,
      total: JuryList && JuryList.total ,
      // showSizeChanger: true,
      showQuickJumper:true,
      showTotal: (total,range) => `共 ${total} 条记录，第${range.slice(',')[0]}-${range.slice(',')[1]}条`,
      onChange:(page, pageSize)=>{
        this.setState({
          pageNo:page,
          pageSize:pageSize,
        });
        const params={
          pageNo:page,
          pageSize:pageSize,
          // roomType:2,
          // tpId:tpId//项目id
        }
        this.props.dispatch({
          type:"bidev/fetchJuryList",
          payload:{...params}
        })
      },
      onShowSizeChange: (current, pageSize) => {
        this.setState({
          pageNo:1,
          pageSize:pageSize,
        });
        const params={
          pageNo:1,
          pageSize:pageSize,
          // roomType:2,
          // tpId:tpId//项目id
        }
        this.props.dispatch({
          type:"bidev/fetchJuryList",
          payload:{...params}
        })
      }
    }
    const formItemLayout = {
      labelCol: { span: 5 },
      wrapperCol: { span: 13 }
    };
    const renderBookt=()=>{
      return <div className="bookt"><Descriptions title={<div className="zul">专家信息</div>} bordered column={2}>
              <DescriptionsItem label="姓名">{JuryInfo!="" && JuryInfo.name}</DescriptionsItem>
              <DescriptionsItem label="手机号">{JuryInfo!="" && JuryInfo.phone}</DescriptionsItem>
              <DescriptionsItem label="身份证号">{JuryInfo!="" && JuryInfo.certificate}</DescriptionsItem>
              </Descriptions>
              <div className="zul" style={{marginTop:"10px",marginBottom:"20px"}}>投标人信息</div>
              <Table
                loading={bidslistLoading}
                columns={this.bidscolumns}
                dataSource={bidslist!="" && bidslist}
                pagination={true}
                // className="table"
                bordered
              />
              <span style={{marginLeft:"39%",fontSize:"15px",fontWeight:"bold"}}><Checkbox onChange={this.onChange} checked={checked}></Checkbox><span style={{marginLeft:"10px"}}>我已读并同意了此承诺书</span><span style={{color:"#2D2DFF",fontSize:"20px",cursor:"pointer"}} onClick={()=>{this.windowopen()}}>《承诺书协议》</span></span><br/><br/>
              <span style={{marginLeft:"39%",marginTop:"10px"}}><Button type="danger" onClick={()=>{this.handleRedirect(2)}}>申请回避</Button><Button style={{marginLeft:"30px"}} type="danger" onClick={()=>{this.handleRedirect(1)}}>确定</Button></span>
              </div>
    }
    return <>
    {bookflag?
    <Card title="评审室">
    <Table
      loading={JurylistLoading}
      columns={this.columns}
      dataSource={JuryList!="" && JuryList.records}
      pagination={pagination}
      bordered
    /></Card>:
    renderBookt()}
    <div className="zry">
      <Modal
        destroyOnClose
        cancelText="取消"
        okText="确定"
        onCancel={()=>{this.onRateOut()}}
        onOk={()=>{this.onRe2ndPageOut()}}
        // title="信息确认"
        heade
        visible={ratevisible}
        style={{width:"55%"}}
      >
        <Form
          ref={formRef}
          labelCol={{ span: 5 }}
          wrapperCol={{ span: 13 }}
          preserve={false}
      >
      <span className="zul">专家信息确认</span>
      <div className="divider"></div>
      <FormItem
                label="姓名"
                initialValue={JuryInfo!="" && JuryInfo.name}
                name="name"
                rules={[
                  {
                    required: !this.state.display,
                    message: '请输入姓名',
                  },
                ]}
      ><Input placeholder="请输入姓名" disabled={this.state.display}/></FormItem>
      <FormItem
              label="电话"
              initialValue={JuryInfo!="" && JuryInfo.phone}
              name="phone"
              rules={[
                {
                  required: !this.state.display,
                  message: '请输入电话',
                },
              ]}
      ><Input placeholder="请输入电话" disabled={this.state.display}/></FormItem>
      <FormItem
              label="身份证号"
              initialValue={JuryInfo!="" && JuryInfo.certificate}
              name="certificate"
              rules={[
                {
                  required: !this.state.display,
                  message: '请输入身份证号',
                },
              ]}
      ><Input placeholder="请输入身份证号" disabled/></FormItem>
      <span className="zul">评标室校验码</span>
        <div className="divider"></div>
        <FormItem label="校验码" {...formItemLayout} name="verificationCode"
        rules={[
          {
            required: true,
            message: '请输入校验码',
          }
        ]}>
        <Input placeholder="请输入校验码"/></FormItem>
      </Form>
      </Modal>
      </div>
    </>
  }
}
export default Jury;