import {
    observable,
    action,
    computed
} from 'mobx';
import * as mobx from 'mobx';
import * as Api from '../apis/resource'; // 引入API接口文件
import {
    WeaForm,WeaTableNew
} from 'comsMobx';
import {
    Modal,
    message,
    Button
} from 'antd'
import {
	WeaSelect,
	WeaInputSearch,
	WeaLocaleProvider,
} from 'ecCom';
import {
    i18n
} from '../public/i18n';
import trim from 'lodash/trim';
import {getSecondPath} from '../util/index'
import cloneDeep from 'lodash/cloneDeep';


const toJS = mobx.toJS;
const {
    TableStore
} = WeaTableNew;
  
  
  export class ResourceStore {
    @observable tableStore = new TableStore();
    @observable topMenu = []
    @observable rightMenu = [];
    @observable condition = [];
    @observable searchCondition = [];
    @observable defaultCondition = [];
    @observable templates=[];
    @observable isEdit = true;
    @observable isNew = true;
    @observable isPanelShow = false; //高级搜索面板
    @observable form2 = new WeaForm();
    @observable form = new WeaForm();
    @observable lastName = '';
    @observable conditionNum = 8;
    @observable ids = ''; //选择行id
    @observable searchConditionLoading = true;
    @observable nEdialogTitle = '';
    @observable visible = false;
    @observable dialogLoading = true;
    @observable userId = '';
    @observable date = '';

    @observable defaultShowLeft = true;
    @observable companysId = 1
    @observable hasRight = '';

    @observable selectTreeNodeInfo;
  
  
    @action("列表") getTableInfo() {
        let params;
        this.tableStore = new TableStore();
        if (this.isEmptyObject(this.form2.getFormParams())) {
            params = {
                ...this.selectTreeNodeInfo,
                lastName: this.lastName
            };
        } else {
            params = {
                ...this.selectTreeNodeInfo,
                ...this.form2.getFormParams()
            };
        }
        Api.getSearchList(params).then(res => {
            if (res.code === 200) {
                res.data.datas && this.tableStore.getDatas(res.data.datas, 1);
            } else {
                message.warning(res.msg);
            }
        }, error => {
            message.warning(error.msg);
        })
    }

    @action("nodetree事件") doSearch(params) {
      this.selectTreeNodeInfo = params;
      this.getTableInfo();
    }

    @action("保存") save() {
        let params = {
            ...this.form.getFormParams()
        };
        this.form.validateForm().then(f => {
            if (f.isValid) {
                Api.add(params).then(response => {
                    return response.json()
                }).then(data => {
                    if (data.code === 200) {
                        message.success(data.msg);
                        this.getTableInfo();
                        this.setVisible(false);
                    } else {
                        message.warning(data.msg);
                    }
                }).catch(error => {
                    message.warning(error.msg);
                })
            } else {
                f.showErrors();
                this.setDate(new Date());
            }
        });
    }

    @action("新增表单") getForm() {
        let params = this.isNew ? {} : {
            id: this.userId
        }
        this.setDialogLoadingStatus(true);

        Api.getSchemeForm(params).then(res => {
            if (res.code === 200) {
                this.setDialogLoadingStatus(false);
                res.data.condition && this.setCondition(res.data.condition);
                res.data.condition && this.form.initFormFields(res.data.condition);
            } else {
                message.warning(res.msg);
            }
        }, error => {
            message.warning(error.msg);
        })

    }

    @action("高级搜索表单") getSearchCondition() {
        this.setScLoadingStatus(true);
        const params = {
            selectKeys:this.transfer.transferKeys
        }
        Api.getAdvanceSearchCondition(params).then(res => {
            if (res.code === 200) {
                this.setScLoadingStatus(false);
                res.data.conditions && this.setSearchCondition(res.data.conditions);
                res.data.defaultcondition && this.setDefaultCondition(res.data.defaultcondition);
                res.data.defaultcondition && this.form2.initFormFields(res.data.defaultcondition);
                res.data.templates && this.setTemplates(res.data.templates);
            } else {
                message.warning(res.msg);
            }
        }, error => {
            message.warning(error.msg);
        })
    }


    @action("顶部按钮") getHasRight() {
        Api.getHasRight().then(res => {
            if (res.code === 200) {
                this.setHasRight(res.data.hasRight);
                res.data.rightMenu && this.setRightMenu(res.data.rightMenu);
                res.data.topMenu && this.setTopMenu(res.data.topMenu);
            } else {
                message.warning(res.msg);
            }
        }, error => {
            message.warning(error.msg);
        })
    }

    @action("导出") export(){
        const params = {
            ...this.form.getFormParams()
        }
        Api.exportResource(toJS(this.tableStore.selectedRowKeys).toString());
        this.tableStore.selectedRowKeys = [];
    }

    @action("另存为版本") version(id) {
        Api.version({id:id}).then(res => {
          if (res.code === 200) {
            message.success(res.msg);
          } else {
            message.warning(res.msg);
          }
        }, error => {
          message.warning(error.msg);
        })
    }


    /** ====================================================================================== */
    @observable searchDialog = {
		visible: false,
		title: '常用条件定制',
	}

    SEARCHDIALOG = {
		hasScroll: false,
		icon: 'icon-coms-hrm',
		iconBgcolor: '#217346',
		onCancel: () => this.closeSearchDialog(),
		style: {
			width: 700,
			height: 450
		},
		moreBtn: {
			datas: []
		},
		buttons: [<Button type='primary' onClick={()=>this.saveHrmSearchUserDefine()}>保存</Button>],
	}


    TRANSFER = {
		height: 350,
		renderItem: (items) => this.renderItem(items),
		filterLeft: (items) => this.filterLeft(items),
		filterRight: (items) => this.filterRight(items),
		onChange: (v) => this.updateTransferKeys(v)
	}

    @observable transfer = {
		transferDatas: [],
		transferKeys: [],
		transferOptions: [],
		transferSelectedKey: '0',
		transferleftIptVal: '',
		transferRightIptVal: ''
	}

    @action("常用条件定制保存") saveHrmSearchUserDefine = () => {
        this.closeSearchDialog();
        this.getSearchCondition();
    }

    @action("常用条件定制") formatTransfer = () => {
		const transferDatas = []
		const transferKeys = []
		const transferOptions = [{
			key: "",
			showname: ""
		}]
		this.transfer.transferSelectedKey = '0';
		this.transfer.transferleftIptVal = '';
		this.transfer.transferRightIptVal = '';
		this.searchCondition.forEach((c, idx) => {
			transferOptions.push({
				key: `${idx}`,
				showname: c.title,
			})
			c.items.forEach((i) => {
				transferDatas.push({
					id: i.domkey[0],
					label: i.label,
					title: c.title,
					idx: `${idx}`
				})
			})
		})
		this.defaultCondition.forEach((c, idx) => {
			c.items.forEach((i) => {
				transferKeys.push(i.domkey[0]);
			})
		})
		this.transfer.transferDatas = transferDatas;
		this.transfer.transferKeys = transferKeys;
		this.transfer.transferOptions = transferOptions;
	}

    inputSearchStyle = {
        width:"105px",
        float:"right",
        marginTop:"5px",
        marginLeft:"10px"
    }
    selectStyle={
        marginTop:"-1px",
        width:"85px",
        float:"right"
    }
	@computed get leftHeader() {
		const {
			transferleftIptVal,
			transferOptions,
			transferSelectedKey
		} = this.transfer;
		return (
			<div className="trasfer-header">
	          <span>待选</span>
	          <WeaInputSearch
                style={this.inputSearchStyle}
	            value={transferleftIptVal}
	            onSearchChange={this.updateTransferleftIptVal}
	          />
	          <WeaSelect
                style={this.selectStyle}
	            options={transferOptions}
	            value={transferSelectedKey}
	            onChange={this.updateTransferSelectedKey}
	          />
	        </div>
		)
	}

	@computed get rightHeader() {
		const {
			transferRightIptVal
		} = this.transfer;
		return (
			<div className="trasfer-header">
              <span>已选</span>
              <WeaInputSearch
                style={this.inputSearchStyle}
                value={transferRightIptVal}
                onSearchChange={ this.updateTransferRightptVal}
              />
            </div>
		)
	}
    renderItem = (item) => {
		const {
			label,
			title
		} = item;
		return (<div className="trasfer-list-item" style={{"padding":"10px 20px","borderBottom":"1px solid #ddd"}}>
		      <div className="top text-overflow" style={{"marginBottom":"4px"}} title={label}>{label}</div>
		      <div className="bottom text-overflow" style={{"color":"#999"}} title={title}>{title}</div>
		    </div>)
	};

    filterLeft = (items) => {
		let leftItems = cloneDeep(items);
		const {
			transferleftIptVal,
			transferSelectedKey
		} = this.transfer;
		if (transferSelectedKey) {
			leftItems = leftItems.filter((item) => item.idx == transferSelectedKey)
		}
		if (trim(transferleftIptVal)) {
			leftItems = leftItems.filter((item) => item.label.indexOf(trim(transferleftIptVal)) > -1)
		}
		return leftItems
	}

	filterRight = (items) => {
		let rightItems = cloneDeep(items);
		const {
			transferRightIptVal
		} = this.transfer;
		if (trim(transferRightIptVal)) {
			rightItems = rightItems.filter((item) => item.label.indexOf(trim(transferRightIptVal)) > -1)
		}
		return rightItems
	}

    @action("穿梭框变化回调") updateTransferKeys = (v) => {
		this.transfer.transferKeys = v;
	}

    @action updateTransferleftIptVal = (v) => {
		this.transfer.transferleftIptVal = v;
	}

	@action updateTransferSelectedKey = (v) => {
		this.transfer.transferSelectedKey = v;
	}

	@action updateTransferRightptVal = (v) => {
		this.transfer.transferRightIptVal = v;
	}



    @action openSearchDialog = () => {
		this.searchDialog.visible = true;
        this.formatTransfer();

	}

	@action closeSearchDialog = () => {
		this.searchDialog.visible = false;
	}




    updateFields(val) {
        this.form2.updateFields({
            lastName: {
                value: val
            }
        });
    }

    setSearchCondition(condition) {
        this.searchCondition = condition;
    }

    setDefaultCondition(defaultcondition) {
        this.defaultCondition = defaultcondition;
    }

    setTemplates(templates) {
        this.templates = templates;
    }

    setScLoadingStatus(bool) {
        this.searchConditionLoading = bool;
    }

    setPanelStatus(bool) {
        this.isPanelShow = bool;
        bool && this.getSearchCondition();
        if (!bool) {
            this.scLoadingReset();
        }
    }

    setLastName(val) {
        this.lastName = val;
    }

    isEmptyObject(obj) {
        for (let key in obj) {
            return false;
        }
        return true;
    }

    setIds(ids) {
        this.ids = ids;
    }

    scLoadingReset() {
        this.searchConditionLoading = true;
    }


    formReset() {
        this.form = new WeaForm();
    }

    dialogLoadingReset() {
        this.dialogLoading = true;
    }

    setVisible(bool) {
        this.visible = bool;
        this.formReset();
        !bool && this.dialogLoadingReset();
    }

    setDialogLoadingStatus(bool) {
        this.dialogLoading = bool;
    }

    setNeDialogTitle(title) {
        this.nEdialogTitle = title;
    }

    setIsNew(bool) {
        this.isNew = bool;
    }

    setCondition(condition) {
        this.condition = condition;
    }

    setUserId(userId) {
        this.userId = userId;
    }

    setDate(date) {
        this.date = date;
    }

    setTopMenu(topMenu) {
        this.topMenu = topMenu;
    }

    setRightMenu(rightMenu) {
        this.rightMenu = rightMenu;
    }

    setHasRight(bool) {
        this.hasRight = bool;
    }
  
  }