@aks-dev/easyui 1.0.163 → 1.1.5

package/lib/Hud/Scanner/Scanner.tsx

@@ -1,250 +0,0 @@
-/*
- * @Author: shiguo
- * @Date: 2022-04-24 14:27:02
- * @LastEditors: shiguo
- * @LastEditTime: 2023-03-23 15:04:18
- * @FilePath: /@aks-dev/easyui/lib/Hud/Scanner/Scanner.tsx
- */
-import React, { useImperativeHandle, useState } from 'react';
-import {
-    Animated, BackHandler, Easing, Image, StyleProp, StyleSheet, Text, TouchableOpacity, View, ViewStyle
-} from 'react-native';
-import { RNCamera, BarCodeReadEvent } from 'react-native-camera';
-import { PERMISSIONS, requestMultiple } from 'react-native-permissions';
-import { navigationBarHeight, px2dp, statusBarHeight } from '../../../screen/px2dp';
-import { px2sp } from '../../../screen/px2sp';
-import * as utils from '../../../utils/lazy';
-import { showToast } from '../Toast/Toast';
-import { ScannerOptions } from './index';
-
-
-
-
-
-
-// enum SCANNER_TYPE {
-//     DENIED = -1,//没有开始权限
-//     START = 0,//没有扫描结果，继续扫描
-//     SUCCESS = 1,//已有扫描结果，停止扫描
-// }
-
-export const Scanner = React.forwardRef<ScannerOptions.RefAttributes, {}>((_, ref) => {
-    const [show, setShow] = useState<boolean>(false);
-    const [torchOn, setTorchOn] = React.useState<boolean>(false)
-    const moveAnim = React.useRef(new Animated.Value(0)).current
-    const [pointStyle, setPointStyle] = React.useState<StyleProp<ViewStyle>>()
-    const cameraRef: React.MutableRefObject<RNCamera> = React.useRef() as any
-    const _cbRef: React.MutableRefObject<ScannerOptions.CallBack> = React.useRef() as any
-    const _scanerResultRef = React.useRef<any>()
-    React.useEffect(() => {
-        const onBackPress = () => {
-            if (show) {
-                _hideScanner()
-            }
-            return true
-        }
-        BackHandler.addEventListener('hardwareBackPress', onBackPress);
-        return () => BackHandler.removeEventListener('hardwareBackPress', onBackPress);
-    }, [show])
-
-
-
-
-    useImperativeHandle<unknown, ScannerOptions.RefAttributes>(ref, () => ({
-        showScanner: _showScanner,
-        hideScanner: _hideScanner
-    }), [show])
-
-
-
-    const _showScanner = async (cb: ScannerOptions.CallBack) => {
-        let res = await requestMultiple([PERMISSIONS.IOS.CAMERA, PERMISSIONS.ANDROID.CAMERA])
-        if (res[PERMISSIONS.ANDROID.CAMERA] == "granted" || res[PERMISSIONS.IOS.CAMERA] == "granted") {
-            _scanerResultRef.current = undefined;
-            setShow(true);
-            setPointStyle({})
-            await utils.sleep()
-            animationStart()
-            _cbRef.current = cb;
-        } else {
-            _hideScanner()
-            showToast('您未开启相机权限，暂不能使用此功能')
-        }
-
-
-    }
-
-    const _hideScanner = async () => {
-        animationStop()
-        await utils.sleep()
-        setShow(false);
-    }
-
-
-
-    const animation = Animated.loop(Animated.sequence([
-        Animated.timing(
-            moveAnim,
-            {
-                toValue: px2dp(222),
-                duration: 3000,
-                easing: Easing.linear,
-                useNativeDriver: true,
-            }
-        ),
-        Animated.timing(
-            moveAnim,
-            {
-                toValue: 0,
-                duration: 3000,
-                easing: Easing.linear,
-                useNativeDriver: true,
-            }
-        )
-    ]))
-
-
-
-    const animationStart = async () => {
-
-        cameraRef.current?.resumePreview()
-        animation.start(({ finished }) => {
-            // console.log('animationStart finished', finished)
-            if (finished) {
-                animation.reset()
-                animation.start()
-            }
-        })
-    }
-    const animationStop = (result?: any) => {
-        cameraRef.current?.pausePreview()
-        animation.stop()
-    }
-
-
-    // const getPointFromBounds = (bounds) => {
-    //     let x = 0
-    //     let y = 0
-
-    //     if (Platform.OS == 'android') {
-    //         bounds.origin.forEach(i => {
-    //             x = Math.max(x, parseFloat(i.x))
-    //             y = Math.max(y, parseFloat(i.y))
-    //         })
-
-    //         y = y * DeviceHeight / bounds.width
-    //         x = x * DeviceWidth / bounds.height
-    //     }
-
-    //     if(Platform.OS == 'ios'){
-    //         x=parseFloat(bounds.origin.x)
-    //         y=parseFloat(bounds.origin.y)
-    //     }
-
-    //     return { x, y }
-    // }
-
-
-    const onBarCodeRead = (e: BarCodeReadEvent) => {
-        // console.log('ss onBarCodeRead: ', JSON.stringify(e))
-        if (e?.data?.length > 0 && _scanerResultRef.current == undefined) {
-            _scanerResultRef.current = e?.data
-            _cbRef.current(e?.data)
-            _hideScanner()
-        }
-    }
-
-
-
-
-
-
-
-    if (!show) return null;
-    return (
-        <TouchableOpacity disabled style={StyleSheet.absoluteFillObject}>
-            <RNCamera
-                ref={cameraRef}
-                captureAudio={false}
-                autoFocus={RNCamera.Constants.AutoFocus.on}/*自动对焦*/
-                style={styles.camera}
-                type={RNCamera.Constants.Type.back}/*切换前后摄像头 front前back后*/
-                flashMode={torchOn ? RNCamera.Constants.FlashMode.torch : RNCamera.Constants.FlashMode.off}/*相机闪光模式*/
-                onBarCodeRead={onBarCodeRead}
-
-
-            >
-                {/* 导航栏 */}
-                <View style={{ display: 'flex', justifyContent: "center", alignItems: "center", height: navigationBarHeight, marginTop: statusBarHeight, position: 'relative' }}>
-                    <TouchableOpacity onPress={() => _hideScanner()} style={{ height: navigationBarHeight, width: px2dp(50), paddingLeft: px2dp(15), position: 'absolute', left: 0, display: 'flex', justifyContent: 'center' }} >
-                        <Image source={require('./icon_back_white.png')} style={{ width: px2dp(20), height: px2dp(20) }} resizeMode='contain' />
-                    </TouchableOpacity>
-                    <Text style={{ fontSize: px2sp(16), color: 'white', fontWeight: 'bold' }}>扫一扫</Text>
-                </View>
-
-                {/* 动画框 */}
-                <View style={styles.scanContainer}>
-                    <View style={styles.rectangle}>
-                        <View style={styles.rectangleLeft} />
-                        <View style={styles.cameraBackground}>
-                            <Animated.View style={[styles.scanLine, { transform: [{ translateY: moveAnim }] }]} />
-                            <View style={styles.reactLineTopLeftX} />
-                            <View style={styles.reactLineTopLeftY} />
-                            <View style={styles.reactLineTopRightX} />
-                            <View style={styles.reactLineTopRightY} />
-                            <View style={styles.reactLineBottomLeftX} />
-                            <View style={styles.reactLineBottomLeftY} />
-                            <View style={styles.reactLineBottomRightX} />
-                            <View style={styles.reactLineBottomRightY} />
-                        </View>
-                        <View style={styles.rectangleRight} />
-                    </View>
-
-                    <TouchableOpacity onPress={() => setTorchOn(!torchOn)}>
-                        <Image
-                            source={torchOn ? require('./flashlight-blue.png') : require('./flashlight-white.png')}
-                            style={styles.flashlight} />
-                    </TouchableOpacity>
-                    <Text style={styles.rectangleText}>将二维码/条码放入框内，即可自动扫描</Text>
-                </View>
-                <View style={pointStyle} />
-            </RNCamera>
-
-        </TouchableOpacity>
-    )
-})
-
-
-
-const transparent = '#00000000'
-const lineColor = '#6ab3ff'
-const scanW = 225
-const scanCornerLineLength = 15;
-const scanCornerLineHeight = 3
-const styles = StyleSheet.create({
-    camera: { display: 'flex', flex: 1, flexDirection: 'column', backgroundColor: "red" },
-    cameraBackground: { width: px2dp(scanW), height: px2dp(scanW), backgroundColor: transparent },
-    scanContainer: { display: 'flex', flex: 1, justifyContent: 'center', alignItems: 'center' },
-    rectangle: { flexDirection: 'row', overflow: 'hidden', },
-    rectangleLeft: { backgroundColor: transparent, height: px2dp(scanW), width: px2dp(scanW) },
-    rectangleRight: { backgroundColor: transparent, height: px2dp(scanW), width: px2dp(scanW) },
-    rectangleText: { color: '#fff', lineHeight: px2dp(15), },
-    scanLine: { width: px2dp(scanW), height: px2dp(scanCornerLineHeight), borderRadius: px2dp(25), backgroundColor: lineColor, },
-    reactLineTopLeftX: { position: 'absolute', top: 0, left: 0, width: px2dp(scanCornerLineLength), height: px2dp(scanCornerLineHeight), backgroundColor: lineColor },
-    reactLineTopLeftY: { position: 'absolute', top: 0, left: 0, width: px2dp(scanCornerLineHeight), height: px2dp(scanCornerLineLength), backgroundColor: lineColor },
-    reactLineTopRightX: { position: 'absolute', top: 0, right: 0, width: px2dp(scanCornerLineLength), height: px2dp(scanCornerLineHeight), backgroundColor: lineColor },
-    reactLineTopRightY: { position: 'absolute', top: 0, right: 0, width: px2dp(scanCornerLineHeight), height: px2dp(scanCornerLineLength), backgroundColor: lineColor },
-    reactLineBottomLeftX: { position: 'absolute', bottom: 0, left: 0, width: px2dp(scanCornerLineLength), height: px2dp(scanCornerLineHeight), backgroundColor: lineColor },
-    reactLineBottomLeftY: { position: 'absolute', bottom: 0, left: 0, width: px2dp(scanCornerLineHeight), height: px2dp(scanCornerLineLength), backgroundColor: lineColor },
-    reactLineBottomRightX: { position: 'absolute', bottom: 0, right: 0, width: px2dp(scanCornerLineLength), height: px2dp(scanCornerLineHeight), backgroundColor: lineColor },
-    reactLineBottomRightY: { position: 'absolute', bottom: 0, right: 0, width: px2dp(scanCornerLineHeight), height: px2dp(scanCornerLineLength), backgroundColor: lineColor },
-    flashlight: { width: px2dp(30), height: px2dp(30), resizeMode: 'contain', marginTop: px2dp(50), marginBottom: px2dp(15), marginHorizontal: px2dp(15) },
-    grantedText: { lineHeight: px2dp(30), color: lineColor, fontWeight: 'bold' }
-})
-
-
-
-
-export const scannerRef = React.createRef<ScannerOptions.RefAttributes>();
-export const showScanner = (cb: ScannerOptions.CallBack) => scannerRef.current?.showScanner(cb)
-export const hideScanner = () => scannerRef.current?.hideScanner()

