import { BfCard } from '@bud-fe/react-taro-ui';
import { Text, View } from '@tarojs/components';
import React from 'react';

export default () => {
  return (
    <>
      <View className="group-title">基础用法</View>
      <BfCard title="标题" content={<View>这里存放内容</View>} />
      <BfCard
        required
        rightOperations={<View>右边的操作</View>}
        operations={<View>中间的操作</View>}
        title="标题"
        content={<View>这里存放内容</View>}
        close
        onClose={(props) => {
          console.log('close', props);
        }}
      />
      <View className="group-title">可收起&自定义背景</View>
      <BfCard
        backgroundColor="rgba(68, 206, 246, 0.6)"
        collapsible
        collapsedHeight={60}
        title="标题"
        content={
          <View className="content">
            <Text>这里存放内容</Text>
            <Text>这里存放内容</Text>
            <Text>这里存放内容</Text>
            <Text>这里存放内容</Text>
            <Text>这里存放内容</Text>
            <Text>这里存放内容</Text>
            <Text>这里存放内容</Text>
            <Text>这里存放内容</Text>
            <Text>这里存放内容</Text>
            <Text>这里存放内容</Text>
            <Text>这里存放内容</Text>
            <Text>这里存放内容</Text>
            <Text>这里存放内容</Text>
            <View>这里存放内容</View>
            <View>这里存放内容</View>
            <View>这里存放内容</View>
            <View>这里存放内容</View>
            <View>这里存放内容</View>
            <View>这里存放内容</View>
            <View>这里存放内容</View>
            <View>这里存放内容</View>
            <View>这里存放内容</View>
            <View>这里存放内容</View>
            <View>这里存放内容</View>
            <View>这里存放内容</View>
            <View>这里存放内容111</View>
          </View>
        }
        onClick={() => {
          console.log('outer onClick');
        }}
      />
    </>
  );
};