@cniot/android-pda-components 0.2.21 → 0.2.25

package/packages/SimpleCardBlock/doc.jsx

@@ -1,77 +0,0 @@
-import React, {useState} from "react";
-import SimpleCardBlock from "./index";
-
-export default function () {
-  return (
-    <div>
-      <h1>SimpleCardBlock</h1>
-      <p>卡片块</p>
-      <h2>示例</h2>
-      <div className="light-block">
-        <SimpleCardBlock
-          title="出库信息出库信息出库信息出库信息出库信息出库信息出库信息"
-          tag={
-            {label: '注意啦', type: 'warning'}
-          }
-          dataSource={
-            [
-              {title: '500', content: '装车完成'},
-              {title: "标题", content: "内容", type: 'error', onClick: e=>console.log(e) },
-              {title: '500', content: '装车完成'},
-              {title: "标题", content: "内容", type: 'error', onClick: e=>console.log(e) },
-              {title: '500', content: '装车完成'},
-            ]
-          }
-        />
-      </div>
-      <code className="code">{`
-<SimpleCardBlock
-  title="出库信息出库信息出库信息出库信息出库信息出库信息出库信息"
-  tag={
-    {label: '注意啦', type: 'warning'}
-  }
-  dataSource={
-    [
-      {title: '500', content: '装车完成'},
-      {title: "标题", content: "内容", type: 'error', onClick: e=>console.log(e) },
-      {title: '500', content: '装车完成'},
-      {title: "标题", content: "内容", type: 'error', onClick: e=>console.log(e) },
-      {title: '500', content: '装车完成'},
-    ]
-  }
-/>
-      `}</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>title</td>
-          </tr>
-          <tr>
-            <td>tag</td>
-            <td>标签</td>
-            <td>object</td>
-            <td>参考 Tab</td>
-          </tr>
-          <tr>
-            <td>dataSource</td>
-            <td>card 数据源</td>
-            <td>{JSON.stringify([{}, {}])}</td>
-            <td>对象格式参考 SimpleCard</td>
-          </tr>
-        </tbody>
-      </table>
-    </div>
-  );
-}

package/packages/SimpleCardBlock/index.jsx

@@ -1,43 +0,0 @@
-import React, {useState, useEffect} from "react";
-import SimpleCard from "../SimpleCard";
-import Tag from '../Tag';
-import "./index.less";
-import classNames from "classnames";
-
-export default function SimpleCardBlock (props) {
-  const { className=undefined, dataSource=[], title='', tag} = props;
-  return (
-    <div className={classNames({[className]: true, 'simple-card-block': true, })} >
-      <div className="simple-card-block-header">
-        <p className="simple-card-block-title">{title}</p>
-        {
-          tag ? (
-            <div style={{marginLeft: 12}}>
-              <Tag {...tag} />
-            </div>
-
-          ) : null
-        }
-
-      </div>
-      {
-        dataSource.length > 0 ? (
-          <div className="simple-card-block-content">
-            {
-              dataSource.map((item, index) => {
-                return <SimpleCard
-                  key={index}
-                  {
-                    ...item
-                  }
-                />
-              })
-            }
-            <div style={{display: 'inline-block', padding: '12px  18px'}}></div>
-            <div style={{display: 'inline-block', padding: '0  18px', margin: 0}}></div>
-          </div>
-        ) : null
-      }
-    </div>
-  )
-}

package/packages/SimpleCardBlock/index.less

@@ -1,26 +0,0 @@
-.simple-card-block {
-  background-color: white;
-  padding: 24px 12px;
-  border-radius: 12px;
-
-  .simple-card-block-header {
-    display: flex;
-    justify-content: space-between;
-  }
-
-  .simple-card-block-title {
-    color: #666666;
-    font-size: 32px;
-    line-height: 32px;
-  }
-  .simple-card-block-content {
-    display: flex;
-    flex-wrap: wrap;
-    &>div {
-      min-width: 190px;
-      flex: 1;
-      margin-right: 12px;
-      margin-top: 12px;
-    }
-  }
-}

package/packages/SubCard/doc.jsx

