ttk-app-core/compatible/apps/scm/ttk-scm-incomeexpenses-setting/action.js

enterprise develop framework

import React from 'react'
import { action as MetaAction, AppLoader } from 'edf-meta-engine'
import {Icon, Tree, Form, Select, Switch} from 'edf-component'
import config from './config'
import renderColumns from './utils/renderColumns'
import extend from './extend'
import { fromJS } from 'immutable'

const Option = Select.Option
const FormItem = Form.Item

class action {
    constructor(option) {
        this.metaAction = option.metaAction
		this.extendAction = option.extendAction
		this.config = config.current
		this.webapi = this.config.webapi
    }

    onInit = ({ component, injections }) => {
        this.extendAction.gridAction.onInit({ component, injections })
        this.component = component
        this.injections = injections
        if (this.component.props.setOkListener) {
            this.component.props.setOkListener(this.onOk)
        }

        let addEventListener = this.component.props.addEventListener
        if (addEventListener) {
			addEventListener('onTabFocus', :: this.onTabFocus)
		}
        injections.reduce('init')

        this.load()
    }

    componentWillUnmount = () => {
        let removeEventListener = this.component.props.removeEventListener

        if (removeEventListener) {
            removeEventListener('onTabAdd')
        }
        if (window.removeEventListener) {
            window.removeEventListener('resize', this.onResize, false)
        } else if (window.detachEvent) {
            window.detachEvent('onresize', this.onResize)
        } else {
            window.onresize = undefined
        }
    }

    componentDidMount = () => {
        if (window.addEventListener) {
            window.addEventListener('resize', this.onResize, false)
        } else if (window.attachEvent) {
            window.attachEvent('onresize', this.onResize)
        } else {
            window.onresize = this.onResize
        }
    }

    onResize = (e) => {
        let keyRandomTab = Math.floor(Math.random() * 10000)
        this.keyRandomTab = keyRandomTab
        setTimeout(() => {
            if (keyRandomTab == this.keyRandomTab) {
                this.getTableScroll('ttk-scm-incomeexpenses-setting-table', 'ant-table-thead', 1, 'ant-table-body', 'data.tableOption', e)
            }
        }, 50)
    }

    getTableScroll = (contaienr, head, num, target, path, e) => {
        try {
            const tableCon = document.getElementsByClassName(contaienr)[0]
            if (!tableCon) {
                if (e) {
                    return
                }
                setTimeout(() => {
                    this.getTableScroll(contaienr, head, num, target, path)
                }, 100)
                return
            }
            const header = tableCon.getElementsByClassName(head)[0]
            const body = tableCon.getElementsByClassName(target)[0].getElementsByTagName('table')[0]
            const pre = this.metaAction.gf(path).toJS()
            const y = tableCon.offsetHeight - header.offsetHeight - num
            const bodyHeight = body.offsetHeight
            if (bodyHeight > y && y != pre.y) {
                this.metaAction.sf(path, fromJS({ ...pre, y }))
            } else if (bodyHeight < y && pre.y != null) {
                this.metaAction.sf(path, fromJS({ ...pre, y: null }))
            } else {
                return false
            }
        } catch (err) {
            console.log(err)
        }
    }

    load = async () => {
        const response = await this.webapi.incomeexpenses.queryCategory()
        this.injections.reduce('setTabs', response)
        if(response && response.length){
            let option = {
                parentId: response[0].id
            }
            this.metaAction.sf('data.loading', true)
            const list = await this.webapi.incomeexpenses.queryChild(option)
            this.metaAction.sf('data.loading', false)
            if(list){
                this.injections.reduce('load', list)
            }
        }
    }
	
	//当前app的 "tab被点击" (从其他app切换到当前app)
	onTabFocus = async (props) => {
		this.refresh()
    }
    
    //刷新列表
    refresh = async () => {
		let incomeexpensesTabId = this.metaAction.gf('data.other.incomeexpensesTabId')
        let option = {
            parentId: incomeexpensesTabId
        }
		this.metaAction.sf('data.other.loading', true)
		const res = await this.webapi.incomeexpenses.queryChild(option)
		this.metaAction.sf('data.other.loading', false)

		if (res) {
			this.injections.reduce('load', res)
		}
	}

