@zamlia/mini-ui 0.0.11 → 0.0.12

package/src/components/common/PullToPushRefresh/index.tsx

@@ -1,338 +0,0 @@
-import Taro, { useDidShow } from '@tarojs/taro';
-import
-React, {
-  MutableRefObject,
-  PropsWithChildren,
-  useEffect,
-  useImperativeHandle,
-  useRef,
-  useState
-} from 'react';
-import { Utils } from '@utils';
-import { View, Text, ScrollView } from '@tarojs/components';
-import { Loading } from '@nutui/nutui-react-taro';
-import './index.scss';
-
-export type PullToPushRefreshProps<T = Record<string, any>> = {
-  pageSize?: number
-  /** 没有数据展示内容 */
-  emptyRender?: React.ReactElement
-  /** 加载文案
- * @default 加载中...
- */
-  loadingText?: string
-  /**
-* 错误文案
-* @default 加载失败，请点击重试
-*/
-  errorText?: string
-  /**
-   * 没有数据文案
-   * @default emptyText
-   * */
-  emptyText?: string
-  /**
-  * 底部文案
-  * @default 没有更多了
-  * */
-  bottomText?: string
-  /**
-   * 是否展示底部文案
-   * @default true
-  */
-  showBottomText?: boolean
-  /**
-   * 是否展示加载图标
-   * @default true
-  */
-  showLoding?: boolean
-  /**
-   * 下拉刷新文案
-   * @default '松开即可刷新'
-   */
-  refreshText?: string
-  /**
-  * show页面是否加载数据
-  * @default false
-  */
-  showPageRequest?: boolean
-  /**
-   * 是否首次进入页面自动掉接口
-   * @default true
-   */
-  hasFirstPageAutoRequest?: boolean
-  /**
-   * 自定义每条数据的内容
-   * @param {T} item 当前条数据
-   * @param {number} index
-  */
-  renderItem: (item: T, index: number) => React.ReactElement
-  /**
-   * 请求方法
-   * @param {T} skip 当前页码
-   * @param {T} first pageSize
-   * @param {Record<string, any>} restParams 可以传其余的饿默认参数
-  */
-  // request: (skip: number, first: number, restParams?: Record<string, any>) => Promise<PullToPushRefreshRequestType
-  request: (skip: number, first: number, restParams?: Record<string, any>) => void
-}
-
-export type PullToPushRefreshRef = {
-  /**
-   * 刷新
-   * @param isFirst 是否是第一次调用
-   * @param restParams 可以传其余的饿默认参数
-   */
-  reload: (isFirst?: boolean, restParams?: Record<string, any>) => void
-  /**
-   * 设置是否可以页面show刷新
-   * @param {boolean}bol
-   */
-  showPageRequest: (bol: boolean) => void
-} | undefined
-
-export type PullToPushRefreshRequestType<T> = {
-  data: Array<T>
-  total: number
-  success: boolean
-}
-
-export type ListInfoType<T> = {
-  loading: boolean,
-  error: boolean,
-  skip: number,
-  list: Array<T>,
-  total: number
-}
-
-const PullToPushRefresh = React.forwardRef<PullToPushRefreshRef, PropsWithChildren<PullToPushRefreshProps<any>>>((props, ref) => {
-  const {
-    pageSize: _pageSize = 10,
-    emptyRender,
-    loadingText = '加载中...',
-    errorText = '加载失败，请点击重试',
-    emptyText = '没有数据',
-    bottomText = '没有更多了',
-    showBottomText = true,
-    showLoding = true,
-    showPageRequest: _showPageRequest = false,
-    // refreshText = '松开即可刷新',
-    hasFirstPageAutoRequest = true,
-    renderItem,
-    request = () => { console.error('PullToPushRefresh组件props没有传入handleQuery') },
-  } = props;
-  const flatlistRef: MutableRefObject<any> = useRef(null);
-
-  const [, setHasMore] = useState<boolean>(true);
-  const [pageSize] = useState<number>(_pageSize)
-  const [refreshing, setRefreshing] = useState<boolean>(false);
-  const [firstEnter, setFirstEnter] = useState<boolean>(true);
-  const [scrollY,] = useState<boolean>(true)
-  const [showPageRequest, setShowPageRequest] = useState<boolean>(_showPageRequest);
-
-  const [listInfo, setListInfo] = useState<ListInfoType<any>>({
-    loading: false,
-    error: true,
-    skip: 0,
-    list: [],
-    total: 0
-  })
-
-  useEffect(() => {
-    setFirstEnter(false)
-    hasFirstPageAutoRequest && handleFetchMore(true)
-  }, [])
-
-  // 使用 useImperativeHandle 定义向外暴露的方法或属性
-  useImperativeHandle(ref, () => ({
-    // 这里返回您希望向外暴露的方法或属性
-    reload: handleFetchMore,
-    showPageRequest: setShowPageRequest
-  }));
-
-  useDidShow(() => {
-    showPageRequest && !firstEnter && handleFetchMore(true)
-  })
-
-  /**
-   * 请求
-   * @param isFirst 是否是第一次调用
-   * @param restParams 可以传其余的饿默认参数
-   */
-  const handleFetchMore = async (isFirst: any = false, restParams = {}) => {
-    showLoding && Taro.showLoading({ title: loadingText })
-
-    let currentPage: number
-    if (isFirst) {
-      currentPage = 0
-      setListInfo({
-        ...listInfo,
-        loading: true,
-        skip: 0,
-        list: [],
-        total: 0,
-      })
-    } else {
-      currentPage = listInfo.skip
-      setListInfo({
-        ...listInfo,
-        loading: true,
-      })
-    }
-    const dataSource: any = await request(currentPage, pageSize, restParams);
-    let cloneDataSource = Utils.cloneDeep(dataSource);
-
-    showLoding && Taro.hideLoading()
-    // 刷新完成后，将刷新状态设置为 false
-    setRefreshing(false)
-    if (!cloneDataSource) {
-      setListInfo({
-        ...listInfo,
-        loading: false,
-        error: true
-      })
-    } else if (isFirst) {
-      setListInfo({
-        ...listInfo,
-        loading: false,
-        error: false,
-        list: [...(cloneDataSource?.data || [])],
-        skip: listInfo?.skip + pageSize!!,
-        total: cloneDataSource?.total || 0
-      })
-    } else {
-      setListInfo({
-        ...listInfo,
-        loading: false,
-        error: false,
-        list: [...listInfo.list, ...(cloneDataSource?.data || [])],
-        skip: listInfo.skip + pageSize!!,
-        total: cloneDataSource?.total || 0
-      })
-    }
-  }
-
-
-  // /**
-  //  * 下拉刷新
-  //  */
-  // const handleRefresh = () => {
-  //   // 将刷新状态设置为 true
-  //   setRefreshing(true)
-
-  //   // 进行刷新操作，例如重新请求数据
-  //   handleFetchMore(true)
-  // };
-
-  /**
-   * 上拉加载
-   */
-  const handleLoadMore = () => {
-    if (
-      !listInfo?.loading &&
-      !refreshing &&
-      listInfo.skip <= listInfo.total
-    ) {
-      if (firstEnter && !hasFirstPageAutoRequest) return
-
-      handleFetchMore();
-    } else {
-      setHasMore(true)
-    }
-  };
-
-  const renderFooter = () => {
-    const isBottom = listInfo.skip > listInfo.total;
-
-    let textRender: any = null;
-
-    if (!listInfo?.loading) {
-      if (!listInfo.error && listInfo.total !== 0) {
-        textRender = (
-          !isBottom ? null : (
-            !showBottomText ? null : (
-              <Text className='we-list__text'>{bottomText}</Text>
-            )
-          )
-        )
-      }
-    } else {
-      textRender = (
-        <>
-          {!refreshing && (
-            <Loading type='circular'>加载中...</Loading>
-          )}
-        </>
-      );
-    }
-
-    return (
-      <View className='we-list__ptpr'>
-        {textRender}
-      </View>
-    )
-  }
-
-  /** 没有数据展示内容 */
-  const renderEmpty = (): React.ReactElement | null => {
-    if (listInfo?.loading || refreshing || firstEnter) return null
-    let textRender: any = null;
-
-    if (listInfo?.error) {
-      textRender = (
-        <Text
-          onClick={() => { handleFetchMore(true) }}
-          className='we-list__bottom_text'
-        >
-          {errorText}
-        </Text>
-      )
-    } else if (listInfo.total === 0) {
-      textRender = !!emptyRender ? emptyRender : (
-        <Text className='we-list__bottom-text'>{emptyText}</Text>
-      )
-    }
-    if (!!textRender) {
-      return (
-        <View className='we-list__bottom'>
-          {textRender}
-        </View>
-      )
-    } else {
-      return null
-    }
-  };
-
-  return (
-    <View className='we-list' ref={flatlistRef}>
-      <ScrollView
-        className='scroll'
-        scrollWithAnimation
-        enableBackToTop
-        lowerThreshold={20}
-        onScrollToLower={handleLoadMore}
-        scrollY={scrollY}
-      // onTouchStart={this.handleTouchStart.bind(this)}
-      // onTouchEnd={this.handleTouchEnd.bind(this)}
-      // onTouchMove={this.handleTouchMove.bind(this)}
-      >
-        {props.children}
-        {listInfo?.list?.map((it, index) => (renderItem(it, index)))}
-        {renderEmpty()}
-        {renderFooter()}
-      </ScrollView>
-    </View>
-  )
-})
-
-type WrappedPullToPushRefreshProps<T> = {
-  actionRef: MutableRefObject<PullToPushRefreshRef>;
-} & PullToPushRefreshProps<T>;
-
-const WrappedPullToPushRefresh = <T extends Record<string, any>>(props: WrappedPullToPushRefreshProps<T>) => {
-  const { actionRef, ...restPorps } = props;
-
-  return <PullToPushRefresh ref={actionRef} {...restPorps} />;
-}
-
-export default WrappedPullToPushRefresh

