ttk-app-core/compatible/apps/edf/edfx-business-subject-manage/action.js

enterprise develop framework

import React from 'react'
import { action as MetaAction, AppLoader } from 'edf-meta-engine'
import {Icon} from 'edf-component'
import config from './config'
import renderColumns from './utils/renderColumns'
import {Tree, Form, Select} from 'edf-component'
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()
       
    }
    scrollTable = () => {
        let scrollTop = document.getElementsByClassName('ant-table-body')[0].scrollTop
        // localStorage.setItem('scrollTop', JSON.stringify(scrollTop))
        this.scrollTop = scrollTop
    }
    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('edfx-business-subject-manage-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 (filterObj, props) => {
        let response,isReloadTree = true,resAccountList,pageArr,filter,influenceList,accountList,
        accessType, activeKey, resTreeList=[],resTreeListAll=[], expandedKeys=[], resTreeAll

        this.metaAction.sf('data.loading', true)
        if (filterObj) isReloadTree = filterObj.isReloadTree
        if(isReloadTree){  //初始化
            if(props && props.accessType) {
                accessType = props.accessType  
            }else if(props && props.openType == "menu"){
                accessType = '' 
            }else{
                accessType = this.component.props.accessType
            }
            if(accessType){
                resTreeList = await this.webapi.accountType.getAccountTree({businessCode: accessType}) 
            }else{
                resTreeListAll = await this.webapi.accountType.getAccountTree() 
            }
            if(resTreeList.length){
                activeKey = resTreeList[0].defaultChildrenId + ''  // 默认选中
                expandedKeys = [resTreeList[0].id+'']  // 默认展开
            }else if(resTreeListAll.length){
                activeKey = resTreeListAll[0].children[0].id + ''
                expandedKeys = [resTreeListAll[0].id+'']  
                resTreeList = resTreeListAll   
            }
            let reduceArr = {
                'data.other.resTreeList':  fromJS(resTreeList),
                'data.other.treeSelectedKey': fromJS([activeKey]),
                'data.other.expandedKeys': fromJS(expandedKeys)
            }
            this.injections.reduce('updateArr', reduceArr)
            filter = {
                entity:{
                    templateAccountTypeId: activeKey,
                    influenceValue: '',
                },
                page: {
                    currentPage: 1,
                    pageSize: 50
                }
            }
            this.injections.reduce('update', 'data.filter', filter)
            accountList = await this.webapi.accountType.queryPageByAccountType(filter)
            
            this.metaAction.sf('data.other.treeId', activeKey)
        }else{    
            resTreeList = this.metaAction.gf('data.other.resTreeList')
            if(filterObj.filter){
                // 修改分页
                filter = filterObj.filter
            }else{
                // 切换左侧树 或者 筛选
                filter = {
                    entity:{
                        templateAccountTypeId: filterObj.accountType,
                        influenceValue: filterObj.influenceValue
                    },
                    page: {
                        currentPage: 1,
                        pageSize: 50
                    }
                }
            }
            
            this.metaAction.sf('data.filter', fromJS(filter))
            accountList = await this.webapi.accountType.queryPageByAccountType(filter)
            this.metaAction.sf('data.other.treeId', filterObj.accountType)
            this.metaAction.sf('data.other.treeSelectedKey', fromJS([filterObj.accountType]))
        }
        
        if(accountList) {
            resAccountList = accountList.list
            influenceList = accountList.searchList
            pageArr = accountList.page
        }
        let resTableList = [], num
        resAccountList.map((item, index)=>{
            resTableList[index] = {}
            item.influenceList.map((v, i) => {
                num = 'influence'+i
                resTableList[index][num] = (resAccountList[index].influenceList)[i].influenceValue
            })
            resTableList[index]['key'] = index
            if(resAccountList[index].accountName){
                resTableList[index]['subject'] = resAccountList[index].accountCode +'-'+ resAccountList[index].accountName 
            }else{
                resTableList[index]['subject'] = ''
            }
            
        })
        response = {resTreeList, resAccountList, resTableList, filter, influenceList,pageArr}
	    if(response){
		    this.injections.reduce('load', response)
        }
        setTimeout(() => {  
            this.onResize()              
        }, 100)
        this.metaAction.sf('data.loading', false)
    }

    refresh = async (isChange) => {
        let resTreeList = this.metaAction.gf('data.other.resTreeList').toJS()
        let filter = this.metaAction.gf('data.filter').toJS()
        
        this.metaAction.sf('data.loading', true)
        let accountList = await this.webapi.accountType.queryPageByAccountType(filter)
        let pageArr = accountList.page, influenceList = accountList.searchList
        let resTableList = [], num

        let resAccountList = accountList.list
        resAccountList.map((item, index)=>{
            resTableList[index] = {}
            item.influenceList.map((v, i) => {
                num = 'influence'+i
                resTableList[index][num] = (resAccountList[index].influenceList)[i].influenceValue
            })
            resTableList[index]['key'] = index
            if(resAccountList[index].accountName){
                resTableList[index]['subject'] = resAccountList[index].accountCode +'-'+ resAccountList[index].accountName 
            }else{
                resTableList[index]['subject'] = '' 
            }
        })
        let response = {resTreeList, resAccountList, resTableList, filter, pageArr, influenceList}

        this.metaAction.sf('data.loading', false)
	    if(response){
		    this.injections.reduce('load', response)
        }
        if(!isChange){
            this.scrollTop = 0
            document.getElementsByClassName('ant-table-body')[0].scrollTop = this.scrollTop
        }
	}
	
	//当前app的 "tab被点击" (从其他app切换到当前app)
	onTabFocus = async (props) => {
        props = props.size? props.toJS() : props
        if((props && props.accessType) || (props && props.openType == "menu")){
            this.load(null, props)
        }else{
            this.refresh(true) 
        }
        document.getElementsByClassName('ant-table-body')[0].scrollTop = this.scrollTop
    }

    onExpand = (expandedKeys) => {
        this.metaAction.sf('data.other.expandedKeys', fromJS(expandedKeys))
    }
    //选择科目设置树
    selectType = (selectedKeys, info) => {
        if(info.selected == false) return
        if(info.selectedNodes[0] && info.selectedNodes[0].props.dataRef.children) return
            
        let accountType = info.selectedNodes[0] && info.selectedNodes[0].key;
        this.metaAction.sf('data.other.treeSelectedKey', fromJS([accountType]));
        
        // 切换左侧树，更新右边筛选框
        this.metaAction.sf('data.other.isSelected', false); 
        this.metaAction.sf('data.other.itemStr', fromJS(''))
        // 清空
        let influenceList = this.metaAction.gf('data.other.influenceList') 
        influenceList = influenceList.size ?  influenceList.toJS() : influenceList
        influenceList.map((item,index)=> {
            this.metaAction.sf('data.form.'+item.code+'.influenceName', '')
            this.metaAction.sf('data.form.'+item.code+'.influenceId', '')
        })
        
        let filterObj = {
                isReloadTree: false,
                accountType,
                influenceValue:'',
                noGetInfluence:false
            }
        this.load( filterObj)
        this.scrollTop = 0
        document.getElementsByClassName('ant-table-body')[0].scrollTop = this.scrollTop
    }

    refreshBtn = () => {
        this.refresh() 
    }

    //展示树
    renderTreeNodes = (data) => {
        if(!data) return <div></div>
        return data.map((item) => {
            if (item.children) {
                return (
                    <Tree.TreeNode title={item.name} key={item.id} dataRef={item}>
                        {this.renderTreeNodes(item.children)}
                    </Tree.TreeNode>
                )
            }
            return <Tree.TreeNode title={item.name} key={item.id} dataRef={item}/>
        })
    }

    influenceFactorSpan = (text, row, index) => {
        let obj 
        return obj = {
            children: <span title={text}>{text}</span>,
        }
    }

    subjectSpan = (text, row, index) => {
        let obj
        return obj = {
            children: <span title={text}>{text}</span>,
            props: { colSpan: 1 }
        }
    }

    handle = (text, row, index) => {
        const obj={           
            children: (
                <a href="javascript:;">                   
                    <Icon fontFamily="edficon" type='bianji' style={{fontSize:'24px'}} 
                        onClick={()=>{return this.openCard(text, row, index)}}></Icon> 
                </a>                  
            )
        }
        return obj
    }

    //分页修改
	pageChanged = async (currentPage, pageSize) => {
        let filter = this.metaAction.gf('data.filter').toJS()
        let resAccountList = this.metaAction.gf('data.other.list').toJS()
        let accountType = this.metaAction.gf('data.other.treeSelectedKey').toJS()[0];
        let page = this.metaAction.gf('data.page').toJS();
        let influenceValue = this.metaAction.gf('data.other.itemStr')

		if (pageSize == null || pageSize == undefined) {
			pageSize = this.metaAction.gf('data.page').toJS().pageSize
        }
        if(!influenceValue) influenceValue = ''
        filter = {
            page: {currentPage, pageSize},
            entity:{
                templateAccountTypeId: resAccountList[0].templateAccountTypeId,
                influenceValue:influenceValue
            }
        }
        let filterObj = {
            isReloadTree: false,
            accountType,
            filter,
            noGetInfluence: true
        }
        this.load( filterObj)
        this.scrollTop = 0
        document.getElementsByClassName('ant-table-body')[0].scrollTop = this.scrollTop
	}

    handleSelect = (arr) => {
        if (arr) {
            arr.unshift({ influenceValueId: 0, influenceValue: '全部' })
            return arr.map((item,index) => {
                if(item.influenceValue) return <Option value={item && item.influenceValue} title={item && item.influenceValue}>{item && item.influenceValue}</Option>
            })
        }
    }
    
    onFieldChange = (index, list) => (id) => {
        let storeField = list.influenceClassList
        this.metaAction.sf('data.other.isSelected',true)
        let value = storeField.filter(function(o){return o.influenceValue == id})[0]
        let path = 'data.form.'+list.code+'.influenceName'   
        let pathId = 'data.form.'+list.code+'.influenceId'    
        if (value) {
            this.metaAction.sf(path, fromJS(value.influenceValue))
            this.metaAction.sf(pathId, fromJS(value.influenceValueId))
        }

        let accountType = this.metaAction.gf('data.other.treeSelectedKey').toJS()[0];
        let influenceList = this.metaAction.gf('data.other.influenceList').toJS()
        let influenceValue = []
        if(influenceList.length) {
            length = influenceList.length
            influenceList.map((item,i)=> {
                if(index == i){
                    influenceValue.push(value.influenceValueId)
                }else {
                    let influence = item.code+'.influenceId' 
                    let str = this.metaAction.gf('data.form.'+influence)
                    influenceValue.push(str)
                }
            })
        }
        let itemStr, influenceArr=[]
        influenceValue.map((item, index)=> {
            if(item!=undefined && item!=0 && item!='') influenceArr.push(item)
        })
        if(influenceArr.length == 4){
            itemStr = influenceArr[0] +';'+ influenceArr[1] +';'+ influenceArr[2] +';'+ influenceArr[3]
        }else if(influenceArr.length == 3){
            itemStr = influenceArr[0] +';'+ influenceArr[1] +';'+ influenceArr[2]
        }else if(influenceArr.length == 2){
            itemStr = influenceArr[0] +';'+ influenceArr[1]
        }else if(influenceArr.length == 1){
            itemStr = influenceArr[0]
        }else{
            itemStr = ''
        }

        this.metaAction.sf('data.other.itemStr', fromJS(itemStr))
        let filter = {
            isReloadTree:false,
            accountType,
            influenceValue:itemStr,
            noGetInfluence: true
        }
        this.load( filter)
        this.scrollTop = 0
        document.getElementsByClassName('ant-table-body')[0].scrollTop = this.scrollTop
    }
    renderSelect = () => {
        let factorArr = [],factorItem, nameArr=[]
        let influenceList = this.metaAction.gf('data.other.influenceList')
        let isSelected = this.metaAction.gf('data.other.isSelected')

        if(influenceList){
            influenceList = influenceList.size ?  influenceList.toJS() : influenceList
            influenceList.map((item, index) => {
                let name = item.code+'.influenceName'  

                let influenceName = this.metaAction.gf('data.form.'+name)
                if(!isSelected) influenceName = ''
                factorItem = <FormItem label={item.name}>
                                <Select
                                    showSearch={true}
                                    filterOption={this.filterOption}
                                    value={influenceName ? influenceName : '全部'}
                                    onChange={this.onFieldChange( index, item)}
                                >
                                    {this.handleSelect(item.influenceClassList)}
                                </Select>
                            </FormItem>
                factorArr.push(factorItem)
            })
        }
        
        return factorArr
    }
    filterOption = (input, option) => {
		if (option && option.props && option.props.children) {
			return option.props.children.toLowerCase().indexOf(input.toLowerCase()) >= 0
		}
		return true
	}
    
    openCard = async (text, row, index) => {
        let influenceArr = [],influencetitArr = [], subject
        if('influence3' in row) influenceArr.push(row.influence3)
        if('influence2' in row) influenceArr.push(row.influence2)
        if('influence1' in row) influenceArr.push(row.influence1)
        if('influence0' in row) influenceArr.push(row.influence0) 

        let resAccountList = this.metaAction.gf('data.other.list').toJS()
        if(resAccountList){
            resAccountList[0].influenceList.map((item)=>{
                influencetitArr.push(item.influence)
            })
        }
        subject = row.subject 

        let {templateUserId, templateAccountTypeId, accountCode, influence, influenceValue, ts} = resAccountList[index]
        let glAccountId = ''
        if(resAccountList[index].glAccountId) glAccountId = resAccountList[index].glAccountId
        
        let treeId = this.metaAction.gf('data.other.treeId')
        
		const ret =  await this.metaAction.modal('show', {
			title: '影响因素',
			wrapClassName: 'asset-card',
			width: 400,
			okText: '确定',
			bodyStyle: {padding: '10px 24px'},
			children: this.metaAction.loadApp('edfx-business-subject-card', {
				store: this.component.props.store,
                initButtionValue:{
                    influencetitArr,
                    influenceArr,
                    subject,
                    templateUserId,
                    templateAccountTypeId,
                    accountCode,
                    influence,
                    influenceValue,
                    ts,
                    glAccountId
                }
			}),
        })
        if(ret){
            this.refresh(true) 
        }
    }

    tableColumns = () => {
        let arr
        let pams = [this.influenceFactorSpan, this.subjectSpan, this.handle]
        this.injections.reduce('normalSearchChange', {
            path: 'colSpan',
            value: 2
        })

        let tableList = this.metaAction.gf('data.other.list')   //表格信息
        let influenceLabel = this.metaAction.gf('data.other.influenceList')  // select-label
        if(tableList){
            return arr = renderColumns(influenceLabel,tableList, ...pams)
        }
    }
}

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
}