ncpub-multipage-demo-2005/src/ssctpaaa/dooroad/businessSysRegis/config/index.js

/*FDKFkr+TYgGKTTudQv9suM5TObrl0kaUnLjqLMCkTsQ=*/
import React, { Component } from 'react';
import ReactDOM from 'react-dom';
import { createPage, toast, } from "nc-lightapp-front";
import initTemplate from "./events/initTemplate.js";
import BillListStyle from 'ssccommon/components/bill-list';
import BusinessSysRegisModal from './modal.js'
import {
  asyncQry,
  asyncSave,
  asyncAdd,
  asyncDel,
} from './events/async.js'

class BusinessSysRegis extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showModal: false, // 显示弹窗
      multiLang: {}, // 多语
      modalStatu: 'add', // 弹窗状态 增加/修改
    };

    initTemplate.call(this, props);
  }

  componentDidMount() {
    // 浏览器原生提示
    window.onbeforeunload = () => {
      if (this.state.showModal) return ''
    }
  }

  // 头部按钮组事件
  headerBtnEventDistribute = () => ({
    Add: () => this.setState({showModal: true, modalStatu: 'add'}),
  })

  // 弹窗隐藏
  onHide = () => {
    this.props.form.EmptyAllFormValue('ssctp_ots_form')
    this.setState({showModal: false})
  }

  // 保存
  modalSave = async () => {
    const {
      props: {
        form: { getAllFormValue, isCheckNow, },
        table: { setAllTableData, },
      },
      state: { modalStatu, multiLang,},
    } = this

    if (!isCheckNow('ssctp_ots_form')) return // 表单校验

    if (modalStatu === 'add') {
      const response = await asyncAdd({
        ssctp_ots_form: getAllFormValue('ssctp_ots_form'),
      })
      const {success, data} = response
      if (!success || !data) return
      setAllTableData('ssctp_ots_list', data.ssctp_ots_list)
      this.setState({showModal: false}) 
      toast({ title: multiLang['701010DOOROAD-016'], duration: 5})
    } else {
      const response = await asyncSave({
        ssctp_ots_form: getAllFormValue('ssctp_ots_form'),
      })
      const {success, data} = response
      if (!success || !data) return
      setAllTableData('ssctp_ots_list', data.ssctp_ots_list)
      this.setState({showModal: false}) 
      toast({ title: multiLang['701010DOOROAD-016'], duration: 5})
    }
  }

  // 列表查询
  listQry = async (isRefresh = false) => {
    const response = await asyncQry()
    const {success, data} = response
    if (!success) return
    this.props.table.setAllTableData('ssctp_ots_list', data ? data.ssctp_ots_list : {rows: []})
    if (isRefresh) {
      toast({title: this.state.multiLang['701010DOOROAD-022'], duration: 5})
    }
  }

  // 修改
  setRowEditable = values => {
    this.setState({showModal: true, modalStatu: 'edit'})
    this.props.form.setFormItemsDisabled('ssctp_ots_form', { 'code': true });
    this.props.form.setAllFormValue({ssctp_ots_form: {rows: [{values}]}})
  }

  // 删除
  delRow = async (record, idx) => {
    const values = {}
    for (let attr in record) {
      if (attr !== 'numberindex' && attr !== 'key' && typeof record[attr] === 'object') {
        values[attr] = { value: record[attr].value }
      }
    }
    const response = await asyncDel({ssctp_ots_list: {areaType: 'form', rows: [{values}]}})
    const {success, data} = response
    if (!success) return
    this.props.table.setAllTableData('ssctp_ots_list', data ? data.ssctp_ots_list : {rows: []})
    toast({ title: this.state.multiLang['701010DOOROAD-017'], duration: 5})
  }

  // 刷新
  refreshButtonEvent = () => {
    this.listQry(true)
  }

  render() {
    const {
      state: {
        multiLang,
      },
      props: {
        getSearchParam,
        table: { createSimpleTable, },
      },
      headerBtnEventDistribute,
      onHide,
      modalSave,
      refreshButtonEvent,
    } = this

    return (
      <BillListStyle {...this.props}>

        <BillListStyle.HeadArea
          title={getSearchParam('n') || multiLang['701010DOOROAD-001']}
          refreshButtonEvent={refreshButtonEvent}
          status={'browse'}
        >
          {/* 头部按钮组 */}
          <BillListStyle.ButtonGroup
            area={'head_btnArea'}
            buttonEvent={headerBtnEventDistribute}
          />
        </BillListStyle.HeadArea>

        <BillListStyle.BodyArea>
          {/* 列表 */}
          {createSimpleTable(
            'ssctp_ots_list',
            {
              showIndex: true,
            },
          )}
        </BillListStyle.BodyArea>

        <BusinessSysRegisModal
          onHide={onHide}
          modalSave={modalSave}
          {...this.props}
          {...this.state}
        />

      </BillListStyle>
    );
  }
}

BusinessSysRegis = createPage({ mutiLangCode: '7010' })(BusinessSysRegis);
ReactDOM.render(<BusinessSysRegis/>, document.querySelector("#app"));

/*FDKFkr+TYgGKTTudQv9suM5TObrl0kaUnLjqLMCkTsQ=*/