@zamlia/mini-ui 0.0.11 → 0.0.12

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

@@ -1,153 +0,0 @@
-import React, { CSSProperties } from 'react';
-import { ITouchEvent, View } from '@tarojs/components';
-import classNames from 'classnames'
-/** 和Card共用样式 */
-import '../Card/index.scss';
-
-export type CardItemProps = {
-  /** label */
-  label: string | React.ReactElement
-  /** 值 */
-  value: string | number | React.ReactElement | null
-  /**
-   * label分割方式
-   * @default :
-   */
-  labelDivider?: string
-  /**
- * 是隐藏分割符
- * @default false
- */
-  disabledLabelDivider?: boolean
-  /**
-   * 右边区域
-   * x轴排列方向 justify = 'start' 才显示
-  */
-  extra?: React.ReactElement | string | number | null
-  /**
-   * x轴排列方向
-   * @default start
-   */
-  justify?: 'start' | 'between'
-  /**
- * y轴排列方向
- * @default center
- */
-  align?: 'center' | 'start' | 'end'
-  /**
-   * 排列方式
-   * @default inline
-   */
-  layout?: 'inline' | 'vertical'
-  /**
-   * value DOM是否脱离文档流
-   * 仅在layout == 'inline' 支持
-   * 不会影响上下item的间距
-   * @default false
-   */
-  valueAbsolute?: boolean
-  /** 自定义字体样式 */
-  labelStyle?: CSSProperties
-  valueStyle?: CSSProperties
-  className?: string
-  /** 点击事件 */
-  onClick?: (e: ITouchEvent) => void
-  /**
-   * 是否隐藏该组件
-   * @default false
-  */
-  hide?: boolean
-};
-
-const CardItem: React.FC<CardItemProps> = (props) => {
-  const {
-    label,
-    value,
-    labelDivider = ':',
-    extra,
-    justify = 'start',
-    align = 'center',
-    layout = 'inline',
-    valueAbsolute = false,
-    className,
-    disabledLabelDivider = false,
-    labelStyle = {},
-    valueStyle = {},
-    hide,
-    onClick
-  } = props
-
-  const isRow = layout === 'inline';
-
-  const labelRender = () => {
-    let _render = value;
-    // if (typeof label === 'string') {
-    _render = (
-      <View className='bd_card-item__l-text' style={labelStyle}>{label}{disabledLabelDivider ? '' : labelDivider}</View>
-    )
-    // }
-
-    return (
-      <View className={classNames(
-        'bd_card-item__l',
-        { 'bd_card-item__l-col': !isRow }
-      )}
-      >
-        {_render}
-      </View>
-    )
-  }
-
-  const valueRender = () => {
-    let _render = value;
-    if (['string', 'number']?.includes(typeof value)) {
-      _render = (
-        <View className='bd_card-item__v-text' style={valueStyle}>{value}</View>
-      )
-    }
-
-    return (
-      <View
-        className={classNames('bd_card-item__v', {
-          'bd_card-item__v-absolute': isRow && valueAbsolute
-        })}
-        style={valueStyle}
-      >
-        {_render}
-      </View>
-    )
-  }
-
-  const extraRender = () => {
-    if (!(!!extra && justify === 'start')) return null;
-
-    return (
-      <View className='bd_card-item__extra'>
-        {extra}
-      </View>
-    )
-  }
-
-  return (
-    hide ? null : (
-      <View
-        className={classNames(
-          'bd_card-item',
-          `bd_card-item--align-${align}`,
-          {
-            'bd_card-item--row': isRow,
-            'bd_card-item--col': !isRow,
-            'bd_card-item--row-start': isRow && justify === 'start',
-            'bd_card-item--row-between': isRow && justify === 'between'
-          }, className)}
-        onClick={onClick}
-      >
-        {labelRender()}
-        {valueRender()}
-        {extraRender()}
-      </View>
-    )
-  );
-};
-
-export default CardItem;

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

