import React from "react";
import { Switch, Form, Tooltip, Tag, Input } from 'antd';
import Styles from './web.module.less';
export default function wechatMpForWeb(props) {
    const { passport, appIdStr, hasQrCodePrefix, t, changeEnabled, updateConfig } = props;
    const { id, type, enabled, stateColor } = passport;
    const config = passport.config || {};
    return (<div className={Styles.item}>
            <div className={Styles.title}>
                <Tag color={stateColor}>{t(`passport:v.type.${type}`)}</Tag>
                <Tooltip title={hasQrCodePrefix ? '' : '请先配置小程序普通链接二维码规则'}>
                    <Switch 
    // disabled={!(mpAppIds && mpAppIds.length > 0)}
    checkedChildren="开启" unCheckedChildren="关闭" checked={enabled} onChange={(checked) => {
            changeEnabled(checked);
        }} disabled={!hasQrCodePrefix}/>
                </Tooltip>
            </div>
            <Form labelCol={{ span: 4 }} wrapperCol={{ span: 20 }} style={{ maxWidth: 900, marginTop: 16 }}>
                <Form.Item label="appId">
                    <Input value={appIdStr} disabled={true}/>
                </Form.Item>
            </Form>

        </div>);
}