package/lib/Hud/Scanner/index.d.ts

@@ -1,42 +0,0 @@
-
-/*
- * @Author: shiguo
- * @Date: 2022-04-24 14:27:02
- * @LastEditors: shiguo
- * @LastEditTime: 2023-03-23 12:36:02
- * @FilePath: /@aks-dev/easyui/lib/Hud/Scanner/index.d.ts
- */
-import * as React from 'react'
-
-
-
-
-
-
-
-
-
-
-declare namespace ScannerOptions {
-
-    type CallBack = (e: string) => void;
-
-
-    type RefAttributes = {
-        showScanner: (cb: CallBack) => void;
-        hideScanner: () => void;
-    }
-}
-
-
-
-export declare const showScanner: (cb: ScannerOptions.CallBack) => void;
-
-
-export declare const hideScanner: () => void;
-
-
-export declare const scannerRef: React.RefObject<ScannerOptions.RefAttributes>;
-
-export declare const Scanner: React.ForwardRefExoticComponent<React.PropsWithoutRef<{}> & React.RefAttributes<ScannerOptions.RefAttributes>>
-

package/lib/Hud/Toast/Toast.tsx

@@ -1,86 +0,0 @@
-/*
- * @Author: shiguo
- * @Date: 2021-04-27 10:38:04
- * @LastEditors: shiguo
- * @LastEditTime: 2022-09-09 10:58:34
- * @FilePath: /@aks-dev/easyui/lib/Hud/Toast/Toast.tsx
- */
-import React, { useImperativeHandle, useState, useRef } from 'react';
-import { View, StyleSheet, Text, Dimensions, Animated, Easing } from 'react-native';
-
-
-import type { ToastOptions } from '.'
-
-const errorMsg = '(^_^)∠※ 送你一束小花'
-
-export const Toast = React.forwardRef<ToastOptions.RefAttributes, {}>((_, ref) => {
-    const [tipText, setTipText] = useState(errorMsg);
-    const fade = useRef(new Animated.Value(0)).current;
-
-    const fadeAnimation = Animated.sequence([
-        Animated.timing(fade, {
-            toValue: 1,
-            duration: 750,
-            useNativeDriver: true,
-            easing: Easing.linear,
-        }),
-        Animated.delay(3000),
-        Animated.timing(fade, {
-            toValue: 0,
-            duration: 750,
-            useNativeDriver: true,
-            easing: Easing.linear,
-        })
-    ])
-
-    useImperativeHandle<unknown, ToastOptions.RefAttributes>(ref, () => ({
-        showToast: (content: string) => {
-            setTipText(content || errorMsg)
-            fadeAnimation.reset()
-            fadeAnimation.start()
-        },
-    }))
-
-    return (
-        <Animated.View style={{ ...styles.toastContainer, opacity: fade }}>
-            <View style={styles.toastTipsContainer}>
-                <Text numberOfLines={5} style={{ ...styles.toastTitle, }}>{tipText} </Text>
-            </View>
-        </Animated.View>
-
-    )
-})
-
-export const toastRef = React.createRef<ToastOptions.RefAttributes>();
-
-export const showToast = (content: string) => toastRef.current?.showToast(content)
-
-
-
-const SCREEN_WIDTH = Dimensions.get('window').width;
-const styles = StyleSheet.create({
-    toastContainer: {
-        position: 'absolute',
-        bottom: 100,
-        width: '100%',
-        justifyContent: 'center',
-        alignItems: 'center'
-    },
-
-    toastTipsContainer: {
-        position: 'absolute',
-        backgroundColor: '#00000088',
-        padding: 10,
-        // paddingVertical: 4,
-        borderRadius: 2,
-        justifyContent: 'center',
-        alignItems: 'center',
-        minWidth: 120
-    },
-    toastTitle: {
-        fontSize: 13,
-        lineHeight: 20,
-        color: 'white',
-        maxWidth: SCREEN_WIDTH * 0.8
-    }
-})

