Commit 639d38868236485373c2d003603d21392ad0078f

Authored by zhangzzzz
1 parent a5f05473

新增commobilePadList路由;

src/mobile/common/CommobileListEvent.js
... ... @@ -387,8 +387,39 @@ export default (ChildComponent) => {
387 387 } else if (name === 'BtnBatchCancelExamine') {
388 388 /* 批量销审 */
389 389 this.handleBatchCancelExamine();
  390 + } else if (name === 'BtnAdd') {
  391 + this.handleAdd();
390 392 }
391 393 };
  394 +
  395 + /** 点击新增按钮 */
  396 + handleAdd = () => {
  397 + const {
  398 + slaveConfig, dispatch, slaveFilterCondition, slavePagination, slaveOrderBy, formRoute,
  399 + } = this.props;
  400 + const picArr = slaveConfig.gdsconfigformslave.filter(item => (item.sName === 'picArr'));
  401 + const getData = this.handleGetData;
  402 + if (picArr.length > 0) {
  403 + let sActiveId = '';
  404 + if (picArr[0].sName === 'picArr' && picArr[0].sDropDownType === 'picArr') {
  405 + [{ sActiveId }] = picArr;
  406 + }
  407 + const sNameUrl = `${commonConfig.server_host}gdsmodule/getGdsmoduleById/${sActiveId}?sModelsId=${sActiveId}&sName=${formRoute}`;
  408 + let copyTo = {};
  409 +
  410 + dispatch({
  411 + type: 'content/onRouterMobile',
  412 + payload: {
  413 + urlKey: sNameUrl,
  414 + sModelsId: sActiveId,
  415 + copyToData: undefined,
  416 + copyTo,
  417 + refresh: getData.bind(this, slaveConfig, slaveFilterCondition, commonUtils.isEmpty(slavePagination) ? 0 : slavePagination.current, slaveOrderBy), /* 刷新方法 */
  418 + },
  419 + });
  420 + }
  421 + };
  422 +
