@cniot/android-pda-components 0.2.21 → 0.2.25

package/packages/TaskCard/index.less

@@ -1,101 +0,0 @@
-.pda-list-item {
-    padding: 24px 16px;
-    border-radius: 16px;
-    & div {
-        margin: 0;
-    }
-    &>div {
-        margin-bottom: 12px;
-    }
-    &>div:last-child {
-        margin-bottom: 0px;
-    }
-    // .pda-listitem-header {
-    //     font-size: 32px;
-    //     line-height: 32px;
-    //     color: #FFFFFF60;
-
-    // }
-    .pda-listitem-highlight {
-        width: 100%;
-        font-size: 40px;
-        line-height: 40px;
-        font-weight: bold;
-        color: #FFFFFF;
-
-        display: flex;
-        flex-direction: row;
-        justify-content: space-between;
-        div:first-child {
-            flex: 1;
-            // display: block;
-            word-break: normal;
-            white-space: normal;
-            word-break: break-word;
-            // width: 200px;
-        }
-    }
-    // .pda-listitem-highlight-top{
-    //     margin-top: -8px;
-    // }
-    .pda-listitem-header,
-    .pda-listitem-state-text,
-    .pda-listitem-subinfo {
-        font-size: 32px;
-        line-height: 32px;
-        color: #999999;
-        word-break: break-all;
-    }
-
-    .pda-listitem-state-block {
-        display: flex;
-        flex-direction: row;
-        flex-wrap: wrap;
-        margin-bottom: 0;
-
-        &>div {
-            padding: 6px 10px;
-            border-radius: 4px;
-            background-color: #0091EA;
-            margin-bottom: 12px;
-            margin-right: 12px;
-
-            font-size: 24px;
-            line-height: 24px;
-        }
-        &>div.success {
-            background-color: #00FF00;
-        }
-        &>div.warning {
-            background-color: #FFCC00;
-        }
-        &>div.error {
-            background-color: #FF0000;
-        }
-    }
-
-    position: relative;
-    .pda-listitem-icon {
-        position: absolute;
-        top: 0;
-        right: 0;
-        width: 60px;
-        height: 60px;
-        background-color: #0091EA;
-        border-radius: 0 16px;
-        display: flex;
-        justify-content: center;
-        align-items: center;
-        opacity: 0.85;
-    }
-    .listitem-icon-container {
-        background-size: 100%;
-        background-repeat: no-repeat;
-        // background-position: center;
-        width: 16px;
-        height: 24px;
-    }
-    .listitem-icon-next {
-        background-image: url(https://img.alicdn.com/imgextra/i4/O1CN01FkZisA1tCg1sj3b6U_!!6000000005866-2-tps-40-58.png);
-    }
-}

package/packages/Toast/doc.jsx

@@ -1,112 +0,0 @@
-import React from "react";
-import Toast from "./index";
-export default function () {
-  return (
-    <div>
-      <h1>Toast</h1>
-      <p>弹窗组件，如果要悬浮在页面上，请配合 Overlay 使用</p>
-      <h2>示例</h2>
-      <div className="light-block">
-        <button onClick={
-          e => {
-            // console.log(123);
-            Toast.show({
-              type: 'success',
-              title: 'hello title',
-              message: 'hello message',
-              duration: 1000,
-            })
-          }
-        }>
-          点击 toast
-        </button>
-        <Toast
-          title="111111"
-          message="22222"
-          type="success"
-         ></Toast>
-         <br />
-         <Toast
-          title="111111"
-          message="22222"
-          type="warning"
-         ></Toast>
-
-        <br />
-         <Toast
-          title="延时关闭"
-          message="duration={3000}"
-          type="error"
-          duration={3000}
-         ></Toast>
-
-        <br />
-      </div>
-      <code className="code">{`
-        Toast.show({
-          type: 'success',
-          title: 'hello title',
-          message: 'hello message',
-        })
-        <Toast
-          title="111111"
-          message="22222"
-          type="success"
-        ></Toast>
-        <br />
-        <Toast
-          title="111111"
-          message="22222"
-          type="warning"
-        ></Toast>
-
-        <br />
-        <Toast
-          title="延时关闭"
-          message="duration={3000}"
-          type="error"
-          duration={3000}
-        ></Toast>
-      `}</code>
-      <h2>参数</h2>
-      <table className="pure-table pure-table-bordered">
-        <thead>
-          <tr>
-            <th>属性</th>
-            <th>说明</th>
-            <th>类型</th>
-            <th>默认值</th>
-          </tr>
-        </thead>
-        <tbody>
-          <tr>
-            <td>title</td>
-            <td>标题</td>
-            <td>string</td>
-            <td>标题文案</td>
-          </tr>
-          <tr>
-            <td>message</td>
-            <td>消息内容</td>
-            <td>string</td>
-            <td>消息内容</td>
-          </tr>
-
-          <tr>
-            <td>type</td>
-            <td>消息类型</td>
-            <td>string</td>
-            <td>success|warning|error</td>
-          </tr>
-          <tr>
-            <td>duration</td>
-            <td>延迟时间</td>
-            <td>number</td>
-            <td>单位 ms</td>
-          </tr>
-
-        </tbody>
-      </table>
-    </div>
-  );
-}

package/packages/Toast/index.jsx

@@ -1,7 +0,0 @@
-import Toast from './toast';
-import { show, clear } from './methods';
-
-Toast.show = show;
-Toast.clear = clear;
-
-export default Toast;

package/packages/Toast/index.less

@@ -1,23 +0,0 @@
-@import '../variable.less';
-
-.toast-wrap{
-  background:#00FF00;
-  border-radius:6px;
-  padding:10px 15px;
-  width: 100%;
-  box-sizing: border-box;
-  &.warning{
-    background-color:#FFCB00;
-  }
-  &.error{
-    background-color:#FF0000;
-  }
-  .toast-title{
-    font-size: 50px;
-    font-weight: bold;
-  }
-
-  .toast-message{
-    font-size: 32px;
-  }
-}

package/packages/Toast/methods.jsx

@@ -1,77 +0,0 @@
-import React, { useEffect, useState } from 'react'
-import { resolveContainer } from '../utils'
-import ReactDOM from 'react-dom'
-import { InternalToast } from './toast'
-import { mergeProps } from '../utils'
-
-const containers = [];
-
-function unmount(container) {
-  const unmountResult = ReactDOM.unmountComponentAtNode(container)
-  if (unmountResult && container.parentNode) {
-    container.parentNode.removeChild(container)
-  }
-}
-
-const defaultProps = {
-  duration: 2000,
-}
-
-export function show(p) {
-  const props = mergeProps(
-    defaultProps,
-    p,
-  )
-  let timer = 0;
-  const { getContainer = () => document.body } = props
-  const container = document.createElement('div')
-  const bodyContainer = resolveContainer(getContainer)
-  bodyContainer.appendChild(container)
-  // console.log('container: ', container);
-
-  clear()
-  containers.push(container)
-
-  function TempToast() {
-    const [visible, setVisible] = useState(true)
-    useEffect(() => {
-      return () => {
-        props.afterClose && props.afterClose()
-      }
-    }, [])
-
-    useEffect(() => {
-      if (props.duration === 0) {
-        return
-      }
-      timer = window.setTimeout(() => {
-        setVisible(false)
-      }, props.duration)
-      return () => {
-        window.clearTimeout(timer)
-      }
-    }, [])
-
-    return (
-      <InternalToast
-        {...props}
-        getContainer={() => container}
-        visible={visible}
-        afterClose={() => {
-          unmount(container)
-        }}
-      />
-    )
-    // return 'hello world: toast'
-  }
-
-  ReactDOM.render(<TempToast />, container)
-}
-
-export function clear() {
-  while (true) {
-    const container = containers.pop()
-    if (!container) break
-    unmount(container)
-  }
-}

package/packages/Toast/toast.jsx

@@ -1,96 +0,0 @@
-import React, { useState, useEffect, ReactNode, useMemo } from "react";
-import './index.less';
-
-import classNames from 'classnames'
-// import Mask from '../mask'
-import { mergeProps, playSound } from '../utils'
-// import { PropagationEvent } from '../utils'
-// import { GetContainer } from '../utils'
-import Overlay from '../Overlay'
-
-
-function getTypeClass(type) {
-    return {
-        "success": "toast-wrap success",
-        "warning": "toast-wrap warning",
-        "error": "toast-wrap error",
-    }[type] || "toast-wrap"
-}
-export default function Toast(props) {
-    const { title = "title", message = "message", type = "success", duration = null } = props;
-    const [hidden, setHidden] = useState(false)
-    useEffect(() => {
-      if(window.WindVane){
-        if(type === 'warning') {
-          playSound('error1');
-          window.WindVane.call('WVMotion', 'vibrate', {duration: 400});
-        } else if(type === 'error') {
-          playSound('error2');
-          window.WindVane.call('WVMotion', 'vibrate', {duration: 200});
-          setTimeout(() => {
-            window.WindVane.call('WVMotion', 'vibrate', {duration: 300});
-          }, 250);
-        }
-      }
-    }, [])
-    if (duration) {
-        setTimeout(() => {
-            setHidden(true);
-        }, duration);
-    }
-
-    return !hidden ? (
-        <div className={getTypeClass(type)}>
-            <div className="toast-title">{title}</div>
-            <div className="toast-message">{message}</div>
-        </div>
-    ) : null
-}
-
-
-const defaultProps = {
-    maskClickable: true,
-    stopPropagation: ['click'],
-}
-
-export const InternalToast = p => {
-    const props = mergeProps(defaultProps, p)
-    const { maskClickable, content, icon, position, title, message, type, visible } = props
-
-    return (
-        // <Mask
-        //     visible={props.visible}
-        //     destroyOnClose
-        //     opacity={0}
-        //     disableBodyScroll={!maskClickable}
-        //     getContainer={props.getContainer}
-        //     afterClose={props.afterClose}
-        //     style={{
-        //         pointerEvents: maskClickable ? 'none' : 'auto',
-        //         ...props.maskStyle,
-        //     }}
-        //     className={classNames(`${classPrefix}-mask`, props.maskClassName)}
-        //     stopPropagation={props.stopPropagation}
-        // >
-        //     <div
-        //         style={{ top }}
-        //         className={classNames(
-        //             `${classPrefix}-wrap`,
-        //             icon ? `${classPrefix}-wrap-icon` : `${classPrefix}-wrap-text`
-        //         )}
-        //     >
-        //         {/* {iconElement && (
-        //     <div className={`${classPrefix}-icon`}>{iconElement}</div>
-        //   )} */}
-        //         {content}
-        //     </div>
-        // </Mask>
-        <Overlay visible={visible} verticalPosition='bottom' closable={true}>
-            <Toast
-                title={title}
-                message={message}
-                type={type}
-            ></Toast>
-        </Overlay>
-    )
-}

package/packages/WakeKeyborard/doc.jsx

@@ -1,170 +0,0 @@
-import React, { useState } from "react";
-import WakeKeyborard from "./index";
-import Keyborard from "./keyborard";
-import Button from '../Button';
-
-export default function () {
-  const [input, setInput] = useState(false);
-  return (
-    <div>
-      <h1>WakeKeyborard</h1>
-      <p>WakeKeyborard</p>
-      <h2>示例</h2>
-
-      <div className="light-block">
-        <p>点击右下角键盘</p>
-        <WakeKeyborard
-          autoWakeup={true}
-          label='搜索'
-          onWakeKeyboard={() => { console.log('wake keyboard') }}
-          onHidden={() => { console.log('keyboard hidden') }}
-          onClick={v => { console.log('v is ', v); }}
-          type='text'
-        />
-        <p>点击下面按钮唤起</p>
-        <Button
-          onClick={e => {
-            setInput(!input);
-          }}
-        >输入</Button>
-        {
-          input ? (
-            <Keyborard
-              onWakeKeyboard={
-                e => {
-                  console.log('keyborard from button');
-                }
-              }
-              onClick={
-                v => {
-                  console.log('value: ', v);
-                }
-              }
-              onHidden={
-                e => {
-                  console.log('keyborard hidden from button');
-                  setInput(false);
-                }
-              }
-            />
-          ) : null
-        }
-
-      </div>
-      <code className="code">{`
-<WakeKeyborard
-  autoWakeup={true}
-  label='搜索'
-  onWakeKeyboard={() => { console.log('wake keyboard') }}
-  onHidden={() => { console.log('keyboard hidden') }}
-  onClick={v => { console.log('v is ', v); }}
-  type='text'
-/>
-
-
-
-const [input, setInput] = useState(false);
-
-<Button
-  onClick={e => {
-    setInput(!input);
-  }}
->输入</Button>
-{
-input ? (
-  <Keyborard
-    onWakeKeyboard={
-      e => {
-        console.log('keyborard from button');
-      }
-    }
-    onClick={
-      v => {
-        console.log('value: ', v);
-      }
-    }
-    onHidden={
-      e => {
-        console.log('keyborard hidden from button');
-        setInput(false);
-      }
-    }
-  />
-) : null
-}
-      `}</code>
-      <h2>WakeKeyborard 参数</h2>
-      <table className="pure-table pure-table-bordered">
-        <thead>
-          <tr>
-            <th>属性</th>
-            <th>说明</th>
-            <th>类型</th>
-            <th>默认值</th>
-          </tr>
-        </thead>
-        <tbody>
-          <tr>
-            <td>autoWakeup</td>
-            <td>自动唤起</td>
-            <td>boolean</td>
-            <td>false</td>
-          </tr>
-
-        </tbody>
-      </table>
-      <p>其他参数同下面 Keyboard 参数</p>
-
-      <h2>Keyborard 参数</h2>
-      <table className="pure-table pure-table-bordered">
-        <thead>
-          <tr>
-            <th>属性</th>
-            <th>说明</th>
-            <th>类型</th>
-            <th>默认值</th>
-          </tr>
-        </thead>
-        <tbody>
-          <tr>
-            <td>label</td>
-            <td>确认按键文案</td>
-            <td>string</td>
-            <td>查询</td>
-          </tr>
-          <tr>
-            <td>onWakeKeyboard</td>
-            <td>唤起键盘回调</td>
-            <td>function</td>
-            <td></td>
-          </tr>
-          <tr>
-            <td>onClick</td>
-            <td>点击查询回调</td>
-            <td>function: (value) => { }</td>
-            <td>(value) => { }</td>
-          </tr>
-          <tr>
-            <td>onHidden</td>
-            <td>键盘隐藏时回调</td>
-            <td>function: (value) => { }</td>
-            <td>(value) => { }</td>
-          </tr>
-          <tr>
-            <td>type</td>
-            <td>键盘 type</td>
-            <td>string</td>
-            <td>tel</td>
-          </tr>
-          <tr>
-            <td>placeholder</td>
-            <td>输入框 placeholder</td>
-            <td>string</td>
-            <td>请输入</td>
-          </tr>
-        </tbody>
-      </table>
-
-    </div>
-  );
-}

package/packages/WakeKeyborard/index.jsx

@@ -1,61 +0,0 @@
-import React, { useState, useEffect, useRef } from "react";
-// import OPInput from "../OPInput";
-import "./index.less";
-// import classNames from "classnames";
-import Button from '../Button'
-import Keyborard from "./keyborard";
-
-const blankFunc = () => { };
-export default function WakeKeyborard(props) {
-  const [inputVisible, setInputVisible] = useState(props.autoWakeup || false);
-  // const inputRef = useRef(null);
-
-  // const { label = "查询", onWakeKeyboard = blankFunc, onClick = blankFunc, onHidden = blankFunc } = props;
-  const { onClick = blankFunc, onHidden = blankFunc, ...keyborardProps } = props;
-
-  return (
-    <div className="wakekeyborard">
-      {
-        inputVisible ? (
-          <Keyborard
-            // label={label}
-            onClick={
-              (v, e) => {
-                onClick(v);
-                setInputVisible(!inputVisible);
-                // onHidden(true);
-              }
-            }
-            onHidden={
-              s => {
-                setInputVisible(false);
-                onHidden(s);
-              }
-            }
-            {...keyborardProps}
-          />
-        ) : null
-      }
-      {
-        !inputVisible ? (
-          <div
-            className="wakekeyborard-icon"
-            onClick={
-              e => {
-                // this.setState({ inputVisible: !inputVisible });
-                setInputVisible(!inputVisible);
-                // requestAnimationFrame(() => {
-                //   onWakeKeyboard();
-                // })
-              }
-            }
-          ></div>
-        ) : null
-      }
-
-    </div>
-  )
-}
-
-
-WakeKeyborard.Keyborard = Keyborard;

package/packages/WakeKeyborard/index.less

@@ -1,55 +0,0 @@
-.wakekeyborard {
-  .wakekeyborard-icon {
-    width: 80px;
-    height: 80px;
-    background-image: url(https://img.alicdn.com/imgextra/i3/O1CN01kxYh3U25Xzr9nAcYp_!!6000000007537-2-tps-240-240.png);
-    background-size: 100%;
-
-    position: fixed;
-    right: 24px;
-    bottom: 24px;
-  }
-}
-
-.wakekeyborard-overlay {
-  position: fixed;
-  top: 0;
-  right: 0;
-  left: 0;
-  bottom: 0;
-  background-color: rgba(222, 222, 222, 0.2);
-}
-.wakekeyborard-inputbox {
-  width: 100%;
-  display: flex;
-  flex-direction: row;
-  height: 85px;
-
-  position: absolute;
-  bottom: 0;
-  left: 0;
-  right: 0;
-
-  input {
-    // width: 330px;
-    width:100%;
-    border-radius: 16px 0 0 0 ;
-    border: 0;
-    font-size: 42px;
-    background-color: white;
-    padding-left: 20px;
-    &:focus {
-      outline: none;
-    }
-    &::-webkit-input-placeholder {
-      color: rgb(209, 209, 214);
-      font-size: 32px;
-    }
-  }
-  button {
-    width: 150px;
-    border: 0;
-    border-radius: 0 16px 0 0;
-    background-color: white;
-  }
-}