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

export default () => {
  const [test, setTest] = useState(false);
  const [_dataList, setDataList] = useState([
    { id: 1, name: '3333' },
    { id: 2, name: '4444' },
    { id: 3, name: '5555' },
    { id: 4, name: '6666' },
  ]);
  return (
    <>
      <View style={{ display: 'flex', flexDirection: 'column' }}>
        {_dataList.map((item, index) => (
          <View key={item.name}>
            <BfSwipeAction
              key={item.name}
              content={
                <View>
                  {item.id}~{item.name}
                </View>
              }
              operation={[
                {
                  text: '删除',
                  key: item.name + '1',
                  style: { color: '#ffffff', backgroundColor: '#FD3C42' },
                  onClick: () => {
                    // console.log(111);
                    setDataList((pre) => {
                      const oldList = [...pre];
                      oldList.splice(index, 1);
                      return oldList;
                    });
                  },
                },
                { text: '预览', key: item.name + '2', style: 'color: #ffffff;background-color: #85673d' },
              ]}
              operationWidth={270}
              onContentClick={() => console.log(22222222)}
              // autoClose
            />
          </View>
        ))}

        <BfSwipeAction
          key={6666}
          content={<View>这是奥迪姐我奥is的及附加爱睡觉</View>}
          height={640}
          operation={[
            {
              text: '删除',
              style: { color: '#ffffff', backgroundColor: '#FD3C42' },
              onClick: () => console.log(1111111),
            },
            { text: '预览', style: { color: '#ffffff', backgroundColor: '#85673d' } },
          ]}
          operationWidth={350}
          onContentClick={() => console.log(22222222)}
          autoClose
          isOpened={test}
          onOpenChange={(opened) => {
            console.log('BfSwipeAction ====> ', opened);
            setTest(opened);
          }}
        />
      </View>
    </>
  );
};