@@ -1,63 +0,0 @@
-import React from "react";
-import SubCard from "./index";
-export default function () {
-  return (
-    <div>
-      <h1>SubCard</h1>
-      <p>附卡片</p>
-      <h2>示例</h2>
-      <div className="dark-block" style={{display:"flex"}}>
-        <SubCard style={{marginRight: "20px", width: 400}} tag={{label: "散箱", type: "default"}}  title="品号" context="50827834508278345082783450827834" attrs={["批次：23842839", "数量：234"]} ></SubCard>
-        <SubCard style={{marginRight: "20px", width: 400}} title="品号" tag={{label: "少货", type: "warning"}} context="5082 7834" name="徐福记抹茶凤梨酥17g" attrs={["批次：23842839", "数量：234"]} ></SubCard>
-        <SubCard title="品号" tag={{label: "少货", type: "warning"}} name="徐福记抹茶凤梨酥17g"></SubCard>
-      </div>
-      <code className="code">{`
-        <SubCard tag={{label: "散箱", type: "default"}}  title="品号" context="5082 7834" attrs={["批次：23842839", "数量：234"]} ></SubCard>
-        <SubCard title="品号" tag={{label: "少货", type: "warning"}} context="5082 7834" name="徐福记抹茶凤梨酥17g" attrs={["批次：23842839", "数量：234"]} ></SubCard>
-      `}</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>context</td>
-            <td>内容</td>
-            <td>string</td>
-            <td></td>
-          </tr>
-          <tr>
-            <td>name</td>
-            <td>品名</td>
-            <td>string</td>
-            <td></td>
-          </tr>
-          <tr>
-            <td>tag</td>
-            <td>标签名</td>
-            <td>object</td>
-            <td></td>
-          </tr>
-          <tr>
-            <td>attrs</td>
-            <td>Array</td>
-            <td></td>
-            <td></td>
-          </tr>
-        </tbody>
-      </table>
-    </div>
-  );
-}

package/packages/SubCard/index.jsx

@@ -1,28 +0,0 @@
-import React from 'react';
-import './index.less';
-export default function SubCard(props){
-  const {title, context, name, tag, attrs = [], style} = props
-  return <div className="android-sub-card" style={style}>
-    <div className="android-sub-card-title-section">
-      <div className="android-sub-card-title">{title}</div>
-      {
-        tag ? <div className="android-sub-card-tag">
-          <div className={tag.type}>
-            {tag.label || ""}
-          </div>
-        </div> : null
-      }
-    </div>
-    <div className="android-sub-card-context">{context}</div>
-    {
-      name ? <div className="android-sub-card-name">{name}</div> : null
-    }
-    <div className="android-sub-card-attrs">
-      {
-        attrs.map((text)=>{
-          return <div key={text}>{text}</div>
-        })
-      }
-    </div>
-  </div>;
-}

package/packages/SubCard/index.less

@@ -1,64 +0,0 @@
-.android-sub-card{
-  background: #282828;
-  border-radius: 16px;
-  padding:10px;
-  color: #FFFFFF;
-  .android-sub-card-title-section {
-    display: flex;
-    justify-content: space-between;
-    .android-sub-card-title{
-      opacity: 0.6;
-      font-size: 32px * 0.666;
-    }
-    .android-sub-card-tag {
-      margin-bottom: 0;
-
-      &>div {
-          padding: 6px 10px;
-          border-radius: 4px;
-          background-color: #0091EA;
-          color: #fff;
-          font-size: 24px * 0.666;
-          line-height: 24px * 0.666;
-      }
-      &>div.success {
-          background-color: #00FF00;
-      }
-      &>div.warning {
-          background-color: #FFCC00;
-          color: #000;
-      }
-      &>div.error {
-          background-color: #FF0000;
-      }
-  }
-  }
-
-  .android-sub-card-context{
-    font-size: 60px;
-    line-height: 60px;
-    font-weight: bold;
-    // margin: -6px 0 -6px 0;
-    word-break: break-all;
-    word-wrap: break-word;
-    margin-top: 16px;
-  }
-
-  .android-sub-card-name {
-    font-size: 40px;
-    line-height: 40px;
-    font-weight: bold;
-    margin-top: 16px;
-    margin-bottom: 12px;
-  }
-
-  .android-sub-card-attrs{
-    // opacity: 0.6;
-    font-size: 32px;
-    line-height: 32px;
-    color: #999999;
-    &>div {
-      margin-top: 12px;
-    }
-  }
-}

