@cloudbase/weda-ui 0.2.16 → 1.0.24

package/src/web/components/form/uploaderFile/uploadFile.h5.tsx

@@ -2,8 +2,7 @@ import * as React from 'react';
 import * as PropTypes from 'prop-types';
 import weui from '../../../utils/weui';
 import { CommonFormPropsType } from '../types';
-import SparkMD5 from 'spark-md5';
-
+import isObjectEqual from '../../../utils/isObjectEqual';
 import {
   Upload,
   ConfigProvider,
@@ -22,12 +21,11 @@ import {
   isHttpFileID,
   transSize,
   downloadFile,
-  transFileCloudidToName
+  transFileCloudidToName,
 } from '../../../utils/platform';
 import { getCloudInstance, getTempFileURL } from '../../../utils/tcb';
 import classNames from '../../../utils/classnames';
 import { renderDecorator } from '../renderDecorator';
-
 // 默认组件类前缀
 const CLASS_PREFIX = 'weda-upload-file-mobile';
 // 默认图片类型
@@ -76,11 +74,18 @@ export function UploadFileH5({
   onChange = null,
   isEdit = true,
 }: IUploadFileH5) {
-  const [fileIDList, setfileIDList] = React.useState(
-    filterStrList([].concat(defaultValue, value))
-  ); // 上传成功文件ID列表，fileID[]
+  const [fileIDList, setfileIDList] = React.useState(filterStrList([].concat(defaultValue, value))); // 上传成功文件ID列表，fileID[]
   const [fileList, setFileList] = React.useState([]); // 上传中的文件列表，file[]，file为原始文件 + uuid属性
   const [fileSizeObj, setFileSizeObj] = React.useState({}); // 管理上传文件大小 {uuid:size}
+    // 两次默认值不同, 需要刷新
+    const prevDefaultRef = React.useRef<any>([]);
+    React.useMemo(()=>{
+    //有有效默认值时不刷新，解决初次渲染默认值不显示问题
+   if(defaultValue&&!isObjectEqual(prevDefaultRef.current,defaultValue)&&(JSON.stringify(prevDefaultRef.current)=='[]'||!prevDefaultRef.current)){
+   prevDefaultRef.current =defaultValue;
+      setfileIDList(filterStrList([].concat(defaultValue)));
+    }
+    },[defaultValue]);
   React.useEffect(() => {
     // 外部 onChange 事件
     const pureFileIDList = fileIDList.filter(
@@ -116,9 +121,9 @@ export function UploadFileH5({
     // 上传时新增事件
     if (type === 'add') {
       fileID && setFileSizeObj((obj) => ({ ...obj, [fileID]: size }));
-      fileID && setfileIDList((list) => [...list, fileID]);
+      fileID && setfileIDList([...fileIDList, fileID]);
     } else {
-      fileID && setfileIDList((list) => list.filter((f) => f !== fileID));
+      fileID && setfileIDList(fileIDList.filter((f) => f !== fileID));
     }
     uuid && setFileList((list) => list.filter((item) => uuid !== item?._uuid));
   };
@@ -371,25 +376,20 @@ const TcbFileUpload = ({
     const tcb = await getCloudInstance();
     try {
       setStatus('UPLOAD_STATUS_PENDING');
-      const fileReader = new FileReader();
-      fileReader.readAsBinaryString(file);
-      fileReader.onload = async function (e) {
-        const md5Path = SparkMD5.hashBinary(e.target.result);
-        const { fileID } = await tcb.uploadFile({
-          cloudPath: `${uploadPath}/${md5Path}-${file?.name}`,
-          filePath: file,
-          onUploadProgress: (progressEvent) => {
-            let percent = 0;
-            percent = Math.round(
-              (progressEvent.loaded * 100) / progressEvent.total
-            );
-            setStatus('UPLOAD_STATUS_LOADING');
-            setPercent(percent < 100 ? percent : 100);
-          },
-        });
-        !cancleRef.current && onChange?.({ fileID, type: 'add', uuid, size });
-        setStatus('UPLOAD_STATUS_SUCCESS');
-      };
+      const { fileID } = await tcb.uploadFile({
+        cloudPath: `${uploadPath}/${uuid.replaceAll('-', '')}-${file?.name}`,
+        filePath: file,
+        onUploadProgress: (progressEvent) => {
+          let percent = 0;
+          percent = Math.round(
+            (progressEvent.loaded * 100) / progressEvent.total
+          );
+          setStatus('UPLOAD_STATUS_LOADING');
+          setPercent(percent < 100 ? percent : 100);
+        },
+      });
+      !cancleRef.current && onChange?.({ fileID, type: 'add', uuid, size });
+      setStatus('UPLOAD_STATUS_SUCCESS');
     } catch (err) {
       setStatus('UPLOAD_STATUS_ERROR');
       events?.error?.(err);
@@ -481,24 +481,28 @@ const UploadFileStatus = ({
         <Tooltip title={title}>
           <Text className={`${CLASS_PREFIX}__file-name`}>{title}</Text>
         </Tooltip>
-        {isEdit && 
-        <div className={`${CLASS_PREFIX}__file-status`}>
-          <Icon
-            type={
-              statusMap[status]?.icon || statusMap['UPLOAD_STATUS_PENDING'].icon
-            }
-          ></Icon>
-          <Text className={`${CLASS_PREFIX}__file-status--msg`}>
-            {statusMap[status]?.title ||
-              statusMap['UPLOAD_STATUS_PENDING'].title}
-          </Text>
-        </div>}
+        {isEdit && (
+          <div className={`${CLASS_PREFIX}__file-status`}>
+            <Icon
+              type={
+                statusMap[status]?.icon ||
+                statusMap['UPLOAD_STATUS_PENDING'].icon
+              }
+            ></Icon>
+            <Text className={`${CLASS_PREFIX}__file-status--msg`}>
+              {statusMap[status]?.title ||
+                statusMap['UPLOAD_STATUS_PENDING'].title}
+            </Text>
+          </div>
+        )}
       </div>
-      {isEdit && <div className={`${CLASS_PREFIX}__file-foot`}>
-        <div>
-          <Text>{size}</Text>
+      {isEdit && (
+        <div className={`${CLASS_PREFIX}__file-foot`}>
+          <div>
+            <Text>{size}</Text>
+          </div>
         </div>
-      </div>}
+      )}
     </>
   );
 };

package/src/web/components/form/uploaderFile/uploadFile.pc.tsx

@@ -8,7 +8,6 @@ import {
   Text,
   List,
 } from 'tea-component';
-import SparkMD5 from 'spark-md5';
 import { v4 } from 'uuid';
 import {
   filterStrList,
@@ -17,12 +16,13 @@ import {
   transSize,
   downloadFile,
   cutFileTitle,
-  transFileCloudidToName
+  transFileCloudidToName,
 } from '../../../utils/platform';
 import { getCloudInstance, getTempFileURL } from '../../../utils/tcb';
 import classNames from '../../../utils/classnames';
 import { renderDecorator } from '../renderDecorator';
 import { CommonFormPropsType } from '../types';
+import isObjectEqual from '../../../utils/isObjectEqual';
 
 // 默认组件类前缀
 const CLASS_PREFIX = 'weda-upload-file-pc';
@@ -68,12 +68,20 @@ export function UploadFilePc({
   onChange = null,
   isEdit = true,
 }: IUploaderFilePc) {
-  const [fileIDList, setfileIDList] = React.useState(
-    filterStrList([].concat(defaultValue, value))
-  ); // 上传成功文件ID列表，fileID[]
+
+
+  const [fileIDList, setfileIDList] = React.useState(filterStrList([].concat(defaultValue, value))); // 上传成功文件ID列表，fileID[]
   const [fileList, setFileList] = React.useState([]); // 上传中的文件列表，file[]，file为原始文件 + uuid属性
   const [fileSizeObj, setFileSizeObj] = React.useState({}); // 管理上传文件大小 {uuid:size}
-
+    // 两次默认值不同, 需要刷新
+  const prevDefaultRef = React.useRef<any>([]);
+  React.useMemo(()=>{
+    //有有效默认值时不刷新，解决初次渲染默认值不显示问题
+   if(defaultValue&&!isObjectEqual(prevDefaultRef.current,defaultValue)&&(JSON.stringify(prevDefaultRef.current)=='[]'||!prevDefaultRef.current)){
+      prevDefaultRef.current =defaultValue;
+      setfileIDList(filterStrList([].concat(defaultValue)));
+    }
+    },[defaultValue]);
   React.useEffect(() => {
     // 外部 onChange 事件
     const pureFileIDList = fileIDList.filter(
@@ -90,7 +98,6 @@ export function UploadFilePc({
       events?.success?.({ value: pureFileIDList });
     }
   }, [fileIDList]);
-
   // 外层组件类
   const cls = classNames({
     'weda-ui': true,
@@ -339,25 +346,20 @@ const TcbFileUpload = ({ file }: ITcbFileUpload) => {
     const tcb = await getCloudInstance();
     try {
       setStatus('0');
-      const fileReader = new FileReader();
-      fileReader.readAsBinaryString(file);
-      fileReader.onload = async function (e) {
-        const md5Path = SparkMD5.hashBinary(e.target.result);
-        const { fileID } = await tcb.uploadFile({
-          cloudPath: `${uploadPath}/${md5Path}-${file?.name}`,
-          filePath: file,
-          onUploadProgress: (progressEvent) => {
-            let percent = 0;
-            percent = Math.round(
-              (progressEvent.loaded * 100) / progressEvent.total
-            );
-            setStatus('1');
-            setPercent(percent < 100 ? percent : 100);
-          },
-        });
-        !cancleRef.current && onChange?.({ fileID, type: 'add', uuid, size });
-        setStatus('2');
-      };
+      const { fileID } = await tcb.uploadFile({
+        cloudPath: `${uploadPath}/${uuid.replaceAll('-', '')}-${file?.name}`,
+        filePath: file,
+        onUploadProgress: (progressEvent) => {
+          let percent = 0;
+          percent = Math.round(
+            (progressEvent.loaded * 100) / progressEvent.total
+          );
+          setStatus('1');
+          setPercent(percent < 100 ? percent : 100);
+        },
+      });
+      !cancleRef.current && onChange?.({ fileID, type: 'add', uuid, size });
+      setStatus('2');
     } catch (e) {
       setStatus('3');
       events.error && events.error(e);

package/src/web/components/graphicCard/index.css

@@ -111,11 +111,7 @@
   margin-right: 8px;
 }
 
-.weda-graphic-card
-  .weda-graphic-card__col
-  .weda-graphic-card__btn
-  .weda-graphic-card__btn--icon {
-  transform: rotate(180deg);
+.weda-graphic-card .weda-graphic-card__btn-icon {
   margin-bottom: 2px;
 }
 

package/src/web/components/graphicCard/index.tsx

@@ -4,6 +4,7 @@ import { CommonPropsType } from '../../types';
 import classNames from '../../utils/classnames';
 import { Row, Col, ConfigProvider, Button, Icon, Text } from 'tea-component';
 import { usePlatform } from '../../utils/platform';
+import { IconFont } from 'tdesign-icons-react';
 
 const CLASS_PREFIX = 'weda-graphic-card';
 
@@ -288,9 +289,9 @@ export default function GraphicCard({
                                 <Text className={`${CLASS_PREFIX}__btn--text`}>
                                   {buttonText}
                                 </Text>
-                                <Icon
-                                  type="btnback"
-                                  className={`${CLASS_PREFIX}__btn--icon`}
+                                <IconFont
+                                  name="arrow-right"
+                                  className={`${CLASS_PREFIX}__btn-icon`}
                                 />
                               </Button>
                             )}

package/src/web/components/image/image.tsx

@@ -184,4 +184,4 @@ export function ImageInner({
       </ConfigProvider>
     );
   }
-}
+}

package/src/web/components/image/index.tsx

@@ -102,4 +102,4 @@ function getObjectFitByWxImageMode(mode: TMode): React.CSSProperties['objectFit'
   const item = array.find((item) => item.mode === mode);
   return item?.h5;
 }
-
+ 

package/src/web/components/index.js

@@ -1,6 +1,6 @@
 import '@tcwd/style-wedatheme/index.css';
-import loadable from '@loadable/component';
-import { fallback } from '../utils/loading-fallback';
+// import loadable from '@loadable/component';
+// import { fallback } from '../utils/loading-fallback';
 
 // export const Button = loadable(() => import('./button'), {fallback});
 // export const Text = loadable(() => import('./text'), {fallback});
@@ -72,10 +72,21 @@ export { default as NavLayout } from './navLayout';
 
 // Data Contaier
 export { default as ListView } from './listView';
+export { default as NavigationBar } from './navigationBar';
+export { default as Line } from './chart/line';
+export { default as Bar } from './chart/bar';
+export { default as Pie } from './chart/pie';
 export { default as DataView } from './dataView';
 
 export { default as StatisticsCard } from './chart/statisticsCard';
 export { default as GraphicCard } from './graphicCard';
+
+export { default as UserInfo } from './userInfo';
+export { default as Phone } from './phone';
+export { default as PhoneCode } from './phoneCode';
+export { default as Share } from './share';
+
+export { default as Lottery } from './lottery';
 // open
 // import Auth from './auth';
 

package/src/web/components/link/index.tsx

@@ -17,6 +17,7 @@ export interface PropsType extends CommonPropsType {
     */
    params?: {key: string, value: string}[];
    contentSlot?: React.ReactNode;
+   isOpenInNewWindow: boolean;
 }
 
 // 所有绝对地址直接交由浏览器，新开窗口交由浏览器
@@ -28,7 +29,8 @@ export default function Link({
   style,
   className,
   contentSlot,
-  params = [], // TODO 格式定义
+  params = [], // TODO 格式定义,
+  isOpenInNewWindow = false,
 }: PropsType) {
   url = url.trim();
   const cls = classNames({
@@ -91,6 +93,7 @@ export default function Link({
     <a
       style={{ ...style }}
       className={cls}
+      target={isOpenInNewWindow ? '_blank' : '_self'}
       href={href}
       onClick={(e) => {
         events.tap && events.tap({}, { originEvent: e });
@@ -107,10 +110,10 @@ export default function Link({
           }
         }
       }}
-      rel="noreferrer"
+      rel='noopener noreferrer'
     >
       {contentSlot && <div className="weda-link-slot">{contentSlot}</div>}
       {content}
     </a>
   );
-}
+}

package/src/web/components/listView/index.css

@@ -60,6 +60,10 @@
 .weda-list-view__containor .weda-list-view__more {
   background-color: #fff;
 }
+.weda-list-view__containor
+  .weda-list-view__more.weda-list-view__more-bottomLoad {
+  background-color: transparent;
+}
 .weda-list-view__containor
   .weda-list-view__more
   .weda-list-view__more-pagination {

package/src/web/components/listView/index.tsx

@@ -11,24 +11,11 @@ import { isInIde } from '../../utils/platform';
 import classNames from '../../utils/classnames';
 import isequal from 'lodash.isequal';
 import './index.css';
+import { REL_DICT } from '../../utils/constant';
+import { isNil } from '../../utils/lodash';
 
-const REL_DICT = {
-  equal: 'eq', // 等于
-  unequal: 'neq', // 不等于
-  include: 'search', // 包含
-  exclude: '_exclude', // 不包含
-  begin_with: '_begin_with', // 开头是
-  greater: 'gt', // 大于
-  greater_or_equal: 'gte', // 大于等于
-  bigger_or_equal: 'gte', //大于等于
-  less: 'lt', // 小于
-  less_or_equal: 'lte', // 小于等于
-  in: 'in', // 多选值
-  not_in: 'nin', // 不在多选值
-};
 const ORDERTYPE = ['asc', 'desc'];
 const BLOCK_NAME = 'weda-list-view';
-const isNull = (val) => [undefined, null].includes(val);
 const getIdeMockData = (length = 3) => Array.from({ length }).map((d) => ({}));
 const getWhereList = (where) => {
   let result = [];
@@ -45,7 +32,7 @@ const getWhereList = (where) => {
             rel = 'regex';
             val = `^((?!${val}).)*$`;
           }
-          if (item2?.logic !== 'or' && item2?.key && rel && !isNull(val)) {
+          if (item2?.logic !== 'or' && item2?.key && rel && !isNil(val)) {
             result.push({ key: item2.key, rel, val });
           }
         });
@@ -185,7 +172,7 @@ export default function ListView(props: IListView) {
     const { orderBy, orderType, pageNo, pageSize, where } = params || {};
     const tcbParams = {};
     // tcb分页参数
-    if (!isNull(pageNo) && !isNull(pageSize)) {
+    if (!isNil(pageNo) && !isNil(pageSize)) {
       tcbParams['pageNo'] = pageNo;
       tcbParams['pageSize'] = pageSize;
     }
@@ -344,7 +331,12 @@ export default function ListView(props: IListView) {
           {children}
         </div>
       )}
-      <div className={classNames(`${BLOCK_NAME}__more`)}>
+      <div
+        className={classNames(
+          `${BLOCK_NAME}__more`,
+          `${BLOCK_NAME}__more-${pagination}`
+        )}
+      >
         {pagination === 'bottomLoad' && renderBottomLoad()}
         {pagination === 'loadMoreButton' && renderLoadMore()}
         {pagination === 'pagination' && renderPagination()}