@aks-dev/easyui 1.0.10

package/lib/WithLoadingContainer/WithLoadingContainer.tsx

@@ -0,0 +1,93 @@
+/*
+ * @Author: shiguo
+ * @Date: 2022-04-20 14:56:47
+ * @LastEditors: shiguo
+ * @LastEditTime: 2022-05-09 14:35:04
+ * @FilePath: /@aks/easyui/lib/WithLoadingContainer/WithLoadingContainer.tsx
+ */
+import React from 'react';
+import { View, Image, Text, StyleSheet, TouchableOpacity } from 'react-native'
+const loading = require('./loading.gif')
+const loading3 = require('./loading3.gif')
+import { WithLoadingContainerProps, Status } from '.'
+
+
+
+export default (props: Partial<WithLoadingContainerProps>) => {
+    const {
+        status = Status.NONE,
+        renderFailComponent,
+        renderEmptyComponent,
+        renderNomoreComponent,
+        reload,
+        failText = '网络请求失败，点击重新加载~',
+        emptyText = '暂无数据',
+        nomoreText = '没有更多数据了～',
+    } = props
+
+
+
+    return (
+        <View style={props.style}>
+            <>
+                {(() => {
+
+                    switch (status) {
+                        case Status.NONE: return undefined;
+                        case Status.SUCCESS: return props.children;
+                        case Status.LOADING: return <Loading />;
+                        case Status.FAIL:
+                            if (renderFailComponent) return renderFailComponent();
+                            return (
+                                <TouchableOpacity disabled={!reload} onPress={reload} style={styles.container}>
+                                    <Text style={styles.text}>{failText}</Text>
+                                </TouchableOpacity>
+                            );
+                        case Status.EMPTY:
+                            if (renderEmptyComponent) return renderEmptyComponent();
+                            return (
+                                <TouchableOpacity disabled={!reload} onPress={reload} style={styles.container}>
+                                    <Text style={styles.text}>{emptyText}</Text>
+                                </TouchableOpacity>
+                            );
+                        case Status.NOMORE:
+                            return (
+                                <>
+                                    {props.children}
+                                    {renderNomoreComponent ? renderNomoreComponent() : <Text style={styles.text}>{nomoreText}</Text>}
+                                </>
+                            );
+                        default: return <Text style={[styles.text, { lineHeight: 44, }]}>(^_^)∠※ 送你一束小花</Text>;
+
+                    }
+                })()}
+            </>
+        </View>
+    )
+}
+
+
+
+const Loading = () => {
+    return (
+        <View style={styles.container}>
+            <Image source={loading3} style={{ width: 20, height: 20 }} resizeMode='contain' />
+        </View>
+    )
+}
+
+
+const styles = StyleSheet.create({
+    text: {
+        color: '#999999',
+        fontSize: 14,
+        // textAlign: 'center',
+    },
+    container: {
+        display: 'flex',
+        minHeight: 44,
+        justifyContent: 'center',
+        alignItems: 'center',
+        paddingHorizontal:15
+    }
+})

package/lib/WithLoadingContainer/index.ts

@@ -0,0 +1,36 @@
+/*
+ * @Author: shiguo
+ * @Date: 2022-04-20 15:33:30
+ * @LastEditors: shiguo
+ * @LastEditTime: 2022-04-29 10:54:37
+ * @FilePath: /@aks/easyui/lib/WithLoadingContainer/index.ts
+ */
+
+
+
+import React from 'react'
+import { ViewProps, GestureResponderEvent } from 'react-native'
+
+
+export enum Status {
+    NONE = 'NONE',
+    LOADING = 'LOADING',
+    FAIL = 'FAIL',
+    SUCCESS = 'SUCCESS',
+    EMPTY = 'EMPTY',
+    NOMORE = 'NOMORE',
+}
+
+export type WithLoadingContainerProps = {
+    status: Status;
+    reload: (event: GestureResponderEvent) => void;
+    failText: string;
+    emptyText: string;
+    nomoreText: string;
+    renderEmptyComponent: () => React.ReactNode;
+    renderFailComponent: () => React.ReactNode;
+    renderNomoreComponent: () => React.ReactNode;
+} & ViewProps
+
+
+export declare const WithLoadingContainer: React.FC<Partial<WithLoadingContainerProps>>

