import { View, Text } from "@tarojs/components";
import React from "react";
import './RecordItem.scss'
import Taro from "@tarojs/taro";
import { TimeFormatter } from "@/utils/time_format";
import { useTranslation } from "react-i18next";
import { vibrate } from "@/utils/tools";
import showActionSheet from "@/components/basic/ActionSheet";
import showAlert from "@/components/basic/Alert";

let useActionSheet;
if (process.env.TARO_ENV == 'rn') {
    useActionSheet = require('@expo/react-native-action-sheet').useActionSheet
}

export default function Component(props: { children: React.ReactNode, onClick?: Function, delete?: Function, canDel?: boolean, disableDelete?: boolean }) {
    const { t } = useTranslation()

    let showActionSheetWithOptions;
    if (process.env.TARO_ENV == 'rn') {
        showActionSheetWithOptions = useActionSheet()
    }


    function click(e) {
        if (props.onClick) {
            if (process.env.TARO_ENV == 'weapp') {
                e.stopPropagation()
            }
            props.onClick();
        }
        else {
            vibrate()
        }
    }

    function longPress() {
        if (global.dimissSel){
            global.dimissSel()
        }
        console.log(props.disableDelete)
        if (!props.delete || props.disableDelete) {
            return;
        }

        showActionSheet({
            showActionSheetWithOptions: showActionSheetWithOptions,
            itemList: [t('feature.common.action_sheet.delete')],
            success: (res) => {
                switch (res) {
                    case 0:
                        {
                            showAlert({
                                title: t('feature.common.modal.delete_item_title'),
                                content: t('feature.common.modal.delete_item_content'),
                                showCancel: true,
                                confirm: () => {
                                    props.delete!();
                                }
                            })
                        }
                        break;
                }
            }
        })

        // Taro.showActionSheet({
        //     itemList: [t('feature.common.action_sheet.delete')],
        //     itemColor: '#ff0000'
        // })
        //     .then(res => {
        //         switch (res.tapIndex) {
        //             case 0:
        //                 showAlert({
        //                     title: t('feature.common.modal.delete_item_title'),
        //                     content: t('feature.common.modal.delete_item_content'),
        //                     showCancel: true,
        //                     confirm: () => {
        //                         props.delete!();
        //                     }
        //                 })
        //                 break;
        //             case 1:

        //                 break;
        //         }
        //     })
        //     .catch(err => {
        //     })

    }
    //gesture  onClick onLongPress 有效
    return <View className="recordItem" onLongPress={longPress} onClick={click}>
        {props.children}

    </View>
}