@beisen-phoenix/lookup/examples/advancedModal/index.js

---

import React, { Component } from 'react';
import ReactDOM from 'react-dom';
import Lookup from '../../src/index';
import Button from '@beisen-phoenix/button';
import Layer from '@beisen-phoenix/unmodeled-layer';
import { fields, columns, options, options1, selectOption, tableData, advanceParam, options50 } from './mock/data';


export default class extends Component {


    constructor (props) {
        super(props);
        this.state = {
            visible: false,
            visibledx: false
        }
    }

    onOk () {
        alert()
    }

    callVisible = () => {
        this.setState({visible: false})
    }

    callVisibledx = () => {
        this.setState({visibledx: false})
    }


    getLook = () => {
        let advanceParam = {
            tableMeta: {
                columns: columns,
                dataSource: tableData,
                pagination:{
                    pageSize: 15
                }
            },
            searchFormMeta: {
                fields: fields
            }
        }

        return <Lookup
            //mode={'advanced'}
                isAvator={true}
                multiple={false}
                options={options}
                onConfirm={(data) => {
                    this.callVisible()
                    console.log(data)
                }}
                onVisibleChange={this.callVisible}
                isAdvanceVbl={true}
                selectValue={selectOption}
                advanceParam={advanceParam}
            />
    }

    getLookdx = () => {
        let advanceParam = {
            tableMeta: {
                columns: columns,
                dataSource: tableData,
                pagination:{
                    pageSize: 15
                }
            },
            searchFormMeta: {
                fields: fields
            },
            maxSize: 20
        }

        return <Lookup
            //mode={'advanced'}
            isAvator={true}
            multiple={true}
            options={options}
            onConfirm={(data) => {
                this.callVisibledx()
                console.log(data)
            }}
            onVisibleChange={this.callVisibledx}
            isAdvanceVbl={true}
            selectValue={selectOption}
            advanceParam={advanceParam}
        />
    }

    render () {
        let defaultValue = {id:'',value:'qqqqqq'}

        return (
            <div style={{'fontSize': '12px','display': 'flex', 'textAlign': 'center',flexWrap: 'wrap'}}>
              <div style={{ width: '200px',height: '300px',padding: '50px 220px 50px 50px'}}>
                  <Layer
                      extraCls="unmodeled-layer-lookup"
                      trigger={['click']}
                      size={'large'}
                      visible={this.state.visible}
                      onVisibleChange={(visible) =>{
                          this.setState({visible: visible})
                      }}
                      content={this.getLook()}
                      footer={null}
                      onOk={this.onOk.bind(this)}
                  >
                  <Button>高级模式弹层单选</Button>
                  </Layer>
              </div>

                <div style={{ width: '200px',height: '300px',padding: '50px 220px 50px 50px'}}>
                    <Layer
                        extraCls="unmodeled-layer-lookup"
                        trigger={['click']}
                        size={'large'}
                        visible={this.state.visibledx}
                        onVisibleChange={(visible) =>{
                            this.setState({visibledx: visible})
                        }}
                        content={this.getLookdx()}
                        footer={null}
                        onOk={this.onOk.bind(this)}
                    >
                        <Button>高级模式弹层多选</Button>
                    </Layer>
                </div>
            </div>
        )
  }
}