/*
 * Creator:     ML
 * CreatDate:   2020-04-29
 * descripts：  居民健康管理 图表 echarts  工作量统计
 * */
import React from 'react';
import moment from 'moment';
import { dayFormat } from 'tools/index';
import { Form, Col, Select, Icon, Button, Card, Row, Table, Typography, message } from 'antd';
import { $http } from 'containers/config/https';
import { Chart, Geom, Axis, Coord, Label, Legend, Tooltip, Guide, Shape, G2, Util, Facet } from 'bizcharts';
import DataSet from "@antv/data-set";
const { DataView } = DataSet;
const { Text } = Typography;
//组件const
const Option = Select.Option;
const padding = {
    padding: "0px"
}
const formItemLayout = { // label 和input宽度
    labelCol: { span: 3 },
    wrapperCol: { span: 20 }
}
const formItemLayouts = {
    labelCol: { span: 7 },
    wrapperCol: { span: 17 }
}
const columnsSeting = [
    {
        key: "0",
        title: "设置统计维度",
        dataIndex: 'condition',
        align: 'left',
        minWidth: 120
    }
]
const columnsOne = [
    {
        key: "0",
        title: '责任医生',
        dataIndex: 'docDesc',
        align: "center",
        width: 100
    },
    {
        key: "3",
        title: '咨询总次数',
        dataIndex: 'docNum',
        align: "center",
        width: 100
    },
    {
        key: "2",
        title: '未处理次数',
        dataIndex: 'undisposeNum',
        align: "center",
        width: 100
    },
    {
        key: "1",
        title: '处理次数',
        dataIndex: 'disposeNum',
        align: "center",
        width: 100
    },
];
const columnsOneBb = [
    {
        key: "0",
        title: '责任医生',
        dataIndex: 'docDesc',
        align: "center",
        width: 100
    },
    {
        key: "1",
        title: '就诊人次(有效)',
        dataIndex: 'admEffectNum',
        align: "center",
        width: 100
    },
    {
        key: "2",
        title: '就诊人次(无效)',
        dataIndex: 'admIneffectNum',
        align: "center",
        width: 100
    },
];
const dataTableOneB = [{
    condition: "就诊人数（有效）",
    key: "1",
}, {
    condition: "就诊人次（无效）",
    key: "2",
},]
const dataTableOne = [{
    condition: "咨询总次数",
    key: "3",
}, {
    condition: "未处理次数",
    key: "2",
}, {
    key: "1",
    condition: '处理次数',
},
]
const dataTableTwo = [{
    condition: "咨询总次数",
    key: "3",
}, {
    condition: "未处理次数",
    key: "2",
}, {
    key: "1",
    condition: '处理次数',
},
]
const columnsThree = [
    {
        key: "0",
        title: '专科医生',
        dataIndex: 'docDesc',
        align: "center",
        width: 100
    },
    {
        key: "1",
        title: '就诊人数（有效）',
        dataIndex: 'admEffectNum',
        align: "center",
        width: 100
    },
    {
        key: "2",
        title: '就诊人次（无效）',
        dataIndex: 'admIneffectNum',
        align: "center",
        width: 100
    },
];
const dataTableThree = [{
    condition: "就诊人数（有效）",
    key: "1",
}, {
    condition: "就诊人次（无效）",
    key: "2",
},]
const dataTableFour = [{
    condition: "咨询总次数",
    key: "3",
}, {
    condition: "未处理次数",
    key: "2",
}, {
    key: "1",
    condition: '处理次数',
},
]
const columnsFour = [
    {
        key: "0",
        title: '护士',
        dataIndex: 'docDesc',
        align: "center",
        width: 100
    },
    {
        key: "3",
        title: '咨询总次数',
        dataIndex: 'docNum',
        align: "center",
        width: 100
    },
    {
        key: "2",
        title: '未处理次数',
        dataIndex: 'undisposeNum',
        align: "center",
        width: 100
    },
    {
        key: "1",
        title: '处理次数',
        dataIndex: 'disposeNum',
        align: "center",
        width: 100
    },

];
const columnsTwo = [
    {
        key: "0",
        title: '责任医生',
        dataIndex: 'docDesc',
        align: "center",
        width: 100
    },
    {
        key: "3",
        title: '咨询总次数',
        dataIndex: 'docNum',
        align: "center",
        width: 100
    },
    {
        key: "2",
        title: '未处理次数',
        dataIndex: 'undisposeNum',
        align: "center",
        width: 100
    },
    {
        key: "1",
        title: '处理次数',
        dataIndex: 'disposeNum',
        align: "center",
        width: 100
    },

];