@@ -1,86 +0,0 @@
-import React, { useState, useEffect } from 'react';
-import { View, Picker } from '@tarojs/components';
-import { Utils } from '@utils';
-
-export type DataSelectProps = {
-  dataSource: any[]
-  rangeKey: string
-  remoteValue?: any
-  onChange: (currentItem: any) => void
-  childRender?: (currentItem: any) => React.ReactElement
-  defaultSeletItem?: any
-  defaultValue?: string
-  isSelectFirstItem?: boolean
-  classNmaes?: string
-};
-
-const DataSelect: React.FC<DataSelectProps> = (
-  {
-    dataSource,
-    rangeKey,
-    remoteValue,
-    onChange,
-    childRender,
-    defaultSeletItem = {},
-    defaultValue,
-    isSelectFirstItem = false,
-    classNmaes = 'DataSelect'
-  },
-) => {
-  const [selectItem, setSelectItem] = useState<any>(defaultSeletItem as any)
-  const [selectIndex, setSelectIndex] = useState<number>(0)
-
-  useEffect(() => {
-    if (!Utils.isEmpty(defaultSeletItem)) {
-      setSelectItem(defaultSeletItem)
-    }
-  }, [defaultSeletItem])
-
-  useEffect(() => {
-    if (isSelectFirstItem && dataSource?.length > 0) setSelectItem(dataSource[0])
-  }, [])
-
-  useEffect(() => {
-    remoteValue && setSelectItem(remoteValue)
-  }, [remoteValue])
-
-  return (
-    <View className={classNmaes}>
-      <Picker
-        mode='selector'
-        disabled={dataSource?.length === 0}
-        range={dataSource}
-        rangeKey={rangeKey}
-        value={selectIndex}
-        onChange={(e) => {
-          onChange(dataSource[e?.detail.value as any])
-          setSelectItem(dataSource[e?.detail.value as any])
-          setSelectIndex(e?.detail.value as number)
-        }}>
-        <View className='select-box'>
-          {
-            !childRender ? (
-              <>
-                <View className='text' style={{ fontWeight: "bold" }}>
-                  {
-                    !dataSource?.length ? '没有数据' : (
-                      Utils.substr(selectItem[rangeKey], 20) ||
-                      defaultValue ||
-                      '选择内容'
-                    )
-
-                  }
-                </View>
-                <View className="icon" />
-              </>
-            ) : (
-              childRender(selectItem)
-            )
-          }
-        </View>
-      </Picker>
-    </View>
-  );
-};
-
-export default DataSelect;

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

@@ -1,49 +0,0 @@
-// 样式基础文件（变量和 mixin）已通过 Taro 配置自动注入，无需手动导入
-.we-modal {
-
-  .nut-dialog {
-    position: relative;
-    min-width: 80vw;
-
-    &__content {
-      padding-inline: 24px;
-      box-sizing: border-box;
-    }
-
-    &__footer {}
-  }
-
-  &__close {
-    position: fixed !important;
-    top: 36px;
-    right: 50px;
-  }
-
-  &__btn {
-    width: 48%;
-    min-width: 230px;
-    height: 78px;
-    border-radius: 20px;
-    font-size: 24px;
-    line-height: 78px;
-    text-align: center;
-    border: 1px solid $primary-color;
-  }
-
-  &__btn-cancel {
-    margin-right: 20px;
-    background: #F0F0F0;
-    color: #666666;
-    border-color: transparent;
-  }
-
-  &__btn-confirm {
-    background: $primary-color;
-    color: #ffffff;
-  }
-
-  &__btn-confirm-large {
-    min-width: 330px;
-    border-radius: 40px;
-  }
-}

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

@@ -1,105 +0,0 @@
-import React, { PropsWithChildren } from 'react';
-import { View } from '@tarojs/components';
-import { Dialog, DialogProps } from '@nutui/nutui-react-taro';
-import classNames from 'classnames';
-import './index.scss';
-import { Close } from '@nutui/icons-react-taro';
-
-export type ModalProps = {
-  /** 底部 */
-  content?: React.ReactElement | string
-  /**
-   * 是否显示右上角关闭按钮
-   * @default true
-   */
-  showCloseIcon?: boolean
-  /**
-   * 是否显示取消按钮
-   * @default true
-   */
-  showCancel?: boolean
-  /**
-   * 是否显示确认按钮
-   * @default true
-   */
-  showConfirm?: boolean
-  /**
-   *自定义确定按钮文字
-   */
-  confirmText?: React.ReactElement | string
-  className?: string
-  onCancel?: () => void
-  onConfirm?: () => void
-} & Omit<DialogProps, 'content' | 'onCancel' | 'onConfirm' | 'confirmText'>;
-
-const Modal: React.FC<PropsWithChildren<ModalProps>> = (props) => {
-  const {
-    className,
-    content,
-    children,
-    showCloseIcon = true,
-    showCancel = true,
-    showConfirm = true,
-    confirmText = "确定",
-    onCancel,
-    onConfirm,
-    ...restProps
-  } = props
-
-  const confirmBtnRender = () => {
-    if (!showConfirm) {
-      return null
-    }
-    if (typeof confirmText === 'string') {
-      return (
-        <View className={classNames('we-modal__btn we-modal__btn-confirm', {
-          'we-modal__btn-confirm-large': !showCancel
-        })} onClick={onConfirm}>
-          {confirmText}
-        </View>
-      )
-    }
-    return confirmText
-  }
-
-  const cancelBtnRender = () => {
-    if (!showCancel) {
-      return null
-    }
-    return (
-      <View className='we-modal__btn we-modal__btn-cancel' onClick={onCancel}>
-        取消
-      </View>
-    )
-  }
-
-  return (
-    <View className={!!className ? `${className} we-modal` : 'we-modal'}>
-      <Dialog
-        {...restProps}
-        lockScroll={true}
-        onConfirm={onConfirm}
-        onCancel={onCancel}
-        footer={(
-          <>
-            {cancelBtnRender()}
-            {confirmBtnRender()}
-          </>
-        )}
-      >
-        {children || content}
-        {
-          showCloseIcon && (
-            <Close
-              size='22'
-              className='we-modal__close'
-              onClick={onCancel}
-            />
-          )
-        }
-      </Dialog>
-    </View>
-  );
-};
-
-export default Modal;

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

