@aks-dev/easyui 1.0.163 → 1.1.5

package/lib/MenuView/index.ts

@@ -1,31 +0,0 @@
-/*
- * @Author: shiguo
- * @Date: 2022-07-14 18:09:02
- * @LastEditors: shiguo
- * @LastEditTime: 2023-01-03 17:30:04
- * @FilePath: /@aks-dev/easyui/lib/MenuView/index.ts
- */
-
-import React from "react";
-import { ImageSourcePropType, StyleProp, ViewStyle, TouchableOpacityProps } from 'react-native';
-
-
-
-export type MenuItem = {
-    text: string;
-    icon?: ImageSourcePropType;
-    extra?: any
-}
-
-export type MenuProps = {
-    defaultAlignVertical?: 'bottom' | 'top';
-    defaultAlignHorizontal?: 'left' | 'right';
-    style?: StyleProp<ViewStyle> | undefined;
-    data?: MenuItem[];
-    onItemClick?: (index: number, extra?: any) => void;
-    onContainerClick?:Function;
-    activeOpacity?:number;
-} & Readonly<{ children?: React.ReactNode | undefined }> & TouchableOpacityProps
-
-
-export declare const MenuView: React.FC<MenuProps>;

package/lib/Modal/index.ts

@@ -1,10 +0,0 @@
-/*
-* @Author: shiguo
-* @Date: 2022-04-22 14:29:32
- * @LastEditors: shiguo
- * @LastEditTime: 2022-04-26 14:34:45
- * @FilePath: /@aks/easy/lib/Modal/index.ts
-*/
-
-
-export { default as Modal, ModalProps } from 'react-native-modal'

package/lib/MutiPictureView/MutiPictureView.tsx