392 423 handleForceComplete = () => {
393 424 const { slaveSelectedRowKeys, app } = this.props;
394 425 if (commonUtils.isEmptyObject(slaveSelectedRowKeys)) {
... ...
src/mobile/common/CommobilePadBill/index.less
... ... @@ -127,7 +127,7 @@
127 127  
128 128 .ant-form-item-control {
129 129 flex-basis: 100px;
130   - max-width: 100%;
  130 + max-width: calc(100% - 160px);
131 131 flex-grow: 1;
132 132 padding: 0 !important;
133 133 }
... ...
src/mobile/common/CommobilePadList/index.js 0 → 100644
  1 +/* eslint-disable */
  2 +/* eslint-disable prefer-destructuring */
  3 +/* eslint no-dupe-keys: 0, no-mixed-operators: 0 */
  4 +import React from 'react';
  5 +import { ListView, Checkbox, Modal, Toast, Flex } from 'antd-mobile-v2';
  6 +import { createForm } from 'rc-form';
  7 +import 'antd-mobile-v2/dist/antd-mobile.css';
  8 +import commonConfig from '../../../utils/config';
  9 +import * as commonUtils from '../../../utils/utils';
  10 +import CommobileBase from '../../../mobile/common/CommobileBase';
  11 +import CommobileListEvent from '../CommobileListEvent';
  12 +import CommobileSearchComponent from '../CommobileSearchComponent';
  13 +import CommobileToolBar from '../CommobileToolBar';
  14 +import CommonbileStep from '../CommobileStep';
  15 +import StaticEditTable from "@/components/Common/CommonTable"; /* 可编辑表格 */
  16 +import SearchComponent from "@/components/Common/SearchComponent";
  17 +import * as commonBusiness from "@/components/Common/commonBusiness"; /* 单据业务功能 */
  18 +import * as commonFunc from "@/components/Common/commonFunc";
  19 +import styles from '../../mobile.less';
  20 +import stylesNew from './index.less';
  21 +import preView from '../../components/preView';
  22 +import { useEffect } from 'react';
  23 +
  24 +const CheckboxItem = Checkbox.CheckboxItem;
  25 +const AgreeItem = Checkbox.AgreeItem;
  26 +
  27 +const dataSource = new ListView.DataSource({
  28 + rowHasChanged: (row1, row2) => row2,
  29 +});
  30 +
  31 +class CommobileList extends React.Component {
  32 + constructor(props) {
  33 + super(props);
  34 + this.state = {
  35 + isLoading: false,
  36 + partNameStatusVisible: false, /* 查看进度 */
  37 + sSlaveId: '',
  38 + };
  39 + }
  40 +
  41 + onEndReached = async () => {
  42 + if ((this.props.slavePagination.current + 1) <= Math.ceil(this.props.slavePagination.total / commonConfig.pageSize)) {
  43 + const { slaveFilterCondition } = this.props;
  44 + const addState = await this.props.onGetData(this.props.slaveConfig, slaveFilterCondition, this.props.slavePagination.current + 1, true);
  45 + addState.slaveData = this.props.slaveData.concat(addState.slaveData);
  46 + this.props.onSaveState({ ...addState });
  47 + }
  48 + }
  49 + onClose = key => () => {
  50 + this.setState({
  51 + [key]: false,
  52 + });
  53 + }
  54 + onModalShow = key => () => {
  55 + this.setState({
  56 + [key]: true,
  57 + });
  58 + }
  59 + handlePartNameStatusLook = (sSlaveId) => {
  60 + if (commonUtils.isNotEmptyObject(sSlaveId)) {
  61 + this.setState({
  62 + partNameStatusVisible: true,
  63 + sSlaveId,
  64 + });
  65 + } else {
  66 + Toast.fail('请选择要查看的工单', 1);
  67 + }
  68 + }
  69 + /* 列表弹出详情 */
  70 + handleDoubleClick = (rowData) => {
  71 + this.props.onDoubleClick(rowData);
  72 + }
  73 +
  74 + padTitles = (titles) => {
  75 + return titles.padEnd(4, ' ') + ':';
  76 + }
  77 + // topHeight = (value) => {
  78 + // let subHeight = 0;
  79 + // if ( value % 2 === 0 ) {
  80 + // subHeight = ( value / 2 ) * 22;
  81 + // } else {
  82 + // subHeight = (Math.floor(value / 2) + 1) * 22;
  83 + // }
  84 + // return subHeight;
  85 + // }
  86 +
  87 + render() {
  88 + return (
  89 + <>
  90 + <div style={{ display: 'none' }}><CommobileSearchComponent {...this.props} showScan="true" /></div>
  91 + <CommobilePadListComponent {...this.props} />
  92 + </>
  93 + );
  94 +
  95 + const {
  96 + slaveConfig, slaveData: slaveDataOld, slaveTotal, slaveSelectedRowKeys: slaveSelectedRowKeysOld, onReturnForm,
  97 + } = this.props;
  98 + const slaveDataOld2 = slaveDataOld === undefined ? [] : slaveDataOld;
  99 + const slaveData = dataSource.cloneWithRows(slaveDataOld2);
  100 + const slaveSelectedRowKeys = slaveSelectedRowKeysOld === undefined ? [] : slaveSelectedRowKeysOld;
  101 + const f1 = commonUtils.isEmptyObject(slaveConfig) ? {} : slaveConfig.gdsconfigformslave.filter(item => item.bVisible && item.sName !== '')[0];
  102 + const f2 = commonUtils.isEmptyObject(slaveConfig) ? {} : slaveConfig.gdsconfigformslave.filter(item => item.bVisible && item.sName !== '')[1];
  103 + const f3 = commonUtils.isEmptyObject(slaveConfig) ? {} : slaveConfig.gdsconfigformslave.filter(item => item.bVisible && item.sName !== '')[2];
  104 + const f4 = commonUtils.isEmptyObject(slaveConfig) ? {} : slaveConfig.gdsconfigformslave.filter(item => item.bVisible && item.sName !== '')[3];
  105 + const f5 = commonUtils.isEmptyObject(slaveConfig) ? {} : slaveConfig.gdsconfigformslave.filter(item => item.bVisible && item.sName !== '')[4];
  106 + const f6 = commonUtils.isEmptyObject(slaveConfig) ? {} : slaveConfig.gdsconfigformslave.filter(item => item.sControlName === 'printPdf')[0];
  107 + const f7 = commonUtils.isEmptyObject(slaveConfig) ? {} : slaveConfig.gdsconfigformslave.filter(item => item.bVisible && item.sName === 'sPartNameStatus')[0]; /* 查看进度 */
  108 + const separator = (sectionID, rowID) => (
  109 + <div
  110 + key={`${sectionID}-${rowID}`}
  111 + style={{
  112 + backgroundColor: '#F5F5F9',
  113 + height: 6,
  114 + borderTop: '1px solid #ECECED',
  115 + borderBottom: '1px solid #ECECED',
  116 + }}
  117 + />
  118 + );
  119 + const row = (rowData, sectionID, rowID) => {
  120 + const obj = JSON.parse(JSON.stringify(rowData)); // 深拷贝
  121 + if (commonUtils.isNotEmptyObject(f7)) {
  122 + // eslint-disable-next-line jsx-a11y/anchor-is-valid
  123 + obj[f7.sName] = (<span style={{ fontWeight: 'bold', fontSize: 14, color: '#888' }}><a onClick={this.handlePartNameStatusLook.bind(this, rowData.sSlaveId)}>查看工单状态</a></span>);
  124 + }
  125 + const f1View = f1 ?
  126 + (
  127 + <div
  128 + key={rowData.sSlaveId}
  129 + style={{
  130 + padding: '0 15px',
  131 + marginRight: 0,
  132 + lineHeight: '30px',
  133 + color: '#888',
  134 + fontSize: 16,
  135 + fontWeight: 'bold',
  136 + borderBottom: '1px solid #F6F6F6',
  137 + }}
  138 + >
  139 + {f1.showName}:<span style={{ fontSize: 16, color: '#000', paddingLeft: '6px' }}>{obj[f1.sName]}</span>
  140 + {/* eslint-disable-next-line jsx-a11y/anchor-is-valid */}
  141 + <span style={{ float: 'right', fontSize: 14, color: '#888' }}>{obj[f2.sName]}</span>
  142 + </div>
  143 + ) : '';
  144 +
  145 + return (
  146 + <div className={styles.CheckboxItem}>
  147 +
  148 + {/* eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions
  149 + onClick={() => this.props.onCopyToClick(rowData)} */}
  150 + {/* eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions */}
  151 + <li key={rowID} style={{ listStyle: 'none' }} onDoubleClick={() => this.handleDoubleClick(rowData)} >
  152 + {
  153 + true ?
  154 + <div style={{ display: 'flex', justifyContent: 'space-between' }}>
  155 + <CheckboxItem
  156 + key={rowData.sSlaveId}
  157 + checked={slaveSelectedRowKeys.findIndex(item => item === rowData.sSlaveId) > -1}
  158 + onChange={e => this.props.onCheckboxChange(e, rowData.sSlaveId)}
  159 + style={{
  160 + width: f6 ? '76%' : '100%',
  161 + marginRight: 0,
  162 + lineHeight: '30px',
  163 + color: '#888',
  164 + fontSize: 16,
  165 + fontWeight: 'bold',
  166 + borderBottom: '1px solid #F6F6F6',
  167 + }}
  168 + >
  169 +
  170 + {f1 ? `${f1.showName}:` : ''}<span style={{ fontSize: 16, color: '#000', paddingLeft: '6px' }}>{obj[f1.sName]}</span>
  171 + {f6 ? '' : f2 ? <span style={{ float: 'right', fontSize: 14, color: '#888' }}>{obj[f2.sName]}</span> : ''}
  172 + </CheckboxItem>
  173 + {
  174 + // eslint-disable-next-line jsx-a11y/anchor-is-valid
  175 + f6 ?
  176 + <div
  177 + style={{
  178 + borderBottom: '1px solid #F6F6F6',
  179 + fontSize: 14,
  180 + lineHeight: '40px',
  181 + fontWeight: 'bold',
  182 + paddingRight: '15px',
  183 + }}
  184 + >
  185 + {/* eslint-disable-next-line jsx-a11y/anchor-is-valid */}
  186 + <a onClick={e => this.props.onPrintView(e, rowData, f6)}>{obj[f6.sName]}</a>
  187 + </div> : ''
  188 + }
  189 + </div> : f1View
  190 + }
  191 + {f3 ?
  192 + <div key={rowID} style={{ padding: '0 15px', fontSize: 17, color: '#000' }}>
  193 + <div style={{ display: 'flex', padding: '10px 0' }}>
  194 + <div style={{ lineHeight: 1, width: '100%', fontSize: 16 }}>
  195 + {/* { f6 ? f2 ? */}
  196 + {/* '' : '' : ''} */}
  197 + {/* <div style={{ marginBottom: '12px' }} className={styles.wordsFlow}>{f3.showName}:<span style={{ color: '#000', paddingLeft: '6px' }}>{obj[f3.sName]}</span></div> */}
  198 + {/* <div */}
  199 + {/* style={{ */}
  200 + {/* marginBottom: '12px', */}
  201 + {/* display: 'flex', */}
  202 + {/* alignItem: 'center', */}
  203 + {/* justifyContent: 'center', */}
  204 + {/* }} */}
  205 + {/* className={styles.wordsFlow} */}
  206 + {/* > */}
  207 + {/* {f4 ? */}
  208 + {/* <div style={{ width: '70%', display: 'flex' }} className={styles.wordsFlow}> */}
  209 + {/* <div>{f4.showName}:</div> */}
  210 + {/* <div style={{ whiteSpace: 'normal', paddingLeft: '6px' }}><span style={{ color: '#000' }}>{obj[f4.sName]}</span></div> */}
  211 + {/* </div> : '' */}
  212 + {/* } */}
  213 + {/* {f5 ? */}
  214 + {/* <div style={{ width: '30%', textAlign: 'right' }} className={styles.wordsFlow}> */}
  215 + {/* { */}
  216 + {/* f6 ? */}
  217 + {/* <span style={{ fontSize: '14px', color: '#108ee9' }} >{obj[f5.sName]}</span> : */}
  218 + {/* <span style={{ fontSize: '14px', color: '#000' }} >{obj[f5.sName]}</span> */}
  219 + {/* } */}
  220 + {/* </div> : '' */}
  221 + {/* } */}
  222 + {/* </div> */}
  223 + {slaveConfig.gdsconfigformslave.filter(item => item.bVisible && item.sName !== '').map((item, iIndex) => {
  224 + if (iIndex > 1) {
  225 + /**
  226 + * 修改日期:2021-04-06
  227 + * 修改人:吕杰
  228 + * 区域:以下 - 行
  229 + * BUG:1144
  230 + * 说明:现实缩略图,点击展示预览弹窗
  231 + * 原代码:
  232 + */
  233 + const bNotViewTitle = item.bNotViewTitle; /* 不显示标题 */
  234 + const sMemo = item.sName.toLowerCase().endsWith('memo');
  235 + const iRowNum = item.iColValue === 1 ? 24 : 1; /* 每个字段占的网格个数 ,网格总个数是24 */
  236 + const iColValue = sMemo ? 24 : item.iColValue * iRowNum; /* 跨度 */
  237 + const iRowValue = commonUtils.isEmptyNumber(item.iRowValue) || item.iRowValue === 0 ? 1 : item.iRowValue; /* 行高 */
  238 + const height = iRowValue * 18; /* 行高 */
  239 + const { token } = this.props.app;
  240 + const dataUrl = []; /* 缩略图 */
  241 + if ((item.showName === '缩略图' || item.sName === 'spicture') && obj[item.sName]) {
  242 + obj[item.sName].split(',').forEach(url => dataUrl.push(`${commonConfig.file_host}file/download?savePathStr=${url}&sModelsId=100&token=${token}`));
  243 + }
  244 + if (dataUrl.length) {
  245 + // eslint-disable-next-line
  246 + return (<span>{item.showName}:<img onClick={(e) => preView(dataUrl, e)} src={dataUrl[0]} alt="img" style={{ width: '30px', height: '20px' }} /></span>);
  247 + }
  248 + const targetConfig = slaveConfig.gdsconfigformslave.filter(item2 => item2.sName === item.sName)[0];
  249 + const customColor = targetConfig.sColorTerms ? targetConfig.sColorTerms : '#000';
  250 + return (
  251 + <div className={iColValue === 24 ? 'singleItem' : (iColValue === 12 ? 'doubleItem' : 'treeItem')} style={{ marginBottom: '12px', color: customColor }}>
  252 + <Flex style={{ padding: 0, fontSize: '16px', alignItems: 'center' }} wrap={'wrap'} align='start'>
  253 + {
  254 + bNotViewTitle ?
  255 + <><Flex.Item style={{ fontWeight: 'bold', paddingLeft: '0.5px' }}> {obj[item.sName]}</Flex.Item></>
  256 + :
  257 + <><div className='flexTitle'>{item.showName}</div> <div style={{ fontWeight: 'bold' }}>:</div> <Flex.Item style={{ paddingLeft: '0.5px' }}> {obj[item.sName]}</Flex.Item></>
  258 + }
  259 + </Flex>
  260 + </div>
  261 + );
  262 + } else {
  263 + return ('');
  264 + }
  265 + })}
  266 + </div>
  267 + </div>
  268 + </div> : ''
  269 + }
  270 + </li>
  271 + </div>
  272 + );
  273 + };
  274 + const BtnStyle = {
  275 + type: 'default',
  276 + color: 'red',
  277 + border: 'none',
  278 + backgroundColor: '#fff',
  279 + fontSize: '15px',
  280 + };
  281 + const divStyle = {
  282 + display: 'flex',
  283 + justifyContent: 'flex-end',
  284 + background: '#fff',
  285 + };
  286 + const stepProps = {
  287 + ...this.props,
  288 + sSlaveId: this.state.sSlaveId,
  289 + };
  290 + return (
  291 + <div
  292 + style={{
  293 + position: 'absolute',
  294 + top: '0',
  295 + bottom: '0',
  296 + overflow: 'hiddle',
  297 + width: '100%',
  298 + }}
  299 + >
  300 + <div
  301 + style={{
  302 + position: 'relative',
  303 + top: '0',
  304 + }}
  305 + >
  306 + <div
  307 + style={{
  308 + display: 'flex',
  309 + // justifyContent: 'center',
  310 + alignItems: 'flex-start',
  311 + flexWrap: 'wrap',
  312 + }}
  313 + >
  314 + {commonUtils.isEmptyArr(slaveTotal) ? '' : Object.keys(slaveTotal[0]).map((key) => {
  315 + const iIndex = slaveConfig.gdsconfigformslave.findIndex(item => item.sName === key);
  316 + if (iIndex > -1) {
  317 + return (
  318 + <div style={{
  319 + width: '50%',
  320 + textAlign: 'center',
  321 + textOverflow: 'ellipsis',
  322 + overflow: 'hidden',
  323 + whiteSpace: 'nowrap',
  324 + padding: '0 15px',
  325 + fontSize: '14px',
  326 + }}
  327 + >
  328 + {`${slaveConfig.gdsconfigformslave[iIndex].showName}:${commonUtils.convertFixNum(commonUtils.convertStrToNumber(slaveTotal[0][key]), this.props.getFloatNum(key))}`}
  329 + </div>
  330 + );
  331 + } else {
  332 + return ('');
  333 + }
  334 + })}
  335 + </div>
  336 + <div>
  337 + <CommobileSearchComponent {...this.props} showScan="true" />
  338 + </div>
  339 + </div>
  340 + <div className={styles.listViewStyle}>
  341 + <ListView
  342 + dataSource={slaveData}
  343 + renderFooter={() => (
  344 + <div style={{ padding: 30, textAlign: 'center' }}>
  345 + {this.state.isLoading ? '加载中...' : '加载完毕'}
  346 + </div>)}
  347 + renderRow={row}
  348 + renderSeparator={separator}
  349 + style={{
  350 + position: 'absolute',
  351 + width: '100%',
  352 + bottom: commonUtils.isEmptyObject(slaveConfig) ? 88 : 135,
  353 + top: 0,
  354 + overflow: 'auto',
  355 + }}
  356 + pageSize={commonConfig.pageSize}
  357 + onScroll={() => { }}
  358 + scrollRenderAheadDistance={500}
  359 + onEndReached={this.onEndReached}
  360 + onEndReachedThreshold={10}
  361 + />
  362 + </div>
  363 +
  364 + {
  365 + commonUtils.isEmptyObject(slaveConfig) ? '' :
  366 + true ?
  367 + <div style={{
  368 + position: 'fixed',
  369 + bottom: '0',
  370 + width: '100%',
  371 + display: 'flex',
  372 + justifyContent: 'flex-start',
  373 + alignItem: 'center',
  374 + background: '#fff',
  375 + zIndex: '9999',
  376 + }}
  377 + >
  378 + {/*<AgreeItem*/}
  379 + {/* data-seed="logId"*/}
  380 + {/* disabled // 暂时全选禁止*/}
  381 + {/* onChange={e => this.props.onSelectAllClick(e)}*/}
  382 + {/* style={{*/}
  383 + {/* background: '#fff',*/}
  384 + {/* zIndex: '99999',*/}
  385 + {/* width: '25%',*/}
  386 + {/* display: 'flex',*/}
  387 + {/* justifyContent: 'flex-start',*/}
  388 + {/* alignItems: 'cneter',*/}
  389 + {/* }}*/}
  390 + {/*>*/}
  391 + {/* 全选*/}
  392 + {/*</AgreeItem>*/}
  393 + <div className={styles.commobilelistToolBarBtn}>
  394 + <CommobileToolBar {...this.props} btnStyle={BtnStyle} divStyle={divStyle} onButtonClick={this.props.onButtonClick} />
  395 + </div>
  396 + </div> : ''
  397 + }{f7 && commonUtils.isNotEmptyObject(this.state.sSlaveId) ?
  398 + <Modal
  399 + className="statusView"
  400 + popup
  401 + visible={this.state.partNameStatusVisible}
  402 + // closable
  403 + onClose={this.onClose('partNameStatusVisible')}
  404 + animationType="fade"
  405 + afterClose={() => { }}
  406 + >
  407 + <div className={styles.statusView_title}>
  408 + {/* eslint-disable-next-line jsx-a11y/anchor-is-valid */}
  409 + <a style={{ float: 'left', fontSize: '1.5em' }} onClick={this.onClose('partNameStatusVisible')} >&lt;</a>
  410 + 工单状态
  411 + </div>
  412 + <CommonbileStep {...stepProps} />
  413 + </Modal> : ''
  414 + }
  415 + </div>
  416 + );
  417 + }
  418 +}
  419 +
  420 +const CommobilePadListComponent = (props) => {
  421 + const { form, onReturnForm, formData = [], slaveConfig = {} } = props;
  422 + if (!formData.length) return null;
  423 +
  424 + useEffect(() => {
  425 + const slaveColumn = commonFunc.getHeaderConfig(slaveConfig);
  426 + props.onSaveState({ slaveColumn });
  427 + }, [])
  428 +
  429 + onReturnForm(form);
  430 +
  431 + const BtnStyle = {
  432 + type: 'default',
  433 + color: 'red',
  434 + border: 'none',
  435 + backgroundColor: '#fff',
  436 + fontSize: '15px',
  437 + };
  438 + const divStyle = {
  439 + display: 'flex',
  440 + justifyContent: 'flex-end',
  441 + background: '#fff',
  442 + };
  443 +
  444 + return (
  445 + <div>
  446 + <div className={stylesNew.search}>
  447 + <SearchComponent {...props} />
  448 + </div>
  449 + <div className={stylesNew.table}>
  450 + <TableComponent {...props} tableName="slave" />
  451 + </div>
  452 + <div className={styles.commobilelistToolBarBtn}>
  453 + <CommobileToolBar {...props} btnStyle={BtnStyle} divStyle={divStyle} onButtonClick={props.onButtonClick} />
  454 + </div>
  455 + </div>
  456 + )
  457 +}
  458 +
  459 +// 表格
  460 +const TableComponent = props => {
  461 + const { tableName } = props;
  462 + const baseProps = commonBusiness.getTableTypes(tableName, {
  463 + ...props,
  464 + noStorageColumn: true
  465 + });
  466 + const tableProps = {
  467 + ...baseProps,
  468 + // setOpterationColumn: "Y",
  469 + tableProps: {
  470 + // onChange: props.onTitleChange.bind(this, tableName),
  471 + },
  472 + fixedHeight: "calc(100vh - 230px)",
  473 + showTableName: false,
  474 + onSelectRowChange: (name, selectedRowKeys) => {
  475 + props.onSaveState({ [`${name}SelectedRowKeys`]: selectedRowKeys });
  476 + }
  477 + };
  478 + return <StaticEditTable {...tableProps} />;
  479 +};
  480 +
  481 +const CommobileListComponent = createForm()(CommobileList);
  482 +
  483 +export default CommobileBase(CommobileListEvent(CommobileListComponent));
... ...
src/mobile/common/CommobilePadList/index.less 0 → 100644
  1 +.flex(@align-item: initial, @justify-content: initial) {
  2 + display: flex;
  3 + align-items: @align-item;
  4 + justify-content: @justify-content;
  5 +}
  6 +
  7 +.size(@width: 100%, @height: 100%) {
  8 + width: @width;
  9 + height: @height;
  10 +}
  11 +
  12 +.verifyScrapBill {
  13 + .size();
  14 +}
  15 +
  16 +.toolBar {
  17 + position: relative;
  18 + .size(100%, 40px);
  19 + background: rgb(197, 197, 197);
  20 +}
  21 +
  22 +.content {
  23 + .size();
  24 + .flex(center, center);
  25 + font-size: 18px;
  26 + font-weight: bold;
  27 +}
  28 +
  29 +.bakTools {
  30 + .size(auto, 100%);
  31 + .flex(center);
  32 + position: absolute;
  33 + top: 0;
  34 + left: 0;
  35 +
  36 + :global {
  37 + .ant-btn {
  38 + font-weight: bold;
  39 + font-size: 18px;
  40 + }
  41 + }
  42 +}
  43 +
  44 +.tools {
  45 + .size(auto, 100%);
  46 + .flex(center);
  47 + position: absolute;
  48 + top: 0;
  49 + right: 0;
  50 +
  51 + :global {
  52 + .ant-btn {
  53 + font-weight: bold;
  54 + font-size: 18px;
  55 + }
  56 + }
  57 +}
  58 +
  59 +.billForm {
  60 + .size(100%, auto);
  61 + .flex();
  62 +
  63 + >div:nth-child(1) {
  64 + .size(calc(100% - 230px), 100%);
  65 + padding-top: 5px;
  66 + }
  67 +
  68 + >div:nth-child(2) {
  69 + .size(230px, auto);
  70 + padding-top: 10px;
  71 + // max-height: 140px;
  72 + display: grid;
  73 + grid-template-columns: repeat(2, 1fr);
  74 + grid-template-rows: repeat(4, 1fr);
  75 +
  76 + >div {
  77 + .size();
  78 + .flex(center, center);
  79 +
  80 + :global {
  81 + .ant-btn-lg {
  82 + min-width: 50px;
  83 + width: 100px;
  84 + height: 38px;
  85 + border-radius: 5px;
  86 + font-size: 18px;
  87 + }
  88 + }
  89 + }
  90 + }
  91 +
  92 + :global {
  93 + .ant-col {
  94 + height: 45px;
  95 + }
  96 +
  97 + .ant-col.ant-col-24.ant-col-order-5 {
  98 + height: auto;
  99 +
  100 + .viewStyle:last-child {
  101 + overflow: hidden !important;
  102 + padding-bottom: 5px;
  103 + }
  104 + }
  105 +
  106 + .ant-col.ant-form-item-label:not(.skipFlexBasis) {
  107 + flex-basis: 160px !important;
  108 + max-width: 160px !important;
  109 + height: 40px;
  110 + line-height: 27px;
  111 + border-right: 1px solid #aaa;
  112 + display: flex;
  113 + align-items: center;
  114 + justify-content: flex-start;
  115 + border: none !important;
  116 + background-color: transparent !important;
  117 +
  118 + label {
  119 + font-size: 18px !important;
  120 + }
  121 +
  122 + }
  123 +
  124 + .ant-form-item {
  125 + border: none !important;
  126 + }
  127 +
  128 + .ant-form-item-control {
  129 + flex-basis: 100px;
  130 + max-width: 100%;
  131 + flex-grow: 1;
  132 + padding: 0 !important;
  133 + }
  134 +
  135 + .ant-form-item-control-input-content {
  136 + .flex();
  137 +
  138 + >* {
  139 + flex-grow: 1;
  140 + }
  141 + }
  142 +
  143 + .ant-input,
  144 + .ant-input[disabled],
  145 + .viewStyle .ant-picker.ant-picker-disabled,
  146 + .viewStyle .ant-select-disabled .ant-select-selector {
  147 + flex-grow: 1;
  148 + text-indent: 8px;
  149 + font-size: 18px;
  150 + background: #f0f0f0 !important;
  151 + border-radius: 5px !important;
  152 + }
  153 +
  154 + .ant-input-number {
  155 + padding: 0 !important;
  156 +
  157 + input {
  158 + background: #f0f0f0 !important;
  159 + border-radius: 5px !important;
  160 + height: 40px !important;
  161 + padding-left: 0;
  162 + padding-right: 0;
  163 + text-indent: 8px;
  164 + }
  165 + }
  166 +
  167 + .ant-picker,
  168 + .ant-select {
  169 + background: #f0f0f0 !important;
  170 + border-radius: 5px !important;
  171 + height: 40px !important;
  172 +
  173 + .ant-select-selector,
  174 + .ant-select-selection-search {
  175 + height: 100%;
  176 + background-color: transparent;
  177 +
  178 + input {
  179 + height: 100% !important;
  180 + }
  181 + }
  182 +
  183 + input {
  184 + background-color: transparent !important;
  185 + }
  186 + }
  187 +
  188 + .ant-input-search-button {
  189 + height: 38px;
  190 + }
  191 +
  192 + .ant-select-selector {
  193 + // border: none !important;
  194 + // background: #f0f0f0 !important;
  195 + // border-radius: 5px !important;
  196 + // height: 32px !important;
  197 +
  198 + .ant-select-selection-item,
  199 + .ant-select-selection-placeholder {
  200 + font-size: 18px;
  201 + line-height: 36px !important;
  202 + }
  203 + }
  204 +
  205 + // .ant-input-affix-wrapper {
  206 + // height: 28px;
  207 + // line-height: 23px;
  208 + // border: none !important;
  209 + // background: #f0f0f0 !important;
  210 + // border-radius: 5px !important;
  211 + // height: 32px !important;
  212 + // box-shadow: none !important;
  213 + // padding-left: 0 !important;
  214 + // }
  215 +
  216 +
  217 + // .ant-picker.ant-picker-range {
  218 + // input {
  219 + // font-size: 14px !important;
  220 + // }
  221 + // }
  222 + }
  223 +}
  224 +
  225 +.search {
  226 + .size(100%, 50px);
  227 + .flex(center);
  228 +
  229 + >div {
  230 + .size();
  231 + .flex(center);
  232 + }
  233 +
  234 + div[class*="solutionList"] {
  235 + width: 160px !important;
  236 + margin-top: 5px;
  237 + }
  238 +
  239 + div[class*="fastFilter"] {
  240 + padding: 0;
  241 + padding: 0 0 0 10px;
  242 +
  243 + div[class*="advRow"] {
  244 + height: 40px;
  245 + margin-top: 5px;
  246 + }
  247 +
  248 + div[class*="toggleBtn"],
  249 + div[class*="advCol"] {
  250 + padding-top: 2px;
  251 + }
  252 +
  253 + div[class*="filterList"] {
  254 + background: #FFF;
  255 + padding-top: 0;
  256 + border-radius: 5px;
  257 + }
  258 + }
  259 +
  260 + span[class*="removeBtn"] {
  261 + top: 14px;
  262 + right: 8px;
  263 + font-size: 18px;
  264 + }
  265 +
  266 + :global {
  267 + .ant-btn-icon-only.ant-btn {
  268 + border-radius: 5px;
  269 + height: 36px;
  270 + min-width: 35px;
  271 + }
  272 +
  273 + .ant-btn:not(.ant-btn-icon-only) {
  274 + border-radius: 5px;
  275 + // min-width: 90px;
  276 + height: 36px;
  277 + font-size: 18px;
  278 +
  279 + span {
  280 + top: 0 !important;
  281 + }
  282 + }
  283 +
  284 + div[class*="filterList"] {
  285 + .ant-btn-lg {
  286 + min-width: 50px;
  287 + }
  288 + }
  289 +
  290 + .ant-input {
  291 + background-color: transparent;
  292 + }
  293 +
  294 + .ant-select-selector {
  295 + border: none !important;
  296 + background: #f0f0f0 !important;
  297 + border-radius: 5px !important;
  298 + height: 32px !important;
  299 +
  300 + .ant-select-selection-item,
  301 + .ant-select-selection-placeholder {
  302 + line-height: 32px !important;
  303 + }
  304 + }
  305 +
  306 + .ant-input-affix-wrapper {
  307 + height: 28px;
  308 + line-height: 23px;
  309 + border: none !important;
  310 + background: #f0f0f0 !important;
  311 + border-radius: 5px !important;
  312 + height: 32px !important;
  313 + box-shadow: none !important;
  314 + padding-left: 0 !important;
  315 + }
  316 +
  317 + .ant-picker {
  318 + background: #f0f0f0 !important;
  319 + border-radius: 5px !important;
  320 + height: 32px !important;
  321 + // margin-top: 6px;
  322 + }
  323 +
  324 + .ant-picker.ant-picker-range {
  325 + input {
  326 + font-size: 14px !important;
  327 + }
  328 + }
  329 + }
  330 +}
  331 +
  332 +.table {
  333 + .size(100%, auto);
  334 + flex-grow: 1;
  335 +
  336 + :global {
  337 +
  338 + .ant-tabs:not(.noXlyTabs) {
  339 + .ant-tabs-nav-wrap {
  340 + background: #fff;
  341 +
  342 + .ant-tabs-nav-list {
  343 + background: #fff;
  344 +
  345 + .ant-tabs-tab {
  346 + border: 1px solid #d9d9d9;
  347 + border-right: 0;
  348 + padding: 0 18px;
  349 + height: 40px;
  350 + line-height: 40px;
  351 + margin-left: 0;
  352 + background: #fafafa;
  353 +
  354 + &:nth-last-of-type(2) {
  355 + border-right: 1px solid #d9d9d9;
  356 + }
  357 + }
  358 +
  359 + .ant-tabs-tab-active {
  360 + border-bottom: 1px solid transparent;
  361 + background: #fff;
  362 + }
  363 +
  364 + .ant-tabs-ink-bar {
  365 + top: 0;
  366 + bottom: unset;
  367 + }
  368 +
  369 + .ant-tabs-tab-btn {
  370 + font-size: 20px;
  371 + }
  372 + }
  373 + }
  374 + }
  375 +
  376 + table {
  377 + border-top: 1px solid #aaa !important;
  378 + }
  379 +
  380 + table tr td.ant-table-selection-column .ant-radio-wrapper {
  381 + margin-top: 7px;
  382 + }
  383 +
  384 + .ant-table-thead>tr>th {
  385 + border-right: 1px solid #aaa !important;
  386 + font-size: 18px;
  387 + color: rgba(0, 0, 0, .85);
  388 + font-weight: 500;
  389 + text-align: left;
  390 + background: #e6e6e6;
  391 + // border-bottom: 1px solid #aaa;
  392 + font-weight: 600;
  393 + white-space: nowrap;
  394 + background: #ddd;
  395 + border-radius: 0 !important;
  396 + padding: 4px;
  397 + }
  398 +
  399 + .ant-table-cell {
  400 + span {
  401 + box-shadow: none !important;
  402 + }
  403 +
  404 + >div {
  405 + .size(100%, 34px);
  406 + }
  407 +
  408 + .noInput {
  409 + .size();
  410 + .flex(center, flex-start);
  411 + }
  412 +
  413 + .changeClassName {
  414 + height: 100%;
  415 +
  416 + * {
  417 + height: 100%;
  418 + }
  419 + }
  420 + }
  421 +
  422 + .ant-btn[class*="mesAdd"],
  423 + .ant-btn[class*="mesDel"],
  424 + .ant-btn[class*="mesSave"] {
  425 + .size(30px, 30px);
  426 + }
  427 +
  428 + .ant-btn[class*="mesSave"] {
  429 + margin-right: 5px;
  430 + }
  431 +
  432 + .ant-table-cell-fix-right {
  433 + .operate-bar {
  434 + .size();
  435 + .flex(center, center);
  436 +
  437 + >span {
  438 + display: none !important;
  439 + }
  440 + }
  441 + }
  442 +
  443 + .noInput span {
  444 + font-size: 18px;
  445 + }
  446 + }
  447 +}
  448 +
  449 +.tdDiv {
  450 + .flex();
  451 + .size();
  452 + flex-direction: column;
  453 +
  454 + :global {
  455 + .ant-btn-lg {
  456 + padding: 0 0 0 2px;
  457 + min-width: 0;
  458 + height: 32px;
  459 + }
  460 + }
  461 +}
  462 +
  463 +.tdDetail {
  464 + flex-grow: 1;
  465 + .size(100%, auto);
  466 + min-height: 50px;
  467 + background-color: #f0f0f0;
  468 + border-top: 1px solid #AAA;
  469 + font-size: 12px;
  470 + padding-left: 4px;
  471 +}
0 472 \ No newline at end of file
... ...
src/routes/mobile/IndexMobile.js
... ... @@ -16,6 +16,7 @@ import MyselfMobile from &quot;./common/MyselfMobile&quot;;
16 16 import ContactsInfoMobile from "./common/ContactsInfoMobile";
17 17 import RevisePasswordMobile from "./common/RevisePasswordMobile";
18 18 import CommobileBill from "./common/commobileBill";
  19 +import CommobilePadList from "./common/commobilePadList";
19 20 import CommobilePadBill from "./common/commobilePadBill";
20 21 import CommobilePrintPdf from "./common/commobilePrintPdf";
21 22 import ExamineMobile from "./common/ExamineMobile";
... ... @@ -195,7 +196,13 @@ class IndexMobile extends React.Component {
195 196 <CommobilePadBill {...this.props} />
196 197 </div>
197 198 );
198   - } else {
  199 + } else if (location.pathname === "/indexMobile/commobilePadList") {
  200 + return (
  201 + <div className={styles.demoContainer}>
  202 + <CommobilePadList {...this.props} />
  203 + </div>
  204 + );
  205 + } else {
199 206 return (
200 207 <div className={styles.demoContainer}>
201 208 <SceneMobile {...this.props} sModelType={pageText} sModelsId="101251240115015916850901130" />
... ...
src/routes/mobile/common/commobilePadList.js 0 → 100644
  1 +/**
  2 + * @Date: 2019-05-20T16:45:00+08:00
  3 + * @Last modified time: 2019-06-26T18:40:44+08:00
  4 + */
  5 +
  6 +import React from 'react';
  7 +import { connect } from 'umi';
  8 +import CommobilePadListComponent from '../../../mobile/common/CommobilePadList';
  9 +import * as commonUtils from '../../../utils/utils';
  10 +
  11 +function commobileBill({
  12 + dispatch, app, content, location,
  13 +}) {
  14 + if (location.state === null) {
  15 + return (<div />);
  16 + }
  17 + // const param = commonUtils.convertStrToObj(location.state.sParam);
  18 + let param = {};
  19 + if (location.state.sParam) {
  20 + param = commonUtils.convertStrToObj(location.state.sParam);
  21 + } else {
  22 + param = commonUtils.convertStrToObj(location.state);
  23 + }
  24 +
  25 + const commonListProps = {
  26 + app,
  27 + content,
  28 + ...param,
  29 + dispatch,
  30 + };
  31 + return (
  32 + <CommobilePadListComponent {...commonListProps} style={{ height: '100%' }} />
  33 + );
  34 +}
  35 +
  36 +export default connect(({ routing, app, content }) =>
  37 + ({ routing, app, content }))(commobileBill);
... ...