class AnalysisChartsWork extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            chartsData: [], //饼、柱图的详情数据
            tableOneData: [],
            tableTwoData: [],
            originDoctor: [],
            tableFourData: [],
            MBIData: [],
            originBMI: [],
            ageData: [],
            originAge: [],
            doctorCsTwo: [],
            doctorCsThree: [],
            doctorActive: 1,

            doctorToData: [],
            doctorOne: [],
            originOne: [],
            doctorToCs: [],

            // originTwo:[],

            originTwo: [],
            doctorTwo: [],
            doctorstaTwo: [],

            tableOneBData: [],
            originOneB: [],
            doctorOneB: [],
            doctorstaOneB: [],

            tableThreeData: [],
            originThree: [],
            doctorThree: [],
            doctorstaThree: [],

            tableFourData: [],
            originFour: [],
            doctorFour: [],
            doctorstaFour: [],

            showOne: false,
            showTwo: false,
            showThree: false,
            showFour: false,
            dataTableOne: [],
            dataTableOneB: [],
            dataTableTwo: [],
            dataTableFour: [],
            selectedRowKeys_rightOne: [],
            selectedRowKeys_rightOneB: [],
            selectedRowKeys_rightTwo: [],
            selectedRowKeys_rightThree: [],
            selectedRowKeys_rightFour: [],
            columnsO: columnsOne,
            columnsTw: columnsTwo,
            columnsT: columnsThree,
            columnsF: columnsFour,
            columnsOneB: columnsOneBb,
            doctorActiveB: "1",
            twoBCount:0
        };
    }

    componentWillReceiveProps(nextProps) {
    }



    componentDidMount = () => {
        this.getAllData()
        this.props.onRefWork(this)
    }



    //获取数据
    getAllData = () => {
        const arr = [
            {
                title: "全科医生工作量",
                key: 0,
                des: "zeren",
                type: "tabge",
                pie: [
                    {
                        descripts: "表格",
                        id: 1,
                        type: "tabge",
                        activeID: 1
                    },
                    {
                        descripts: "柱形",
                        id: 2,
                        type: "pi",
                        activeID: 1
                    },
                    {
                        descripts: "折线图",
                        id: 3,
                        type: "point",
                        activeID: 1
                    }, {
                        descripts: "饼状图",
                        id: 4,
                        type: "pie",
                        activeID: 1
                    }
                ]
            }, {
                title: "社工工作量",
                key: 1,
                des: "BMI",
                type: "tabge",
                pie: [
                    {
                        descripts: "表格",
                        id: 1,
                        type: "tabge",
                        activeID: 1
                    },
                    {
                        descripts: "柱形",
                        id: 2,
                        type: "pi",
                        activeID: 1
                    },
                    {
                        descripts: "折线图",
                        id: 3,
                        type: "point",
                        activeID: 1
                    }, {
                        descripts: "饼状图",
                        id: 4,
                        type: "pie",
                        activeID: 1
                    },
                ]
            }, {
                title: "专科医生工作量",
                key: 2,
                des: "age",
                type: "tabge",
                pie: [
                    {
                        descripts: "表格",
                        id: 1,
                        type: "tabge",
                        activeID: 1
                    },
                    {
                        descripts: "柱形",
                        id: 2,
                        type: "pi",
                        activeID: 1
                    },
                    {
                        descripts: "折线图",
                        id: 3,
                        type: "point",
                        activeID: 1
                    }, {
                        descripts: "饼状图",
                        id: 4,
                        type: "pie",
                        activeID: 1
                    },
                ]
            }, {
                title: "护士工作量",
                key: 3,
                des: "sex",
                type: "tabge",
                pie: [
                    {
                        descripts: "表格",
                        id: 1,
                        type: "tabge",
                        activeID: 1
                    },
                    {
                        descripts: "柱形",
                        id: 2,
                        type: "pi",
                        activeID: 1
                    },
                    {
                        descripts: "折线图",
                        id: 3,
                        type: "point",
                        activeID: 1
                    }, {
                        descripts: "饼状图",
                        id: 4,
                        type: "pie",
                        activeID: 1
                    },
                ]
            },
        ]
        this.setState({
            arr,
        })
    }
    //医生工作量 就诊
    getToHosData = (toHospData, ) => {
        // console.log("toHospData------",toHospData)
        let arr = [...toHospData.data, { docDesc: "总计", admEffectNum: toHospData.admEffectCount || 0, admIneffectNum: toHospData.admIneffectCount || 0, }]
        console.log("toHospDatatoHospData", toHospData)
        this.setState({
            tableOneBData: arr,
            originOneB: toHospData.data,
            doctorOneB: toHospData.staData,
            doctorstaOneB: toHospData.staData,
            oneBCount: toHospData.totalCount,

        })
    }
    getToHosdataOne = (toZKData) => {
        // console.log("toZKData----",toZKData)
        let arr1 = [...toZKData.data, { docDesc: "总计", admEffectNum: toZKData.admEffectCount || 0, admIneffectNum: toZKData.admIneffectCount || 0, }]
        this.setState({
            tableThreeData: arr1,
            originThree: toZKData.data,
            doctorThree: toZKData.staData,
            doctorstaThree: toZKData.staData,
            threeCount: toZKData.totalCount,
        })
    }
    getData = (
        tableOneData,
        // tableOneDataTotal, 
        tableFourData,
        // tableFourDataTotal,
        BMIData,
        // BMIDataTotal,
        ageData, ageDataTotal,

    ) => {
        let arr = [...tableOneData.data, { docDesc: "总计", docNum: tableOneData.docCount, undisposeNum: tableOneData.undisposedCount, disposeNum: tableOneData.disposeCount }]
        let arr1 = [...tableFourData.data, { docDesc: "总计", docNum: tableFourData.docCount, undisposeNum: tableFourData.undisposedCount, disposeNum: tableFourData.disposeCount }]
        let arr2 = [...BMIData.data, { docDesc: "总计", docNum: BMIData.docCount, undisposeNum: BMIData.undisposedCount, disposeNum: BMIData.disposeCount }]
        // let arr3 = [...ageData, { ageDesc: "总计", docNum: ageDataTotal, }]
        // console.log("tableOnetableOneDatatableOneDataData", tableOneData)
        this.setState({
            oneCount: tableOneData.totalCount,
            twoACount: BMIData.totalCount,
           
            fourCount: tableFourData.totalCount,

            tableOneData: arr,
            originOne: tableOneData.data,
            doctorOne: tableOneData.staData,
            doctorstaOne: tableOneData.staData,
            // tableOneDataTotal,
            tableFourData: arr1,
            originFour: tableFourData.data,
            doctorFour: tableFourData.staData,
            doctorstaFour: tableFourData.staData,

            // tableFourDataTotal,

            tableTwoData: arr2,
            originTwo: BMIData.data,
            doctorTwo: BMIData.staData,
            doctorstaTwo: BMIData.staData,
            // BMIDataTotal,

            // ageData:arr3,
            // originAge: ageData,
            // ageDataTotal,
        })
        // console.log("aaaaaaawork", tableOneData, tableFourData)
    }
    //选择图形样式
    handleType = (subItem, name) => {
        const { arr } = this.state
        let newArr = arr
        newArr && newArr.map((item, index) => {
            if (name == item.des) {
                item.pie.map((i, s) => {
                    i.activeID = ""
                    // item.type=""
                    if (subItem.id == i.id) {
                        i.activeID = i.id
                        item.type = i.type
                    }
                })
            }
        })
        this.setState({
            arr: newArr
        }, () => {
            // console.log(this.state.arr)
        })
    }

    //设置table最后一行
    setClassName = (record, index) => {
        return (record.docDesc === "总计" || record.docDesc === "总计" || record.ageDesc === "总计" || record.sexDesc === "总计" ? "rowFont" : '')
    }
    //设置统计维度
    handleSetting = (e, show, columns, dataTable, selectedRowKeys) => {
        //设置初始选中
        dataTable && dataTable.map((item, index) => {
            columns && columns.map((i, s) => {
                if (i.key == item.key) {
                    selectedRowKeys.push(i.key)
                }
            })
        })
        this.setState({
            [selectedRowKeys]: selectedRowKeys
        }, () => {
            this.setState({
                ["show" + show]: !this.state["show" + show]
            })
        })
    }
    //确认筛选
    handleOk = (name, selectedRowKeys_right, columns, columnsShow, OriginData, originName) => {
        //选中条件 进行筛选
        if (selectedRowKeys_right.length > 0) {
            let arr = columns
            let newArr = [
                arr[0]
            ]
            let newArr1 = []
            arr && arr.map((item, index) => {
                selectedRowKeys_right && selectedRowKeys_right.map((i, s) => {
                    if (item.key == i) {
                        newArr.push(item)
                    }
                })
                OriginData && OriginData.map((j, jIndex) => {
                    selectedRowKeys_right && selectedRowKeys_right.map((i, s) => {
                        if (j.flag == i) {
                            newArr1.push(j)
                        }
                    })
                })
            })
            this.setState({
                [columnsShow]: Array.from(new Set(newArr)),
                [originName]: newArr1
            }, () => {
                this.setState({
                    ["show" + name]: false
                })
                // console.log("newArr1", newArr1)
            })
        } else {
            //直接关闭
            this.setState({
                ["show" + name]: false
            })
        }
    }
    render() {
        const { zerentabgeID, zerenzhuID, zerencrealID, zerenpieID, arr } = this.state;


        const rowSelection_rightOne = {
            selectedRowKeys: this.state.selectedRowKeys_rightOne,
            onChange: (selectedRowKeys, selectedRows) => {
                let btnStatus = false;
                let canSaveStatus = false;
                let selectrow = "";
                if (selectedRowKeys.length === 0) {
                    btnStatus = true;
                    canSaveStatus = true;
                } else {
                    selectrow = selectedRowKeys[selectedRowKeys.length - 1];
                }
                this.setState({ selectrow1: selectrow, selectedRow_right1: selectedRows, selectedRowKeys_rightOne: selectedRowKeys });
            },
            onSelectAll: (selected, selectedRows, changeRows) => {
                // console.log("selected, selectedRows, changeRows",selected, selectedRows, changeRows)
                if (selectedRows.length > 0) {
                    this.setState({
                        btnStatus: false,
                        canSaveStatus: false,
                    })
                } else {
                    this.setState({
                        btnStatus: true,
                        canSaveStatus: true,
                    })
                }
                this.setState({ selectedRow_right1: selectedRows, });
            }
        };

        const rowSelection_rightOneB = {
            selectedRowKeys: this.state.selectedRowKeys_rightOneB,
            onChange: (selectedRowKeys, selectedRows) => {
                let btnStatus = false;
                let canSaveStatus = false;
                let selectrow = "";
                if (selectedRowKeys.length === 0) {
                    btnStatus = true;
                    canSaveStatus = true;
                } else {
                    selectrow = selectedRowKeys[selectedRowKeys.length - 1];
                }
                this.setState({ selectrow1: selectrow, selectedRow_right1: selectedRows, selectedRowKeys_rightOneB: selectedRowKeys });
            },
            onSelectAll: (selected, selectedRows, changeRows) => {
                // console.log("selected, selectedRows, changeRows",selected, selectedRows, changeRows)
                if (selectedRows.length > 0) {
                    this.setState({
                        btnStatus: false,
                        canSaveStatus: false,
                    })
                } else {
                    this.setState({
                        btnStatus: true,
                        canSaveStatus: true,
                    })
                }
                this.setState({ selectedRow_right1: selectedRows, });
            }
        };
        const rowSelection_rightTwo = {
            selectedRowKeys: this.state.selectedRowKeys_rightTwo,
            onChange: (selectedRowKeys, selectedRows) => {
                let btnStatus = false;
                let canSaveStatus = false;
                let selectrow = "";
                if (selectedRowKeys.length === 0) {
                    btnStatus = true;
                    canSaveStatus = true;
                } else {
                    selectrow = selectedRowKeys[selectedRowKeys.length - 1];
                }
                this.setState({ selectrow1: selectrow, selectedRow_right1: selectedRows, selectedRowKeys_rightTwo: selectedRowKeys });
            },
            onSelectAll: (selected, selectedRows, changeRows) => {
                // console.log("selected, selectedRows, changeRows",selected, selectedRows, changeRows)
                if (selectedRows.length > 0) {
                    this.setState({
                        btnStatus: false,
                        canSaveStatus: false,
                    })
                } else {
                    this.setState({
                        btnStatus: true,
                        canSaveStatus: true,
                    })
                }
                this.setState({ selectedRow_right1: selectedRows, });
            }
        };
        const rowSelection_rightThree = {
            selectedRowKeys: this.state.selectedRowKeys_rightThree,
            onChange: (selectedRowKeys, selectedRows) => {
                let btnStatus = false;
                let canSaveStatus = false;
                let selectrow = "";
                if (selectedRowKeys.length === 0) {
                    btnStatus = true;
                    canSaveStatus = true;
                } else {
                    selectrow = selectedRowKeys[selectedRowKeys.length - 1];
                }
                this.setState({ selectrow1: selectrow, selectedRow_right1: selectedRows, selectedRowKeys_rightThree: selectedRowKeys });
            },
            onSelectAll: (selected, selectedRows, changeRows) => {
                // console.log("selected, selectedRows, changeRows",selected, selectedRows, changeRows)
                if (selectedRows.length > 0) {
                    this.setState({
                        btnStatus: false,
                        canSaveStatus: false,
                    })
                } else {
                    this.setState({
                        btnStatus: true,
                        canSaveStatus: true,
                    })
                }
                this.setState({ selectedRow_right1: selectedRows, });
            }
        };
        const rowSelection_rightFour = {
            selectedRowKeys: this.state.selectedRowKeys_rightFour,
            onChange: (selectedRowKeys, selectedRows) => {
                let btnStatus = false;
                let canSaveStatus = false;
                let selectrow = "";
                if (selectedRowKeys.length === 0) {
                    btnStatus = true;
                    canSaveStatus = true;
                } else {
                    selectrow = selectedRowKeys[selectedRowKeys.length - 1];
                }
                this.setState({ selectrow1: selectrow, selectedRow_right1: selectedRows, selectedRowKeys_rightFour: selectedRowKeys });
            },
            onSelectAll: (selected, selectedRows, changeRows) => {
                // console.log("selected, selectedRows, changeRows",selected, selectedRows, changeRows)
                if (selectedRows.length > 0) {
                    this.setState({
                        btnStatus: false,
                        canSaveStatus: false,
                    })
                } else {
                    this.setState({
                        btnStatus: true,
                        canSaveStatus: true,
                    })
                }
                this.setState({ selectedRow_right1: selectedRows, });
            }
        };
        const { DataView } = DataSet;
        const { chartsData, show } = this.state
        //医生工作量 咨询 饼
        const dvOnea = new DataView();
        // console.log("this.state.originDoctor", this.state.originDoctor)
        dvOnea.source(this.state.originOne).transform({
            type: "percent",
            field: "docNum",
            dimension: "docDesc",
            as: "percent"
        });

        //柱 折
        const dsOne = new DataSet();
        const dvOne = dsOne
            .createView()
            .source(this.state.doctorOne)
            .transform({
                type: "percent",
                field: "value",
                // 统计销量
                dimension: "consult",
                // 每年的占比
                groupBy: ["docDesc"],
                // 以不同产品类别为分组
                as: "percent"
            });
        //医生工作量 就诊 饼
        const dvOneab = new DataView();
        // console.log("this.state.originDoctor", this.state.originDoctor)
        dvOneab.source(this.state.originOneB).transform({
            type: "percent",
            field: "admNum",
            dimension: "docDesc",
            as: "percent"
        });

        //柱 折
        const dsOneB = new DataSet();
        const dvOneB = dsOneB
            .createView()
            .source(this.state.doctorOneB)
            .transform({
                type: "percent",
                field: "value",
                // 统计销量
                dimension: "clinic",
                // 每年的占比
                groupBy: ["docDesc"],
                // 以不同产品类别为分组
                as: "percent"
            });
        //社工工作量 咨询 饼
        const dvTwoa = new DataView();
        // console.log("this.state.originDoctor", this.state.originDoctor)
        dvTwoa.source(this.state.originTwo).transform({
            type: "percent",
            field: "docNum",
            dimension: "docDesc",
            as: "percent"
        });

        //柱 折
        const dsTwo = new DataSet();
        const dvTwo = dsTwo
            .createView()
            .source(this.state.doctorTwo)
            .transform({
                type: "percent",
                field: "value",
                // 统计销量
                dimension: "consult",
                // 每年的占比
                groupBy: ["docDesc"],
                // 以不同产品类别为分组
                as: "percent"
            });
        const dsFourThree = new DataSet();
        const dvFourThree = dsFourThree
            .createView()
            .source(this.state.doctorCsThree)
            .transform({
                type: "percent",
                field: "value",
                // 统计销量
                dimension: "consult",
                // 每年的占比
                groupBy: ["docDesc"],
                // 以不同产品类别为分组
                as: "percent"
            });
        const colsOne = {
            percent: {
                min: 0,
                formatter(val) {
                    return val;
                }
            }
        };
        const colsPointOne = {
            docDesc: {
                range: [0, 1]
            }
        };
        //就诊全科医生数据 柱形 折线 
        const dsTo = new DataSet();
        const dvOneTo = dsTo
            .createView()
            .source(this.state.doctorToCs)
            .transform({
                type: "percent",
                field: "value",
                // 统计销量
                dimension: "clinic",
                // 每年的占比
                groupBy: ["docDesc"],
                // 以不同产品类别为分组
                as: "percent"
            });

        //专科医生 就诊 饼状
        const dvThreea = new DataView();
        dvThreea.source(this.state.originThree).transform({
            type: "percent",
            field: "admNum",
            dimension: "docDesc",
            as: "percent"
        });
        const dsThree = new DataSet();
        const dvThree = dsThree
            .createView()
            .source(this.state.doctorThree)
            .transform({
                type: "percent",
                field: "value",
                // 统计销量
                dimension: "clinic",
                // 每年的占比
                groupBy: ["docDesc"],
                // 以不同产品类别为分组
                as: "percent"
            });
        const cols333 = {
            percent: {
                min: 0,

                formatter(val) {
                    return val;
                }
            }
        };


        //护士 就诊 饼状
        const dvFoura = new DataView();
        dvFoura.source(this.state.originFour).transform({
            type: "percent",
            field: "docNum",
            dimension: "docDesc",
            as: "percent"
        });
        //柱 折
        const dsFoura = new DataSet();
        const dvFour = dsFoura
            .createView()
            .source(this.state.doctorFour)
            .transform({
                type: "percent",
                field: "value",
                // 统计销量
                dimension: "consult",
                // 每年的占比
                groupBy: ["docDesc"],
                // 以不同产品类别为分组
                as: "percent"
            });
        const colsFour = {
            percent: {
                min: 0,

                formatter(val) {
                    return val;
                }
            }
        };
        const colsPointFour = {
            docDesc: {
                range: [0, 1]
            }
        };

        const cols = {
            percent: {
                formatter: val => {
                    val = val * 100 + "%";
                    return val;
                }
            }
        };
        const chartStyle = { paddingTop: "0" }

        const colss = {
            docDesc: {
                range: [0, 1]
            }
        };
        const colsPi = {
            sales: {
                tickInterval: 20
            }
        };
        const colsPoint = {
            value: {
                min: 0,
                range: [0, 0.93],
                alias: ''
            },
            year: {
                range: [0, 0.9],
                alias: ''
            }
        };
        //数据
        let chartsList = []
        arr && arr.map((item, i) => {
            if (item.key == "0") {
                chartsList.push(
                    <div>
                        <div className="doctorQuest">
                            <Col span={12}>
                                <Card span={12} key={item.id} title={item.title} className="work-dom">
                                    <div>
                                        <p className="p-dom">
                                            <span onClick={() => this.setState({ doctorActive: "1" })} className={this.state.doctorActive == "1" ? "span-style" : ""}>咨询</span>
                                            <span onClick={() => this.setState({ doctorActive: "2" })} className={this.state.doctorActive == "2" ? "span-style" : ""}>就诊</span>
                                        </p>
                                    </div>
                                    <div className="button-dom" style={{ position: "relative" }}>
                                        {
                                            item.pie && item.pie.map((i, s) => {
                                                return (
                                                    <Button onClick={() => this.handleType(i, item.des)} style={{ background: (i.activeID == i.id ? "rgb(0, 153, 255)" : "#fff"), color: (i.activeID == i.id ? "#fff" : "#333") }} >{i.descripts}</Button>
                                                )
                                            })
                                        }
                                        <Button style={{ float: "right", display: (this.state.doctorActive == "1" ? "block" : "none") }} onClick={(e) => this.handleSetting(e, "One", this.state.columnsO, dataTableOne, this.state.selectedRowKeys_rightOne)}>设置统计维度</Button>
                                        <div className={this.state.showOne ? "setting-table-dom" : ""}
                                            style={{ display: (this.state.showOne && this.state.doctorActive == "1" ? "inline-block" : "none"), }}>
                                            <Table
                                                columns={columnsSeting}
                                                dataSource={dataTableOne}
                                                pagination={false}
                                                bordered
                                                rowKey={record => record.key}
                                                rowClassName={this.setClassName}
                                                rowSelection={rowSelection_rightOne}
                                            />
                                            <Row>
                                                <Button onClick={() => this.handleOk("One", this.state.selectedRowKeys_rightOne, columnsOne, "columnsO", this.state.doctorstaOne, "doctorOne")}>确定</Button>
                                            </Row>
                                        </div>
                                        <Button style={{ float: "right", display: (this.state.doctorActive == "2" ? "block" : "none") }} onClick={(e) => this.handleSetting(e, "One", this.state.columnsOneB, dataTableOneB, this.state.selectedRowKeys_rightOneB)}>设置统计维度</Button>
                                        <div className={this.state.showOne ? "setting-table-dom" : ""}
                                            style={{ display: (this.state.showOne && this.state.doctorActive == "2" ? "inline-block" : "none"), }}>
                                            <Table
                                                columns={columnsSeting}
                                                dataSource={dataTableOneB}
                                                pagination={false}
                                                bordered
                                                rowKey={record => record.key}
                                                rowClassName={this.setClassName}
                                                rowSelection={rowSelection_rightOneB}
                                            />
                                            <Row>
                                                <Button onClick={() => this.handleOk("One", this.state.selectedRowKeys_rightOneB, columnsOneBb, "columnsOneB", this.state.doctorstaOneB, "doctorOneB")}>确定</Button>
                                            </Row>
                                        </div>
                                    </div>
                                    <div className="charts-item" style={{ height: "204px", width:item.type=="pi"||item.type=="point"?this.state.oneCount * 150 +"px":"", display: (this.state.doctorActive == "1" ? "block" : "none") }}>
                                        {
                                            item.type == "pie" ?
                                                <Chart
                                                    height={194}
                                                    width={600}
                                                    data={dvOnea}
                                                    scale={cols}
                                                    padding={[60, 320, 12, 12]}
                                                    forceFit
                                                    style={chartStyle}
                                                >
                                                    <Coord type="theta" radius={0.75} />
                                                    <Axis name="docNum" />
                                                    <Legend
                                                        position="right"
                                                        offsetY={-20}
                                                        offsetX={-50}
                                                    />

                                                    <Tooltip
                                                        showTitle={false}
                                                    //    itemTpl='<li><span style="background-color:{color};" class="g2-tooltip-marker"></span>{name}: {value}</li>'
                                                    />

                                                    <Geom
                                                        type="intervalStack"
                                                        position="docNum"
                                                        color="docDesc"
                                                        tooltip={[
                                                            "docDesc*docNum",
                                                            (docDesc, docNum) => {
                                                                docNum = docNum.toFixed(2) + "%";
                                                                return {
                                                                    name: docDesc,
                                                                    value: docNum
                                                                };
                                                            }
                                                        ]}
                                                        style={{
                                                            lineWidth: 1,
                                                            stroke: "#fff"
                                                        }}
                                                    >
                                                        <Label
                                                            content="docNum"
                                                            formatter={(val, item) => {
                                                                var str = val;
                                                                var a = str.split("%").join("");
                                                                // let b = a.toFixed(2)
                                                                // let b = a&&a.map((i,s)=>{
                                                                //    i = i.toFixed(2)
                                                                // })

                                                                // console.log("b------------", b)
                                                                return item.point.docDesc;
                                                            }}
                                                        />
                                                    </Geom>
                                                </Chart>
                                                : item.type == "pi" ?
                                                    <Chart height={194} data={dvOne} scale={colsOne} forceFit
                                                    padding={[20, 20, 20, 30]}
                                                    >
                                                        {/* <Legend /> */}
                                                        <Legend
                                                            visible={false}
                                                            marker={(x, y, r) => {
                                                                return [
                                                                    ['M', x - r, y],
                                                                    ['L', x + r, y]
                                                                ];
                                                            }}
                                                        />
                                                        <Axis name="docDesc" />
                                                        <Axis name="value" />
                                                        <Tooltip />
                                                        <Geom
                                                            type="intervalStack"
                                                            position="docDesc*value"
                                                            color={"consult"}
                                                        />
                                                    </Chart>
                                                    : item.type == "point" ?
                                                        <Chart height={194} data={dvOne} scale={colsPointOne} forceFit
                                                        padding={[20, 20, 20, 30]}
                                                        >
                                                            <Legend
                                                                visible={false}
                                                                marker={(x, y, r) => {
                                                                    return [
                                                                        ['M', x - r, y],
                                                                        ['L', x + r, y]
                                                                    ];
                                                                }}
                                                            />
                                                            <Axis name="docDesc" />
                                                            <Axis
                                                                name="value"
                                                                label={{
                                                                    formatter: val => `${val}`
                                                                }}
                                                            />
                                                            <Tooltip
                                                                crosshairs={{
                                                                    type: "y"
                                                                }}
                                                            />
                                                            <Geom
                                                                type="line"
                                                                position="docDesc*value"
                                                                size={2}
                                                                color={"consult"}
                                                                shape={"smooth"}
                                                            />
                                                            <Geom
                                                                type="point"
                                                                position="docDesc*value"
                                                                size={4}
                                                                shape={"circle"}
                                                                color={"consult"}
                                                                style={{
                                                                    stroke: "#fff",
                                                                    lineWidth: 1
                                                                }}
                                                            />
                                                        </Chart>
                                                        :
                                                        <div>
                                                            <Table
                                                                columns={this.state.columnsO}
                                                                dataSource={this.state.tableOneData}
                                                                pagination={false}
                                                                bordered
                                                                rowClassName={this.setClassName}
                                                            />
                                                        </div>
                                        }
                                    </div>
                                    <div className="charts-item" style={{ height: "204px", width:item.type=="pi"||item.type=="point"?this.state.oneBCount * 150 +"px":"",display: (this.state.doctorActive == "2" ? "block" : "none") }}>
                                        {
                                            item.type == "pie" ?
                                                <Chart
                                                    height={194}
                                                    width={600}
                                                    data={dvOneab}
                                                    scale={cols}
                                                    padding={[60, 320, 12, 12]}
                                                    forceFit
                                                    style={chartStyle}
                                                >
                                                    <Coord type="theta" radius={0.75} />
                                                    <Axis name="admNum" />
                                                    <Legend
                                                        position="right"
                                                        offsetY={-20}
                                                        offsetX={-50}
                                                    />
                                                    <Tooltip
                                                        showTitle={false}
                                                    //    itemTpl='<li><span style="background-color:{color};" class="g2-tooltip-marker"></span>{name}: {value}</li>'
                                                    />
                                                    <Geom
                                                        type="intervalStack"
                                                        position="admNum"
                                                        color="docDesc"
                                                        tooltip={[
                                                            "docDesc*admNum",
                                                            (docDesc, admNum) => {
                                                                admNum = admNum.toFixed(2) + "%";
                                                                return {
                                                                    name: docDesc,
                                                                    value: admNum
                                                                };
                                                            }
                                                        ]}
                                                        style={{
                                                            lineWidth: 1,
                                                            stroke: "#fff"
                                                        }}
                                                    >
                                                        <Label
                                                            content="admNum"
                                                            formatter={(val, item) => {
                                                                var str = val;
                                                                var a = str.split("%").join("");
                                                                // let b = a.toFixed(2)
                                                                // let b = a&&a.map((i,s)=>{
                                                                //    i = i.toFixed(2)
                                                                // })

                                                                // console.log("b------------", b)
                                                                return item.point.docDesc;
                                                            }}
                                                        />
                                                    </Geom>
                                                </Chart>
                                                : item.type == "pi" ?
                                                    <Chart height={194} data={dvOneB} scale={colsOne} forceFit
                                                    padding={[20, 20, 20, 30]}
                                                    >
                                                        {/* <Legend /> */}
                                                        <Legend
                                                            visible={false}
                                                            marker={(x, y, r) => {
                                                                return [
                                                                    ['M', x - r, y],
                                                                    ['L', x + r, y]
                                                                ];
                                                            }}
                                                        />
                                                        <Axis name="docDesc" />
                                                        <Axis name="value" />
                                                        <Tooltip />
                                                        <Geom
                                                            type="intervalStack"
                                                            position="docDesc*value"
                                                            color={"clinic"}
                                                        />
                                                    </Chart>
                                                    : item.type == "point" ?
                                                        <Chart height={194} data={dvOneB} scale={colsPointOne} forceFit
                                                        padding={[20, 20, 20, 30]}
                                                        >
                                                            <Legend
                                                                visible={false}
                                                                marker={(x, y, r) => {
                                                                    return [
                                                                        ['M', x - r, y],
                                                                        ['L', x + r, y]
                                                                    ];
                                                                }}
                                                            />
                                                            <Axis name="docDesc" />
                                                            <Axis
                                                                name="value"
                                                                label={{
                                                                    formatter: val => `${val}`
                                                                }}
                                                            />
                                                            <Tooltip
                                                                crosshairs={{
                                                                    type: "y"
                                                                }}
                                                            />
                                                            <Geom
                                                                type="line"
                                                                position="docDesc*value"
                                                                size={2}
                                                                color={"clinic"}
                                                                shape={"smooth"}
                                                            />
                                                            <Geom
                                                                type="point"
                                                                position="docDesc*value"
                                                                size={4}
                                                                shape={"circle"}
                                                                color={"clinic"}
                                                                style={{
                                                                    stroke: "#fff",
                                                                    lineWidth: 1
                                                                }}
                                                            />
                                                        </Chart>
                                                        :
                                                        <div>
                                                            <Table
                                                                columns={this.state.columnsOneB}
                                                                dataSource={this.state.tableOneBData}
                                                                pagination={false}
                                                                bordered
                                                                rowClassName={this.setClassName}
                                                            // summary={pageData => {
                                                            //     let totalBorrow = 0;
                                                            //     let totalRepayment = 0;
                                                            //     console.log("pageData", pageData)
                                                            //     pageData.forEach(({ borrow, repayment }) => {
                                                            //         totalBorrow += borrow;
                                                            //         totalRepayment += repayment;
                                                            //     });
                                                            //       return(
                                                            //         <div>
                                                            //         <tr>
                                                            //             <th>总计</th>
                                                            //             <td>
                                                            //                 <Text type="danger">{totalBorrow}</Text>
                                                            //             </td>
                                                            //             <td>
                                                            //                 <Text>{totalRepayment}</Text>
                                                            //             </td>
                                                            //         </tr>
                                                            //         <tr>
                                                            //             <th>Balance</th>
                                                            //             <td colSpan={2}>
                                                            //                 <Text type="danger">{totalBorrow - totalRepayment}</Text>
                                                            //             </td>
                                                            //         </tr>
                                                            //     </div>
                                                            //       )
                                                            // }}
                                                            />
                                                        </div>
                                        }
                                    </div>
                                </Card>
                            </Col>
                        </div>

                    </div >

                )
            } if (item.key == "1") {
                chartsList.push(
                    <Col span={12} className="doctorQuest">
                        <Card span={12} key={item.id} title={item.title} className="work-dom">
                            <div>
                                <p className="p-dom">
                                    <span onClick={() => this.setState({ doctorActiveB: "1" })} className={this.state.doctorActiveB == "1" ? "span-style" : ""}>咨询</span>
                                    <span onClick={() => message.warning("暂无数据")} className={this.state.doctorActiveB == "2" ? "span-style" : ""}>电话</span>
                                </p>
                            </div>
                            <div className="button-dom" style={{ position: "relative" }}>
                                {
                                    item.pie && item.pie.map((i, s) => {
                                        return (
                                            <Button onClick={() => this.handleType(i, item.des)} style={{ background: (i.activeID == i.id ? "rgb(0, 153, 255)" : "#fff"), color: (i.activeID == i.id ? "#fff" : "#333") }} >{i.descripts}</Button>
                                        )
                                    })
                                }
                                <Button style={{ float: "right", display: (this.state.doctorActiveB == "1" ? "block" : "none") }} onClick={(e) => this.handleSetting(e, "Two", this.state.columnsTw, dataTableTwo, this.state.selectedRowKeys_rightTwo)}>设置统计维度</Button>
                                <div className={this.state.showTwo ? "setting-table-dom" : ""}
                                    style={{ display: (this.state.showTwo && this.state.doctorActiveB == "1" ? "inline-block" : "none"), }}>
                                    <Table
                                        columns={columnsSeting}
                                        dataSource={dataTableTwo}
                                        pagination={false}
                                        bordered
                                        rowKey={record => record.key}
                                        rowClassName={this.setClassName}
                                        rowSelection={rowSelection_rightTwo}
                                    />
                                    <Row>
                                        <Button onClick={() => this.handleOk("Two", this.state.selectedRowKeys_rightTwo, columnsTwo, "columnsTw", this.state.doctorstaTwo, "doctorTwo")}>确定</Button>
                                    </Row>
                                </div>
                                <Button style={{ float: "right", display: (this.state.doctorActiveB == "2" ? "block" : "none") }} onClick={(e) => this.handleSetting(e, "Two", this.state.columnsTw, dataTableTwo, this.state.selectedRowKeys_rightTwo)}>设置统计维度</Button>
                                <div className={this.state.showTwo ? "setting-table-dom" : ""}
                                    style={{ display: (this.state.showTwo && this.state.doctorActiveB == "2" ? "inline-block" : "none"), }}>
                                    <Table
                                        columns={columnsSeting}
                                        dataSource={dataTableTwo}
                                        pagination={false}
                                        bordered
                                        rowKey={record => record.key}
                                        rowClassName={this.setClassName}
                                        rowSelection={rowSelection_rightTwo}
                                    />
                                    <Row>
                                        <Button onClick={() => this.handleOk("One", this.state.selectedRowKeys_rightOneB, columnsOneBb, "columnsOneB", this.state.doctorstaOneB, "doctorOneB")}>确定</Button>
                                    </Row>
                                </div>
                            </div>
                            <div className="charts-item" style={{ height: "204px", width:item.type=="pi"||item.type=="point"?this.state.twoACount * 150 +"px":"", display: (this.state.doctorActiveB == "1" ? "block" : "none") }}>
                                {
                                    item.type == "pie" ?
                                        <Chart
                                            height={194}
                                            width={600}
                                            data={dvTwoa}
                                            scale={cols}
                                            padding={[60, 280, 12, 12]}
                                            forceFit
                                            style={chartStyle}
                                        >
                                            <Coord type="theta" radius={0.75} />
                                            <Axis name="docNum" />
                                            <Legend
                                                position="right"
                                                offsetY={-20}
                                                offsetX={-50}
                                            />
                                            <Tooltip
                                                showTitle={false}
                                            //    itemTpl='<li><span style="background-color:{color};" class="g2-tooltip-marker"></span>{name}: {value}</li>'
                                            />

                                            <Geom
                                                type="intervalStack"
                                                position="docNum"
                                                color="docDesc"
                                                tooltip={[
                                                    "docDesc*docNum",
                                                    (docDesc, percent) => {
                                                        docNum = docNum.toFixed(2) + "%";
                                                        return {
                                                            name: docDesc,
                                                            value: docNum
                                                        };
                                                    }
                                                ]}
                                                style={{
                                                    lineWidth: 1,
                                                    stroke: "#fff"
                                                }}
                                            >
                                                <Label
                                                    content="docNum"
                                                    formatter={(val, item) => {
                                                        var str = val;
                                                        var a = str.split("%").join("");
                                                        // let b = a.toFixed(2)
                                                        // let b = a&&a.map((i,s)=>{
                                                        //    i = i.toFixed(2)
                                                        // })

                                                        // console.log("b------------", b)
                                                        return item.point.docDesc;
                                                    }}
                                                />
                                            </Geom>
                                        </Chart>
                                        : item.type == "pi" ?
                                            <Chart height={194} data={dvTwo} scale={colsOne} forceFit
                                            padding={[20, 20, 20, 30]}
                                            >
                                                <Legend
                                                    visible={false}
                                                    marker={(x, y, r) => {
                                                        return [
                                                            ['M', x - r, y],
                                                            ['L', x + r, y]
                                                        ];
                                                    }}
                                                />
                                                <Axis name="docDesc" />
                                                <Axis name="value" />
                                                <Tooltip />
                                                <Geom
                                                    type="intervalStack"
                                                    position="docDesc*value"
                                                    color={"consult"}
                                                />
                                            </Chart>
                                            //      <Chart height={194} data={dvCs} scale={colsCs} forceFit>
                                            //      <Legend />
                                            //      <Axis name="docDesc" />
                                            //      <Axis name="value" />
                                            //      <Tooltip />
                                            //      <Geom
                                            //        type="intervalStack"
                                            //        position="docDesc*percent"
                                            //        color={"value"}
                                            //      />
                                            //    </Chart>
                                            : item.type == "point" ?
                                                <Chart height={194} data={dvTwo} scale={colsPointOne} forceFit
                                                padding={[20, 20, 20, 30]}
                                                >
                                                    <Legend
                                                        visible={false}
                                                        marker={(x, y, r) => {
                                                            return [
                                                                ['M', x - r, y],
                                                                ['L', x + r, y]
                                                            ];
                                                        }}
                                                    />
                                                    <Axis name="docDesc" />
                                                    <Axis
                                                        name="value"
                                                        label={{
                                                            formatter: val => `${val}`
                                                        }}
                                                    />
                                                    <Tooltip
                                                        crosshairs={{
                                                            type: "y"
                                                        }}
                                                    />
                                                    <Geom
                                                        type="line"
                                                        position="docDesc*value"
                                                        size={2}
                                                        color={"consult"}
                                                        shape={"smooth"}
                                                    />
                                                    <Geom
                                                        type="point"
                                                        position="docDesc*value"
                                                        size={4}
                                                        shape={"circle"}
                                                        color={"consult"}
                                                        style={{
                                                            stroke: "#fff",
                                                            lineWidth: 1
                                                        }}
                                                    />
                                                </Chart>
                                                :
                                                <div>
                                                    <Table
                                                        columns={this.state.columnsTw}
                                                        dataSource={this.state.tableTwoData}
                                                        pagination={false}
                                                        bordered
                                                        rowClassName={this.setClassName}
                                                    />
                                                </div>
                                }
                            </div>
                            <div className="charts-item" style={{ height: "204px", width:item.type=="pi"||item.type=="point"?this.state.twoBCount * 150 +"px":"", display: (this.state.doctorActiveB == "2" ? "block" : "none") }}>
                                {
                                    item.type == "pie" ?
                                        <Chart
                                            height={194}
                                            width={600}
                                            data={dvOneab}
                                            scale={cols}
                                            padding={[60, 280, 12, 12]}
                                            forceFit
                                            style={chartStyle}
                                        >
                                            <Coord type="theta" radius={0.75} />
                                            <Axis name="admNum" />
                                            <Legend
                                                position="right"
                                                offsetY={-20}
                                                offsetX={-50}
                                            />
                                            <Tooltip
                                                showTitle={false}
                                            //    itemTpl='<li><span style="background-color:{color};" class="g2-tooltip-marker"></span>{name}: {value}</li>'
                                            />
                                            <Geom
                                                type="intervalStack"
                                                position="admNum"
                                                color="docDesc"
                                                tooltip={[
                                                    "docDesc*admNum",
                                                    (docDesc, admNum) => {
                                                        admNum = admNum.toFixed(2) + "%";
                                                        return {
                                                            name: docDesc,
                                                            value: admNum
                                                        };
                                                    }
                                                ]}
                                                style={{
                                                    lineWidth: 1,
                                                    stroke: "#fff"
                                                }}
                                            >
                                                <Label
                                                    content="admNum"
                                                    formatter={(val, item) => {
                                                        var str = val;
                                                        var a = str.split("%").join("");
                                                        // let b = a.toFixed(2)
                                                        // let b = a&&a.map((i,s)=>{
                                                        //    i = i.toFixed(2)
                                                        // })

                                                        // console.log("b------------", b)
                                                        return item.point.docDesc;
                                                    }}
                                                />
                                            </Geom>
                                        </Chart>
                                        : item.type == "pi" ?
                                            <Chart height={194} data={dvOneB} scale={colsOne} forceFit
                                            padding={[20, 20, 20, 30]}
                                            >
                                                <Legend
                                                    visible={false}
                                                    marker={(x, y, r) => {
                                                        return [
                                                            ['M', x - r, y],
                                                            ['L', x + r, y]
                                                        ];
                                                    }}
                                                />
                                                <Axis name="docDesc" />
                                                <Axis name="value" />
                                                <Tooltip />
                                                <Geom
                                                    type="intervalStack"
                                                    position="docDesc*value"
                                                    color={"clinic"}
                                                />
                                            </Chart>
                                            //      <Chart height={194} data={dvCs} scale={colsCs} forceFit>
                                            //      <Legend />
                                            //      <Axis name="docDesc" />
                                            //      <Axis name="value" />
                                            //      <Tooltip />
                                            //      <Geom
                                            //        type="intervalStack"
                                            //        position="docDesc*percent"
                                            //        color={"value"}
                                            //      />
                                            //    </Chart>
                                            : item.type == "point" ?
                                                <Chart height={194} data={dvOneB} scale={colsPointOne} forceFit
                                                padding={[20, 20, 20, 30]}
                                                >
                                                    <Legend
                                                        visible={false}
                                                        marker={(x, y, r) => {
                                                            return [
                                                                ['M', x - r, y],
                                                                ['L', x + r, y]
                                                            ];
                                                        }}
                                                    />
                                                    <Axis name="docDesc" />
                                                    <Axis
                                                        name="value"
                                                        label={{
                                                            formatter: val => `${val}`
                                                        }}
                                                    />
                                                    <Tooltip
                                                        crosshairs={{
                                                            type: "y"
                                                        }}
                                                    />
                                                    <Geom
                                                        type="line"
                                                        position="docDesc*value"
                                                        size={2}
                                                        color={"clinic"}
                                                        shape={"smooth"}
                                                    />
                                                    <Geom
                                                        type="point"
                                                        position="docDesc*value"
                                                        size={4}
                                                        shape={"circle"}
                                                        color={"clinic"}
                                                        style={{
                                                            stroke: "#fff",
                                                            lineWidth: 1
                                                        }}
                                                    />
                                                </Chart>
                                                :
                                                <div>
                                                    <Table
                                                        columns={this.state.columnsOneB}
                                                        dataSource={this.state.tableOneBData}
                                                        pagination={false}
                                                        bordered
                                                        rowClassName={this.setClassName}
                                                    />
                                                </div>
                                }
                            </div>
                        </Card>
                    </Col>
                )
            } if (item.key == "2") {
                chartsList.push(
                    <Col span={12}>
                        <Card span={12} key={item.id} title={item.title}>
                            <div className="button-dom" style={{ position: "relative" }}>
                                {
                                    item.pie && item.pie.map((i, s) => {
                                        return (
                                            <Button onClick={() => this.handleType(i, item.des)} style={{ background: (i.activeID == i.id ? "rgb(0, 153, 255)" : "#fff"), color: (i.activeID == i.id ? "#fff" : "#333") }} >{i.descripts}</Button>
                                        )
                                    })
                                }
                                <Button style={{ float: "right" }} onClick={(e) => this.handleSetting(e, "Three", this.state.columnsT, dataTableThree, this.state.selectedRowKeys_rightThree)}>设置统计维度</Button>
                                <div className={this.state.showThree ? "setting-table-dom" : ""}
                                    style={{ display: (this.state.showThree ? "inline-block" : "none"), }}>
                                    <Table
                                        columns={columnsSeting}
                                        dataSource={dataTableThree}
                                        pagination={false}
                                        bordered
                                        rowKey={record => record.key}
                                        rowClassName={this.setClassName}
                                        rowSelection={rowSelection_rightThree}
                                    />
                                    <Row>
                                        <Button onClick={() => this.handleOk("Three", this.state.selectedRowKeys_rightThree, columnsThree, "columnsT", this.state.doctorstaThree, "doctorThree")}>确定</Button>
                                    </Row>
                                </div>
                            </div>
                            <div className="charts-item" style={{ height: "320px", width:item.type=="pi"||item.type=="point"?this.state.threeCount * 150 +"px":"",}}>
                                {
                                    item.type == "pie" ?
                                        <Chart
                                            height={302}
                                            width={600}
                                            data={dvThreea}
                                            scale={cols}
                                            padding={[60, 280, 12, 12]}
                                            forceFit
                                            style={chartStyle}
                                        >
                                            <Coord type="theta" radius={0.75} />
                                            <Axis name="admNum" />
                                            <Legend
                                                position="right"
                                                offsetY={-20}
                                                offsetX={-50}
                                            />
                                            <Tooltip
                                                showTitle={false}
                                            //    itemTpl='<li><span style="background-color:{color};" class="g2-tooltip-marker"></span>{name}: {value}</li>'
                                            />
                                            <Geom
                                                type="intervalStack"
                                                position="admNum"
                                                color="docDesc"
                                                tooltip={[
                                                    "docDesc*admNum",
                                                    (docDesc, admNum) => {
                                                        admNum = admNum.toFixed(2) + "%";
                                                        return {
                                                            name: docDesc,
                                                            value: admNum
                                                        };
                                                    }
                                                ]}
                                                style={{
                                                    lineWidth: 1,
                                                    stroke: "#fff"
                                                }}
                                            >
                                                <Label
                                                    content="admNum"
                                                    formatter={(val, item) => {
                                                        var str = val;
                                                        var a = str.split("%").join("");
                                                        // let b = a.toFixed(2)
                                                        // let b = a&&a.map((i,s)=>{
                                                        //    i = i.toFixed(2)
                                                        // })

                                                        // console.log("b------------", b)
                                                        return item.point.docDesc;
                                                    }}
                                                />
                                            </Geom>
                                        </Chart> : item.type == "pi" ?
                                            <Chart height={302} data={dvThree} scale={colsFour} forceFit
                                            padding={[20, 20, 20, 30]}
                                            >
                                                <Legend
                                                    visible={false}
                                                    marker={(x, y, r) => {
                                                        return [
                                                            ['M', x - r, y],
                                                            ['L', x + r, y]
                                                        ];
                                                    }}
                                                />
                                                <Axis name="docDesc" />
                                                <Axis name="value" />
                                                <Tooltip />
                                                <Geom
                                                    type="intervalStack"
                                                    position="docDesc*value"
                                                    color={"clinic"}
                                                />
                                            </Chart>

                                            : item.type == "point" ?
                                                <Chart height={302} data={dvThree} scale={colsPointOne} forceFit
                                                    padding={[20, 20, 20, 30]}
                                                >
                                                    <Legend
                                                        visible={false}
                                                        marker={(x, y, r) => {
                                                            return [
                                                                ['M', x - r, y],
                                                                ['L', x + r, y]
                                                            ];
                                                        }}
                                                    />
                                                    <Axis name="docDesc" />
                                                    <Axis
                                                        name="value"
                                                        label={{
                                                            formatter: val => `${val}`
                                                        }}
                                                    />
                                                    <Tooltip
                                                        crosshairs={{
                                                            type: "y"
                                                        }}
                                                    />
                                                    <Geom
                                                        type="line"
                                                        position="docDesc*value"
                                                        size={2}
                                                        color={"clinic"}
                                                        shape={"smooth"}
                                                    />
                                                    <Geom
                                                        type="point"
                                                        position="docDesc*value"
                                                        size={4}
                                                        shape={"circle"}
                                                        color={"clinic"}
                                                        style={{
                                                            stroke: "#fff",
                                                            lineWidth: 1
                                                        }}
                                                    />
                                                </Chart>

                                                :
                                                <div>
                                                    <Table
                                                        columns={this.state.columnsT}
                                                        dataSource={this.state.tableThreeData}
                                                        pagination={false}
                                                        bordered
                                                        rowClassName={this.setClassName}
                                                    />
                                                </div>
                                }
                            </div>
                        </Card>
                    </Col>
                )
            } if (item.key == "3") {
                chartsList.push(
                    <Col span={12}>
                        <Card span={12} key={item.id} title={item.title}>
                            <div className="button-dom" style={{ position: "relative" }}>
                                {
                                    item.pie && item.pie.map((i, s) => {
                                        return (
                                            <Button onClick={() => this.handleType(i, item.des)} style={{ background: (i.activeID == i.id ? "rgb(0, 153, 255)" : "#fff"), color: (i.activeID == i.id ? "#fff" : "#333") }} >{i.descripts}</Button>
                                        )
                                    })
                                }
                                <Button style={{ float: "right" }} onClick={(e) => this.handleSetting(e, "Four", this.state.columnsF, dataTableFour, this.state.selectedRowKeys_rightFour)}>设置统计维度</Button>
                                <div className={this.state.showFour ? "setting-table-dom" : ""}
                                    style={{ display: (this.state.showFour ? "inline-block" : "none"), }}>
                                    <Table
                                        columns={columnsSeting}
                                        dataSource={dataTableFour}
                                        pagination={false}
                                        bordered
                                        rowKey={record => record.key}
                                        rowClassName={this.setClassName}
                                        rowSelection={rowSelection_rightFour}
                                    />
                                    <Row>
                                        <Button onClick={() => this.handleOk("Four", this.state.selectedRowKeys_rightFour, columnsFour, "columnsF", this.state.doctorstaFour, "doctorFour")}>确定</Button>
                                    </Row>
                                </div>
                            </div>
                            <div className="charts-item" style={{ height: "320px", width:item.type=="pi"||item.type=="point"?this.state.fourCount * 150 +"px":"",}}>
                                {
                                    item.type == "pie" ?
                                        <Chart
                                            height={302}
                                            width={600}
                                            data={dvFoura}
                                            scale={cols}
                                            padding={[60, 280, 12, 12]}
                                            forceFit
                                            style={chartStyle}
                                        >
                                            <Coord type="theta" radius={0.75} />
                                            <Axis name="docNum" />
                                            <Legend
                                                position="right"
                                                offsetY={-20}
                                                offsetX={-50}
                                            />
                                            <Tooltip
                                                showTitle={false}
                                            //    itemTpl='<li><span style="background-color:{color};" class="g2-tooltip-marker"></span>{name}: {value}</li>'
                                            />
                                            <Geom
                                                type="intervalStack"
                                                position="docNum"
                                                color="docDesc"
                                                tooltip={[
                                                    "docDesc*docNum",
                                                    (docDesc, docNum) => {
                                                        docNum = docNum.toFixed(2) + "%";
                                                        return {
                                                            name: docDesc,
                                                            value: docNum
                                                        };
                                                    }
                                                ]}
                                                style={{
                                                    lineWidth: 1,
                                                    stroke: "#fff"
                                                }}
                                            >
                                                <Label
                                                    content="docNum"
                                                    formatter={(val, item) => {
                                                        var str = val;
                                                        var a = str.split("%").join("");
                                                        // let b = a.toFixed(2)
                                                        // let b = a&&a.map((i,s)=>{
                                                        //    i = i.toFixed(2)
                                                        // })

                                                        // console.log("b------------", b)
                                                        return item.point.docDesc;
                                                    }}
                                                />
                                            </Geom>
                                        </Chart> : item.type == "pi" ?
                                            <Chart height={302} data={dvFour} scale={colsFour} forceFit
                                            padding={[20, 20, 20, 30]}
                                            >
                                                <Legend
                                                    visible={false}
                                                    marker={(x, y, r) => {
                                                        return [
                                                            ['M', x - r, y],
                                                            ['L', x + r, y]
                                                        ];
                                                    }}
                                                />
                                                <Axis name="docDesc" />
                                                <Axis name="value" />
                                                <Tooltip />
                                                <Geom
                                                    type="intervalStack"
                                                    position="docDesc*value"
                                                    color={"consult"}
                                                />
                                            </Chart>
                                            : item.type == "point" ?
                                                <Chart height={302} data={dvFour} scale={colsPointFour} forceFit
                                                    padding={[20, 20, 20, 30]}
                                                >
                                                    <Legend
                                                        visible={false}
                                                        marker={(x, y, r) => {
                                                            return [
                                                                ['M', x - r, y],
                                                                ['L', x + r, y]
                                                            ];
                                                        }}
                                                    />
                                                    <Axis name="docDesc" />
                                                    <Axis
                                                        name="value"
                                                        label={{
                                                            formatter: val => `${val}`
                                                        }}
                                                    />
                                                    <Tooltip
                                                        crosshairs={{
                                                            type: "y"
                                                        }}
                                                    />
                                                    <Geom
                                                        type="line"
                                                        position="docDesc*value"
                                                        size={2}
                                                        color={"consult"}
                                                        shape={"smooth"}
                                                    />
                                                    <Geom
                                                        type="point"
                                                        position="docDesc*value"
                                                        size={4}
                                                        shape={"circle"}
                                                        color={"consult"}
                                                        style={{
                                                            stroke: "#fff",
                                                            lineWidth: 1
                                                        }}
                                                    />
                                                </Chart>
                                                :
                                                <div>
                                                    <Table
                                                        columns={this.state.columnsF}
                                                        dataSource={this.state.tableFourData}
                                                        pagination={false}
                                                        bordered
                                                        rowClassName={this.setClassName}
                                                    />
                                                </div>
                                }
                            </div>
                        </Card>
                    </Col>
                )
            }
        })
        return (
            <div className="charts-dom">
                <Row>

                    {
                        chartsList
                    }
                </Row>
            </div>
        );
    }
}
export default AnalysisChartsWork 
