import React, { useMemo, useState } from 'react';
import { Button, Checkbox, Divider, Tabs } from 'antd';
import styles from './Policy.less'
import ListOfStrategies from "@/pages/alarmcenter_policy/component/listOfStrategies/ListOfStrategies";

const items =[
    {
        label: `策略列表`,
        key: '策略列表',
        children: <ListOfStrategies/>,
    },
    {
        label: `场景化配置`,
        key: '场景化配置',
        children: `Content of tab 2`,
    },
    {
        label: `联系人分组管理`,
        key: '联系人分组管理',
        children: `Content of tab 3`,
    },
    {
        label: `模板管理`,
        key: '模板管理',
        children: `Content of tab 4`,
    },
]
const Policy = ()=>{
    const [activeKey, setActiveKey] = useState('策略列表');

    return (
        <div style={{borderTopLeftRadius:16}}>
            <Tabs className={styles['tabs']} tabBarExtraContent={{left: <div className={styles['title']}><span>{activeKey}</span></div>}} items={items}
                  onChange={(key) => setActiveKey(key)} />
        </div>
    )
}
export default Policy