package/package.json

@@ -0,0 +1,59 @@
+{
+  "name": "@aks-dev/easyui",
+  "version": "1.0.10",
+  "description": "React Native Tools for iOS & Android",
+  "main": "./src/index.ts",
+  "typings": "./src/index.d.ts",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "keywords": [
+    "react",
+    "react-native",
+    "@aks/easyui"
+  ],
+  "files": [
+    "/android",
+    "!/android/build",
+    "/ios",
+    "/*.podspec",
+    "/src",
+    "/lib",
+    "/screen",
+    "/jsbridge",
+    "/utils",
+    "/**/*.png",
+    "!/tsconfig.json",
+    "!/tsconfig.md"
+  ],
+  "homepage": "git+https://gitee.com/the_period_of_the_ten_kingdoms/aks-easy",
+  "repository": {
+    "type": "git",
+    "url": "git+https://gitee.com/the_period_of_the_ten_kingdoms/aks-easy.git"
+  },
+  "author": "",
+  "license": "MIT",
+  "peerDependencies": {
+    "@shiguo2022/react-native-syan-image-picker": "*",
+    "react": "*",
+    "react-native": "*",
+    "react-native-webview": "*"
+  },
+  "dependencies": {
+    "echarts": "^5.3.2",
+    "react-native-image-zoom-viewer": "^3.0.1",
+    "react-native-modal": "^13.0.1",
+    "react-native-swipe-list-view": "^3.2.9"
+  },
+  "devDependencies": {
+    "@shiguo2022/react-native-syan-image-picker": "^0.5.5",
+    "@types/react": "^17.0.39",
+    "@types/react-native": "^0.67.4",
+    "react-native-webview": "^11.18.2",
+    "tslib": "^2.4.0",
+    "typescript": "^4.6.3"
+  },
+  "resolutions": {
+    "@types/react": "*"
+  }
+}

package/screen/index.ts

@@ -0,0 +1,16 @@
+/*
+ * @Author: shiguo
+ * @Date: 2022-04-19 10:25:14
+ * @LastEditors: shiguo
+ * @LastEditTime: 2022-04-26 11:53:21
+ * @FilePath: /@aks/easy/screen/index.ts
+ */
+export declare const deviceWidth: number;      //设备的宽度
+export declare const deviceHeight: number;      //设备的高度
+export declare const isAndroid: boolean;
+export declare const isIos: boolean;
+export declare const px2dp: (uiElePx: number) => number;
+export declare const px2sp: (fontSize: number) => number;
+export declare const isiPhoneX: boolean;
+export declare const statusBarHeight: number;
+export declare const navigationBarHeight: number; 

package/screen/px2dp.tsx

@@ -0,0 +1,44 @@
+import { Dimensions, StatusBar, Platform } from 'react-native';
+
+
+// 设备宽度，单位 dp
+export const deviceWidth = Dimensions.get('window').width;      //设备的宽度
+export const deviceHeight = Dimensions.get('window').height;    //设备的高度
+export const isAndroid = Platform.OS === "android"
+export const isIos = Platform.OS === 'ios'
+
+/** 
+ * 375px/667px 
+ * */
+const uiWidthPx = 375;
+
+
+
+// const pixelRatio = PixelRatio.get()
+// const deviceWidthPx = PixelRatio.getPixelSizeForLayoutSize(deviceWidth);
+
+
+
+export const px2dp = (uiElePx: number) => {
+    return Math.round(uiElePx * deviceWidth / uiWidthPx);
+}
+
+
+
+export const isiPhoneX = isIos && (deviceHeight > 736)
+
+
+
+export const statusBarHeight = (() => {
+    if (isAndroid) {
+        if ((StatusBar.currentHeight || 0) > 20) return 40
+    }
+    if (isiPhoneX) return 44
+    return 20
+})()
+
+export const navigationBarHeight = (() => {
+    if (isAndroid) return statusBarHeight + 44
+    if (isiPhoneX) return 88
+    return 64
+})()

