@aks-dev/easyui 1.0.195 → 1.0.197

package/dist/components/Hud/AlertSheetView/AlertSheetView.js

@@ -1,33 +1,23 @@
-var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-};
 import * as React from "react";
 import { Dimensions, Platform, StatusBar, StyleSheet, Text, TouchableOpacity, View, } from "react-native";
 import Modal from "react-native-modal";
 import { px2dp } from "../../../screen/px2dp";
 import { px2sp } from "../../../screen/px2sp";
 export default React.forwardRef((_, ref) => {
-    var _a;
     const defaultState = {
         visible: false,
         actions: [],
     };
     const [state, setState] = React.useState(defaultState);
     React.useImperativeHandle(ref, () => ({
-        show: (options) => __awaiter(void 0, void 0, void 0, function* () {
+        show: async (options) => {
             setState(Object.assign({}, defaultState, { visible: true }, options));
-        }),
+        },
         hide,
     }), []);
-    const hide = () => __awaiter(void 0, void 0, void 0, function* () {
+    const hide = async () => {
         setState(defaultState);
-    });
+    };
     React.useEffect(() => {
         if (Platform.OS == "android") {
             if (state.visible) {
@@ -40,27 +30,40 @@ export default React.forwardRef((_, ref) => {
             }
         }
     }, [state.visible]);
-    return (React.createElement(Modal, { hideModalContentWhileAnimating: true, useNativeDriver: true, animationIn: "slideInUp", animationOut: "slideOutDown", onBackButtonPress: () => {
+    return (<Modal hideModalContentWhileAnimating={true} //通过隐藏模态内容直到动画完成来增强性能
+     useNativeDriver={true} //定义动画是否应使用本机驱动程序
+     animationIn="slideInUp" animationOut="slideOutDown" onBackButtonPress={() => {
+            //按下Android后退按钮时调用
+            hide();
+        }} onBackdropPress={() => {
+            //按下背景时调用
             hide();
-        }, onBackdropPress: () => {
+        }} isVisible={state.visible} deviceHeight={Dimensions.get("screen").height} style={{ margin: 0 }}>
+      <View style={styles.container}>
+        <View style={[styles.wrapper]}>
+          <View style={styles.itemContainer}>
+            {state.actions?.map((i, idx) => (<TouchableOpacity key={`sg-action-${idx}`} style={[styles.item]} activeOpacity={1} onPress={() => {
+                hide();
+                i.onClick && i.onClick();
+            }}>
+                <Text style={[styles.itemText, { color: i.color }]} numberOfLines={2}>
+                  {i.text}
+                </Text>
+              </TouchableOpacity>))}
+          </View>
+
+          <TouchableOpacity style={[styles.cancel]} activeOpacity={1} onPress={() => {
             hide();
-        }, isVisible: state.visible, deviceHeight: Dimensions.get("screen").height, style: { margin: 0 } },
-        React.createElement(View, { style: styles.container },
-            React.createElement(View, { style: [styles.wrapper] },
-                React.createElement(View, { style: styles.itemContainer }, (_a = state.actions) === null || _a === void 0 ? void 0 : _a.map((i, idx) => (React.createElement(TouchableOpacity, { key: `sg-action-${idx}`, style: [styles.item], activeOpacity: 1, onPress: () => {
-                        hide();
-                        i.onClick && i.onClick();
-                    } },
-                    React.createElement(Text, { style: [styles.itemText, { color: i.color }], numberOfLines: 2 }, i.text))))),
-                React.createElement(TouchableOpacity, { style: [styles.cancel], activeOpacity: 1, onPress: () => {
-                        hide();
-                    } },
-                    React.createElement(Text, { style: [styles.cancelText] }, "\u53D6\u6D88"))))));
+        }}>
+            <Text style={[styles.cancelText]}>取消</Text>
+          </TouchableOpacity>
+        </View>
+      </View>
+    </Modal>);
 });
 export const alertSheetViewRef = React.createRef();
 export const showAlertSheetModal = (props) => {
-    var _a;
-    (_a = alertSheetViewRef.current) === null || _a === void 0 ? void 0 : _a.show(props);
+    alertSheetViewRef.current?.show(props);
 };
 const styles = StyleSheet.create({
     container: {
@@ -73,6 +76,7 @@ const styles = StyleSheet.create({
         flexGrow: 0,
         flexShrink: 0,
         width: "100%",
+        // backgroundColor: 'pink',
         overflow: "hidden",
         borderTopLeftRadius: px2dp(10),
         borderTopRightRadius: px2dp(10),

package/dist/components/Hud/AlertView/AlertView.js

@@ -1,12 +1,3 @@
-var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-};
 import * as React from "react";
 import { View, Text, StyleSheet, Platform, Modal, StatusBar, TouchableOpacity, Animated, Easing, } from "react-native";
 import { px2dp, deviceWidth } from "../../../screen/px2dp";
@@ -21,18 +12,20 @@ export default React.forwardRef((_, ref) => {
     const cancelCallbackRef = React.useRef(undefined);
     const confirmCallbackRef = React.useRef(undefined);
     React.useImperativeHandle(ref, () => ({
-        show: (options) => __awaiter(void 0, void 0, void 0, function* () {
+        show: async (options) => {
             setState(Object.assign({}, defaultState, { visible: true }, options));
             cancelCallbackRef.current = options.cancel;
             confirmCallbackRef.current = options.confirm;
+            // await sleep(50)
             startAnimate(1);
-        }),
+        },
         hide,
     }), []);
-    const hide = () => __awaiter(void 0, void 0, void 0, function* () {
+    const hide = async () => {
         startAnimate(0.3);
+        // await sleep(50)
         setState(defaultState);
-    });
+    };
     let scale_anim = React.useRef(new Animated.Value(0.3)).current;
     const startAnimate = (x) => {
         Animated.timing(scale_anim, {
@@ -54,49 +47,66 @@ export default React.forwardRef((_, ref) => {
             }
         }
     }, [state.visible]);
-    return (React.createElement(Modal, { visible: state.visible, transparent: true, animationType: "fade", onRequestClose: () => {
-        } },
-        React.createElement(View, { style: styles.container },
-            React.createElement(Animated.View, { style: [
-                    styles.wrapper,
-                    state.wrapperStyle,
-                    { transform: [{ scale: scale_anim }] },
-                ] },
-                state.title && React.createElement(Text, { style: styles.titleText }, state.title),
-                (() => {
-                    if (typeof state.content == "string")
-                        return React.createElement(Text, { style: styles.contentText }, state.content);
-                    if (React.isValidElement(state.content))
-                        return state.content;
-                    return React.createElement(View, null);
-                })(),
-                (state.cancelText || state.confirmText) && (React.createElement(View, { style: styles.action },
-                    state.cancelText && (React.createElement(TouchableOpacity, { style: [
-                            styles.cancel,
-                            { marginRight: state.confirmText ? px2dp(15) : 0 },
-                            state.cancelContainerStyle,
-                        ], activeOpacity: 0.8, disabled: state.cancelDisabled, onPress: () => {
-                            hide();
-                            cancelCallbackRef.current && cancelCallbackRef.current();
-                            cancelCallbackRef.current = undefined;
-                        } },
-                        React.createElement(Text, { style: [styles.cancelText, state.cancelTextStyle] }, state.cancelText))),
-                    state.confirmText && (React.createElement(TouchableOpacity, { style: [
-                            styles.confirm,
-                            { marginLeft: state.cancelText ? px2dp(15) : 0 },
-                            state.confirmContainerStyle,
-                        ], activeOpacity: 0.8, onPress: () => {
-                            hide();
-                            confirmCallbackRef.current && confirmCallbackRef.current();
-                            confirmCallbackRef.current = undefined;
-                        } },
-                        React.createElement(Text, { style: [styles.confirmText, state.confirmTextStyle] }, state.confirmText)))))))));
+    return (<Modal visible={state.visible} transparent animationType="fade" onRequestClose={() => {
+            // hide()
+        }}>
+      <View style={styles.container}>
+        <Animated.View style={[
+            styles.wrapper,
+            state.wrapperStyle,
+            { transform: [{ scale: scale_anim }] },
+        ]}>
+          {state.title && <Text style={styles.titleText}>{state.title}</Text>}
+          {(() => {
+            if (typeof state.content == "string")
+                return <Text style={styles.contentText}>{state.content}</Text>;
+            if (React.isValidElement(state.content))
+                return state.content;
+            return <View />;
+        })()}
+
+          {(state.cancelText || state.confirmText) && (<View style={styles.action}>
+              {state.cancelText && (<TouchableOpacity style={[
+                    styles.cancel,
+                    { marginRight: state.confirmText ? px2dp(15) : 0 },
+                    state.cancelContainerStyle,
+                ]} activeOpacity={0.8} disabled={state.cancelDisabled} onPress={() => {
+                    hide();
+                    cancelCallbackRef.current && cancelCallbackRef.current();
+                    cancelCallbackRef.current = undefined;
+                }}>
+                  <Text style={[styles.cancelText, state.cancelTextStyle]}>
+                    {state.cancelText}
+                  </Text>
+                </TouchableOpacity>)}
+
+              {state.confirmText && (<TouchableOpacity style={[
+                    styles.confirm,
+                    { marginLeft: state.cancelText ? px2dp(15) : 0 },
+                    state.confirmContainerStyle,
+                ]} activeOpacity={0.8} onPress={() => {
+                    hide();
+                    confirmCallbackRef.current && confirmCallbackRef.current();
+                    confirmCallbackRef.current = undefined;
+                }}>
+                  <Text style={[styles.confirmText, state.confirmTextStyle]}>
+                    {state.confirmText}
+                  </Text>
+                </TouchableOpacity>)}
+            </View>)}
+        </Animated.View>
+      </View>
+    </Modal>);
 });
 export const alertViewRef = React.createRef();
 export const showAlertModal = (props) => {
-    var _a;
-    (_a = alertViewRef.current) === null || _a === void 0 ? void 0 : _a.show(props);
+    alertViewRef.current?.show(props);
 };
+// const sleep = (msec?: number) => {
+//     return new Promise(resolve => {
+//         setTimeout(resolve, msec || 350);
+//     });
+// }
 const styles = StyleSheet.create({
     container: {
         display: "flex",
@@ -108,6 +118,7 @@ const styles = StyleSheet.create({
     wrapper: {
         flexGrow: 0,
         flexShrink: 0,
+        // minWidth: '70%',
         minWidth: deviceWidth - px2dp(60),
         backgroundColor: "white",
         overflow: "hidden",
@@ -119,6 +130,7 @@ const styles = StyleSheet.create({
         maxWidth: deviceWidth - px2dp(90),
         fontSize: px2sp(18),
         marginBottom: px2dp(20),
+        // backgroundColor: 'red',
         textAlign: "center",
         fontWeight: "bold",
         color: "#1A1A1A",
@@ -131,6 +143,7 @@ const styles = StyleSheet.create({
         flexShrink: 1,
         width: undefined,
         fontSize: px2sp(15),
+        // backgroundColor: 'red',
         color: "#1A1A1A",
         textAlign: "center",
     },
@@ -139,6 +152,7 @@ const styles = StyleSheet.create({
         flexDirection: "row",
         justifyContent: "space-between",
         alignItems: "center",
+        // backgroundColor:"red"
     },
     cancel: {
         width: "40%",

package/dist/components/Hud/Hud.js

@@ -1,4 +1,12 @@
+/*
+ * @Author: shiguo
+ * @Date: 2022-04-24 14:10:04
+ * @LastEditors: shiguo
+ * @LastEditTime: 2023-03-23 11:13:55
+ * @FilePath: /aks-fire-app/node_modules/@aks-dev/easyui/lib/Hud/Hud.tsx
+ */
 import * as React from 'react';
+// import { StyleSheet } from 'react-native'
 import { alertViewRef, default as AlertView, showAlertModal } from './AlertView/AlertView';
 import { alertBottomViewRef, default as AlertBottomView, showAlertBottomModal } from './AlertBottomView/AlertBottomView';
 import { alertSheetViewRef, default as AlertSheetView, showAlertSheetModal } from './AlertSheetView/AlertSheetView';
@@ -6,13 +14,16 @@ import { hideLoading, Loading, loadingRef, showLoading } from './Loading/Loading
 import { showToast, Toast, toastRef } from './Toast/Toast';
 import { showPopoverView, hidePopoverView, popoverViewRef, PopoverView } from './PopoverView/PopoverView';
 import { showScanner, hideScanner, scannerRef, Scanner } from './Scanner/Scanner';
-export const Hud = () => React.cloneElement(React.createElement(React.Fragment, null), {}, [
-    React.createElement(Loading, { key: "hud-0", ref: loadingRef }),
-    React.createElement(Toast, { key: "hud-1", ref: toastRef }),
-    React.createElement(AlertView, { key: "hud-2", ref: alertViewRef }),
-    React.createElement(AlertBottomView, { key: "hud-3-0", ref: alertBottomViewRef }),
-    React.createElement(AlertSheetView, { key: "hud-3-1", ref: alertSheetViewRef }),
-    React.createElement(PopoverView, { key: "hud-4", ref: popoverViewRef }),
-    React.createElement(Scanner, { key: "hud-5", ref: scannerRef }),
+export const Hud = () => React.cloneElement(<></>, {
+// ...StyleSheet.absoluteFillObject,
+// display: 'flex',
+}, [
+    <Loading key="hud-0" ref={loadingRef}/>,
+    <Toast key="hud-1" ref={toastRef}/>,
+    <AlertView key="hud-2" ref={alertViewRef}/>,
+    <AlertBottomView key="hud-3-0" ref={alertBottomViewRef}/>,
+    <AlertSheetView key="hud-3-1" ref={alertSheetViewRef}/>,
+    <PopoverView key="hud-4" ref={popoverViewRef}/>,
+    <Scanner key="hud-5" ref={scannerRef}/>,
 ]);
 export { showAlertModal, showToast, showLoading, hideLoading, showAlertBottomModal, showAlertSheetModal, showPopoverView, hidePopoverView, showScanner, hideScanner, };

package/dist/components/Hud/Loading/Loading.js

@@ -1,3 +1,10 @@
+/*
+ * @Author: shiguo
+ * @Date: 2022-04-24 14:27:02
+ * @LastEditors: shiguo
+ * @LastEditTime: 2022-09-09 10:55:48
+ * @FilePath: /@aks-dev/easyui/lib/Hud/Loading/Loading.tsx
+ */
 import React, { useImperativeHandle, useState } from "react";
 import { View, ActivityIndicator, StyleSheet, Text, Dimensions, TouchableOpacity, BackHandler, } from "react-native";
 export const Loading = React.forwardRef((_, ref) => {
@@ -6,6 +13,7 @@ export const Loading = React.forwardRef((_, ref) => {
     React.useEffect(() => {
         const onBackPress = () => show;
         BackHandler.addEventListener("hardwareBackPress", onBackPress);
+        // return () => BackHandler.removeEventListener('hardwareBackPress', onBackPress);
     }, [show]);
     useImperativeHandle(ref, () => ({
         showLoading: (content) => {
@@ -18,17 +26,27 @@ export const Loading = React.forwardRef((_, ref) => {
     }), [show]);
     if (!show)
         return null;
-    return (React.createElement(TouchableOpacity, { disabled: true, style: styles.container },
-        React.createElement(View, { style: styles.warpper },
-            React.createElement(ActivityIndicator, { color: "white", size: "large" }),
-            React.createElement(Text, { numberOfLines: 5, style: styles.title }, tipText))));
+    return (<TouchableOpacity disabled style={styles.container}>
+      <View style={styles.warpper}>
+        <ActivityIndicator color="white" size="large"/>
+        <Text numberOfLines={5} style={styles.title}>
+          {tipText}
+        </Text>
+      </View>
+    </TouchableOpacity>);
 });
 export const loadingRef = React.createRef();
-export const showLoading = (content) => { var _a; return (_a = loadingRef.current) === null || _a === void 0 ? void 0 : _a.showLoading(content); };
-export const hideLoading = () => { var _a; return (_a = loadingRef.current) === null || _a === void 0 ? void 0 : _a.hideLoading(); };
+export const showLoading = (content) => loadingRef.current?.showLoading(content);
+export const hideLoading = () => loadingRef.current?.hideLoading();
 const SCREEN_WIDTH = Dimensions.get("window").width;
 const styles = StyleSheet.create({
-    container: Object.assign(Object.assign({}, StyleSheet.absoluteFill), { display: "flex", justifyContent: "center", alignItems: "center" }),
+    container: {
+        ...StyleSheet.absoluteFill,
+        display: "flex",
+        justifyContent: "center",
+        alignItems: "center",
+        // backgroundColor:'red'
+    },
     warpper: {
         backgroundColor: "#00000088",
         padding: 40,

package/dist/components/Hud/PopoverView/PopoverView.js

@@ -1,3 +1,10 @@
+/*
+ * @Author: shiguo
+ * @Date: 2022-04-24 14:27:02
+ * @LastEditors: shiguo
+ * @LastEditTime: 2022-12-21 15:36:06
+ * @FilePath: /@aks-dev/easyui/lib/Hud/PopoverView/PopoverView.tsx
+ */
 import React, { useImperativeHandle, useState } from "react";
 import { StyleSheet, TouchableOpacity, BackHandler, } from "react-native";
 export const PopoverView = React.forwardRef((_, ref) => {
@@ -6,6 +13,7 @@ export const PopoverView = React.forwardRef((_, ref) => {
     React.useEffect(() => {
         const onBackPress = () => visible;
         BackHandler.addEventListener("hardwareBackPress", onBackPress);
+        // return () => BackHandler.removeEventListener('hardwareBackPress', onBackPress);
     }, [visible]);
     useImperativeHandle(ref, () => ({
         showPopoverView: (options) => {
@@ -19,14 +27,21 @@ export const PopoverView = React.forwardRef((_, ref) => {
     }), [visible]);
     if (!visible)
         return null;
-    return (React.createElement(TouchableOpacity, { activeOpacity: 1, style: [styles.container, options === null || options === void 0 ? void 0 : options.style], disabled: options === null || options === void 0 ? void 0 : options.disabled, onPress: (e) => {
+    return (<TouchableOpacity activeOpacity={1} style={[styles.container, options?.style]} disabled={options?.disabled} onPress={(e) => {
             setVisible(false);
             setOptions(undefined);
-        } }, React.isValidElement(options === null || options === void 0 ? void 0 : options.content) && (options === null || options === void 0 ? void 0 : options.content)));
+            // e.stopPropagation()
+        }}>
+      {React.isValidElement(options?.content) && options?.content}
+    </TouchableOpacity>);
 });
 export const popoverViewRef = React.createRef();
-export const showPopoverView = (options) => { var _a; return (_a = popoverViewRef.current) === null || _a === void 0 ? void 0 : _a.showPopoverView(options); };
-export const hidePopoverView = () => { var _a; return (_a = popoverViewRef.current) === null || _a === void 0 ? void 0 : _a.hidePopoverView(); };
+export const showPopoverView = (options) => popoverViewRef.current?.showPopoverView(options);
+export const hidePopoverView = () => popoverViewRef.current?.hidePopoverView();
 const styles = StyleSheet.create({
-    container: Object.assign(Object.assign({}, StyleSheet.absoluteFill), { display: "flex" }),
+    container: {
+        ...StyleSheet.absoluteFill,
+        display: "flex",
+        // backgroundColor:'red'
+    },
 });