@@ -1,26 +0,0 @@
-.transparent-nav {
-  width: 100vw;
-  display: flex;
-  align-items: center;
-  box-sizing: border-box;
-  top: 0;
-  left: 0;
-  z-index: 1000;
-}
-
-.transparent-nav--center {
-  font-weight: 600;
-  font-size: 36px;
-  color: #1D1B1B;
-  line-height: 50px;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-}
-
-.transparent-nav--fixed {
-  position: fixed;
-  top: 0;
-  left: 0;
-  z-index: 1000;
-}

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

@@ -1,81 +0,0 @@
-import { Text, ITouchEvent } from '@tarojs/components';
-import { NavBar as NutNavBar } from '@nutui/nutui-react-taro';
-import { ArrowLeft, Share } from '@nutui/icons-react-taro';
-import Taro from '@tarojs/taro';
-import React from 'react';
-import './index.scss';
-
-export type NavBarProps = {
-  title?: string | React.ReactElement
-  /**
-   * 标题剧中
-   * @default false
-   */
-  titleCenter?: boolean
-  /**
-   * 是否是头像
-   * @default false
-   * @description 如果该值是true titleCenter则为true
-   */
-  isHeader?: boolean
-  /**
-   * 背景颜色
-   * @default transparent
-   * @description 只有isHeader才生效
-   */
-  backageColor?: string
-  /**
-   * 是否穿透
-   * @default false
-   */
-  fixed?: boolean
-  /**
-   * 返回按钮
-   * @default false
-   */
-  back?: boolean
-  /**
-   * 返回事件
-   */
-  onBack?: () => void
-}
-
-const NavBar: React.FC<NavBarProps> = (props) => {
-  const {
-    title,
-    onBack
-  } = props;
-
-  /**
-   * 返回
-   */
-  const handleBack = (e: ITouchEvent) => {
-    e?.stopPropagation()
-    if (onBack) {
-      onBack();
-    } else {
-      Taro.navigateBack({ delta: 1 })
-    }
-  }
-
-  return (
-    <NutNavBar
-      back={
-        <>
-          <ArrowLeft size={14} />
-          返回
-        </>
-      }
-      right={
-        <span className="flex-center">
-          <Share size={14} />
-        </span>
-      }
-      onBackClick={handleBack}
-    >
-      <Text>{title}</Text>
-    </NutNavBar>
-  )
-}
-
-export default NavBar

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

@@ -1,19 +0,0 @@
-.we-page {
-  width: 100%;
-
-  &__loading {
-    padding: 50px 0;
-    text-align: center;
-    display: flex;
-    justify-content: center;
-  }
-
-  &__empty {
-    width: 100%;
-    text-align: center;
-    height: 100px;
-    line-height: 100px;
-    font-size: 28px;
-    color: #666666;
-  }
-}

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

@@ -1,56 +0,0 @@
-import React, { PropsWithChildren } from 'react';
-import { View } from '@tarojs/components';
-import { Utils } from '@utils';
-import './index.scss';
-
-export type PageProps = {
-  error: boolean
-  loading: boolean
-  loadingColor?: string
-  loadingText?: string
-  errorText?: string
-  emptyDataText?: string
-  emptyDataRender?: React.ReactElement
-  dataSource: Array<any> | any
-  onRequest?: () => void
-  renderLoading?: any
-}
-
-const Page: React.FC<PropsWithChildren<PageProps>> = (props) => {
-  const {
-    error = true,
-    loading = false,
-    // loadingColor = '#666666',
-    // loadingText = '加载中...',
-    errorText = '加载失败，请点击重试',
-    emptyDataText = '没有数据',
-    dataSource = [],
-    renderLoading,
-    emptyDataRender,
-    onRequest = () => { console.error('Page组件props没有传入onRequest') },
-    children
-  } = props;
-
-  return (
-    <View className='we-page'>
-      {
-        !loading && !error && !Utils.isEmpty(dataSource) && children
-      }
-      {loading ?
-        (
-          renderLoading || (
-            <View className='we-page__loading'>
-              {/* <Loading color={loadingColor} content={loadingText} /> */}
-            </View>
-          )
-        ) : (
-          error ?
-            <View className='we-page__empty' onClick={onRequest}>{errorText}</View> :
-            Utils.isEmpty(dataSource) && <View className='we-page__empty-content'>{emptyDataRender ? emptyDataRender : emptyDataText}</View>
-        )
-      }
-    </View>
-  )
-}
-
-export default Page

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

@@ -1,38 +0,0 @@
-.we-list {
-  .scroll {
-    height: 100%;
-  }
-
-  &__bottom {
-    margin: 0 auto;
-    text-align: center;
-    height: 200px;
-    line-height: 200px;
-    font-size: 24px;
-    color: #999999;
-
-    &-text {}
-  }
-
-  &__text {
-    font-size: 24px;
-    color: #999999;
-  }
-
-  &__ptpr {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    height: 200px;
-
-    .nut-loading-icon {
-      width: 20px !important;
-      height: 20px !important;
-      font-size: 16px !important;
-    }
-
-    .nut-loading-text {
-      font-size: 12px !important;
-    }
-  }
-}