package/src/components/common/Radio/index.scss

@@ -1,15 +0,0 @@
-// 样式基础文件（变量和 mixin）已通过 Taro 配置自动注入，无需手动导入
-.we-radio {
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  width: 31px;
-  height: 31px;
-  border: 2px solid #D7D7D7;
-  border-radius: 50%;
-}
-
-.we-radio--select {
-  border-color: transparent !important;
-  background: $primary-color;
-}

package/src/components/common/Radio/index.tsx

@@ -1,56 +0,0 @@
-import { Check } from '@nutui/icons-react-taro';
-import { View } from '@tarojs/components';
-import React, { useMemo } from 'react';
-import classNames from 'classnames';
-import './index.scss';
-
-export type RadioProps = {
-  /**
-   * 是否选中
-   * @default false
-   */
-  visible: boolean
-  /**
-   * 大小 大小等同于圆圈宽度
-   * @default 10
-   */
-  size?: number
-  /**
-   * 边框颜色
-   * @default '#AAAAAA'
-   */
-  borderColor?: string
-  /**
-   * 边框宽度
-   * @default 1
-   */
-  borderWidth?: number
-};
-
-const Radio: React.FC<RadioProps> = (props) => {
-  const {
-    visible = false,
-    size = 10,
-    borderColor = '#D7D7D7',
-    borderWidth = 1,
-  } = props
-
-  const circleStyles = useMemo(() => ({
-    width: size * 1.5,
-    height: size * 1.5,
-    borderWidth,
-    borderColor: visible ? '#3b4eae' : borderColor,
-  }), [])
-
-  return (
-    <View style={circleStyles}
-      className={classNames(
-        'we-radio',
-        { 'we-radio--select': visible }
-      )}>
-      {visible ? (<Check size={size} color='#ffffff' />) : null}
-    </View>
-  );
-};
-
-export default Radio;

