import React, { useState } from 'react';
import { Button } from 'antd';
import PandaConfiguration from '../index';
// import PandaConfigurationView from '../../es/index';
const Demo = () => {
  const [name, setName] = useState('水厂工艺流程段');
  const [devices, setDevices] = useState(
    'EQZT00000008,EQZT00000007,CPDA00000001,JYBZ00000003,JYBZ00000005,JYBZ00000004,SC00000003',
  );
  return (
    <>
      <div style={{ width: '100%', height: '600px', background: '#242835' }}>
        <PandaConfiguration
          name={name}
          devices={devices.split(',')}
          // name={'崇左丽江水厂原水泵房'}
          // devices={'EQZT00000007,CPBA00000001,CPAA00000001,EQZT00000008,CPDA00000001,CPAD00000001,LJSC00000002,EQZT00000005,EQZT00000004,EQZT00000002,EQZT00000003'.split(
          //   ',',
          // )}
          // name={'丽江水厂原水提升泵D单元'}
          // devices={'CPAA00000001, CPAD00000001, LJSC00000002'.split(',')}
          config={globalConfig}
          deviceName={['工艺流程1', '工艺流程2', '工艺流程3']}
          // isZoom={true}
          // flowShow={false}
        />
      </div>
      <Button
        onClick={() => {
          setName('崇左丽江水厂原水泵房');
          setDevices(
            'EQZT00000007,CPBA00000001,CPAA00000001,EQZT00000008,CPDA00000001,CPAD00000001,LJSC00000002,EQZT00000005,EQZT00000004,EQZT00000002,EQZT00000003',
          );
        }}
        style={{ margin: '10px' }}
      >
        改变组态名称
      </Button>
    </>
  );
};

export default Demo;

const globalConfig = {
  token: 'a1372ef0ce7b4e4884d31cfd99fe92f6',
  mqtt_iotIP: 'emqttd10.panda-water.cn:443',
  mqtt_path: '/mqtt',
  mqtt_IsSSL: true,
  mqtt_site_code: 'site_dc8302ni',
  mqtt_mess: {
    MessageLevel: '1.0',
    TcpIP: 'emqttd10.panda-water.cn',
    TcpPort: 443,
    site_code: 'site_dc8302ni',
  },
  userInfo: {
    LocalSite: 'site_dc8302ni',
    site: '',
  },
};