| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465 | import React from 'react';import { Icon, Button, Input, Spin, Table, message, Modal, Tabs, InputNumber, Checkbox, Select } from 'antd';import ajax from 'jquery/src/ajax/xhr.js';import $ from 'jquery/src/ajax';import './userList.less';const ListAdd = React.createClass({    getInitialState () {        return {            visible: false,            loading: false        };    },    showModal () {        this.setState({            visible: true,        });    },    handleCancel (e) {        this.setState({            visible: false,        });    },    handleOk () {        this.setState({            loading: true        });        $.ajax({            method: "post",            dataType: "json",            crossDomain: false,            url: globalConfig.context + "/api/admin/member/addGradeName",            data: {                gradeName: this.state.lvlName,                memberRank: this.state.level            },            success: function (data) {                if (data.error && data.error.length) {                    message.warning(data.error[0].message);                } else {                    message.success("添加成功!");                    this.state.visible = false;                    this.props.refresh(this.state.level);                }                this.setState({                    loading: false                })            }.bind(this),        });    },    render () {        const Option = Select.Option;        return (            <div className="patent-desc" style={{ float: 'right', marginRight: '20px' }}>                <Button type="primary" onClick={this.showModal}>添加新等级</Button>                <Modal maskClosable={false}                    title="新增用户等级"                    visible={this.state.visible}                    onCancel={this.handleCancel}                    afterClose={() => { this.state.lvlName = undefined; this.state.level = undefined }}                    width='400px'                    footer={[                        <Button key="submit" type="primary" loading={this.state.loading} onClick={this.handleOk}>提交</Button>,                        <Button key="back" onClick={this.handleCancel}>返回</Button>                    ]}                    className="admin-desc-content">                    <div className='orgAdd-input'>                        <span>会员等级名称:</span>                        <Input value={this.state.lvlName} style={{ width: '200px' }}                            onChange={(e) => { this.setState({ lvlName: e.target.value }); }} />                    </div>                    <div className='orgAdd-input'>                        <span>会员等级:</span>                        <Select value={this.state.level} style={{ width: 120 }}                            onChange={(e) => { this.setState({ level: e }) }}>                            <Option value="2">2</Option>                            <Option value="3">3</Option>                            <Option value="4">4</Option>                            <Option value="5">5</Option>                        </Select>                    </div>                </Modal>            </div>        );    }});const ListDelete = React.createClass({    getInitialState () {        return {            visible: false,            loading: false        };    },    showModal () {        this.setState({            visible: true,        });    },    handleCancel (e) {        this.setState({            visible: false,        });    },    handleOk () {        this.setState({            loading: true        });        $.ajax({            method: "post",            dataType: "json",            crossDomain: false,            url: globalConfig.context + "/api/admin/member/delGrade",            data: {                id: this.props.rid            },            success: function (data) {                if (data.error && data.error.length) {                    message.warning(data.error[0].message);                } else {                    message.success("删除成功!");                    this.state.visible = false;                    this.props.refreshForDel();                }                this.setState({                    loading: false                })            }.bind(this),        });    },    render () {        return (            <div className="patent-desc" style={{ float: 'right', marginRight: '20px' }}>                <Button type="ghost" onClick={this.showModal}>删除</Button>                <Modal maskClosable={false}                    title="删除用户等级"                    visible={this.state.visible}                    onCancel={this.handleCancel}                    width='400px'                    footer={[                        <Button key="submit" type="primary" loading={this.state.loading} onClick={this.handleOk}>提交</Button>,                        <Button key="back" onClick={this.handleCancel}>返回</Button>                    ]} >                    <div className="level-tabs-modal">                        <p>                            <Icon type="exclamation-circle-o" />                            <span> 确认要删除该用户等级吗?删除以后不可恢复!</span>                        </p>                    </div>                </Modal>            </div>        );    }});const SetContent = React.createClass({    getInitialState () {        return {            visible: false,            loading: false,            columns: [                {                    title: '会员时长',                    dataIndex: 'time',                    key: 'time',                    render: (text, record, index) => {                        return <div>                            <Input style={{ width: '80px' }}                                value={record.time}                                onChange={(e) => {                                    record.time = e.target.value;                                    this.setState({ dataSource: this.state.dataSource });                                }} />                            <span style={{ marginLeft: '10px' }}>个月</span>                        </div>                    }                }, {                    title: '金额',                    dataIndex: 'money',                    key: 'money',                    render: (text, record, index) => {                        return <div>                            <InputNumber step={0.01} min={0}                                value={record.money}                                onChange={(e) => {                                    record.money = e;                                    this.setState({ dataSource: this.state.dataSource });                                }} />                            <span style={{ marginLeft: '10px' }}>元</span>                        </div>                    }                }            ],            dataSource: [],            selectedRowKeys: []        };    },    componentWillMount () {        this.state.checked01 = this.props.business.checked01;        this.state.checked02 = this.props.business.checked02;        this.state.checked03 = this.props.business.checked03;        this.state.checked04 = this.props.business.checked04;        this.state.checked05 = this.props.business.checked05;        this.state.checked06 = this.props.business.checked06;        this.state.checked07 = this.props.business.checked07;        this.state.checked08 = this.props.business.checked08;        for (let item in this.props.cost) {            this.state.dataSource.push({                key: this.state.dataSource.length,                time: item,                money: this.props.cost[item]            })        }    },    remove () {        this.state.selectedRowKeys.sort((a, b) => { return b - a });        let theArr = this.state.dataSource.concat();        for (let idx = 0; idx < this.state.selectedRowKeys.length; idx++) {            let dataIndex = this.state.selectedRowKeys[idx];            theArr.map((item, index) => {                if (item.key === dataIndex) {                    theArr.splice(index, 1);                }            })        };        this.state.dataSource = [];        for (let i = 0; i < theArr.length; i++) {            let item = theArr[i];            this.state.dataSource.push({                key: i,                time: item.time,                money: item.money            })        };        this.setState({            dataSource: this.state.dataSource,            selectedRowKeys: []        });    },    addNew () {        this.state.dataSource.push({            key: this.state.dataSource.length,            time: '',            money: ''        });        this.setState({            dataSource: this.state.dataSource        })    },    submit () {        this.setState({ loading: true });        let theCost = {};        if (this.state.dataSource.length) {            for (let i = 0; i < this.state.dataSource.length; i++) {                let theMoney = this.state.dataSource[i].money;                let theTime = this.state.dataSource[i].time;                theCost[theTime] = theMoney;            }        };        $.ajax({            method: "post",            dataType: "json",            crossDomain: false,            url: globalConfig.context + "/api/admin/member/addBusinessAndCost",            data: {                id: this.props.rid,                business: JSON.stringify({                    "1008": this.state.checked08 ? "1" : "0",                    "1007": this.state.checked07 ? "1" : "0",                    "1006": this.state.checked06 ? "1" : "0",                    "1005": this.state.checked05 ? "1" : "0",                    "1004": this.state.checked04 ? "1" : "0",                    "1003": this.state.checked03 ? "1" : "0",                    "1002": this.state.checked02 ? "1" : "0",                    "1001": this.state.checked01 ? "1" : "0",                }),                cost: JSON.stringify(theCost)            },            success: function (data) {                if (data.error && data.error.length) {                    message.warning(data.error[0].message);                } else {                    message.success("保存成功!");                    this.state.visible = false                }                this.setState({                    loading: false                })            }.bind(this),        });    },    render () {        const rowSelection = {            type: 'checkbox',            selectedRowKeys: this.state.selectedRowKeys,            onChange: (selectedRowKeys, selectedRows) => {                this.setState({                    selectedRows: selectedRows,                    selectedRowKeys: selectedRowKeys                });            }        };        const hasSelected = this.state.selectedRowKeys.length > 0;        return (            <Spin spinning={this.state.loading}>                <div className="level-tabs">                    <div className="level-tabs-title">                        <span>会员等级费用设置</span>                        <Button style={{ background: "#ea0862", border: "none", color: "#fff" }}                            onClick={this.addNew}>添加<Icon type="plus" /></Button>                        <Button style={{ background: "#3fcf9e", border: "none", color: "#fff" }}                            disabled={!hasSelected}                            onClick={this.remove}>删除<Icon type="minus" /></Button>                    </div>                    <Table className="level-tabs-table no-all-select"                        columns={this.state.columns}                        dataSource={this.state.dataSource}                        pagination={false}                        rowSelection={rowSelection} />                    <div className="level-tabs-title">                        <span>会员等级增值服务设置</span>                    </div>                    <div>                        <div className="level-checkbox">                            <Checkbox checked={this.state.checked01}                                onChange={(e) => { this.setState({ checked01: e.target.checked }) }}>                                科技成果,专家信息定点推送                        </Checkbox>                        </div>                        <div className="level-checkbox">                            <Checkbox checked={this.state.checked02}                                onChange={(e) => { this.setState({ checked02: e.target.checked }) }}>                                查看专家的联系方式                        </Checkbox>                        </div>                        <div className="level-checkbox">                            <Checkbox checked={this.state.checked03}                                onChange={(e) => { this.setState({ checked03: e.target.checked }) }}>                                任何业务申请,付费业享受会员专属折扣                        </Checkbox>                        </div>                        <div className="level-checkbox">                            <Checkbox checked={this.state.checked04}                                onChange={(e) => { this.setState({ checked04: e.target.checked }) }}>                                一对一的技术经纪人服务,进行技术成果媒合服务                        </Checkbox>                        </div>                        <div className="level-checkbox">                            <Checkbox checked={this.state.checked05}                                onChange={(e) => { this.setState({ checked05: e.target.checked }) }}>                                一对一的科技咨询师服务                        </Checkbox>                        </div>                        <div className="level-checkbox">                            <Checkbox checked={this.state.checked06}                                onChange={(e) => { this.setState({ checked06: e.target.checked }) }}>                                一对一的专业技术顾问,搜集技术情报,提供研发高参                        </Checkbox>                        </div>                        <div className="level-checkbox">                            <Checkbox checked={this.state.checked07}                                onChange={(e) => { this.setState({ checked07: e.target.checked }) }}>                                免费参加现场业务培训会                        </Checkbox>                        </div>                        <div className="level-checkbox">                            <Checkbox checked={this.state.checked08}                                onChange={(e) => { this.setState({ checked08: e.target.checked }) }}>                                免前期费用做科技类扶持资金项目申报                        </Checkbox>                        </div>                    </div>                    <div className="level-tabs-save">                        <Button type="primary" onClick={this.submit}>保存</Button>                        <ListDelete rid={this.props.rid} refreshForDel={this.props.refreshForDel} />                    </div>                </div>            </Spin>        );    }});const LevelSet = React.createClass({    loadData (pageNo) {        this.setState({            loading: true        });        $.ajax({            method: "get",            dataType: "json",            crossDomain: false,            url: globalConfig.context + "/api/admin/member/selectMemberGrade",            data: {            },            success: function (data) {                let theArr = [];                if (data.error && data.error.length) {                    message.warning(data.error[0].message);                } else {                    for (let i = 0; i < data.data.length; i++) {                        let item = data.data[i];                        let theBusiness = {};                        theBusiness['checked01'] = (item.business && item.business['1001'] == 1 ? true : false);                        theBusiness['checked02'] = (item.business && item.business['1002'] == 1 ? true : false);                        theBusiness['checked03'] = (item.business && item.business['1003'] == 1 ? true : false);                        theBusiness['checked04'] = (item.business && item.business['1004'] == 1 ? true : false);                        theBusiness['checked05'] = (item.business && item.business['1005'] == 1 ? true : false);                        theBusiness['checked06'] = (item.business && item.business['1006'] == 1 ? true : false);                        theBusiness['checked07'] = (item.business && item.business['1007'] == 1 ? true : false);                        theBusiness['checked08'] = (item.business && item.business['1008'] == 1 ? true : false);                        theArr.push(                            <Tabs.TabPane tab={item.gradeName + '( Lv.' + item.memberRank + ' )'} key={item.memberRank}>                                <SetContent business={theBusiness} cost={item.cost || []} rid={item.id} refreshForDel={this.refreshForDel} />                            </Tabs.TabPane>                        )                    };                    this.setState({ tabPane: theArr })                }            }.bind(this),        }).always(function () {            this.setState({                loading: false            });        }.bind(this));    },    getInitialState () {        return {            tabPane: [],            activeKey: '1',            loading: false        };    },    componentWillMount () {        this.loadData();    },    refresh (e) {        this.state.activeKey = e;        this.loadData()    },    refreshForDel () {        this.state.activeKey = '1';        this.loadData();    },    tabChange (e) {        this.setState({ activeKey: e });    },    render () {        return (            <div className="user-content" >                <div className="content-title clearfix">                    <span>会员等级管理</span>                    <ListAdd refresh={this.refresh} />                </div>                <div>                    <Tabs activeKey={this.state.activeKey} onChange={this.tabChange}>                        {this.state.tabPane}                    </Tabs>                </div>            </div >        );    }});export default LevelSet;
 |