npm - @cloudbase/weda-ui - Versions diffs - 0.2.9 → 0.2.13 - Mend

@cloudbase/weda-ui 0.2.9 → 0.2.13

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (322) hide show

package/src/web/wedatheme/package.json ADDED Viewed

@@ -0,0 +1,61 @@
+{
+  "name": "@tencent/tea-app-wedatheme",
+  "version": "1.0.0",
+  "description": "The wedatheme tea app for qcloud console",
+  "main": "src/app.js",
+  "scripts": {
+    "lint": "npx eslint --quiet --ext jsx,.js src",
+    "dev": "tea dev",
+    "scan": "tea scan",
+    "build": "tea build",
+    "build-css": "npx webpack --config webpack/css.config.js",
+    "publish": "npm run build-css && node ./scripts/publish.js"
+  },
+  "keywords": [
+    "tea",
+    "app",
+    "wedatheme"
+  ],
+  "engines": {},
+  "license": "UNLICENSED",
+  "dependencies": {
+    "@tencent/tea-app": "^2.0.0",
+    "@tencent/tea-component": "^2.0.0",
+    "history": "^4.9.0",
+    "moment": "^2.24.0",
+    "postcss": "^8.3.6",
+    "postcss-css-variables": "^0.16.0",
+    "react": "^16.10.0",
+    "react-dom": "^16.10.0",
+    "react-router-dom": "^4.3.1",
+    "resolve-url-loader": "^4.0.0",
+    "svg-url-loader": "^7.1.1",
+    "svgo-loader": "^3.0.0"
+  },
+  "devDependencies": {
+    "@tencent/eslint-config-tencent": "^0.12.2",
+    "@tencent/tea-scripts": "^2.0.0",
+    "@types/react": "^16.8.4",
+    "@types/react-dom": "^16.8.2",
+    "@types/react-router-dom": "^4.3.1",
+    "@types/webpack": "^4.4.32",
+    "autoprefixer": "^9.5.1",
+    "babel-eslint": "^10.0.2",
+    "clean-webpack-plugin": "^3.0.0",
+    "css-loader": "^2.1.1",
+    "cssnano": "^4.1.10",
+    "eslint": "^7.0.0",
+    "eslint-plugin-react": "^7.21.5",
+    "file-loader": "^4.2.0",
+    "html-webpack-plugin": "^3.2.0",
+    "less-loader": "^5.0.0",
+    "mini-css-extract-plugin": "^0.7.0",
+    "node-sass": "^4.12.0",
+    "postcss-loader": "^3.0.0",
+    "sass-loader": "^10.1.1",
+    "svg-transform-loader": "^2.0.13",
+    "webpack": "^4.32.2",
+    "webpack-cli": "^3.3.9",
+    "webpack-hot-middleware": "^2.25.0"
+  }
+}

package/src/web/wedatheme/public/index.html ADDED Viewed

@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <meta name="theme-color" content="#000000" />
+    <title>WEDATHEME</title>
+    <link href="http://imgcache.qq.com/qcloud/app/resource/ac/favicon.ico" rel="icon" type="image/x-icon">
+    <link rel="stylesheet" href="http://assets.woa.com/open_proj/proj_qcloud_v2/mc_2014/global/css/v2/global.css"></link>
+    <link rel="stylesheet" href="https://user-source-1303824488.cos.ap-shanghai.myqcloud.com/materials/gsd-h5-react@0.0.70/gsd-h5-react.main.css"></link>
+    <!-- <link rel="stylesheet" href="https://user-source-1303824488.cos.ap-shanghai.myqcloud.com/materials/gsd-h5-react@0.0.70/gsd-h5-react.main.css"></link> -->
+  </head>
+  <body data-weui-theme="light">
+    <div id="root" style="height: 100%"></div>
+    <script src="http://imgcache.qq.com/qcloud/main/scripts/release/common/vendors/babel/polyfill.6.26.min.js"></script>
+    <script src="http://imgcache.qq.com/qcloud/vendors/react/react16.development.js"></script>
+    <script src="http://imgcache.qq.com/qcloud/vendors/moment/moment-2.24.0.js"></script>
+  </body>
+</html>

package/src/web/wedatheme/src/app.js ADDED Viewed