package/src/components/common/TabPane/index.tsx

@@ -1,26 +0,0 @@
-import React, { PropsWithChildren } from 'react';
-import { View } from '@tarojs/components';
-import classNames from 'classnames'
-/** 和Tabs共用样式 */
-import '../Tabs/index.scss';
-
-export type TabPaneProps = {
-  /** 标题 */
-  title: string
-};
-
-const TabPane: React.FC<PropsWithChildren<TabPaneProps>> = (props) => {
-  const {
-    children
-  } = props
-
-  return (
-    <View
-      className={classNames('bd-tabs__pane')}
-    >
-      {children}
-    </View>
-  );
-};
-
-export default TabPane;

package/src/components/common/Tabs/index.scss

@@ -1,60 +0,0 @@
-// 样式基础文件（变量和 mixin）已通过 Taro 配置自动注入，无需手动导入
-$tabs-header-height: 92px;
-$tabs-header-title-color: #333333;
-
-.we-tabs {
-  &__header {
-    padding-inline: 20px;
-    box-sizing: border-box;
-    height: $tabs-header-height;
-    background-color: #ffffff;
-    overflow: hidden;
-
-    &-item {
-      position: relative;
-      font-size: 28px;
-      line-height: $tabs-header-height;
-      text-align: center;
-
-      &__text {
-        color: $tabs-header-title-color;
-      }
-
-      &__line {
-        position: absolute;
-        left: 0;
-        right: 0;
-        bottom: 0px;
-        margin: auto;
-        width: 59px;
-        height: 14px;
-        background: $primary-color;
-        border-radius: 7px;
-        opacity: 0;
-      }
-    }
-
-    &-item--active {
-      font-weight: bold;
-
-      .bd-tabs__header-item__line {
-        overflow: hidden;
-        opacity: 1;
-      }
-    }
-  }
-
-  &__list {
-    height: 100%;
-    display: flex;
-    align-items: center;
-  }
-
-  &__header-border {
-    border-bottom: 1px solid #F0F0F0;
-  }
-
-  &__body {
-    overflow: hidden;
-  }
-}

