/*
 * Create:      柿子
 * CreateDate:  2024/01/09
 * Describe：   历史护理评估单
 * */
import React, { Component } from 'react';
import { Modal, Row, Col, Button, Tabs } from 'antd';
import { Util, dayFormat } from 'tools';
import store from 'store';
import moment from 'moment';
import RangeDatePicker from 'components/rangePicker/index';
import PublicTablePagination from 'pages/common/PubilcTablePagination';
import './style/index.less';

const { TabPane } = Tabs;

class HistoricalNursingAssessmentForm extends Component {
  constructor(props) {
    super(props);
    this.state = {
      userData: React.$getSessionData(),
      visible: false,
      rowData: {},
      totalWidth: 0,
      columns: [],
      tableData: [],
      loading: false,
      queryParams: {
        startDate: moment().format(dayFormat),
        endDate: moment().format(dayFormat)
      },
      activeKey: '1',
      detailTableData: [],
      detailTotalWidth: 0,
      detailColumns: [],
      detailLoading: false,
      tabList: [{
        title: '集团巡视单',
        componentName: 'AssessmentOfSelfCareAbility',
      }, {
        title: '生活自理能力评估',
        componentName: 'AssessmentOfSelfCareAbility',
      }, {
        title: '护理评估表',
        componentName: 'AssessmentOfSelfCareAbility',
      }, {
        title: '跌倒、坠床评估表',
        componentName: 'AssessmentOfSelfCareAbility',
      }, {
        title: '压创风险评估单',
        componentName: 'AssessmentOfSelfCareAbility',
      }],
    }
  };

  componentDidMount() {
    this.props && 'onRef' in this.props && this.props.onRef(this);
  };

  modifyVisible = (visible, rowData = {}) => {
    const { columns } = this.state;
    if (visible) {
      !(columns && columns.length > 0) && this.getTableColumns();
      this.getDetailTableColumns();
    }
    this.setState({ visible, rowData }, () => {
      visible && this.getTableData();
    });
  };

  // 获取列表表头数据
  getTableColumns = async () => {
    try {
      let data = {
        params: [{
          type: 'C',
          compontName: 'HistoricalNursingAssessmentForm',
        }]
      }
      let res = await React.$asyncPost(this, '01040073', data);
      let columns = res.result?.C || [];
      if (columns && columns.length > 0) {
        this.setState({
          columns,
          totalWidth: res.totalWidth
        })
      }
    } catch (error) {
      console.log(error)
    }
  };

  // 病区信息明细
  getTableData = async () => {
    try {
      this.setState({ loading: true });
      const { rowData } = this.state;
      let data = {
        params: [{
          ...rowData
        }]
      }
      let res = await React.$asyncPost(this, '123', data);
      let tableData = Util.addKeyValueToDataSource(res?.result || []);
      this.setState({ tableData, loading: false });
    } catch (error) {
      console.log(error);
      this.setState({ loading: false });
    }
  };

  // 日期修改
  handleRangeChange = (e, dataIndex) => {
    this.state.queryParams[dataIndex] = e;
    this.setState({});
  };

  handleTabChange = e => {
    this.setState({ activeKey: e }, () => {
      this.getDetailTableColumns();
    });
  };

  // 获取明细表头数据
  getDetailTableColumns = async () => {
    try {
      let { tabList, activeKey } = this.state;
      let detailColumns = [], detailTotalWidth = 0;
      let currentColumns = tabList[activeKey - 1]?.columns || [];
      let componentName = tabList[activeKey - 1]?.componentName || '';
      if (currentColumns && currentColumns.length > 0) {
        detailColumns = currentColumns;
        detailTotalWidth = tabList[activeKey - 1]?.totalWidth || 0;
      } else {
        let data = {
          params: [{
            type: 'C',
            compontName: componentName,
          }]
        }
        let res = await React.$asyncPost(this, '01040073', data);
        detailColumns = res.result?.C || [];
        detailTotalWidth = res?.totalWidth || 0;
        tabList[activeKey - 1].columns = detailColumns;
        tabList[activeKey - 1].totalWidth = detailTotalWidth;
      };
      if (detailColumns && detailColumns.length > 0) {
        this.setState({
          detailColumns,
          detailTotalWidth,
          detailCurrentComponentName: componentName
        });
      };
    } catch (error) {
      console.log(error)
    }
  };

  // 获取明细列表数据
  getDetailTableData = async () => {
    try {
      this.setState({ detailLoading: true });
      const { rowData } = this.state;
      let data = {
        params: [{
          ...rowData
        }]
      }
      let res = await React.$asyncPost(this, '123', data);
      let tableData = Util.addKeyValueToDataSource(res?.result || []);
      this.setState({ detailTableData: tableData, detailLoading: false });
    } catch (error) {
      console.log(error);
      this.setState({ detailLoading: false });
    }
  };

  render() {
    const { visible, tableData, totalWidth, columns, loading, queryParams, activeKey, detailTableData, detailTotalWidth, detailColumns, detailLoading, tabList, detailCurrentComponentName } = this.state;
    return (
      <Modal
        title="历史护理评估单"
        width="76vw"
        footer={null}
        bodyStyle={{ padding: 0 }}
        visible={visible}
        onCancel={() => this.modifyVisible(false)}
      >
        <Row className="table-body-height historical-nursing-assessment-form">
          <Col span={8} style={{ padding: '12px' }}>
            <div style={{ marginBottom: '12px' }} className="flex-align-items">
              <RangeDatePicker
                width="300px"
                label="就诊日期："
                isChange={true}
                format={dayFormat}
                endDate={queryParams['endDate']}
                startDate={queryParams['startDate']}
                endChange={(e) => this.handleRangeChange(e, 'endDate')}
                startChange={(e) => this.handleRangeChange(e, 'startDate')}
              />
              <Button type="primary" style={{ marginLeft: '12px' }} onClick={this.getTableData}>查询</Button>
            </div>
            <PublicTablePagination
              param={{
                y: store.getState().tableHeight.y - 100,
                height: store.getState().tableHeight.y - 50 + 'px',
                data: tableData, // 表格数据
                x: totalWidth, // 表格的宽度
                columns, // 表头配置
                loading: loading,
                componentName: 'HistoricalNursingAssessmentForm',
              }}
              getColumns={this.getTableColumns}
            />
          </Col>
          <Col span={16} style={{ padding: '6px 12px 0 0' }} className="hnaf-right">
            <Tabs type="card" activeKey={activeKey} onChange={this.handleTabChange}>
              {tabList && tabList.map((item, index) => {
                return (
                  <TabPane tab={item?.title || ''} key={String(index + 1)}></TabPane>
                )
              })}
            </Tabs>
            <PublicTablePagination
              param={{
                y: store.getState().tableHeight.y - 100,
                height: store.getState().tableHeight.y - 50 + 'px',
                data: detailTableData, // 表格数据
                x: detailTotalWidth, // 表格的宽度
                columns: detailColumns, // 表头配置
                loading: detailLoading,
                componentName: detailCurrentComponentName,
              }}
              getColumns={this.getDetailTableColumns}
            />
          </Col>
        </Row>
      </Modal>
    )
  }
};

export default HistoricalNursingAssessmentForm;