@@ -0,0 +1,22 @@
+// 导入样式
+// import '@tencent/tea-component/lib/tea.css';
+import '@tencent/tea-component/dist/style/index.scss';
+import '@src/styles/index.scss';
+// 导入依赖
+import { app } from '@tea/app';
+// 导入组件
+import { WedathemeIndex } from '@src/routes/wedatheme-index';
+// 路由表，一个路由对应一个组件
+// prettier-ignore
+const routes = {
+  'wedatheme/index': WedathemeIndex,
+};
+// 注册路由表
+// 左侧菜单请在 `configs/menus.js` 配置
+app.routes(routes);

package/src/web/wedatheme/src/components/README.md ADDED Viewed

@@ -0,0 +1,4 @@
+腾讯云 WEDATHEME 控制台前端项目 - 公共组件
+================================
+此目录存放公共业务组件。

package/src/web/wedatheme/src/configs/menu.js ADDED Viewed

@@ -0,0 +1,9 @@
+/**
+ * 定义业务导航菜单
+ *
+ * 控制台业务请移至 http://yehe.isd.com/buffet 配置
+ */
+export const menu = {
+  title: 'WEDATHEME',
+  items: [{ route: '/wedatheme/index', title: 'WEDATHEME 主页' }],
+};

package/src/web/wedatheme/src/routes/wedatheme-index/Component.jsx ADDED Viewed