@@ -1,259 +0,0 @@
-/*
- * @Author: OBKoro1
- * @Date: 2022-04-24 17:38:27
- * @LastEditors: shiguo
- * @LastEditTime: 2022-11-14 11:33:33
- * @FilePath: /@aks-dev/easyui/lib/MutiPictureView/MutiPictureView.tsx
- */
-
-import * as React from 'react'
-import { Image, View, StyleSheet, Keyboard, ImageSourcePropType, TouchableOpacity, MeasureOnSuccessCallback, Text } from 'react-native'
-import { px2dp } from '../../screen/px2dp'
-import { px2sp } from '../../screen/px2sp'
-
-import SYImagePicker from "@aks-dev/react-native-syan-image-picker";
-
-
-import type { MutiPictureViewProps } from '.'
-
-let icon_add_image = require('./icon_add_image.png')
-let icon_del_image = require('./icon_del_image.png')
-
-const MutiPictureView: React.FC<MutiPictureViewProps> = (props) => {
-    const {
-        bind,
-        maxCount = 6,
-        type = 'showImagePicker',
-        addIcon,
-        addIconStyle,
-        addIconContainerStyle,//borderWidth: 1, borderStyle: 'dashed', borderColor: assets.color_A3A9CC  虚线框
-        itemContainerStyle,
-        emptyPlaceHolderStyle,
-        delIcon,
-        delIconStyle,
-        spacingHorizontal = px2dp(15),
-        spacingInner = px2dp(8),
-        editable = true,
-        showEmptyPlaceHolder = false
-    } = props
-    const { viewModel, setViewModel } = bind
-    React.useEffect(() => {
-
-
-    }, [])
-
-    const [sideLength, setSideLength] = React.useState<number>(0)
-
-
-
-    const addPhoto = () => {
-        let images: any[] = viewModel.photos || []
-        if (!images) {
-            throw new Error("viewModel没有定义photos字段")
-        }
-
-        if (type == 'showImagePicker') {
-            SYImagePicker.showImagePicker({ imageCount: maxCount - (viewModel.photos?.length || 0), isCrop: false, isRecordSelected: false, quality: 20 }, (err, photos) => {
-                if (!err) {
-                    let imgs = photos.map((it) => { return { uri: it.uri } })
-                    images = images.concat(imgs)
-                    setViewModel({ photos: images })
-                }
-            })
-        }
-
-        if (type == 'openCamera') {
-            SYImagePicker.openCamera({ imageCount: maxCount - (viewModel.photos?.length || 0), isCrop: false, isRecordSelected: false, quality: 20 }, (err, photos) => {
-                if (!err) {
-                    let imgs = photos.map((it) => { return { uri: it.uri } })
-                    images = images.concat(imgs)
-                    setViewModel({ photos: images })
-                } else {
-                    console.log('打开相机失败')
-                }
-            })
-        }
-
-
-
-    }
-
-    const deletePhoto = (index: number) => {
-        Keyboard.dismiss()
-        let photos = [...viewModel.photos || []]
-        photos.splice(index, 1)
-        setViewModel({ photos: photos })
-    }
-
-    const showPhoto = (index: number) => {
-        Keyboard.dismiss()
-        let imgs: any[] = (props.value || viewModel.photos)?.filter((it) => { return (typeof it === 'string' && it.indexOf('http') >= 0) || typeof it == 'object' }) || []
-        let images: any[] = []
-        // console.log('viewModel', viewModel, imgs)
-        imgs.forEach(it => {
-            if (typeof it === 'string') {
-                images.push({ uri: it })
-            } else {
-                images.push(it)
-            }
-        })
-        setViewModel({
-            imageViewer: {
-                imageUrls: images.map((it) => {
-                    return it.uri
-                }),
-                index: index,
-                visible: true,
-            }
-        })
-    }
-
-
-
-
-
-
-    const ItemView: React.FC<{ source: ImageSourcePropType, index: number }> = ({ source, index }) => {
-
-        return (
-            <TouchableOpacity style={[styles.item_container, itemContainerStyle, {
-                marginTop: index < 3 ? 0 : spacingInner,
-                marginLeft: index % 3 == 0 ? spacingHorizontal : spacingInner,
-                width: sideLength,
-                height: sideLength,
-            }]} activeOpacity={0.8} onPress={() => showPhoto(index)}>
-                <Image source={source} style={{ width: '100%', height: '100%' }} resizeMode='cover' />
-                {
-                    editable && !props.value &&
-                    <TouchableOpacity onPress={() => deletePhoto(index)} style={[styles.del_img_container, delIconStyle]}>
-                        <Image source={delIcon ? delIcon : icon_del_image} resizeMode='contain' style={{ width: '100%', height: '100%' }} />
-                    </TouchableOpacity>
-                }
-            </TouchableOpacity>
-        )
-
-
-    }
-
-
-
-    const containerRef = React.useRef<{ measure: (callback: MeasureOnSuccessCallback) => void }>()
-
-    React.useEffect(() => {
-        containerRef.current?.measure((...args) => {
-            // console.log('measure', args[2])
-            if (args.length > 3) {
-                let _sideLength = +((args[2] - spacingHorizontal * 2 - spacingInner * 2) / 3).toFixed(1);
-                setSideLength(_sideLength - 0.1)
-            }
-
-        })
-    })
-
-
-
-    if (props.value && props.value?.length > 0) {
-        return (
-            <View style={[styles.container, props.style]} ref={containerRef as any}>
-                {props.value instanceof Array && props.value?.map((item, index) => {
-                    return <ItemView key={index} source={typeof item === 'string' ? { uri: item } : item} index={index} />
-                })}
-
-                {
-                    showEmptyPlaceHolder && maxCount - (props.value?.length || 0) - 1 > 0 &&
-                    Array.from({ length: maxCount - (props.value?.length || 0) - (editable ? 1 : 0) }, (_, k) =>
-                        <View key={`sg-showEmptyPlaceHolder-${k}`} style={[styles.empty_place_container, emptyPlaceHolderStyle, itemContainerStyle, {
-                            marginTop: k + (editable ? 1 : 0) + (props.value?.length || 0) > 2 ? spacingInner : 0,
-                            marginLeft: (k + (editable ? 1 : 0) + (props.value?.length || 0)) % 3 == 0 ? spacingHorizontal : spacingInner,
-                            width: sideLength,
-                            height: sideLength,
-                        }]} />
-                    )
-                }
-            </View >
-        )
-    }
-
-    return (
-        <View style={[styles.container, props.style]} ref={containerRef as any}>
-            {viewModel?.photos instanceof Array && viewModel.photos.map((item, index) => {
-                return <ItemView key={index} source={typeof item === 'string' ? { uri: item } : item} index={index} />
-            })}
-
-            {
-                !(viewModel?.photos?.length == maxCount) && editable && (
-                    <TouchableOpacity style={[styles.item_container, itemContainerStyle, {
-                        marginTop: (viewModel?.photos?.length || 0) >= 3 ? spacingInner : 0,
-                        marginLeft: (viewModel?.photos?.length || 0) % 3 == 0 ? spacingHorizontal : spacingInner,
-                        width: sideLength,
-                        height: sideLength,
-                    }, addIconContainerStyle]} activeOpacity={0.8} onPress={() => addPhoto()}>
-                        <Image source={addIcon ? addIcon : icon_add_image} style={[{ width: '25%', height: '25%' }, addIconStyle]} resizeMode='contain' />
-                        {props.addText && <Text style={[{ fontSize: px2sp(12), color: 'lightgrey', marginTop: px2dp(2) }, props.addTextStyle]}>{props.addText}</Text>}
-                    </TouchableOpacity>
-
-                )
-            }
-            {
-                showEmptyPlaceHolder && maxCount - (viewModel.photos?.length || 0) - 1 > 0 &&
-                Array.from({ length: maxCount - (viewModel.photos?.length || 0) - (editable ? 1 : 0) }, (_, k) =>
-                    <View key={`sg-showEmptyPlaceHolder-${k}`} style={[styles.empty_place_container, emptyPlaceHolderStyle, itemContainerStyle, {
-                        marginTop: k + (editable ? 1 : 0) + (viewModel.photos?.length || 0) > 2 ? spacingInner : 0,
-                        marginLeft: (k + (editable ? 1 : 0) + (viewModel.photos?.length || 0)) % 3 == 0 ? spacingHorizontal : spacingInner,
-                        width: sideLength,
-                        height: sideLength,
-                    }]} />
-                )
-            }
-        </View >
-
-    )
-}
-
-
-
-
-
-
-
-
-const styles = StyleSheet.create({
-    container: {
-        flex: 1,
-        minHeight: 1,
-        backgroundColor: 'transparent',
-        display: 'flex',
-        flexDirection: 'row',
-        flexWrap: 'wrap',
-        // borderRadius: px2dp(10),
-    },
-    item_container: {
-        overflow: 'hidden',
-        borderRadius: px2dp(10),
-        display: 'flex',
-        position: 'relative',
-        justifyContent: 'center',
-        alignItems: 'center',
-        backgroundColor: '#ededed',
-    },
-
-    del_img_container: {
-        position: 'absolute',
-        right: 2,
-        top: 2,
-        width: px2dp(24),
-        height: px2dp(24)
-    },
-    empty_place_container: {
-        borderRadius: px2dp(10),
-        backgroundColor: '#ededed',
-        borderColor: '#cccccc',
-        borderWidth: .75,
-    }
-})
-
-
-export default React.memo(MutiPictureView, (prevProps, nextProps) => false);
-
-
-

