Untitled
user_4058768
plain_text
a year ago
19 kB
4
Indexable
import React from 'react'; import { Link } from 'react-router-dom'; import { AdminModal, AdminPage, FormCheckbox, FormRichTextBox, FormSelect, FormTextBox, TableCell, TableHead, getValue, renderDataTable } from 'view/component/AdminPage'; import { SelectAdapter_FwSinhVienSDH, createSdhDeTai, getDeTaiPage } from './redux'; import { connect } from 'react-redux'; import Pagination from 'view/component/Pagination'; import { SelectAdapter_FwCanBoGiangVien } from 'modules/mdTccb/tccbCanBo/redux'; import { FormChildren } from '../sdhTsThiSinhHoSo/FormChildren'; class EditModal extends AdminModal { // componentDidMount() { // this.onShown(() => { // this.tenDeTai.focus(); // }); // } state = { data: {}, listCbhd: [] } selectVaiTro = [{ id: 'Cán bộ hướng dẫn chính', text: 'Cán bộ hướng dẫn chính' }, { id: 'Cán bộ hướng dẫn phụ', text: 'Cán bộ hướng dẫn phụ' }, { id: 'Cán bộ hướng dẫn độc lập', text: 'Cán bộ hướng dẫn độc lập' }, { id: 'Đồng hướng dẫn', text: 'Đồng hướng dẫn' }]; onShow = (item) => { console.log(item, 'cshiuj'); console.log(this.mssv?.value(item.mssv ?? ''), 'ggg'); let { id, tenDeTai, ghiChu, noiDung, mssv, soQuyetDinh, tenSqd } = item ? item : { id: '', tenDeTai: '', ghiChu: '', noiDung: '', mssv: '', soQuyetDinh: this.props.newSoQuyetDinh + 1, tenSqd: '' }; this.setState({ id }, () => { this.tenDeTai?.value(tenDeTai ?? ''); this.mssv?.value(mssv ?? ''); this.ghiChu?.value(ghiChu ?? ''); this.noiDung?.value(noiDung ?? ''); this.soQuyetDinh?.value(soQuyetDinh + 1 ?? ''); this.tenSqd?.value(tenSqd ?? ''); }); } onSubmit = (e) => { e.preventDefault(); console.log(this.state.listCbhd, 'ssssss'); console.log(getValue(this.tenDeTai), 'tendetai'); console.log(getValue(this.mssv), 'mssv'); console.log(getValue(this.ghiChu), 'ghichu'); console.log(getValue(this.noiDung), 'noidung'); console.log(getValue(this.soQuyetDinh), 'soquyetdinh'); console.log(getValue(this.tenSqd), 'tenSqd'); let changes = { tenDeTai: getValue(this.tenDeTai), mssv: getValue(this.mssv), ghiChu: getValue(this.ghiChu), noiDung: getValue(this.noiDung), soQuyetDinh: getValue(this.soQuyetDinh), tenSqd: getValue(this.tenSqd), cbhd: getValue(this.state.listCbhd) }; console.log(changes, 'changes'); if (this.state.id) { changes = { ...changes, mode: 1 }; // update this.props.create(this.state.id, changes, this.hide); } else { changes = { ...changes, mode: 0 }; this.props.create(null, changes, this.hide); } } handleCbhd = (idCbhd, action) => { const [ghiChu, vaiTro, shcc] = [ this['ghiChuCbhd' + idCbhd].value() || '', this['vaiTro' + idCbhd]?.value() || '', this['shcc' + idCbhd]?.value() || '', ]; let condition = (vaiTro && shcc) || ghiChu; if (!condition) { T.notify('Vui lòng điền đầy đủ thông tin người hướng dẫn'); return; } let changes = { idThiSinh: this.props.idThiSinh, hoTen: ghiChu?.split('. ').join(' ').split(' - ')[0]?.trim() || '', vaiTro: vaiTro || ghiChu?.split('.').join(' ').split(' - ')[1]?.trim() || '', shcc: shcc || '' }; let another = this.state.listCbhd.find(({ id }) => id != idCbhd); if (another && another.shcc && another.shcc == changes.shcc) { T.notify('Không thể đăng ký một cán bộ hướng dẫn hai lần', 'danger'); return; } else { let struct = { dataDeTai: { dataCbhd: { ...changes } } }; action == 'update' ? this.props.updateThiSinh(idCbhd, struct) : ''; } } handleTempCbhd = () => { const [ghiChu, vaiTro, shcc] = [ this['ghiChuCbhdTemp']?.value(), this['vaiTroTemp']?.value(), this['shccTemp']?.value() ]; let condition = ghiChu || (vaiTro && shcc); let newData = { // idThiSinh: this.props.idThiSinh, // hoTen: ghiChu && ghiChu?.split('. ').join(' ').split(' - ')[0]?.trim(), vaiTro: vaiTro || ghiChu && ghiChu?.split('.').join(' ').split(' - ')[1]?.trim(), shcc }; console.log(newData, 'newdata'); // this.setState(prevState => ({ // listCbhd: [ // ...prevState.listCbhd, // newData // ] // })); this.setState(prevState => ({ listCbhd: [ ...prevState.listCbhd, newData ] }), () => { console.log(this.state.listCbhd, 'datatest'); }); // console.log(this.state.listCbhd, 'datatest'); if (!condition) { T.notify('Vui lòng điền đầy đủ thông tin người hướng dẫn'); return; } else { const curCbhd = this.state.listCbhd; if (curCbhd.length) { if (curCbhd.find(i => i.shcc == newData.shcc)) { T.notify('Không thể đăng ký một cán bộ hướng dẫn hai lần', 'danger'); return; } } // const changes = { dataDeTai: { dataCbhd: newData } }; // console.log('1'); // this.props.updateThiSinh('Temp', changes, () => this.getData()); } } // setVal = (data) => { // const { tenDeTai, listCbhd } = data; // this.tenDeTai?.value(tenDeTai); // if (listCbhd.length) // for (const cbhd of listCbhd) { // let idCbhd = cbhd.id; // for (const key in cbhd) { // if (key == 'shcc' && !cbhd[key]) { // this['ghiChuCbhd' + idCbhd].value(`${cbhd.hoTen} - ${cbhd.vaiTro}`); // break; // } // this[key + idCbhd]?.value(cbhd[key] || ''); // } // } // } renderCbhdForm = () => { const { data } = this.state; console.log(data, 'req'); const dataCbhd = this.state.listCbhd || []; const readOnly = this.props.readOnly; const formOld = (idCbhd, cbhd) => { console.log({ idCbhd, cbhd }, 'formOld'); return ( <div className='row'> <h5 className='tile-sub col-md-12' style={{ marginBottom: '5px' }}>Thông tin nguời hướng dẫn</h5><br /> <strong className='col-md-12 text-danger' style={{ paddingLeft: 15 }}>Trường hợp không tìm thấy cán bộ hướng dẫn (CBHD) hoặc CBHD là cán bộ ngoài trường, vui lòng nhập ở ghi chú theo mẫu</strong><br /> <FormSelect ref={e => this['shcc' + idCbhd] = e} label='Cán bộ hướng dẫn' data={SelectAdapter_FwCanBoGiangVien} className='col-md-6' allowClear readOnly={readOnly} value={cbhd?.shcc} /> <FormSelect ref={e => this['vaiTro' + idCbhd] = e} label='Vai trò' data={this.selectVaiTro} className='col-md-6' readOnly={readOnly} allowClear value={cbhd?.vaiTro} /> <FormRichTextBox ref={e => this['ghiChuCbhd' + idCbhd] = e} maxLength={1999} label='Ghi chú' placeholder='<Chức danh cao nhất> <Học vị cao nhất> <Họ và tên> - <Vai trò>. Vd: PGS TS Nguyễn Văn A - Cán bộ hướng dẫn chính' className='col-md-12' readOnly={readOnly} value={cbhd?.hoTen} /> {readOnly ? '' : <div className='col-md-12 d-flex justify-content-end' style={{ marginTop: 15, marginBottom: 15 }}> <button type='button' className='btn btn-success rounded-0' onClick={(e) => e.preventDefault() || this.handleCbhd(idCbhd, 'update')}> <i className='fa fa-fw fa-lg fa-save' />Lưu </button> <button type='button' className='btn btn-danger rounded-0' onClick={(e) => e.preventDefault() || this.handleCbhd(idCbhd, 'delete')}> <i className='fa fa-fw fa-lg fa-trash' />Xoá </button> </div>} </div> ); }; const formNew = () => { let idCbhd = 'Temp'; return <div className='row'> <FormSelect ref={e => this['shcc' + idCbhd] = e} label='Cán bộ hướng dẫn' data={SelectAdapter_FwCanBoGiangVien} className='col-md-6' allowClear readOnly={false} /> <FormSelect ref={e => this['vaiTro' + idCbhd] = e} label='Vai trò' data={this.selectVaiTro} className='col-md-6' readOnly={false} allowClear /> <FormRichTextBox ref={e => this['ghiChuCbhd' + idCbhd] = e} maxLength={1999} label='Ghi chú' placeholder='<Chức danh cao nhất> <Học vị cao nhất> <Họ và tên> - <Vai trò>. Vd: PGS TS Nguyễn Văn A - Cán bộ hướng dẫn chính' className='col-md-12' readOnly={false} /> <div className='col-md-12 d-flex justify-content-center' style={{ marginTop: 15 }}> <button type='button' className='btn btn-success rounded-0' onClick={(e) => e.preventDefault() || this.handleTempCbhd(idCbhd)}> <i className='fa fa-fw fa-lg fa-plus' />Lưu người hướng dẫn </button> </div> </div>; }; if (dataCbhd.length == 0) { return <div className='col-md-12' style={{ marginTop: 5 }}> {!readOnly ? <div className='tile'> <h5 className='text-primary' style={{ color: 'green' }}>Thêm mới người hướng dẫn</h5> {formNew()} </div> : ''}</div>; } else if (dataCbhd.length == 1) { return <div className='col-md-12' style={{ marginTop: 5 }}> <FormChildren title='Chỉnh sửa người hướng dẫn' className='tile' titleClassName='tile-title' titleSize='h5' titleStyle={{ color: 'orange' }} content={formOld(dataCbhd[0].id, dataCbhd[0])} /> {!readOnly ? <FormChildren title='Thêm mới người hướng dẫn' className='tile' titleClassName='tile-title' titleSize='h5' titleStyle={{ color: 'green' }} content={formNew(this.temp)} /> : ''} </div>; } else { return <div className='col-md-12' style={{ marginTop: 5 }}> <div className='tile'> <h5 style={{ color: 'orange' }}>Chỉnh sửa người hướng dẫn</h5> {dataCbhd.map(i => formOld(i.id))} </div> </div>; } } render = () => { console.log(this.state.id); console.log(this.mssv, 'mssv'); const readOnly = this.props.readOnly; return this.renderModal({ title: this.state.id ? 'Cập nhật đề tài' : 'Tạo mới đề tài', size: 'large', body: <div className='row'> <FormTextBox className='col-md-8' ref={e => this.tenSqd = e} label='Mô tả quyết định' placeholder={this.state.id ? '' : 'Duyệt đề tài'} readOnly={readOnly} disabled={!this.state.id} /> <FormTextBox className='col-md-4' ref={e => this.soQuyetDinh = e} label='Số quyết định' readOnly={readOnly} /> <FormTextBox className='col-md-12' ref={e => this.tenDeTai = e} label='Tên đề tài' readOnly={readOnly} /> <FormRichTextBox className='col-md-12' ref={e => this.ghiChu = e} label='Ghi chú đề tài' readOnly={readOnly} /> <FormRichTextBox className='col-md-12' ref={e => this.noiDung = e} label='Nội dung đề tài' readOnly={readOnly} /> {this.renderCbhdForm()} </div> }); }; } class sdhDeTai extends AdminPage { state = { filter: {}, isKeySearch: false, isCoDinh: false, isFixCol: false }; componentDidMount() { T.ready('/user/sau-dai-hoc', () => { this.getPage(); }); } onEdit = (e, item) => { e.preventDefault(); console.log(item); this.modal.show(item); } handleKeySearch = (data, pageNumber, pageSize, pageCondition) => { this.setState({ filter: { ...this.state.filter, [data.split(':')[0]]: data.split(':')[1] } }, () => { console.log(this.state.filter, 'filter2'); this.getPage(pageNumber, pageSize, pageCondition); }); } getPage = (pageN, pageS, pageC) => { let filter = { ...this.state.filter }; console.log(filter, 'filter'); this.props.getDeTaiPage(pageN, pageS, pageC, filter); } render() { const permission = this.getUserPermission('sdhDeTai'); console.log(this.props.sdhDeTai, 'sdsdcdcdcdcd'); const { pageNumber, pageSize, pageTotal, totalItem, pageCondition, newestSoQuyetDinh, list } = this.props.sdhDeTai?.page || { pageNumber: 1, pageSize: 25, pageTotal: 0, totalItem: 0, pageCondition: '', newestSoQuyetDinh: '', list: [] }; const onKeySearch = this.state.isKeySearch ? this.handleKeySearch : null; console.log(list, 'sdsdsds'); let table = renderDataTable({ className: this.state.isFixCol ? 'dsts table-fix-col' : 'dsts', data: list, getDataSource: () => list, stickyHead: this.state.isCoDinh, header: 'thead-light', empty: 'Chưa có dữ liệu', renderHead: () => ( <tr> <th style={{ width: 'auto', verticalAlign: 'middle' }} >#</th> <TableHead keyCol='mssv' content='MSSV' style={{ minWidth: '50px', whiteSpace: 'nowrap' }} onKeySearch={onKeySearch} /> <TableHead keyCol='hoTenSinhVien' content='Tên sinh viên' style={{ minWidth: '150px', whiteSpace: 'nowrap' }} onKeySearch={onKeySearch} /> <TableHead keyCol='tenDeTai' content='Tên đề tài' style={{ minWidth: '260px', whiteSpace: 'nowrap' }} onKeySearch={onKeySearch} /> <TableHead style={{ minWidth: '50px', verticalAlign: 'middle' }} content='Số quyết định' /> <TableHead content='Mã CBHD1' style={{ minWidth: '80px', whiteSpace: 'nowrap', textAlign: 'center', verticalAlign: 'middle' }} /> <TableHead content='Tên CBHD1' style={{ minWidth: '170px', whiteSpace: 'nowrap', textAlign: 'center', verticalAlign: 'middle' }} /> <TableHead content='Mã CBHD2' style={{ minWidth: '50px', whiteSpace: 'nowrap', textAlign: 'center', verticalAlign: 'middle' }} /> <TableHead content='Tên CBHD2' style={{ minWidth: '170px', whiteSpace: 'nowrap', textAlign: 'center', verticalAlign: 'middle' }} /> <TableHead style={{ width: 'auto', whiteSpace: 'nowrap', verticalAlign: 'middle' }} content='Thao tác' /> </tr> ), renderRow: (item, index) => ( <tr key={index}> <TableCell content={(pageNumber - 1) * pageSize + index + 1} /> <TableCell content={item.mssv ?? ''} /> <TableCell content={item.hoTenSinhVien ?? ''} /> <TableCell type='link' onClick={() => this.modal.show(item)} content={item.tenDeTai ?? ''} permission={permission} /> <TableCell content={item.soQuyetDinh ?? ''} /> <TableCell content={item.canBo[0]?.MSCB ?? ''} /> <TableCell content={item.canBo[0]?.hoTenCanBo ?? ''} /> <TableCell content={item.canBo[1]?.MSCB ?? ''} /> <TableCell content={item.canBo[1]?.hoTenCanBo ?? ''} /> <TableCell type='buttons' permission={{ ...permission }} onEdit={(e) => this.onEdit(e, item)} /> </tr> ) }); return this.renderPage({ icon: 'fa fa-list', title: 'Danh mục cấu trúc khung đào tạo', breadcrumb: [ <Link key={1} to='/user/sau-dai-hoc'>Sau đại học</Link>, 'Quản lý đề tài' ], content: <div className='p-2' style={{ background: 'white' }}> <div className='d-flex justify-content-between align-items-center'> <div style={{ gap: 10, display: 'inline-flex', width: '800px' }}> <FormCheckbox label='Tìm theo cột' onChange={value => this.setState({ isKeySearch: value })} ref={e => this.isKeySearch = e} style={{ marginBottom: '0' }} /> <FormCheckbox label='Cố định bảng' onChange={value => this.setState({ isCoDinh: value })} ref={e => this.isCoDinh = e} style={{ marginBottom: '0' }} /> <FormCheckbox label='Thao tác nhanh' onChange={value => this.setState({ isFixCol: value })} ref={e => this.isFixCol = e} style={{ marginBottom: '0' }} /> </div> <Pagination style={{ position: 'unset', justifyContent: 'end', marginBottom: '1rem' }} {...{ pageNumber, pageSize, pageTotal, totalItem, pageCondition }} getPage={this.getPage} /> </div> <div className='tile'>{table}</div> <EditModal ref={e => this.modal = e} readOnly={!permission.write} create={this.props.createSdhDeTai} newSoQuyetDinh={newestSoQuyetDinh} /> </div>, backRoute: '/user/sau-dai-hoc/topic-program', collapse: [ { icon: 'fa-plus-square', name: 'Tạo công trình cán bộ hướng dẫn', permission: permission.write, onClick: e => e.preventDefault() || this.modal.show(), type: 'info' }, // { icon: 'fa-cloud-upload', name: 'Import công trình cán bộ hướng dẫn', permission: permission.write, onClick: e => e.preventDefault() || this.uploadModal.show(), type: 'warning' }, // { icon: 'fa-file-text', name: 'Export công trình cán bộ hướng dẫn', permission: permission.export || permission.write, onClick: e => e.preventDefault() || this.exportCongTrinhCBHD(), type: 'danger' }, // { icon: 'fa-print', name: 'Export TuyenSinh', permission: permission.export || permission.write, onClick: e => e.preventDefault() || this.exportDSTuyenSinh(), type: 'primary' } ], }); } } const mapStateToProps = state => ({ system: state.system, sdhDeTai: state.sdh.sdhDeTai }); const mapActionsToProps = { getDeTaiPage, createSdhDeTai }; export default connect(mapStateToProps, mapActionsToProps)(sdhDeTai);
Editor is loading...
Leave a Comment