package/lib/Hud/Toast/index.d.ts

@@ -1,22 +0,0 @@
-/*
- * @Author: shiguo
- * @Date: 2022-04-18 19:18:03
- * @LastEditors: shiguo
- * @LastEditTime: 2022-09-09 10:58:11
- * @FilePath: /@aks-dev/easyui/lib/Hud/Toast/index.ts
- */
-import * as React from 'react'
-
-
-declare namespace ToastOptions {
-    type   RefAttributes = {
-        showToast: (content: string) => void;
-    }
-}
-
-export declare const showToast: (content: string) => void;
-
-
-export declare const toastRef: React.RefObject<ToastOptions.RefAttributes>;
-
-export declare const Toast: React.ForwardRefExoticComponent<React.PropsWithoutRef<{}> & React.RefAttributes<ToastOptions.RefAttributes>>;

package/lib/Hud/index.ts

@@ -1,20 +0,0 @@
-/*
- * @Author: shiguo
- * @Date: 2022-04-24 14:14:42
- * @LastEditors: shiguo
- * @LastEditTime: 2023-03-23 11:05:22
- * @FilePath: /aks-fire-app/node_modules/@aks-dev/easyui/lib/Hud/index.ts
- */
-
-
-import * as React from 'react'
-
-
-export * from './AlertView'
-export * from './Loading'
-export * from './Toast'
-export * from './AlertBottomView'
-export * from './AlertSheetView'
-export * from './PopoverView'
-export * from './Scanner'
-export declare const Hud: React.FC<{}>