package/screen/px2sp.tsx

@@ -0,0 +1,65 @@
+import { Dimensions, PixelRatio } from 'react-native';
+const pixelRatio = PixelRatio.get();
+const width = Dimensions.get('window').width;      //设备的宽度
+const height = Dimensions.get('window').height;    //设备的高度
+
+export const px2sp = (size: number) => {
+    if (pixelRatio === 2) {
+        // iphone 5s and older Androids
+        if (width < 360) {
+            return size * 0.95;
+        }
+        // iphone 5
+        if (height < 667) {
+            return size;
+            // iphone 6-6s
+        } else if (height >= 667 && height <= 735) {
+            return size * 1.15;
+        }
+        // older phablets
+        return size * 1.25;
+    }
+    if (pixelRatio === 3) {
+        // catch Android font scaling on small machines
+        // where pixel ratio / font scale ratio => 3:3
+        if (width <= 360) {
+            return size;
+        }
+        // Catch other weird android width sizings
+        if (height < 667) {
+            return size * 1.15;
+            // catch in-between size Androids and scale font up
+            // a tad but not too much
+        }
+        if (height >= 667 && height <= 735) {
+            return size * 1.2;
+        }
+        // catch larger devices
+        // ie iphone 6s plus / 7 plus / mi note 等等
+        return size * 1.27;
+    }
+    if (pixelRatio === 3.5) {
+        // catch Android font scaling on small machines
+        // where pixel ratio / font scale ratio => 3:3
+        if (width <= 360) {
+            return size;
+            // Catch other smaller android height sizings
+        }
+        if (height < 667) {
+            return size * 1.2;
+            // catch in-between size Androids and scale font up
+            // a tad but not too much
+        }
+        if (height >= 667 && height <= 735) {
+            return size * 1.25;
+        }
+        // catch larger phablet devices
+        return size * 1.4;
+    }
+    // if older device ie pixelRatio !== 2 || 3 || 3.5
+    return size;
+};
+
+
+
+

package/screen/text-set.tsx

@@ -0,0 +1,58 @@
+/*
+ * @Author: shiguo
+ * @Date: 2022-04-15 14:15:07
+ * @LastEditors: shiguo
+ * @LastEditTime: 2022-04-26 14:39:27
+ * @FilePath: /@aks/easy/screen/text-set.tsx
+ */
+/**
+ * 全局配置Text
+ */
+
+import React from 'react';
+import { Platform, Text as Text_spaceName, TextInput as TextInput_spaceName } from 'react-native';
+const Text: any = Text_spaceName
+const TextInput: any = TextInput_spaceName
+const textDefaultStyle = {
+    ...Platform.select({
+        android: { fontFamily: 'DroidSansFallback' }
+    }),
+    allowFontScaling: false,
+    paddingVertical: 0,
+    paddingHorizontal: 0,
+};
+
+
+
+const textRender = Text.render;
+Text.render = function (...args: any[]) {
+    const origin = textRender.call(this, ...args);
+    return React.cloneElement(origin, {
+        style: [textDefaultStyle, origin.props.style]
+    });
+};
+
+
+const textInputDefaultStyle = {
+    defaultProps: false,
+    paddingVertical: 0,
+    paddingHorizontal: 0,
+    autoCapitalize: "none", //不自动大写
+    autoCorrect: false, //不自动纠正拼写
+};
+
+const textInputRender = TextInput.render;
+TextInput.render = function (...args: any[]) {
+    const origin = textInputRender.call(this, ...args);
+    return React.cloneElement(origin, {
+        style: [textInputDefaultStyle, origin.props.style]
+    });
+};
+
+
+
+/**关闭字体缩放 */
+if (!Text.defaultProps) Text.defaultProps = {};
+if (!TextInput.defaultProps) TextInput.defaultProps = {};
+Text.defaultProps.allowFontScaling = false
+TextInput.defaultProps.allowFontScaling = false