    //列表展示
    tableColumns = () => {
        let tableList = this.metaAction.gf('data.other.tableList'),  //表格信息
            incomeexpensesTabId = this.metaAction.gf('data.other.incomeexpensesTabId')
        if(tableList){
            return renderColumns(tableList, incomeexpensesTabId, this)
        }
    }

    //收支类型页签切换
    incomeexpensesTabChange = async (path, value) => {
        let option = {
            parentId: value
        }
        const list = await this.webapi.incomeexpenses.queryChild(option)
        if(list){
            this.injections.reduce('update', {
                path: 'data.tableCheckbox',
                value: {
                    checkboxValue: [],
                    selectedOption: []
                }
            })
            this.injections.reduce('incomeexpensesTabChange', path, value, list)
            this.getTableScroll('ttk-scm-incomeexpenses-setting-table', 'ant-table-thead', 1, 'ant-table-body', 'data.tableOption')
        }
    }

    //表格复选框
    getRowSelection = () => {
        return undefined
    }

   //选择数据改变
   checkboxChange = (arr, itemArr) => {
        let newArr = []
        itemArr.map(item => {
            if(item){
                newArr.push(item.id)
            }
        })

        this.injections.reduce('update', {
            path: 'data.other.tableCheckbox',
            value: {
                checkboxValue: newArr,
                selectedOption: itemArr
            }
        })
        this.selectedOption = itemArr
    }

    //新增收支类型
    newClick = async (option) => {
        let incomeexpensesTabId = this.metaAction.gf('data.other.incomeexpensesTabId'),
            title = option.record ? '编辑收入类型' : '新增收入类型'
            if(incomeexpensesTabId == '4001001') {
                title = option.record ? '编辑费用类型' : '新增费用类型'
            }else if(incomeexpensesTabId == '3001002') {
                title = option.record ? '编辑收款类型' : '新增收款类型'
            }else if(incomeexpensesTabId == '3001001') {
                title = option.record ? '编辑付款类型' : '新增付款类型'
            }
        const ret =  await this.metaAction.modal('show', {
			title: title,
			wrapClassName: 'income-expenses-card',
			width: 400,
            okText: '确定',
            footer: '',
            bodyStyle: {padding: '10px 0'},
            closeModal: this.close,
			closeBack: (back) => { this.closeTip = back },
			children: this.metaAction.loadApp('scm-incomeexpenses-setting-card', {
                store: this.component.props.store,
                incomeexpensesTabId: incomeexpensesTabId,
                record: option.record ? option.record : undefined
			}),
        })
    }

    close = (ret) => {
		this.closeTip()
		if (ret) {
            this.getTableScroll('ttk-scm-incomeexpenses-setting-table', 'ant-table-thead', 1, 'ant-table-body', 'data.tableOption')
            this.refresh()
        }
	}

    //编辑
    modifyDetail = (text, record, index) => {
        this.newClick({text, record, index})
    }

    //删除
    delClick = async (text, record, index) => {
        let option = {}
        const ret = await this.metaAction.modal('confirm', {
			title: '删除',
			content: '确认删除?'
		})

		if (ret) {
            option.id = record.id
            option.ts = record.ts
			let response = await this.webapi.incomeexpenses.delete(option)
			if (response.message) {
				this.metaAction.toast('warn', response.message)
			} else {
				this.metaAction.toast('success', '删除成功')
            }
            this.getTableScroll('ttk-scm-incomeexpenses-setting-table', 'ant-table-thead', 1, 'ant-table-body', 'data.tableOption')
			this.refresh()
		}
    }

