import { BfDialog } from '@bud-fe/react-taro-ui';
import { Button, View } from '@tarojs/components';
import Taro from '@tarojs/taro';
import React, { useState } from 'react';

export default () => {
  const [baseOpened, setBaseOpened] = useState(false);
  const [singleBtnOpened, setSingleBtnOpened] = useState(false);
  const [disableOpened, setDisableOpened] = useState(false);

  return (
    <>
      <Button className="group-title" onClick={() => setBaseOpened(true)}>
        基础用法
      </Button>
      <Button className="group-title" onClick={() => setDisableOpened(true)}>
        confirmDisable=true
      </Button>
      <Button className="group-title" onClick={() => setSingleBtnOpened(true)}>
        自定义渲染 content
      </Button>

      <BfDialog
        actionTip="操作提示"
        isOpened={baseOpened}
        title="提醒"
        content="业务台账修改需要您的上级审批，若您正在执行拜访任务，不会造成影响。"
        onCancel={() => setBaseOpened(false)}
        onTipClick={() => Taro.showToast({ title: '操作提示' })}
      />
      <BfDialog
        confirmDisable
        actionTip="操作提示"
        isOpened={disableOpened}
        title="标题"
        content="内容"
        onCancel={() => setDisableOpened(false)}
        onTipClick={() => Taro.showToast({ title: '操作提示' })}
      />
      <BfDialog
        isOpened={singleBtnOpened}
        title="标题"
        content={
          <View>
            <View>123</View>
            <View>123</View>
            <View>123</View>
            <View>123</View>
            <View>123</View>
            <View>123</View>
            <View>123</View>
          </View>
        }
        onCancel={() => setSingleBtnOpened(false)}
      />
    </>
  );
};