package/src/index.d.ts

@@ -0,0 +1,58 @@
+/*
+ * @Author: shiguo
+ * @Date: 2022-04-26 11:44:22
+ * @LastEditors: shiguo
+ * @LastEditTime: 2022-05-05 16:25:03
+ * @FilePath: /@aks/easyui/src/index.d.ts
+ */
+
+
+
+/// 组件 easy-ui
+
+export * from '../lib/Badge'
+
+export * from '../lib/Easy-Hud'
+
+export * from '../lib/Modal'
+
+export * from '../lib/MutiPictureView'
+
+export * from '../lib/PictureViewer'
+
+export * from '../lib/RefreshList'
+
+export * from '../lib/TableCell'
+
+export * from '../lib/TextInputArea'
+
+export * from '../lib/WithLoadingContainer'
+
+
+export * from '../lib/StickHeaderView'
+
+export * from '../lib/Echarts'
+
+/// 全局适配
+export * from '../screen'
+
+
+
+
+
+/// 工具
+import * as utils from '../utils'
+export {
+    utils
+}
+
+//通用类型
+export type ItemProps = {
+    item: any;
+    index: number
+}
+
+
+
+///
+export * as jsbridge from '../jsbridge'

package/src/index.ts

@@ -0,0 +1,66 @@
+
+/*
+ * @Author: shiguo
+ * @Date: 2022-04-13 12:47:34
+ * @LastEditors: shiguo
+ * @LastEditTime: 2022-05-05 17:29:57
+ * @FilePath: /@aks/easyui/src/index.ts
+ */
+
+
+
+/// 组件
+
+
+export * from '../lib/Badge/Badge'
+export type { BadgeProps } from '../lib/Badge'
+
+
+export { EasyHud, ShowLoading, HideLoading, ShowToast, ShowAlertModal } from '../lib/Easy-Hud/EasyHud'
+
+export * from '../lib/Modal/Modal'
+
+export { default as MutiPictureView } from '../lib/MutiPictureView/MutiPictureView'
+
+export { PictureViewer } from '../lib/PictureViewer/PictureViewer'
+
+export { default as RefreshList } from '../lib/RefreshList/RefreshList'
+export type { RefreshListProps, RefreshState } from '../lib/RefreshList'
+
+export { default as TableCell } from '../lib/TableCell/TableCell'
+export type { TableCellProps } from '../lib/TableCell'
+
+
+export { default as TextInputArea } from '../lib/TextInputArea/TextInputArea'
+export type { TextInputAreaCurrent, TextInputAreaProps } from '../lib/TextInputArea'
+
+
+export { default as WithLoadingContainer } from '../lib/WithLoadingContainer/WithLoadingContainer'
+export { WithLoadingContainerProps, Status } from '../lib/WithLoadingContainer'
+
+
+
+export * from '../lib/StickHeaderView/StickHeaderView'
+export type { StickHeaderViewProps } from '../lib/StickHeaderView'
+
+
+export { default as EchartsView } from '../lib/Echarts/EchartsView'
+export { echarts } from '../lib/Echarts'
+export type { EchartsViewProps } from '../lib/Echarts'
+
+
+/// 全局适配
+export * from '../screen/px2dp'
+export * from '../screen/px2sp'
+
+
+/// 工具
+import * as mode from '../utils/mode'
+import * as lazy from '../utils/lazy'
+export const utils = Object.assign({}, mode, lazy)
+
+
+
+///  桥接
+import * as UpgradeModule from '../jsbridge/UpgradeModule'
+export const jsbridge = Object.assign({}, UpgradeModule)

package/utils/index.ts