@@ -0,0 +1,402 @@
+import React, { useState } from 'react';
+import {
+  Card,
+  Form,
+  Layout,
+  Button,
+  RegionSelect,
+  RegionPanel,
+  RegionOption,
+  Cascader,
+  DatePicker,
+  List,
+  Dropdown,
+  SelectMultiple,
+  Tooltip,
+  Tag,
+  Text,
+  Upload,
+  Icon,
+  Justify,
+} from '@tencent/tea-component';
+// const { RangePicker } = DatePicker;
+// const [SelectAp, setSelectAp] = useState('default');
+const data = [
+  {
+    label: '北京市',
+    value: 'bj',
+    children: [
+      { label: '朝阳区', value: 'cy' },
+      { label: '海淀区', value: 'hd' },
+    ],
+  },
+  {
+    label: '上海市',
+    value: 'sh',
+    children: [
+      { label: '徐汇区', value: 'xh' },
+      { label: '黄埔区', value: 'hp' },
+    ],
+  },
+  {
+    label: '广东省',
+    value: 'gd',
+    children: [
+      {
+        label: '深圳市',
+        value: 'sz',
+        children: [
+          { label: '南山区', value: 'ns' },
+          { label: '宝安区', value: 'ba' },
+          { label: '福田区', value: 'ft', disabled: true },
+        ],
+      },
+    ],
+  },
+];
+// const menu = close => (
+//     <List type="option">
+//       <List.Item onClick={() => setSelectAp('default')}>默认</List.Item>
+//       <List.Item onClick={() => setSelectAp('button')}>按钮</List.Item>
+//       <List.Item onClick={() => setSelectAp('link')}>链接</List.Item>
+//       <List.Item onClick={() => setSelectAp('filter')}>筛选</List.Item>
+//       <List.Item onClick={() => setSelectAp('pre')}>无</List.Item>
+//       <List.SubMenu label="更多">
+//         <List type="option">
+//           <List.Item disabled>订阅</List.Item>
+//           <List.Item onClick={close}>朋友代付</List.Item>
+//         </List>
+//       </List.SubMenu>
+//     </List>
+// );
+// const [fileList, setFileList] = useState([]);
+// const [uploading, setUploading] = useState(null);
+// const [image, setImage] = useState(null);
+// function handleStart(file) {
+//   getBase64(file);
+//   setUploading(true);
+// }
+// const fnGetUrl = (file) => {
+//   const reader = new FileReader();
+//   let a ;
+//   reader.onloadend = () => {
+//     console.log('reader.result;', reader.result);
+//     a = reader.result;
+//   };
+//   console.log('aaaa', a);
+//   reader.readAsDataURL(file);
+//   return a;
+// };
+// function handleSuccess(result, { file }) {
+//   setFileList(fileList => [
+//     ...fileList,
+//     { name: file.name, status: 'success', url: 'https://via.placeholder.com/100' },
+//   ]);
+//   setUploading(false);
+//   console.log('result', result);
+//   console.log('FileList', FileList);
+// }
+// function handleError(error, { file }) {
+//   setFileList(fileList => [
+//     ...fileList,
+//     { name: file.name, status: 'danger', url: 'https://via.placeholder.com/50' },
+//   ]);
+//   setUploading(false);
+//   console.error('error', error);
+// }
+// function getBase64(file) {
+//   const reader = new FileReader();
+//   reader.onloadend = () => {
+//     setImage(reader.result);
+//   };
+//   reader.readAsDataURL(file);
+// }
+// 输入框
+export function WedaInput(props) {
+  const { label = '输入' } = props;
+  return (
+    <div className="weda-ui weda-input">
+      <div className="weda-formcells weui-cells weui-cells_forms weui-flex">
+        <div className="weda-formcells__label weui-cell">
+          <label>{label}</label>
+        </div>
+        <div className="weda-formcells__content weui-flex__item">
+          <div className="weui-cell weui-cell_active weui-cell_form">
+            <div className="weui-cell__bd weui-flex">
+              <input
+                className="weui-input"
+                type="text"
+                placeholder="请输入"
+                name="formInput"
+                value=""
+              />
+              <button className="weui-btn_reset weui-btn_icon weui-btn_input-clear">
+                <i className="weui-icon-clear"></i>
+              </button>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+}
+// 多选
+export function WedaTextArea() {
+  return (
+    <div className="weda-ui weda-textarea">
+      <div className="weda-formcells weui-cells weui-cells_forms weui-flex">
+        <div className="weda-formcells__label weui-cell">
+          <label>标题</label>
+        </div>
+        <div className="weda-formcells__content weui-flex__item">
+          <div className="weui-cell weui-cell_active weui-cell_form">
+            <div className="weui-cell__bd">
+              <textarea
+                className="weui-textarea fn-weda-textarea"
+                placeholder="请输入"
+                maxLength="140"
+              ></textarea>
+              <div className="weui-textarea-counter">
+                <span>0</span>/140
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+}
+// Radio
+export function WedaRadio() {
+  return (
+    <div className="weda-radio weda-ui">
+      <div className="weda-formcells weui-cells weui-cells_checkbox weui-flex">
+        <div className="weda-formcells__label weui-cell">
+          <label>单选框</label>
+        </div>
+        <div className="weda-formcells__content weui-flex__item">
+          <label
+            className="weui-cell weui-cell_active weui-check__label"
+            htmlFor="radio-6-0"
+          >
+            <div className="weui-cell__hd">
+              <input
+                type="radio"
+                className="weui-check"
+                name="radio-6-formRadio"
+                id="radio-6-0"
+                value="first"
+              />
+              <i className="weui-icon-checked"></i>
+            </div>
+            <div className="weui-cell__bd">
+              <p>选项一</p>
+            </div>
+          </label>
+          <label
+            className="weui-cell weui-cell_active weui-check__label"
+            htmlFor="radio-6-1"
+          >
+            <div className="weui-cell__hd">
+              <input
+                type="radio"
+                className="weui-check"
+                name="radio-6-formRadio"
+                id="radio-6-1"
+                value="second"
+                checked=""
+              />
+              <i className="weui-icon-checked"></i>
+            </div>
+            <div className="weui-cell__bd">
+              <p>选项二</p>
+            </div>
+          </label>
+        </div>
+      </div>
+    </div>
+  );
+}
+// 复选
+export function WedaCheckbox() {
+  return (
+    <div className="weda-ui weda-checkbox">
+      <div className="weda-formcells weui-cells weui-cells_checkbox weui-flex">
+        <div className="weda-formcells__label weui-cell">
+          <label>复选框</label>
+        </div>
+        <div className="weda-formcells__content weui-flex__item">
+          <label
+            className="weui-cell weui-cell_active weui-check__label"
+            htmlFor="checkbox-32-0"
+          >
+            <div className="weui-cell__hd">
+              <input
+                type="checkbox"
+                className="weui-check"
+                name="checkbox-32-formCheckbox"
+                id="checkbox-32-0"
+                value="first"
+              />
+              <i className="weui-icon-checked"></i>
+            </div>
+            <div className="weui-cell__bd">
+              <p>选项一</p>
+            </div>
+          </label>
+          <label
+            className="weui-cell weui-cell_active weui-check__label"
+            htmlFor="checkbox-32-1"
+          >
+            <div className="weui-cell__hd">
+              <input
+                type="checkbox"
+                className="weui-check"
+                name="checkbox-32-formCheckbox"
+                id="checkbox-32-1"
+                value="second"
+              />
+              <i className="weui-icon-checked"></i>
+            </div>
+            <div className="weui-cell__bd">
+              <p>选项二</p>
+            </div>
+          </label>
+        </div>
+      </div>
+    </div>
+  );
+}
+// 选则，包括时间/邮箱/等
+export function WedaSelect(props) {
+  const { label = '选择' } = props;
+  return (
+    <div className="weda-ui weda-select">
+      <div className="weda-formcells weui-cells weui-cells_forms weui-flex">
+        <div className="weda-formcells__label weui-cell">
+          <label>{label}</label>
+        </div>
+        <div className="weda-formcells__content weui-flex__item">
+          <div className="weui-cell weui-cell_active weui-cell_form weui-flex__item">
+            <div className="weui-cell__bd weui-flex">
+              <input
+                className="weui-input"
+                type="select"
+                name="formSelect"
+                placeholder="请选择"
+                autoComplete="off"
+                value=""
+              />
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+}
+// 开关
+export function WedaSwitch() {
+  return (
+    <div className="weda-ui weda-switch">
+      <div className="weda-formcells weui-cells weui-cells_checkbox weui-flex">
+        <div className="weda-formcells__label weui-cell">
+          <label>开关</label>
+        </div>
+        <div className="weda-formcells__content weui-flex__item">
+          <div className="weui-cell weui-cell_active weui-cell_switch weui-flex__item">
+            <div className="weui-cell__bd"></div>
+            <div className="weui-cell__ft">
+              <label htmlFor="switch-id2" className="weui-switch-cp">
+                <input
+                  id="switch-id2"
+                  className="weui-switch-cp__input"
+                  type="checkbox"
+                />
+                <div className="weui-switch-cp__box"></div>
+              </label>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+}
+// 地域选择器
+export function WedaRegionSelect() {
+  const { Head, Column, Group } = RegionPanel;
+  const [region, setRegion] = useState('gz');
+  return (
+    <div className="weda-select weui-cells weui-cells_form weui-flex">
+      <div className="weui-cell">地区</div>
+      <div className="weui-cell weui-cell_active weui-cell_form weui-flex__item">
+        <RegionSelect
+          className="fn-weda-dropdown--region-select"
+          boxclassName="fn-weda-region"
+          value={region}
+          onChange={value => setRegion(value)}
+          moreInfo="其它地域 20"
+          shortcut={{
+            title: '最近访问',
+            options: ['gz', 'sh', 'bj'],
+          }}
+        >
+          <RegionPanel>
+            <Head>全部地域</Head>
+            <Column>
+              <Group name="中国">
+                <RegionOption value="gz" num={20}>
+                  广州
+                </RegionOption>
+                <RegionOption value="sh" num={20} dot>
+                  上海
+                </RegionOption>
+                <RegionOption value="hk">香港</RegionOption>
+              </Group>
+              <Group name="游戏专区">
+                <RegionOption value="bj">北京</RegionOption>
+              </Group>
+            </Column>
+            <Column>
+              <Group name="亚洲">
+                <RegionOption value="ia" num={20}>
+                  印度
+                </RegionOption>
+                <RegionOption value="ko">韩国</RegionOption>
+                <RegionOption value="ta">泰国</RegionOption>
+                <RegionOption value="sg">新加坡</RegionOption>
+                <RegionOption value="jp">日本</RegionOption>
+              </Group>
+            </Column>
+            <Column>
+              <Group name="北美洲">
+                <RegionOption value="gg">硅谷</RegionOption>
+                <RegionOption value="dld">多伦多</RegionOption>
+              </Group>
+            </Column>
+            <Column>
+              <Group name="欧洲">
+                <RegionOption value="fl">法兰克福</RegionOption>
+                <RegionOption value="mo">莫斯科</RegionOption>
+              </Group>
+            </Column>
+          </RegionPanel>
+        </RegionSelect>
+      </div>
+    </div>
+  );
+}