@aks-dev/easyui 1.0.190 → 1.0.192

package/dist/components/AnimationModal/AnimationModal.js

@@ -1,25 +1,18 @@
-/*
- * @Author: shiguo
- * @Date: 2022-05-17 15:22:06
- * @LastEditors: shiguo
- * @LastEditTime: 2023-09-27 15:17:15
- * @FilePath: /@aks-dev/easyui/lib/AnimationModal/AnimationModal.tsx
- */
+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, Animated, Easing, PanResponder, StyleSheet, useWindowDimensions, BackHandler, } from "react-native";
 import * as utils from "../../utils/lazy";
-// type State = {
-//     display: 'flex' | 'none';
-// }
-// type StateReducerProps = (state: State, action: Partial<State>) => State
 export const AnimationModal = React.forwardRef((props, ref) => {
     const { animationType = "from-bottom", mask = false } = props || {};
     const { height } = useWindowDimensions();
-    // const [state, dispatch] = React.useReducer<StateReducerProps>(
-    //     (state, action) => ({ ...state, ...action }),
-    //     {
-    //         display: 'none'
-    //     })
     const [display, setDisplay] = useCallbackState("none");
     const animatedValue = React.useRef(new Animated.Value(0)).current;
     const timing = (value) => {
@@ -29,14 +22,14 @@ export const AnimationModal = React.forwardRef((props, ref) => {
             useNativeDriver: true,
             easing: Easing.ease,
         }).start(({ finished }) => {
-            /* 动画完成的回调函数 */
         });
     };
     const viewRef = React.useRef(null);
     const layoutRef = React.useRef({ h0: 0, h1: 0 });
     const getLayoutPromise = () => {
         return new Promise((resovle, reject) => {
-            viewRef.current?.measure((...args) => {
+            var _a;
+            (_a = viewRef.current) === null || _a === void 0 ? void 0 : _a.measure((...args) => {
                 if (args.length == 6) {
                     layoutRef.current.h1 = args[3];
                 }
@@ -53,11 +46,12 @@ export const AnimationModal = React.forwardRef((props, ref) => {
     };
     const getData = () => dataRef.current;
     const show = () => {
-        setDisplay("flex", async () => {
-            await utils.sleep(50);
-            await getLayoutPromise();
-            timing(-layoutRef.current?.h1);
-        });
+        setDisplay("flex", () => __awaiter(void 0, void 0, void 0, function* () {
+            var _a;
+            yield utils.sleep(50);
+            yield getLayoutPromise();
+            timing(-((_a = layoutRef.current) === null || _a === void 0 ? void 0 : _a.h1));
+        }));
         return init();
     };
     const hide = () => {
@@ -75,9 +69,9 @@ export const AnimationModal = React.forwardRef((props, ref) => {
             addEventListener.remove();
         };
     }, [display]);
-    return (<View style={Object.assign({
+    return (React.createElement(View, Object.assign({ style: Object.assign({
             display: display,
-        }, styles.container, props.style)} {...PanResponder.create({
+        }, styles.container, props.style) }, PanResponder.create({
         onStartShouldSetPanResponder: (e, gestureState) => {
             let pageY = e.nativeEvent.pageY;
             let topY = height - layoutRef.current.h1;
@@ -87,7 +81,6 @@ export const AnimationModal = React.forwardRef((props, ref) => {
             return false;
         },
         onPanResponderGrant: (e, gestureState) => {
-            // console.log({e})
             let pageY = e.nativeEvent.pageY;
             let topY = height - layoutRef.current.h1;
             if (pageY <= topY && !mask) {
@@ -95,18 +88,10 @@ export const AnimationModal = React.forwardRef((props, ref) => {
                 hide();
             }
         },
-    }).panHandlers}>
-      <Animated.View style={Object.assign({}, styles.wrapper, {
-            transform: [{ translateY: animatedValue }],
-        })} 
-    // onLayout={e => {
-    //     let target: LayoutRectangle = e.nativeEvent.layout
-    //     layoutRef.current.h1 = target.height
-    // }}
-    ref={viewRef}>
-        {props.children}
-      </Animated.View>
-    </View>);
+    }).panHandlers),
+        React.createElement(Animated.View, { style: Object.assign({}, styles.wrapper, {
+                transform: [{ translateY: animatedValue }],
+            }), ref: viewRef }, props.children)));
 });
 const styles = StyleSheet.create({
     container: {
@@ -116,7 +101,6 @@ const styles = StyleSheet.create({
         top: 0,
         bottom: 0,
         zIndex: 999,
-        // display: 'flex',
         flexDirection: "column",
         backgroundColor: "#00000055",
         overflow: "hidden",
@@ -125,14 +109,12 @@ const styles = StyleSheet.create({
         position: "absolute",
         display: "flex",
         flexDirection: "column",
-        // backgroundColor: 'pink',
         width: "100%",
         top: "100%",
     },
     empty: {
         flex: 1,
         position: "relative",
-        //  backgroundColor: 'cyan'
     },
 });
 const useCallbackState = (od) => {

package/dist/components/Badge/Badge.js

@@ -1,23 +1,15 @@
-/*
- * @Author: shiguo
- * @Date: 2022-04-21 14:40:29
- * @LastEditors: shiguo
- * @LastEditTime: 2022-07-08 15:40:21
- * @FilePath: /@aks-dev/easyui/lib/Badge/Badge.tsx
- */
 import React from "react";
 import { View, Text } from "react-native";
 import { px2dp } from "../../screen/px2dp";
 import { px2sp } from "../../screen/px2sp";
 export const Badge = (props) => {
     if (isNaN(+props.count) || Number(props.count) == 0)
-        return <View />;
-    return (<View style={[
+        return React.createElement(View, null);
+    return (React.createElement(View, { style: [
             {
                 flexGrow: 0,
                 flexShrink: 1,
                 zIndex: 1,
-                // paddingHorizontal: px2dp(0),
                 height: px2dp(16),
                 minWidth: px2dp(16),
                 borderRadius: px2dp(8),
@@ -26,10 +18,9 @@ export const Badge = (props) => {
                 backgroundColor: "red",
             },
             props.style,
-        ]}>
-      <Text style={{ fontSize: px2sp(12), color: "white", textAlign: "center" }}>
-        {" "}
-        {Number(props.count) > 99 ? "+99" : props.count}{" "}
-      </Text>
-    </View>);
+        ] },
+        React.createElement(Text, { style: { fontSize: px2sp(12), color: "white", textAlign: "center" } },
+            " ",
+            Number(props.count) > 99 ? "+99" : props.count,
+            " ")));
 };

package/dist/components/DottedLine/DottedLine.js

@@ -1,27 +1,22 @@
-/*
- * @Author: shiguo
- * @Date: 2022-07-12 15:30:19
- * @LastEditors: shiguo
- * @LastEditTime: 2022-07-12 15:33:06
- * @FilePath: /@aks-dev/easyui/lib/DottedLine/DottedLine.tsx
- */
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
 import React from "react";
 import { StyleSheet, View } from "react-native";
 export default (props) => {
-    const { vertical = false, dottedColor, dottedCount = 200, ...rest } = props;
+    const { vertical = false, dottedColor, dottedCount = 200 } = props, rest = __rest(props, ["vertical", "dottedColor", "dottedCount"]);
     const arrs = Array.from({ length: dottedCount }, (k, v) => v);
-    return (<View style={{
-            ...styles.container,
-            flexDirection: vertical ? "column" : "row",
-            ...rest.style,
-        }}>
-      {arrs.map((item, index) => {
-            return (<View key={`dotted-${index}`} style={{
-                    ...(vertical ? styles.dotted_vertical : styles.dotted_horizontal),
-                    ...(dottedColor && { backgroundColor: dottedColor }),
-                }}/>);
-        })}
-    </View>);
+    return (React.createElement(View, { style: Object.assign(Object.assign(Object.assign({}, styles.container), { flexDirection: vertical ? "column" : "row" }), rest.style) }, arrs.map((item, index) => {
+        return (React.createElement(View, { key: `dotted-${index}`, style: Object.assign(Object.assign({}, (vertical ? styles.dotted_vertical : styles.dotted_horizontal)), (dottedColor && { backgroundColor: dottedColor })) }));
+    })));
 };
 const styles = StyleSheet.create({
     container: {

package/dist/components/Echarts/EchartsView.js

@@ -1,16 +1,18 @@
-/*
- * @Author: shiguo
- * @Date: 2022-05-05 14:52:53
- * @LastEditors: shiguo
- * @LastEditTime: 2023-01-03 17:50:43
- * @FilePath: /@aks-dev/easyui/lib/Echarts/EchartsView.tsx
- */
+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 { StyleSheet, View, } from "react-native";
 import { WebView } from "react-native-webview";
 import { getHtml, toString } from "./helper";
-// type Reducer = (prevState: State, action: Partial<State>) => State;
 const EchartsView = (props) => {
+    var _a, _b;
     const [state, dispatch] = React.useReducer((prevState, ...args) => Object.assign({}, prevState, ...args), {
         width: 0,
         height: 0,
@@ -21,7 +23,8 @@ const EchartsView = (props) => {
     const rootView = React.useRef({ pageX: 0, pageY: 0, width: 0, height: 0 });
     const getRootViewlayoutPromise = () => {
         return new Promise((resovle, reject) => {
-            containerRef.current?.measure((...args) => {
+            var _a;
+            (_a = containerRef.current) === null || _a === void 0 ? void 0 : _a.measure((...args) => {
                 if (args.length == 6) {
                     rootView.current = {
                         width: args[2],
@@ -30,15 +33,15 @@ const EchartsView = (props) => {
                         pageY: args[5],
                     };
                 }
-                // console.log('RootView', rootView.current)
                 resovle(args);
             });
         });
     };
     React.useLayoutEffect(() => {
-        (async () => {
+        (() => __awaiter(void 0, void 0, void 0, function* () {
+            var _a;
             if (state.isLoaded) {
-                await getRootViewlayoutPromise();
+                yield getRootViewlayoutPromise();
                 let height = rootView.current.height
                     ? `${rootView.current.height}px`
                     : "auto";
@@ -57,8 +60,9 @@ const EchartsView = (props) => {
                     instance.setOption(${toString(props.option)});
                 })();
                 `;
-                WebViewRef.current?.injectJavaScript(run);
+                (_a = WebViewRef.current) === null || _a === void 0 ? void 0 : _a.injectJavaScript(run);
                 return () => {
+                    var _a;
                     const run = `
                     ;(function() {
                         var instance = echarts.getInstanceByDom(document.getElementById('main'));
@@ -68,75 +72,35 @@ const EchartsView = (props) => {
                         }
                     })();
                     `;
-                    WebViewRef.current?.injectJavaScript(run);
+                    (_a = WebViewRef.current) === null || _a === void 0 ? void 0 : _a.injectJavaScript(run);
                 };
             }
             return undefined;
-        })().catch((err) => {
+        }))().catch((err) => {
             console.log(err);
         });
     }, [props.option, state.isLoaded]);
-    // const injectedJavaScript = (): string => {
-    //     console.log('injectedJavaScript', props.option.xAxis.data)
-    //     let height = state.height ? `${state.height}px` : 'auto'
-    //     let width = state.width ? `${state.width}px` : 'auto'
-    //     return `
-    //             ;(function() {
-    //                 document.getElementById('main').style.height = "${height}";
-    //                 document.getElementById('main').style.width = "${width}";
-    //                 var instance = echarts.getInstanceByDom(document.getElementById('main'));
-    //                 if(instance == null){
-    //                      instance = echarts.init(document.getElementById('main'));
-    //                 }
-    //                 instance.clear();
-    //                 instance.setOption(${toString(props.option)});
-    //                 instance.on('click', function(params) {
-    //                     var seen = [];
-    //                     var paramsString = JSON.stringify(params, function(key, val) {
-    //                     if (val != null && typeof val == "object") {
-    //                         if (seen.indexOf(val) >= 0) {
-    //                         return;
-    //                         }
-    //                         seen.push(val);
-    //                     }
-    //                     return val;
-    //                     });
-    //                    // window.ReactNativeWebView.postMessage(JSON.stringify({"types":"ON_PRESS","payload": paramsString}));
-    //                 });
-    //             })();
-    //             `
-    // }
-    return (<View style={[styles.container, props.style]} ref={containerRef}>
-      <WebView ref={WebViewRef} originWhitelist={["*"]} useWebKit={true} // ios使用最新webkit内核渲染
-     allowUniversalAccessFromFileURLs={true} geolocationEnabled={true} mixedContentMode={"always"} renderLoading={() => {
-            if (props.renderLoading)
-                return props.renderLoading();
-            return (<View style={{
-                    backgroundColor: props.style?.backgroundColor || "transparent",
-                }}/>);
-        }} // 设置空View，修复ioswebview闪白
-     style={{
-            backgroundColor: props.style?.backgroundColor || "transparent",
-            opacity: 0.99, //解决闪退的办法
-        }} // 设置背景色透明，修复android闪白
-     scrollEnabled={false} 
-    // onMessage={e=>{
-    //     console.log(e)
-    // }}
-    javaScriptEnabled={true} 
-    // injectedJavaScript={injectedJavaScript()}
-    startInLoadingState={false} onLoadEnd={(_) => {
-            dispatch({ isLoaded: true });
-            // console.log('onLoadEnd')
-        }} onError={(e) => {
-            console.log("onError", e);
-        }} source={{
-            baseUrl: "",
-            html: getHtml({
-                backgroundColor: props.style?.backgroundColor || "transparent",
-            }),
-        }}/>
-    </View>);
+    return (React.createElement(View, { style: [styles.container, props.style], ref: containerRef },
+        React.createElement(WebView, { ref: WebViewRef, originWhitelist: ["*"], useWebKit: true, allowUniversalAccessFromFileURLs: true, geolocationEnabled: true, mixedContentMode: "always", renderLoading: () => {
+                var _a;
+                if (props.renderLoading)
+                    return props.renderLoading();
+                return (React.createElement(View, { style: {
+                        backgroundColor: ((_a = props.style) === null || _a === void 0 ? void 0 : _a.backgroundColor) || "transparent",
+                    } }));
+            }, style: {
+                backgroundColor: ((_a = props.style) === null || _a === void 0 ? void 0 : _a.backgroundColor) || "transparent",
+                opacity: 0.99,
+            }, scrollEnabled: false, javaScriptEnabled: true, startInLoadingState: false, onLoadEnd: (_) => {
+                dispatch({ isLoaded: true });
+            }, onError: (e) => {
+                console.log("onError", e);
+            }, source: {
+                baseUrl: "",
+                html: getHtml({
+                    backgroundColor: ((_b = props.style) === null || _b === void 0 ? void 0 : _b.backgroundColor) || "transparent",
+                }),
+            } })));
 };
 const styles = StyleSheet.create({
     container: {
@@ -146,6 +110,5 @@ const styles = StyleSheet.create({
     },
 });
 export default EchartsView;
-// React.memo(EchartsView)
 import * as echarts from "echarts/core";
 export { echarts };

package/dist/components/Echarts/demo.js

@@ -0,0 +1,201 @@
+import * as React from "react";
+import { View, StyleSheet } from "react-native";
+import EchartsView from "./EchartsView";
+import { echarts } from "./EchartsView";
+export default () => {
+    let option = {
+        color: ["#80FFA5", "#00DDFF", "#37A2FF", "#FF0087", "#FFBF00"],
+        title: {
+            text: "Gradient Stacked Area Chart",
+        },
+        tooltip: {
+            trigger: "axis",
+            axisPointer: {
+                type: "cross",
+                label: {
+                    backgroundColor: "#6a7985",
+                },
+            },
+        },
+        legend: {
+            data: ["Line 1", "Line 2", "Line 3", "Line 4", "Line 5"],
+        },
+        toolbox: {
+            feature: {
+                saveAsImage: {},
+            },
+        },
+        grid: {
+            left: "3%",
+            right: "4%",
+            bottom: "3%",
+            containLabel: true,
+        },
+        xAxis: [
+            {
+                type: "category",
+                boundaryGap: false,
+                data: ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"],
+            },
+        ],
+        yAxis: [
+            {
+                type: "value",
+            },
+        ],
+        series: [
+            {
+                name: "Line 1",
+                type: "line",
+                stack: "Total",
+                smooth: true,
+                lineStyle: {
+                    width: 0,
+                },
+                showSymbol: false,
+                areaStyle: {
+                    opacity: 0.8,
+                    color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+                        {
+                            offset: 0,
+                            color: "rgb(128, 255, 165)",
+                        },
+                        {
+                            offset: 1,
+                            color: "rgb(1, 191, 236)",
+                        },
+                    ]),
+                },
+                emphasis: {
+                    focus: "series",
+                },
+                data: [140, 232, 101, 264, 90, 340, 250],
+            },
+            {
+                name: "Line 2",
+                type: "line",
+                stack: "Total",
+                smooth: true,
+                lineStyle: {
+                    width: 0,
+                },
+                showSymbol: false,
+                areaStyle: {
+                    opacity: 0.8,
+                    color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+                        {
+                            offset: 0,
+                            color: "rgb(0, 221, 255)",
+                        },
+                        {
+                            offset: 1,
+                            color: "rgb(77, 119, 255)",
+                        },
+                    ]),
+                },
+                emphasis: {
+                    focus: "series",
+                },
+                data: [120, 282, 111, 234, 220, 340, 310],
+            },
+            {
+                name: "Line 3",
+                type: "line",
+                stack: "Total",
+                smooth: true,
+                lineStyle: {
+                    width: 0,
+                },
+                showSymbol: false,
+                areaStyle: {
+                    opacity: 0.8,
+                    color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+                        {
+                            offset: 0,
+                            color: "rgb(55, 162, 255)",
+                        },
+                        {
+                            offset: 1,
+                            color: "rgb(116, 21, 219)",
+                        },
+                    ]),
+                },
+                emphasis: {
+                    focus: "series",
+                },
+                data: [320, 132, 201, 334, 190, 130, 220],
+            },
+            {
+                name: "Line 4",
+                type: "line",
+                stack: "Total",
+                smooth: true,
+                lineStyle: {
+                    width: 0,
+                },
+                showSymbol: false,
+                areaStyle: {
+                    opacity: 0.8,
+                    color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+                        {
+                            offset: 0,
+                            color: "rgb(255, 0, 135)",
+                        },
+                        {
+                            offset: 1,
+                            color: "rgb(135, 0, 157)",
+                        },
+                    ]),
+                },
+                emphasis: {
+                    focus: "series",
+                },
+                data: [220, 402, 231, 134, 190, 230, 120],
+            },
+            {
+                name: "Line 5",
+                type: "line",
+                stack: "Total",
+                smooth: true,
+                lineStyle: {
+                    width: 0,
+                },
+                showSymbol: false,
+                label: {
+                    show: true,
+                    position: "top",
+                },
+                areaStyle: {
+                    opacity: 0.8,
+                    color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+                        {
+                            offset: 0,
+                            color: "rgb(255, 191, 0)",
+                        },
+                        {
+                            offset: 1,
+                            color: "rgb(224, 62, 76)",
+                        },
+                    ]),
+                },
+                emphasis: {
+                    focus: "series",
+                },
+                data: [220, 302, 181, 234, 210, 290, 150],
+            },
+        ],
+    };
+    return (React.createElement(View, { style: styles.container },
+        React.createElement(View, { style: { width: 100, height: 100, backgroundColor: "pink" } }),
+        React.createElement(EchartsView, { option: option, style: {
+                marginTop: 100,
+                marginHorizontal: 20,
+                height: 200,
+            } })));
+};
+const styles = StyleSheet.create({
+    container: {
+        flexGrow: 1,
+        display: "flex",
+    },
+});

package/dist/components/Echarts/helper.js

@@ -1,10 +1,3 @@
-/*
- * @Author: shiguo
- * @Date: 2022-05-05 15:56:21
- * @LastEditors: shiguo
- * @LastEditTime: 2023-01-03 17:02:57
- * @FilePath: /@aks-dev/easyui/lib/Echarts/helper.tsx
- */
 export const getHtml = (props) => {
     return `
       <!DOCTYPE html>
@@ -42,23 +35,15 @@ export const getHtml = (props) => {
       </html>
       `;
 };
-/**
- * https://res.actiiot.com/echarts/5.0.2/echarts.min.js
- *
- * https://cdnjs.cloudflare.com/ajax/libs/echarts/5.4.1/echarts.min.js
- */
 export const toString = (obj) => {
     let result = JSON.stringify(obj, function (key, val) {
-        // 对function进行特殊处理
         if (typeof val === 'function') {
             return `~ha~${val}~ha~`;
         }
         return val;
     });
-    // 再进行还原
     do {
-        result = result.replace('\"~ha~', '').replace('~ha~\"', '').replace(/\\\"/g, "\""); //最后一个replace将release模式中莫名生成的\"转换成"
+        result = result.replace('\"~ha~', '').replace('~ha~\"', '').replace(/\\\"/g, "\"");
     } while (result.indexOf('~ha~') >= 0);
     return result;
 };
-///.replace(/\\n/g, '')