@@ -0,0 +1,56 @@
+/*
+ * @Author: shiguo
+ * @Date: 2022-04-19 10:25:43
+ * @LastEditors: shiguo
+ * @LastEditTime: 2022-05-10 18:32:50
+ * @FilePath: /@aks/easyui/utils/index.ts
+ */
+
+
+import * as rn from 'react-native'
+
+/**
+ * @description: 睡眠时间
+ * @param {*}毫秒值
+ * @return {*}
+ */
+export declare const sleep: (msec?: number) => void;
+
+
+export declare const keyboardDismissHandlers: rn.GestureResponderHandlers;
+
+export type CallBack = (...args: any[]) => void;
+
+
+
+
+/**
+ * @description: 手势动作回调
+ * @param {*}
+ * @return {*}
+ */
+export declare const panHandlersCallback: (props: { GrantCallback: CallBack, MoveCallback: CallBack, ReleaseCallback: CallBack }) => void;
+
+/**
+ * @description: 拨打电话
+ * @param {number} phone
+ * @return {*}
+ */
+export declare const callTelephone: (phone: number | string) => void;
+
+/**
+ * @description: 获取随机色
+ * @param {*}
+ * @return {*}
+ */
+export declare const randomcolor: () => string;
+
+
+
+export type SyncLoopCallBack = (item: any, index: number) => void;
+/**
+ * @description: 同步遍历
+ * @param {*} dataList：数据源
+ * @return {*}
+ */
+export declare const syncLoop: (dataList: any[], callback: SyncLoopCallBack) => Promise<string>;

package/utils/lazy.tsx

@@ -0,0 +1,40 @@
+/*
+ * @Author: shiguo
+ * @Date: 2022-04-27 18:17:54
+ * @LastEditors: shiguo
+ * @LastEditTime: 2022-05-10 14:28:24
+ * @FilePath: /@aks/easyui/utils/lazy.tsx
+ */
+import type { SyncLoopCallBack } from '.'
+
+export const sleep = (msec?: number) => {
+    return new Promise(resolve => {
+        setTimeout(resolve, msec || 350);
+    });
+}
+
+
+
+
+export const randomcolor = () => {
+    return `rgba(${Math.round(Math.random() * 255)},${Math.round(Math.random() * 255)},${Math.round(Math.random() * 255)},${Math.random()})`
+}
+
+
+
+
+
+export const syncLoop = async (dataList: any[], callback: SyncLoopCallBack) => {
+    const length = dataList.length;
+    const O = Object(dataList);
+    let k = 0;
+    while (k < length) {
+        if (k in O) {
+            const kValue = O[k];
+            await callback(kValue, k);
+        }
+        k++;
+    }
+
+    return Promise.resolve('SyncForeach loop over')
+};

package/utils/mode.tsx

@@ -0,0 +1,48 @@
+/*
+ * @Author: shiguo
+ * @Date: 2022-04-18 18:40:07
+ * @LastEditors: shiguo
+ * @LastEditTime: 2022-05-09 16:21:37
+ * @FilePath: /@aks/easyui/utils/mode.tsx
+ */
+import type { CallBack } from '.'
+
+
+
+
+import { PanResponder, Keyboard, Linking } from 'react-native'
+export const keyboardDismissHandlers = PanResponder.create({
+    onStartShouldSetPanResponder: () => true,
+    onPanResponderGrant: Keyboard.dismiss
+}).panHandlers
+
+
+
+
+export const panHandlersCallback = (props: { GrantCallback: CallBack, MoveCallback: CallBack, ReleaseCallback: CallBack }) => {
+    return PanResponder.create({
+        onStartShouldSetPanResponder: () => true,
+        onMoveShouldSetPanResponder: () => true,
+        onPanResponderGrant: props.GrantCallback,
+        onPanResponderMove: props.MoveCallback,
+        onPanResponderRelease: props.ReleaseCallback
+    }).panHandlers
+
+}
+
+
+export const callTelephone = (phone: number | string) => {
+
+    let tel = 'tel:' + phone
+    Linking.canOpenURL(tel).then((supported) => {
+        if (!supported) {
+            console.warn('[sg:mode]', '模拟器不支持拨打电话')
+        } else {
+            Linking.openURL(tel)
+        }
+    }).catch(error => {
+        //alert(error.toString())
+        console.warn('[sg:mode]', error.toString())
+    })
+
+}