package/packages/Tag/doc.jsx

@@ -1,47 +0,0 @@
-import React, {useState} from "react";
-import Tag from "./index";
-
-export default function () {
-  return (
-    <div>
-      <h1>Tag</h1>
-      <p>标签</p>
-      <h2>示例</h2>
-      <div className="light-block">
-        <Tag />
-        <Tag label='warning' type='warning'/>
-      </div>
-      <code className="code">{`
-<Tag />
-<Tag label='warning' type='warning'/>
-      `}</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>label</td>
-            <td>label</td>
-            <td>string</td>
-            <td>label</td>
-
-
-          </tr>
-          <tr>
-            <td>type</td>
-            <td>类型</td>
-            <td>success | warning | error</td>
-            <td>success</td>
-          </tr>
-        </tbody>
-      </table>
-    </div>
-  );
-}

package/packages/Tag/index.jsx

@@ -1,12 +0,0 @@
-import React, {useState, useEffect} from "react";
-import "./index.less";
-import classNames from "classnames";
-
-export default function Tag (props) {
-  const { className=undefined, label='label', type='success' } = props;
-  return (
-    <div className={classNames({[className]: true, 'pda-tag': true, ['pda-tag-'+type]: true})}>
-      {label}
-    </div>
-  )
-}

package/packages/Tag/index.less

@@ -1,22 +0,0 @@
-.pda-tag {
-  display: inline-block;
-  padding: 6px 10px;
-  border-radius: 4px;
-  background-color: #0091ea;
-  margin-bottom: 12px;
-  margin-right: 12px;
-
-  font-size: 24px;
-  line-height: 24px;
-
-  word-break: keep-all;
-  &.pda-tag-success {
-    background-color: #00ff00;
-  }
-  &.pda-tag-warning {
-    background-color: #ffcc00;
-  }
-  &.pda-tag-error {
-    background-color: #ff0000;
-  }
-}

package/packages/TaskCard/doc.jsx