package/lib/PictureViewer/PictureViewer.tsx

@@ -1,80 +0,0 @@
-/*
- * @Author: shiguo
- * @Date: 2022-04-24 15:58:39
- * @LastEditors: shiguo
- * @LastEditTime: 2022-04-26 12:38:13
- * @FilePath: /@aks/easy/lib/PictureViewer/PictureViewer.tsx
- */
-
-import * as React from 'react'
-import { Modal, StatusBar, Platform } from 'react-native'
-import ImageViewer from "react-native-image-zoom-viewer";
-
-import type { BindProps } from './index'
-
-export const PictureViewer: React.FC<{ bind: BindProps }> = ({ bind }) => {
-
-    const { viewModel, setViewModel } = bind
-    const visible = viewModel.imageViewer.visible
-    const imgs = viewModel.imageViewer.imageUrls?.map(item => ({ url: item }))
-    const index = viewModel.imageViewer.index
-
-    React.useEffect(() => {
-        if (Platform.OS == 'android') {
-            if (visible) {
-                StatusBar.setBackgroundColor('black')
-                StatusBar.setBarStyle('light-content')
-            } else {
-                StatusBar.setBackgroundColor('transparent')
-                StatusBar.setBarStyle('dark-content')
-            }
-        }
-    }, [visible])
-
-
-
-    return (
-        <Modal
-            presentationStyle='overFullScreen'
-            visible={visible}
-            transparent={false}
-            onRequestClose={() => {
-                /**
-                 * 【官方文档】
-                 * onRequestClose回调会在用户按下 Android 设备上的后退按键或是 Apple TV 上的菜单键时触发。
-                 * 请务必注意本属性在 Android 平台上为必填，且会在 modal 处于开启状态时阻止BackHandler事件。
-                 */
-                setViewModel({
-                    imageViewer: {
-                        ...viewModel.imageViewer,
-                        visible: false
-                    }
-                })
-            }}
-            style={{ margin: 0, backgroundColor: 'red' }}
-        >
-            <ImageViewer
-                imageUrls={imgs}
-                index={index}
-                onSwipeDown={() => {
-                    // console.log('onSwipeDown');
-                }}
-                saveToLocalByLongPress={false}
-                // onMove={data => console.log(data)}
-                useNativeDriver={true}
-                enableSwipeDown={true}
-                onClick={() => {
-                    setViewModel({
-                        imageViewer: {
-                            ...viewModel.imageViewer,
-                            visible: false
-                        }
-                    })
-                }}
-            />
-        </Modal>
-    )
-}
-
-
-

