/*
 * @Author: 吴文洁
 * @Date: 2020-08-07 16:23:27
 * @LastEditors: renmanyi
 * @LastEditTime: 2023-07-10 14:28:06
 * @Description: 选择学员组件
 * @Copyright: 杭州杰竞科技有限公司 版权所有
 */

import React from 'react';
import { Modal, Radio, message } from 'antd';

import Bus from '@/core/bus';
import ShowTips from "@/components/ShowTips";

import FilterContent from './FilterContent';
import StudentList from './StudentList';

import './index.less';


const DEFAULT_NEW_QUERY = {
  size: 10,
  current: 1,
  status: 'NORMAL', // 学员类型, 默认显示在读学员
};

const DEFAULT_NEW_DEDUCTION_QUERY = {
  size: 10,
  current: 1,
  status: 'NORMAL', // 学员类型, 默认显示在读学员
}
class SelectStudent extends React.Component {

  constructor(props) {
    super(props);
    const {
      studentType,
      // 扣课时学员列表
      consumeStudentList = [],
      // 不扣课时学员列表
      studentList = [],
      // 不扣课时学员ID列表（已经入库的）
      excludeStudentIds = [],
      // 扣课时学员ID列表（已经入库的）
      excludeConsumeStudentIds = []
    } = props;
    const _studentList = studentType === 'DEDUCTION' ? consumeStudentList : studentList;
    const excludeIds = studentType === 'DEDUCTION' ? excludeConsumeStudentIds : excludeStudentIds;

    this.state = {
      newQuery: { ...DEFAULT_NEW_QUERY },
      newDeductionQuery: { ...DEFAULT_NEW_DEDUCTION_QUERY },
      totalCount: 0,
      allstudentList: [],                      // 学员列表
      excludeIds,                              // 已经入库的学员
      consumeStudentList: [].concat(consumeStudentList),                      // 扣课时学员列表
      studentIds: _.pluck(_studentList, 'studentId'),
    }
  }

  componentDidMount() {
    this.handleFetchStudentList();
  }

  // 获取学员列表
  handleFetchStudentList = () => {
    // 5.0和4.0请求学员列表的接口不一样
      const { studentType } = this.props;
      // 扣课时学员
      if (studentType === 'DEDUCTION') {
        this.handleFetchNewDeductionStudentList();
      } else {
        // 不扣课时学员
        this.handleFetchNewStudentList();
      }
  }

  // 获取不扣课时学员列表
  handleFetchNewStudentList = () => {
    const { adminId, instId } = window.currentUserInstInfo;
    const { studentType } = this.props;
    const { newQuery } = this.state;
    const {
      current, size, status, courseId, saleId,
      classId, teacherId, nameOrPhone, resourceType
    } = newQuery;
    const _query = {
      size,
      current,
      status,
      instId,
      adminId,
      expandRequest: {
        courseId,
        classId,
        teacherId,
      },
      basicRequest: {},
      filterRequest: {
        saleId,
        resourceType,
      }
    };

    if ((nameOrPhone || '').match(/[^0-9]/)) {
      _query.basicRequest.nameLike = nameOrPhone;
    } else {
      _query.basicRequest.phoneLike = nameOrPhone;
    }
    
    window.axios.Business('public/student/getLearningStudentPage', _query)
      .then((res) => {
        const { result = {} } = res;
        const { records = [], total = 0 } = result;
        const studentVOList = records;

        let allstudentList = [];

        allstudentList = _.map(studentVOList, item => {
          const { studentBasicVO: { studentId } } = item;
          return {
            ...item,
            studentId,
            key: studentId
          }
        });

        this.setState({
          allstudentList,
          totalCount: Number(total),
        });
      });
  }

  // 获取扣课时学员列表
  handleFetchNewDeductionStudentList = () => {
    const { newDeductionQuery } = this.state;
    const { size, current, courseId, classId, nameOrPhone } = newDeductionQuery;

    const _query = {
      size,
      current,
      classId,
      courseId,
    }

    if ((nameOrPhone || '').match(/[^0-9]/)) {
      _query.nameLike = nameOrPhone;
    } else {
      _query.phoneLike = nameOrPhone;
    }

    window.axios.Business('public/student/getStudentListWithUseAbleAccount', _query)
      .then((res) => {
        const { result = {} } = res;
        const { records = [], total = 0 } = result;

        const allstudentList = _.map(records, item => ({
          ...item,
          key: item.studentId,
        }));

        this.setState({
          allstudentList,
          totalCount: Number(total),
        })
      });
  }

