@cloudbase/weda-ui 0.2.13 → 0.2.16

package/src/web/components/tabs/tabs.h5.tsx

@@ -1,4 +1,4 @@
-import React, { useMemo } from 'react';
+import React, { useEffect, useMemo } from 'react';
 
 import './index.css';
 import classNames from '../../utils/classnames';
@@ -13,7 +13,10 @@ export default function TabsH5({
   style,
   ...restProps
 }: PropsType) {
-  const [currentIndex, setCurrentIndex] = useSyncValue(selectedIndex);
+  const [currentIndex, setCurrentIndex] = useSyncValue(
+    typeof selectedIndex === 'string' ?
+    parseInt(selectedIndex) : selectedIndex
+  );
   const stickyStyle = useMemo(() => {
     const length = tabs.length;
     return {
@@ -21,7 +24,7 @@ export default function TabsH5({
       transform: `translate3d( ${currentIndex * 100}%, 0, 0)`
     };
   }, [tabs, currentIndex]);
-  
+
   return (
     <div data-testid="tabs" className={classNames("weda-tabs weda-ui", {
       [className]: className
@@ -63,4 +66,4 @@ export default function TabsH5({
       </div>
     </div>
   );
-}
+}

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

@@ -1,11 +1,11 @@
-a.weda-file-view-pc__single{
-    display: inline-block;
-    vertical-align: middle;
-    white-space: nowrap;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    max-width: 100%;
+a.weda-uploader-file-view__single {
+  display: inline-block;
+  vertical-align: middle;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  max-width: 100%;
 }
-a.weda-file-view-pc__single:hover{
-    text-decoration: underline;
+a.weda-uploader-file-view__single:hover {
+  text-decoration: underline;
 }

package/src/web/components/uploaderFileView/index.jsx

@@ -1,43 +1,52 @@
 import * as React from 'react';
 import { UploadFilePc } from '../form/uploaderFile/uploadFile.pc';
+import { UploadFileH5 } from '../form/uploaderFile/uploadFile.h5';
 import {
   filterStrList,
   isCloudFileID,
   downloadFile,
+  usePlatform,
+  transFileCloudidToName,
 } from '../../utils/platform';
 import { getTempFileURL } from '../../utils/tcb';
 import './index.css';
 
-const CLASS_PREFIX = 'weda-file-view-pc';
+const CLASS_PREFIX = 'weda-uploader-file-view';
 
 /**
- * 上传文件回显
- * single 表示单个文件回显
+ * 上传文件回显，传showType强制展示某端样式，否则根据平台自动判断
  */
 export default function UploaderFileView({
   value,
   className,
-  single = true,
+  single = true, // 展示为单行 a 标签
+  showType, // 展示端为 pc 还是 h5 样式
   ...rest
 }) {
   const fileIDList = filterStrList(value);
-  if(single){
-    return <FileView fileID={fileIDList[0]}/>
-  }else{
-    return (
-      <UploadFilePc
-        className={`${CLASS_PREFIX} ${className}`}
-        decorator={null}
-        {...rest}
-        value={fileIDList}
-        isEdit={false}
-      />
-    )
+  if (single) {
+    return <FileView fileID={fileIDList[0]} />;
+  } else {
+    const platform = usePlatform();
+    const showTypeMix = showType ? (showType === 'h5' ? 'h5' : 'pc') : platform;
+    const uploadFileProps = {
+      ...rest,
+      className: `${CLASS_PREFIX} ${className}`,
+      decorator: null,
+      labelVisible: false,
+      value: fileIDList,
+      isEdit: false,
+    };
+    return showTypeMix === 'pc' ? (
+      <UploadFilePc {...uploadFileProps} />
+    ) : (
+      <UploadFileH5 {...uploadFileProps} />
+    );
   }
 }
 
 /**
- * 单个文件回显
+ * 单个文件回显，用在表格里面
  */
 const FileView = ({ fileID }) => {
   const [src, setSrc] = React.useState('');
@@ -58,18 +67,18 @@ const FileView = ({ fileID }) => {
 
   const title = React.useMemo(() => {
     if (isCloudFileID(fileID)) {
-      const uuidReg = /file-[0-9a-f]{8}(-[0-9a-f]{4}){3}-[0-9a-f]{12}-/;
-      const lastIndex = `${fileID}`.lastIndexOf('/');
-      const name = `${fileID}`.slice(lastIndex + 1);
-      const title = name.replace(uuidReg, '');
-      return title;
+      return transFileCloudidToName(fileID);
     } else {
       return fileID;
     }
   }, [fileID]);
   return (
-      <a title={title} onClick={() => downloadFile(src)} className={`${CLASS_PREFIX}__single`}>
+    <a
+      title={title}
+      onClick={() => downloadFile(src)}
+      className={`${CLASS_PREFIX}__single`}
+    >
       {title}
-      </a>
-  )
+    </a>
+  );
 };

package/src/web/types.d.ts

@@ -1,20 +1,21 @@
 /// <reference types="resize-observer-browser" />
 
-import * as React from "react";
-export type unknownFunction = (...args: unknown[]) => unknown
+import { any } from 'prop-types';
+import * as React from 'react';
+export type unknownFunction = (...args: unknown[]) => unknown;
 export interface CommonPropsType {
-    style?: React.CSSProperties,
-    id?: string,
-    events?: Record<string, unknownFunction>;
-    className?: string,
-    children?: React.ReactNode | undefined
+  style?: React.CSSProperties;
+  id?: string;
+  events?: Record<string, unknownFunction>;
+  className?: string;
+  children?: React.ReactNode | undefined;
 }
 
-
 declare global {
-    var app: any
-    interface Window { 
-        app: any;
-    }
-
-}
+  var app: any;
+  interface Window {
+    app: any;
+    qq: any;
+    TMap: any;
+  }
+}

package/src/web/utils/debounce.js

@@ -0,0 +1,98 @@
+function isObject(value) {
+  const type = typeof value;
+  return value != null && (type === 'object' || type === 'function');
+}
+function debounce(func, wait, options) {
+  let lastArgs, lastThis, maxWait, result, timerId, lastCallTime;
+  let lastInvokeTime = 0;
+  let leading = false;
+  let maxing = false;
+  let trailing = true;
+  if (typeof func !== 'function') {
+    throw new TypeError('Expected a function');
+  }
+  wait = +wait || 0;
+  if (isObject(options)) {
+    leading = !!options.leading;
+    maxing = 'maxWait' in options;
+    maxWait = maxing ? Math.max(+options.maxWait || 0, wait) : maxWait;
+    trailing = 'trailing' in options ? !!options.trailing : trailing;
+  }
+  function invokeFunc(time) {
+    const args = lastArgs;
+    const thisArg = lastThis;
+
+    lastArgs = lastThis = undefined;
+    lastInvokeTime = time;
+    result = func.apply(thisArg, args);
+    return result;
+  }
+  function startTimer(pendingFunc, wait) {
+    return setTimeout(pendingFunc, wait);
+  }
+  function leadingEdge(time) {
+    lastInvokeTime = time;
+    timerId = startTimer(timerExpired, wait);
+    return leading ? invokeFunc(time) : result;
+  }
+  function remainingWait(time) {
+    const timeSinceLastCall = time - lastCallTime;
+    const timeSinceLastInvoke = time - lastInvokeTime;
+    const timeWaiting = wait - timeSinceLastCall;
+
+    return maxing
+      ? Math.min(timeWaiting, maxWait - timeSinceLastInvoke)
+      : timeWaiting;
+  }
+  function shouldInvoke(time) {
+    const timeSinceLastCall = time - lastCallTime;
+    const timeSinceLastInvoke = time - lastInvokeTime;
+    return (
+      lastCallTime === undefined ||
+      timeSinceLastCall >= wait ||
+      timeSinceLastCall < 0 ||
+      (maxing && timeSinceLastInvoke >= maxWait)
+    );
+  }
+  function timerExpired() {
+    const time = Date.now();
+    if (shouldInvoke(time)) {
+      return trailingEdge(time);
+    }
+    timerId = startTimer(timerExpired, remainingWait(time));
+  }
+  function trailingEdge(time) {
+    timerId = undefined;
+    if (trailing && lastArgs) {
+      return invokeFunc(time);
+    }
+    lastArgs = lastThis = undefined;
+    return result;
+  }
+
+  //debouncedFunc
+  function debounced(...args) {
+    const time = Date.now();
+    const isInvoking = shouldInvoke(time);
+
+    lastArgs = args;
+    lastThis = this;
+    lastCallTime = time;
+
+    if (isInvoking) {
+      if (timerId === undefined) {
+        return leadingEdge(lastCallTime);
+      }
+      if (maxing) {
+        timerId = startTimer(timerExpired, wait);
+        return invokeFunc(lastCallTime);
+      }
+    }
+    if (timerId === undefined) {
+      timerId = startTimer(timerExpired, wait);
+    }
+    return result;
+  }
+  return debounced;
+}
+export default debounce;

package/src/web/utils/platform.js

@@ -38,6 +38,21 @@ export function usePlatform() {
   return touchDevice || smallScreen ? 'h5' : 'pc';
 }
 
+/**
+ * 在h5下，判断当前是否是移动浏览器
+ */
+export function inH5IsMobile() {
+  try {
+    // 区分h5是在编辑器还是移动浏览器
+    let is_mobile_ua = false;
+    const ua = navigator && navigator.userAgent;
+    is_mobile_ua = /Android|webOS|BlackBerry|iPhone|iPad|iPod|iOS/i.test(ua);
+    return is_mobile_ua;
+  } catch (e) {
+    console.log('isMobile err', e);
+  }
+}
+
 /**
  * 过滤非字符串，返回字符串数组
  * 用于兼容单个组件和组件数组
@@ -101,3 +116,19 @@ export const cutFileTitle = (str = '', count = 10) => {
   }
   return title;
 };
+
+/**
+ * 判断是否在 ide 中
+ */
+export const isInIde = () => !!window?.app?.cloud?.IS_WEDA_IDE;
+
+/**
+ * cloudid和文件名转换
+ */
+export const transFileCloudidToName = (fileID) => {
+  const uuidReg = /(file-)?[0-9a-f]{8}(-[0-9a-f]{4}){3}-[0-9a-f]{12}-/;
+  const lastIndex = `${fileID}`.lastIndexOf('/');
+  const name = `${fileID}`.slice(lastIndex + 1);
+  const title = name.replace(uuidReg, '');
+  return title;
+};

package/src/web/utils/tcb.js

@@ -35,3 +35,38 @@ export async function getTempFileURL(data) {
     return await window?.app?.cloud?.getTempFileURL(data);
   }
 }
+
+/**
+ * 云函数获取数据
+ */
+export async function callDataSource(param) {
+  const { params, dataSourceName, methodName } = param;
+  try {
+    const res = await window?.app?.cloud?.callDataSource?.({
+      params,
+      dataSourceName,
+      methodName,
+    });
+    return res;
+  } catch (error) {
+    console.error('错误', error);
+    return {};
+  }
+}
+
+/**
+ * 调用微搭后端API服务
+ */
+export async function callWedaApi(param) {
+  const { data, action } = param;
+  try {
+    const res = await window?.app?.cloud?.callWedaApi?.({
+      action,
+      data,
+    });
+    return res;
+  } catch (error) {
+    console.error('错误', error);
+    return {};
+  }
+}

package/src/web/utils/tmap.js

@@ -0,0 +1,4 @@
+export function getTMap() {
+  const TMap = window?.TMap;
+  return TMap;
+}

package/src/web/wedatheme/.code.yml

@@ -1,16 +0,0 @@
-source:
-  # 文件或目录使用绝对路径，绝对路径按代码库根目录计算，以/开头。
-  # 提供产品代码库中编写的测试代码存放目录或文件名格式，以便代码检查时进行排除处理
-  # 不要使用.*/等正则表达式屏蔽掉所有代码，会使得代码存在风险，还会导致Coverity扫不到任何代码而失败
-  test_source:
-    #用于匹配文件; 匹配方式为正则表达式，例如[".*/java/test/.*", ".*/test.java"]
-    filepath_regex:  
-  # 提供产品代码库中工具或框架自动生成的且在代码库中的代码，没有可为空。以便代码检查时进行排除处理。
-  auto_generate_source:
-    # 自动生成代码文件的正则表达式，若无统一标识格式，可以指定具体目录，样例可参考test_source举例
-    filepath_regex: ["/style-package/*.*"]
-  # 提供产品代码库中直接以源码形式存在的第三方代码目录或代码文件名的正则表达。
-  # 此处备注的第三方代码将在代码检查时进行排除，若代码库中不存在需要排除的第三方代码，该项配置标识可为空
-  third_party_source:
-    #第三方代码文件的正则表达式，若无统一标识格式，可以指定具体目录，样例可参考test_source举例
-    filepath_regex: 

package/src/web/wedatheme/.editorconfig

@@ -1,9 +0,0 @@
-root = true
-
-[*]
-indent_style = space
-indent_size = 2
-charset = utf-8
-trim_trailing_whitespace = false
-insert_final_newline = false
-end_of_line = lf

package/src/web/wedatheme/.eslintrc

@@ -1,20 +0,0 @@
-{
-  "env": {
-    "browser": true,
-    "es6": true
-  },
-  "settings": {
-    "react": {
-      "version": "detect"
-    }
-  },
-  "parser": "babel-eslint",
-  "parserOptions": {
-    "ecmaVersion": 6,
-    "sourceType": "module",
-    "ecmaFeatures": {
-      "jsx": true
-    }
-  },
-  "extends": ["@tencent/eslint-config-tencent", "plugin:react/recommended"]
-}

package/src/web/wedatheme/.git

@@ -1 +0,0 @@
-gitdir: ../../../.git/modules/src/web/wedatheme

package/src/web/wedatheme/.gitignore

@@ -1,5 +0,0 @@
-node_modules
-dist
-.history
-src/.DS_Store
-*.DS_Store

package/src/web/wedatheme/.npmrc

@@ -1 +0,0 @@
-registry=https://mirrors.tencent.com/npm/

package/src/web/wedatheme/.orange-ci.yml

@@ -1,55 +0,0 @@
-### 该配置文件用于自动发布tnpm包，tnpm相关配置从git地址获取 ###
-master:
-  push:
-    - 
-      stages:
-        - name: 发布 npm 包
-          image: plugins/npm
-          envFrom: https://git.code.oa.com/tc-console/public-key/blob/master/tnpm.text
-          settings:
-            username: $TNPM_USER
-            password: $TNPM_PWD
-            email: $TNPM_EMAIL
-            registry: https://mirrors.tencent.com/npm/
-            folder: ./style-package/
-        - name: 获取包名
-          type: orange-ci:readFile
-          options:
-            filePath: ./style-package/package.json
-          envExport:
-            name: PACKAGE_NAME
-        - name: make message
-          script: echo '[http://mirrors.tencent.com/#/private/npm/detail?project_name=$PACKAGE_NAME](http://mirrors.tencent.com/#/private/npm/detail?project_name=$PACKAGE_NAME)' > message.txt
-        - name: send message
-          type: wework:message
-          options:
-            fromFile: message.txt
-### 该配置文件用于自动构建并部署文件到服务器，通过企业微信返回内网预览地址 ###
-### 接入配置可参考：http://km.oa.com/articles/show/422133 有疑问可联系youngerwang ###
-dev:
-  push:
-    - docker: 
-        image: node:10
-      env:
-        ORANGE_W_BUILD_SUCCESS_MSG: 预览地址：http://9.134.68.199/$ORANGE_REPO_SLUG/dist/index.html
-      stages:
-        ### 需要每次都安装一次，后续下放到开发机器
-        - name: 安装 tnpm
-          script: npm install @tencent/tnpm -g --registry=https://mirrors.tencent.com/npm/
-        - name: 安装 tea-cli
-          script: tnpm i @tencent/tea-cli -g  
-        - name: 安装依赖
-          script: tnpm install && tnpm i @tencent/tea-component
-        - name: 构建
-          script: tea login qaayH8xL2ATXSkWS8ahBB7IEYXMECyaKSAlbkDzX && tea build -l zh
-        - name: 预览地址
-          type: wework:message
-          options:
-            message: '[http://9.134.68.199/$ORANGE_REPO_SLUG/dist/index.html](http://9.134.68.199/$ORANGE_REPO_SLUG/dist/index.html)'
-        - name: 拷贝文件
-          type: orange-ci:transfer
-          options:
-            dist: '/'
-            to: /usr/share/nginx/html/$ORANGE_REPO_SLUG
-            ips: 
-              - 9.134.68.199

package/src/web/wedatheme/.vscode/extensions.json

@@ -1,3 +0,0 @@
-{
-  "recommendations": ["dbaeumer.vscode-eslint"]
-}

package/src/web/wedatheme/.vscode/settings.json

@@ -1,11 +0,0 @@
-{
-  "eslint.validate": [
-    "javascript",
-    "javascriptreact",
-    "typescript",
-    "typescriptreact"
-  ],
-  "editor.codeActionsOnSave": {
-    "source.fixAll.eslint": true
-  }
-}

package/src/web/wedatheme/README.md

@@ -1,50 +0,0 @@
-腾讯云 WEDATHEME 控制台前端项目
-======================
-
-<!-- 识别每类内容的标题是否具备，同时判断页面内容字数；
-	具备内容类别数，字数大于等于类别数*200字，得到该类别的总分数 -->
-
-## 项目介绍
-<!-- 本组织/项目的整体说明概览 -->
-介绍：
-控制台地址：
-
-
-## 快速上手
-<!-- 使用者如何快速上手使用本组织/项目，如下载，安装，启动，运行，教程。 -->
-- `src/app.js` 入口文件，主要进行业务路由定义
-- `src/routes` 存放业务路由实现
-- `src/configs` 存放 CSS 和菜单配置
-- `src/components` 存放公共业务组件
-- `src/utils` 存放公共工具方法
-
-
-## 常见问题
-<!-- 本组织/项目的常见通用问题和官方解答 -->
-- master：默认为主干分支，用于发包
-- dev：默认开发分支
-
-
-## 行为准则
-<!-- 本组织/项目在代码协作方面需遵循的责任、范围、软件许可证、冲突解决等章程 -->
-
-
-## 如何加入
-<!-- 本组织/项目有明确的如何加入和贡献的文字说明 -->
-
-
-## 团队介绍
-<!-- 本组织/项目的角色分工、人名和联络方式、官方交流/沟通渠道 -->
-产品经理：<!-- 姓名 -->
-
-交互设计：<!-- 姓名 -->
-
-视觉设计师：<!-- 姓名 -->
-
-前端开发：<!-- 姓名 -->
-
-仓库地址：<!-- 姓名 -->
-
-
-## 其他说明
-<!-- 其他需要补充的内容 -->

package/src/web/wedatheme/i18n/README.md

@@ -1,4 +0,0 @@
-i18n 目录说明
-============
-
-这里存放翻译的词条文件。

package/src/web/wedatheme/i18n/translation/index.js

@@ -1,10 +0,0 @@
-/**
- * @fileoverview
- *
- * 开发环境默认导出中文词条（无任何翻译）
- *
- *   - 如果要查看某个语言包的开发环境效果，使用命令 `tea dev --lang=en`
- *   - 正式编译时，`@i18n/translation` 模块会重定向到相应的词条文件
- */
-
-export { translation } from './zh';

package/src/web/wedatheme/i18n/translation/zh.js

@@ -1,15 +0,0 @@
-/**
- * @fileoverview
- *
- * 本文件词条由 `tea scan` 命令扫描生成，可提交给翻译团队进行翻译。
- * 具体使用方法，请参考 http://tapd.oa.com/QCloud_2015/markdown_wikis/view/#1010103951008365523
- */
-
-/**
- * @type {import('@tencent/tea-app').I18NTranslation}
- */
-const translation = {
-  // 使用 `tea scan` 命令扫描词条
-};
-
-module.exports = { translation };

package/src/web/wedatheme/jsconfig.json

@@ -1,15 +0,0 @@
-{
-  "compilerOptions": {
-    "lib": ["es2017", "dom"],
-    "baseUrl": ".",
-    "paths": {
-      "@tea/app": ["./mock"],
-      "@tea/app/*": ["./mock/*"],
-      "@src/*": ["./src/*"]
-    },
-    "checkJs": true,
-    "jsx": "preserve",
-    "noImplicitAny": false
-  },
-  "exclude": ["dist"]
-}

package/src/web/wedatheme/mock/app.js

@@ -1,42 +0,0 @@
-import React from 'react';
-import ReactDOM from 'react-dom';
-import { Router, Route, Redirect, Switch } from 'react-router-dom';
-import { createHashHistory } from 'history';
-import { AppLayout } from './layout';
-import { HistoryContext } from './history-context';
-import { ConfigProvider } from '@tencent/tea-component';
-
-// 菜单配置
-import { menu } from '../src/configs/menu';
-
-const history = createHashHistory();
-
-const App = ({ routes }) => (
-  <ConfigProvider classPrefix='wedatea2td'>
-    <Router history={history}>
-      <HistoryContext.Provider value={{ history }}>
-        <AppLayout menu={menu}>
-          <Switch>
-            {Object.entries(routes).map(([path, route]) => (route.render ? (
-                <Route key={path} path={`/${path}`} render={route.render} />
-            ) : (
-                <Route key={path} path={`/${path}`} component={route} />
-            )))}
-            <Route
-              render={() => (
-                <Redirect to={`/${(Object.entries(routes)[0] || [])[0]}`} />
-              )}
-            />
-          </Switch>
-        </AppLayout>
-      </HistoryContext.Provider>
-    </Router>
-  </ConfigProvider>
-);
-
-/**
- * @param {import('@tencent/tea-app').AppRouteMap} appRoutes
- */
-export async function routes(appRoutes) {
-  ReactDOM.render(<App routes={appRoutes} />, document.querySelector('#root'));
-}

package/src/web/wedatheme/mock/history-context.js

@@ -1,8 +0,0 @@
-import React, { useContext } from 'react';
-
-export const HistoryContext = React.createContext(null);
-
-export const useHistory = () => {
-  const { history } = useContext(HistoryContext);
-  return history;
-};

package/src/web/wedatheme/mock/index.js

@@ -1,3 +0,0 @@
-import * as app from './app';
-export * from './history-context';
-export { app };