    delDaphClick = async () => {
        let incomeexpensesTabId = this.metaAction.gf('data.other.incomeexpensesTabId'),
            tableCheckbox = this.metaAction.gf('data.other.tableCheckbox').toJS(), 
            selectedRowsArr = []
        if(!tableCheckbox.selectedOption.length){
            let title = '收支类型'
            if(incomeexpensesTabId == '4001001') {
                title = '费用类型'
            }else if(incomeexpensesTabId == '3001002') {
                title = '收款类型'
            }else if(incomeexpensesTabId == '3001001') {
                title = '付款类型'
            }
            this.metaAction.toast('warning', `请选择${title}`)
            return
        }

        const ret = await this.metaAction.modal('confirm', {
			title: '删除',
			content: '确认删除?'
        })
        if(!ret) return
        tableCheckbox.selectedOption.map(item=>{
            selectedRowsArr.push({
                id: item.id,
                ts: item.ts
            })
        })

        let response = await this.webapi.incomeexpenses.deleteBatch(selectedRowsArr)
        if (response.fail && response.fail.length) {
            this.metaAction.toast('warn', this.getMessage(response.fail))
        } else {
            this.metaAction.toast('success', '删除成功')
        }
        this.getTableScroll('ttk-scm-incomeexpenses-setting-table', 'ant-table-thead', 1, 'ant-table-body', 'data.tableOption')
        this.refresh()
    }

    //批量删除提示信息
    getMessage = (fail) => {
        return <div>
            {
                fail.map(item => {
                    return <p>{item.message}</p>
                })
            }
        </div>
    }

    //是否启用
    checkedChange = async (e, text, record, index) => {
        record.isEnable = !record.isEnable
        let res = await this.webapi.incomeexpenses.update(record)
        if(res){
            this.injections.reduce("checkedChange", {value: e, text, res, index})
        }
    }

    //大类展示
    getLargeClassColumn = (text, record, index) => {
        const num = this.calcRowSpan(record.categoryId, 'categoryId', index)
        const obj = {
            children: (
                <span>{text}</span>
            ),
            props: {
                rowSpan: num,
            },
        }
        return obj
    }

    //编号
    getCode = (text, record, index) => {
        let _this = this
        if(record.isEnable){
            return <a onClick={function(){_this.modifyDetail(text, record, index)}}>{text}</a>
        }
        return <span className='no-enable'>{text}</span>
    }

    getOtherContent = (text, record, index) => {
        if(record.isEnable){
            return <span>{text}</span>
        }
        return <span className='no-enable'>{text}</span>
    }

    //操作展示
    getOperColumn = (text, record, index) => {
        let _this = this,
            other = this.metaAction.gf('data.other').toJS()
        return <div style={{textAlign: 'center', display: 'block'}}>
            <Icon type={record.isEnable ? "tingyong-" : "qiyong-"}
                fontFamily='edficon'
                disabled={!record.canDisable}
                title={record.isEnable ? "已启用" : "已停用"}
                style={{fontSize: 22, cursor: 'pointer', marginRight: '4px'}}
                onClick={function(e){record.canDisable ? _this.checkedChange(e, text, record, index) : null}} />
            <Icon type="bianji" 
                fontFamily='edficon'
                title="编辑"
                style={{fontSize: 23, cursor: 'pointer', marginRight: '4px'}}
                onClick={function(){_this.modifyDetail(text, record, index)}} />
            <Icon type="shanchu" 
                fontFamily='edficon' 
                title='删除'
                disabled = {!record.canDelete}
                style={{fontSize: 23, cursor: 'pointer'}}
                onClick={function(){record.canDelete ? _this.delClick(text, record, index) : null}} />
            
        </div>
    }

    //合并行的
    calcRowSpan = (text, columnKey, currentRowIndex) => {
        let tableList = this.metaAction.gf('data.other.tableList')
        if (!tableList) return
        const rowCount = tableList.size
        if (rowCount == 0 || rowCount == 1) return 1

        if (currentRowIndex > 0
            && currentRowIndex <= rowCount
            && text == tableList.getIn([currentRowIndex - 1, columnKey])) {
            return 0
        }

        var rowSpan = 1
        for (let i = currentRowIndex + 1; i < rowCount; i++) {
            if (text == tableList.getIn([i, columnKey]))
                rowSpan++
            else
                break
        }

        return rowSpan
    }
}

export default function creator(option) {
    const metaAction = new MetaAction(option),
		extendAction = extend.actionCreator({ ...option, metaAction }),
		o = new action({ ...option, metaAction, extendAction }),
		ret = { ...metaAction, ...extendAction.gridAction, ...o }
	
	metaAction.config({ metaHandlers: ret })
	
	return ret
}