package/lib/PictureViewer/index.ts

@@ -1,26 +0,0 @@
-/*
- * @Author: shiguo
- * @Date: 2022-04-24 17:10:21
- * @LastEditors: shiguo
- * @LastEditTime: 2022-04-26 11:35:20
- * @FilePath: /@aks/easy/lib/PictureViewer/index.ts
- */
-
-
-type ViewModelProps = {
-    imageViewer: {
-        imageUrls: any[],
-        index: number,
-        visible: boolean
-    }
-}
-
-
-export type BindProps = {
-    viewModel: ViewModelProps,
-    setViewModel: (intent: Partial<ViewModelProps>) => void
-}
-
-
-
-export declare const PictureViewer: React.FC<{ bind: BindProps }>;

package/lib/RefreshList/RefreshList.tsx

@@ -1,235 +0,0 @@
-import * as React from 'react';
-import { View, Text, Animated, StyleSheet, ActivityIndicator, TouchableOpacity } from 'react-native';
-import { SwipeListView, RowMap } from 'react-native-swipe-list-view'
-
-
-
-import {
-    FlatListRefreshProps,
-    SectionListRefreshProps,
-    SwipeListViewRefreshProps,
-    RefreshListProps,
-    RefreshState,
-    RefreshText
-} from './index'
-
-
-
-
-export default React.forwardRef((props: RefreshListProps, ref: React.Ref<any>) => {
-    const {
-        mode = 'FlatList',
-        refreshState,
-        onHeaderRefresh,
-        onFooterRefresh,
-        reload,
-        ...rest
-    } = props
-
-
-    const seed = React.useRef(Math.random()).current
-
-
-    let onRefresh = () => {
-        if (refreshState == RefreshState.HeaderRefreshing) return
-        if (refreshState == RefreshState.FooterRefreshing) return
-        onHeaderRefresh && onHeaderRefresh(RefreshState.HeaderRefreshing)
-    }
-
-    let onEndReached = (info: unknown) => {
-
-        if (mode == 'FlatList') {
-            props = props as FlatListRefreshProps;
-            if (!(props.data instanceof Array)) {
-                throw new Error('[sg:FlatList] data is not Array')
-            }
-            if (props.data.length == 0) return
-        }
-
-        if (mode == 'SectionList') {
-            props = props as SectionListRefreshProps;
-            if (!(props.sections instanceof Array)) {
-                throw new Error('[sg:SectionList] sections is not Array')
-            }
-            if (props.sections.length == 0) return
-        }
-
-        if (refreshState != RefreshState.Idle) return
-        onFooterRefresh && onFooterRefresh(RefreshState.FooterRefreshing)
-    }
-
-
-
-    switch (mode) {
-        case 'FlatList':
-            let flatListProps: FlatListRefreshProps = props as FlatListRefreshProps
-            return (
-                <Animated.FlatList
-                    {...rest as FlatListRefreshProps}
-                    ref={ref}
-                    refreshing={refreshState == RefreshState.HeaderRefreshing}
-                    keyExtractor={(_, index) => { return `sg-index-FlatList-${seed}-${index}` }}
-                    contentContainerStyle={flatListProps.data?.length ? {} : { height: "100%" }}
-                    onRefresh={onRefresh}
-                    onEndReachedThreshold={0.1}
-                    onEndReached={onEndReached}
-                    showsVerticalScrollIndicator={false}
-                    ListHeaderComponent={(_) => (
-                        <View style={{ display: 'flex', flexDirection: 'column' }}>
-                            <ListHeaderComponent {...flatListProps} />
-                            {flatListProps.ListHeaderComponent}
-                        </View>
-                    )}
-                    ListFooterComponent={(_) => <ListFooterComponent {...flatListProps} />}
-
-                />
-            )
-
-        case 'SectionList':
-            let sectionListProps: SectionListRefreshProps = props as SectionListRefreshProps;
-            const { ItemSeparatorComponent = (_) => (
-                <View style={{ height: 1 }} />
-            ) } = sectionListProps
-            return (
-                <Animated.SectionList
-                    {...rest as SectionListRefreshProps}
-                    ref={ref}
-                    refreshing={refreshState == RefreshState.HeaderRefreshing}
-                    onRefresh={onRefresh}
-                    keyExtractor={(_, index) => { return `sg-index-SectionList-${seed}-${index}` }}
-                    contentContainerStyle={sectionListProps.sections?.length > 0 ? {} : { height: "100%" }}
-                    ItemSeparatorComponent={ItemSeparatorComponent}
-                    onEndReachedThreshold={0.1}
-                    onEndReached={onEndReached}
-                    showsVerticalScrollIndicator={false}
-                    // ListHeaderComponent={(_) => <ListHeaderComponent {...sectionListProps} />}
-                    ListHeaderComponent={(_) => (
-                        <View style={{ display: 'flex', flexDirection: 'column' }}>
-                            <ListHeaderComponent {...flatListProps} />
-                            {sectionListProps.ListHeaderComponent}
-                        </View>
-                    )}
-                    ListFooterComponent={(_) => <ListFooterComponent {...sectionListProps} />}
-                    renderSectionHeader={sectionListProps.renderSectionHeader}
-                />
-            )
-
-        case 'SwipeList':
-            let swipeListProps: SwipeListViewRefreshProps = props as SwipeListViewRefreshProps
-            const { renderHiddenItem = (data, rowMap) => (
-                <View style={{ backgroundColor: 'red', height: '100%', alignItems: 'flex-end', justifyContent: "center" }}>
-                    <Text>Right </Text>
-                </View>
-            ) } = swipeListProps
-            return (
-                <SwipeListView
-                    {...rest as SwipeListViewRefreshProps}
-                    rightOpenValue={-100}
-                    leftOpenValue={0}
-                    ref={ref}
-                    disableLeftSwipe={false}
-                    disableRightSwipe={true}
-                    onRefresh={onRefresh}
-                    refreshing={refreshState == RefreshState.HeaderRefreshing}
-                    ItemSeparatorComponent={ItemSeparatorComponent}
-                    onEndReachedThreshold={0.1}
-                    onEndReached={onEndReached}
-                    showsVerticalScrollIndicator={false}
-                    ListHeaderComponent={(_) => (
-                        <View style={{ display: 'flex', flexDirection: 'column' }}>
-                            <ListHeaderComponent {...flatListProps} />
-                            {swipeListProps.ListHeaderComponent}
-                        </View>
-                    )}
-                    ListFooterComponent={(args) => <ListFooterComponent {...swipeListProps} />}
-                    renderHiddenItem={renderHiddenItem}
-                />
-
-            )
-    }
-
-})
-
-
-
-
-
-
-
-const ListFooterComponent = React.memo((props: RefreshListProps) => {
-    const {
-        refreshState,
-        reload,
-    } = props
-
-    switch (refreshState) {
-        case RefreshState.Idle:
-        case RefreshState.FooterRefreshing:
-            return (
-                <View style={{ ...styles.container, flexDirection: 'row' }}>
-                    <ActivityIndicator color={'gray'} />
-                    <Text style={{ ...styles.text, marginLeft: 5 }}>{RefreshText.FooterRefreshing}</Text>
-                </View>
-            )
-        case RefreshState.NoMoreData:
-            return (
-                <View style={styles.container}>
-                    <Text style={{ ...styles.text, color: '#999999' }}>{RefreshText.NoMoreData}</Text>
-                </View>
-            )
-        case RefreshState.Failure:
-            return (
-                <View style={styles.container}>
-                    <TouchableOpacity onPress={() => reload && reload()}>
-                        <Text style={styles.text}>{RefreshText.Failure}</Text>
-                    </TouchableOpacity>
-                </View>
-            )
-        case RefreshState.EmptyData:
-            if (props.renderListEmptyComponent) return props.renderListEmptyComponent()
-            return (
-                <View style={styles.container}>
-                    <TouchableOpacity onPress={() => reload && reload()}>
-                        <Text style={styles.text}>{RefreshText.EmptyData}</Text>
-                    </TouchableOpacity>
-                </View>
-            )
-        default:
-            return <View />
-    }
-})
-
-
-const ListHeaderComponent = React.memo((props: RefreshListProps) => {
-    const { refreshState } = props
-    switch (refreshState) {
-        case RefreshState.HeaderRefreshing:
-            return (
-                <View style={{ ...styles.container, }}>
-                    <Text style={{ ...styles.text, }}>{RefreshText.HeaderRefreshing}</Text>
-                </View>
-            )
-        default:
-            return <View />
-    }
-})
-
-
-
-
-const styles = StyleSheet.create({
-    container: {
-        display: 'flex',
-        flexDirection: 'column',
-        justifyContent: "center",
-        alignItems: 'center',
-        height: 44,
-        // backgroundColor:'cyan'
-    },
-    text: {
-        color: 'gray',
-        lineHeight: 16,
-        fontSize: 13,
-    },
-})
-

package/lib/RefreshList/demo.tsx

@@ -1,30 +0,0 @@
-import * as React from 'react'
-import { View, TouchableOpacity, Text } from 'react-native'
-
-import { RefreshList, RefreshState } from './index'
-
-
-
-const App = () => {
-
-    const [refreshState, setRefreshState] = React.useState(RefreshState.Idle)
-
-    
-    return (
-        <RefreshList
-                data={['a', 'b']}
-                renderItem={({ item, index }) => {
-
-                    return <View>{item}</View>
-                }}
-
-                refreshState={refreshState}
-                onHeaderRefresh={() => {
-
-                }}
-                onFooterRefresh={() => {
-
-                }}
-            />
-    )
-}