package/src/components/common/Tabs/index.tsx

@@ -1,107 +0,0 @@
-import React, { CSSProperties, PropsWithChildren, useMemo } from 'react';
-import { ScrollView, View } from '@tarojs/components';
-import TabPane, { TabPaneProps } from '../TabPane';
-import classNames from 'classnames';
-import './index.scss';
-
-export type TabsProps = {
-  /**
-   * 标签栏样式
-   * @default {}
-   */
-  tabStyle?: CSSProperties
-  /**
-  * 当前激活 tab 面板的值
-  * @default 0
-  */
-  value: number
-  className?: string;
-  /** 是否需要滚动 */
-  scroll?: boolean
-  tabsRender?: (dom: { tabsDom: React.ReactNode }) => React.ReactNode
-  // style?: CSSProperties;
-  onChange: (value: number) => void
-};
-
-interface TabsComponent extends React.FC<PropsWithChildren<TabsProps>> {
-  TabPane: React.FC<PropsWithChildren<TabPaneProps>>;
-}
-
-const Tabs: TabsComponent = (props) => {
-  const {
-    value = 0,
-    onChange,
-    className,
-    // style,
-    scroll,
-    tabStyle = {},
-    tabsRender: tabsRenderProps,
-    children
-  } = props;
-
-  const titles = useMemo(() => {
-    return React.Children.map(children, (child: any) => {
-      return child?.props?.title;
-    }) || [];
-  }, [children])
-
-  const tabsDom = () => {
-    const tabListDom = (
-      <>
-        {titles?.map((it: string, index: number) => (
-          <View
-            className={classNames(
-              'we-tabs__header-item',
-              { 'we-tabs__header-item--active': value === index }
-            )}
-            key={index}
-            style={{ width: `calc(100vw / ${titles?.length})` }}
-            onClick={() => { onChange(index) }}
-          >
-            <View className='we-tabs__header-item__line' />
-            <View className='we-tabs__header-item__text'>{it}</View>
-          </View>
-        ))}
-      </>
-    )
-    if (scroll) {
-      return (
-        <ScrollView style={{ whiteSpace: 'nowrap' }} scrollX className='we-tabs__scroll'>
-          <View className='we-tabs__list'>
-            {tabListDom}
-          </View>
-        </ScrollView>
-      )
-    }
-    return (
-      <View className='we-tabs__list'>
-        {tabListDom}
-      </View>
-    )
-  }
-
-  const tabsRender = () => {
-    return tabsRenderProps ? tabsRenderProps({ tabsDom: tabsDom() }) : tabsDom()
-  }
-
-  return (
-    <View className={classNames('we-tabs', className)}>
-      <View className={classNames('we-tabs__header')} style={tabStyle}>
-        {tabsRender()}
-      </View>
-      <View className='we-card__body'>
-        {React.Children.map(children, (child, index) => {
-          if (index === value) {
-            return child;
-          } else {
-            return null;
-          }
-        })}
-      </View>
-    </View>
-  );
-};
-
-Tabs.TabPane = TabPane
-
-export default Tabs;

package/src/components/common/UploadFile/index.scss

@@ -1,59 +0,0 @@
-.uploadImg {
-  display: flex;
-  flex-wrap: wrap;
-
-  &__item {
-    position: relative;
-    margin-right: 9px;
-    margin-bottom: 10px;
-    width: 140px;
-    height: 142px;
-    border-radius: 10px;
-    overflow: hidden;
-
-    .deleteImg{
-      position: absolute;
-      top: 0;
-      right: 0;
-      width: 31px;
-      height: 31px;
-      // @include bgImg('/aliyunOSSUpload_deleteIcon.png');
-    }
-
-    image {
-      width: 100%;
-      height: 100%;
-    }
-  }
-
-  &__item:nth-child(4n) {
-    margin-right: 0;
-  }
-
-  &__add {
-    position: relative;
-    width: 140px;
-    height: 142px;
-    background: #f0f0f0;
-    border-radius: 10px;
-
-    .add_icon {
-      position: absolute;
-      top: 0;
-      bottom: 0;
-      left: 0;
-      right: 0;
-      margin: auto;
-      width: 30px;
-      height: 30px;
-      // @include bgImg('/aliyunOSSUpload_addIcon.png')
-    }
-
-    .add_icon:nth-child(2) {
-      top: 25%;
-      left: 51%;
-      width: 2px;
-      height: 60px;
-    }
-  }
-}