package/lib/MenuView/MenuView.tsx

@@ -1,252 +0,0 @@
-import React from "react";
-import { Image, LayoutRectangle, MeasureOnSuccessCallback, ScrollView, StatusBar, Text, TouchableOpacity, View } from 'react-native';
-import type { MenuProps } from '.';
-import { deviceHeight, deviceWidth } from '../../screen/px2dp';
-// import * as utils from '../../utils/lazy';
-import { hidePopoverView, showPopoverView } from '../Hud/Hud';
-
-type State = {
-}
-
-
-type Reducer = (prevState: State, action: Partial<State>) => State
-
-
-
-export default (props: MenuProps) => {
-
-    const {
-        defaultAlignHorizontal = 'left',
-        defaultAlignVertical = 'bottom'
-    } = props
-
-    const [state, dispatch] = React.useReducer<Reducer>((prevState, action) => Object.assign({}, prevState, action), {})
-
-    // const containerRef = React.useRef<{ measureInWindow: (callback: MeasureInWindowOnSuccessCallback) => void }>()
-    const containerRef = React.useRef<{ measure: (callback: MeasureOnSuccessCallback) => void }>()
-    const rootView = React.useRef<{
-        pageX: number;
-        pageY: number;
-        height: number;
-        width: number;
-    }>({ pageX: 0, pageY: 0, width: 0, height: 0 })
-    const sc = React.useRef<LayoutRectangle>({ x: 0, y: 0, width: 0, height: 0 })
-
-    // React.useEffect(() => {
-    //     ; (async () => {
-    //         await utils.sleep()
-    //         containerRef.current?.measure((...args) => {
-    //             console.log('containerRef', args)
-    //             if (args.length == 6) {
-    //                 _container.current = {
-    //                     x: args[4],
-    //                     y: args[5],
-    //                     width: args[2],
-    //                     height: args[3],
-    //                 }
-    //             }
-    //         })
-    //     })()
-    // })
-
-
-    const getRootViewlayoutPromise = () => {
-        return new Promise((resovle, reject) => {
-            containerRef.current?.measure((...args) => {
-                if (args.length == 6) {
-                    rootView.current = {
-                        width: args[2],
-                        height: args[3],
-                        pageX: args[4],
-                        pageY: args[5],
-                    }
-                }
-                // console.log('RootView', rootView.current)
-                resovle(args)
-            })
-        })
-    }
-
-
-    const getLayoutInfos: () => {
-        alignVertical: 'bottom' | 'top';
-        alignHorizontal: 'left' | 'right';
-        width: number;
-        height: number;
-        x: number;
-        y: number;
-        target_width: number;
-        target_height: number;
-    }
-        = () => {
-            let alignVertical: 'bottom' | 'top' = defaultAlignVertical
-            let alignHorizontal: 'left' | 'right' = defaultAlignHorizontal
-            let width = rootView.current.width
-            let height = rootView.current.height
-            let x = rootView.current.pageX
-            // let y = (StatusBar.currentHeight || 0) + _container.current.y + height
-            let y = rootView.current.pageY + height
-            if (x > Math.abs(deviceWidth - width - x)) {
-                alignHorizontal = 'right'
-            }
-            if (y > deviceHeight * .5) {
-                alignVertical = 'top'
-            }
-            /**todo: target_width的获取是延迟的，所以这里又问题 */
-            const target_width = sc.current.width
-            const target_height = CELL_HEIGHT * (Math.min(props.data?.length || 0, 5) || 0)
-            return {
-                alignVertical,
-                alignHorizontal,
-                width,
-                height,
-                x,
-                y,
-                target_width,
-                target_height,
-            }
-        }
-
-
-    const reLayout = (): Partial<{
-        left: number;
-        right: number;
-        top: number;
-        botttom: number;
-    }> => {
-        let {
-            alignVertical,
-            alignHorizontal,
-            width,
-            height,
-            x,
-            y,
-            target_width,
-            target_height,
-        } = getLayoutInfos()
-
-        // console.log({ getLayoutInfos: getLayoutInfos() })
-        const layout = () => {
-            if (alignHorizontal == 'left') {
-                if (target_width + x > deviceWidth) {
-                    return {
-                        left: Math.abs(deviceWidth - target_width) * .7,
-                        top: y,
-                    }
-                }
-                return {
-                    left: Math.max(x, 15),
-                    top: y,
-                }
-            } else {
-                let _x = deviceWidth - x - width
-                if (target_width + _x > deviceWidth) {
-                    return {
-                        right: Math.abs(deviceWidth - target_width) * .7,
-                        top: y
-                    }
-                }
-                return {
-                    right: Math.max(_x, 15),
-                    top: y
-                }
-            }
-        }
-        if (alignVertical == 'bottom') {
-            y = y + PADDING
-            return layout()
-        } else {
-            y = rootView.current.pageY - target_height - PADDING * 2 - ARROW_HEIGHT
-            return layout()
-        }
-    }
-
-
-    const PADDING = 10
-    const ARROW_HEIGHT = 12
-    const CELL_HEIGHT = 36
-
-
-    const show = async () => {
-        props.onContainerClick && props.onContainerClick()
-        if (props.data == undefined || props.data?.length == 0) return
-        /**重新获取rootview的定位 */
-        await getRootViewlayoutPromise()
-        /**重新获取rootview的定位 */
-        showPopoverView({
-            content: (
-                <TouchableOpacity
-                    activeOpacity={1}
-                    style={{
-
-                        position: 'absolute',
-                        minWidth: deviceWidth * 0.36,
-                        maxWidth: deviceWidth * 0.8,
-                        minHeight: CELL_HEIGHT + PADDING * 2,
-                        maxHeight: CELL_HEIGHT * 5 + PADDING * 2,
-                        borderRadius: 6, backgroundColor: '#000000ee',
-                        // overflow: 'hidden' ,
-                        padding: PADDING,
-                        ...reLayout()
-                    }}
-                >
-
-                    <View style={{
-                        width: ARROW_HEIGHT, height: ARROW_HEIGHT,
-                        backgroundColor: '#000000ee', position: 'absolute', zIndex: 1,
-                        transform: [{ rotateZ: '45deg' }],
-                        ...(() => {
-                            const {
-                                alignVertical,
-                                alignHorizontal,
-                            } = getLayoutInfos()
-                            if (alignVertical == 'bottom' && alignHorizontal == 'left') return { left: '20%', top: -5 }
-                            if (alignVertical == 'bottom' && alignHorizontal == 'right') return { right: '20%', top: -5 }
-                            if (alignVertical == 'top' && alignHorizontal == 'left') return { left: '20%', bottom: -5 }
-                            if (alignVertical == 'top' && alignHorizontal == 'right') return { right: '20%', bottom: -5 }
-                            return {}
-                        })()
-                    }} />
-
-                    <ScrollView onLayout={e => {
-                        // console.log('target onLayout', e.nativeEvent.layout)
-                        let _sc: LayoutRectangle = e.nativeEvent.layout
-                        sc.current = _sc
-                    }}
-                    // style={{ backgroundColor: "red" }}
-                    >
-                        {props.data?.map((i, idx) => {
-                            return (
-                                <TouchableOpacity
-                                    activeOpacity={.7}
-                                    key={`sg-memnu-${idx}`}
-                                    style={{
-                                        height: CELL_HEIGHT, display: 'flex', flexDirection: 'row', alignItems: 'center'
-                                        // ,backgroundColor:utils.randomcolor()
-                                    }}
-                                    onPress={e => {
-                                        props.onItemClick && props.onItemClick(idx, i.extra)
-                                        hidePopoverView()
-                                    }}
-                                >
-                                    {i.icon &&
-                                        <Image style={{ width: 18, height: 18, marginRight: 4 }} source={i.icon} />
-                                    }
-                                    <Text style={{ flexShrink: 1, fontSize: 14, color: 'white' }}>{i.text}</Text>
-                                </TouchableOpacity>
-                            )
-                        })}
-                    </ScrollView>
-                </TouchableOpacity>
-            )
-        })
-    }
-
-    return (
-        <TouchableOpacity
-            ref={containerRef as any}
-            onPress={e => show()}
-            {...props}
-        />
-    )
-}