  // 修改学员类型,清空搜索条件
  handleChangeStatus = (e) => {
    const { value } = e.target;
    Bus.trigger('resetSearchBar');
    this.setState({
      newQuery: {
        size: 10,
        current: 1,
        status: value,
      },
      oldQuery: {
        pageNo: 0,
        pageSize: 10,
        status: value,
      },
      newDeductionQuery: {
        size: 10,
        current: 1
      }
    }, () => {
      this.handleFetchStudentList();
    })
  }

  handleChangeQuery = (field, value) => {
    const { newQuery, oldQuery, newDeductionQuery } = this.state;

    const _newQuery = {
      ...newQuery,
      [field]: value
    };

    if (field === 'size') {
      _newQuery.current = 1;
    }

    
    const _oldQuery = {
     ...oldQuery,
      [field]: value
    };

    if (field === 'size') {
      _oldQuery.pageNo = 0;
    }

    const _newDeductionQuery = {
      ...newDeductionQuery,
      [field]: value
    };

    if (field === 'size') {
      _newDeductionQuery.current = 1;
    }

    this.setState({
      newQuery: {
        ..._newQuery,
      },
      oldQuery: {
        ..._oldQuery,
      },
      newDeductionQuery: {
        ..._newDeductionQuery,
      }
    }, () => {
      this.handleFetchStudentList();
    });
  }
  
  // 重置搜索条件
  handleReset = () => {
    const { newQuery, oldQuery } = this.state;
    this.setState({
      newQuery: {
        ...DEFAULT_NEW_QUERY,
        status: newQuery.status
      },
      newDeductionQuery: {
        ...DEFAULT_NEW_DEDUCTION_QUERY
      }
    }, () => {
      this.handleFetchStudentList();
    })
  }

  // 勾选学员
  handleSelect = (studentIds, consumeStudentList = [], savedSelectedRows) => {
    const { studentType } = this.props;
    const _studentIds = _.uniq([].concat(studentIds));
    const _consumeStudentList = _.uniq([].concat(consumeStudentList));
    this.setState({
      savedSelectedRows,
      studentIds: _studentIds,
      consumeStudentList: studentType === 'DEDUCTION' ? _consumeStudentList : this.state.consumeStudentList
    });
  }

  // 确定选择学员
  handleSelectDone = () => {
    const { studentIds, consumeStudentList, excludeIds, savedSelectedRows } = this.state;
    if (!_.isEqual(studentIds, excludeIds)){
      this.props.onSelect(studentIds, consumeStudentList, savedSelectedRows);
    } else {
      message.warning('请选择学员')
    }
  }

  render() {
    const {
      type,
      after,
      showTabs,
      studentType,
      studentList,
      savedSelectedRows
    } = this.props;
    const {
      newQuery,
      oldQuery,
      newDeductionQuery,
      totalCount,
      studentIds,
      excludeIds,
      allstudentList,
      consumeStudentList
    } = this.state;

    const { status: newStatus } = newQuery;
    const status = newStatus;
    const query = studentType === 'DEDUCTION' ? newDeductionQuery : newQuery ;

    return (
      <Modal
        title="选择学员"
        visible={true}
        width={720}
        onCancel={this.props.close}
        maskClosable={false}
        closeIcon={<span className="icon iconfont modal-close-icon">&#xe6ef;</span>}
        className="livecourse__select-student-modal"
        onOk={this.handleSelectDone}
      >

        {
          showTabs &&
          <Radio.Group
            onChange={this.handleChangeStatus}
            value={status}
          >
            <Radio.Button value='POTENTIAL'>潜在学员</Radio.Button>
            <Radio.Button value='NORMAL'>在读学员</Radio.Button>
            <Radio.Button value='HISTORY'>历史学员</Radio.Button>
          </Radio.Group> 
        }

        {
          studentType === 'DEDUCTION' &&
          <div className="show-tips">
            <ShowTips message="只支持选择有剩余课时的在读学员" />
          </div>
        }

        <FilterContent
          type={type}
          query={query}
          studentType={studentType}
          onReset={this.handleReset}
          onChange={this.handleChangeQuery}
        />

        <StudentList
          type={type}
          after={after}
          query={query}
          savedSelectedRows={savedSelectedRows}
          studentType={studentType}
          allstudentList={allstudentList}
          totalCount={totalCount}
          studentIds={studentIds}
          excludeIds={excludeIds}
          studentList={studentList}
          consumeStudentList={consumeStudentList}
          onSelect={this.handleSelect}
          onChange={this.handleChangeQuery}
        />
      </Modal>
    )
  }
}

export default SelectStudent;