@@ -1,151 +0,0 @@
-import React from "react";
-import ListItem from "./index";
-export default function () {
-  return (
-    <div>
-      <h1>ListItem</h1>
-      <p>扫码组件</p>
-      <h2>示例</h2>
-      {/* const { className, header, highlightText, highlightSubText, stateTextList = [], stateList=[], subInfoList = [], style={} } = this.props; */}
-      <div className="light-block" style={{display: 'flex', flexDirection: 'row'}}>
-        <ListItem
-          onClick={
-            e => {
-              console.log(123);
-            }
-          }
-          // header="任务单"
-          highlightText="c5058f90218443bf857bc1e6c0b72aef"
-          highlightSubText="30%"
-          icon="next"
-          stateTextList={[
-            {label: '状态1'},
-            {label: '状态2'},
-            {label: '状态2'},
-          ]}
-          stateList={[
-            {label: 'success', type: 'success'},
-            {label: 'default', },
-            {label: 'warning', type: 'warning'},
-            {label: 'error', type: 'error'},
-          ]}
-          subInfoList={
-            [
-              {label: '商品条码', content: '623126388798'},
-              {label: '截止日期', content: '2022-07-25'},
-              {label: '产品名称', content: '商品的名称'},
-              {label: '品号', content: '12398765423'},
-              {label: '仓库', content: '12398000032432432423400000765423'},
-            ]
-          }
-          onHeightLightClick={()=> {
-            console.log('heightlight click!')
-          }}
-          onIconClick={()=> {
-            console.log('icon click!')
-          }}
-          style={{
-            width: '432px',
-            marginRight: '32px',
-            backgroundColor: 'black'
-          }}
-        />
-      </div>
-      <code className="code">{`
-<ListItem
-  header="任务单"
-  highlightText="XXXX-XX-XXX"
-  highlightSubText="30%"
-  icon="next"
-  stateTextList={[
-    {label: '状态1'},
-    {label: '状态2'},
-    {label: '状态2'},
-  ]}
-  stateList={[
-    {label: 'success', type: 'success'},
-    {label: 'default', },
-    {label: 'warning', type: 'warning'},
-    {label: 'error', type: 'error'},
-  ]}
-  onIconClick={()=> {
-    console.log('icon click!')
-  }}
-  onHeightLightClick={()=> {
-    console.log('heightlight click!')
-  }}
-  subInfoList={
-    [
-      {label: '商品条码', content: '623126388798'},
-      {label: '截止日期', content: '2022-07-25'},
-      {label: '产品名称', content: '商品的名称'},
-      {label: '品号', content: '12398765423'},
-      {label: '仓库', content: '12398000000000765423'},
-    ]
-  }
-/>
-      `}</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>header</td>
-            <td>标题</td>
-            <td>string</td>
-            <td></td>
-          </tr>
-          <tr>
-            <td>icon</td>
-            <td>右上方icon</td>
-            <td>string: next</td>
-            <td>暂时只支持 next</td>
-          </tr>
-          <tr>
-            <td>onHeightLightClick</td>
-            <td>HeightLight文本点击事件</td>
-            <td>()=></td>
-            <td></td>
-          </tr>
-          <tr>
-            <td>onIconClick</td>
-            <td>右上方icon点击事件</td>
-            <td>()=></td>
-            <td></td>
-          </tr>
-          <tr>
-            <td>highlightText</td>
-            <td>高亮文本</td>
-            <td>string</td>
-            <td></td>
-          </tr>
-          <tr>
-            <td>highlightSubText</td>
-            <td>高亮副文本</td>
-            <td>string</td>
-            <td></td>
-          </tr>
-          <tr>
-            <td>stateTextList</td>
-            <td>状态列表</td>
-            <td>object[]</td>
-            <td></td>
-          </tr>
-          <tr>
-            <td>subInfoList</td>
-            <td>更多商品信息</td>
-            <td>object[]</td>
-            <td></td>
-          </tr>
-        </tbody>
-      </table>
-    </div>
-  );
-}

package/packages/TaskCard/index.jsx

@@ -1,65 +0,0 @@
-import React from "react";
-import "./index.less";
-import classNames from "classnames";
-
-export default class PdaListItem extends React.Component {
-  constructor(props) {
-    super(props);
-  }
-
-  render() {
-    const { className, header, onClick = () => {}, onHeightLightClick = () => {}, onIconClick = () => {}, highlightText, highlightSubText, stateTextList = [], stateList=[], subInfoList = [], style={}, icon } = this.props;
-    return (
-      <div className={classNames({[className]: true, 'pda-list-item': true, })} style={style} onClick={onClick}>
-        {!!header ? <div className="pda-listitem-header">{header}</div> : null}
-        <div onClick={onHeightLightClick} className={classNames({"pda-listitem-highlight": true })}>
-          <div>{highlightText}</div>
-          <div>{highlightSubText}</div>
-        </div>
-        <div className="pda-listitem-state-text">
-          {
-            stateTextList.map((item, index) => {
-              return (
-                <span key={index}>{item.label || ''}｜</span>
-              )
-            })
-          }
-        </div>
-        <div className="pda-listitem-state-block">
-          {
-            stateList.map((item, index) => {
-              // const type = item?.type ? item.type : 'default';
-              const type = (item && item.type) ? item.type : 'default';
-              return (
-                <div key={index} className={type}>
-                  {item.label || ""}
-                </div>
-              )
-            })
-          }
-        </div>
-        {
-          icon ? (
-            <div onClick={onIconClick} className="pda-listitem-icon">
-              <div className={classNames({"listitem-icon-container": true, ["listitem-icon-"+icon]: true})}></div>
-            </div>
-          ) : null
-        }
-        {
-          subInfoList.map((item, index) => {
-            return (
-              <div key={index} className="pda-listitem-subinfo">
-                <span>{item.label || ''}</span>
-                &nbsp;&nbsp;
-                <span>{item.content || ''}</span>
-              </div>
-            )
-          })
-        }
-
-
-        
-      </div>
-    )
-  }
-}