Browse Source

uas手机版
通用表单,附件上传逻辑基础处理

RaoMeng 5 years ago
parent
commit
fbd9db7c18

+ 9 - 7
uas-office-web/uas-mobile/src/components/common/currencyDetail/CurrencyDetail.jsx

@@ -199,13 +199,15 @@ class CurrencyDetail extends Component {
                     break
                   case 2:
                     //附件
-                    /* formItems.push(
-                       <FormEnclosure
-                         billModel={billModel}
-                         groupIndex={g}
-                         baseUrl={_baseURL}
-                         childIndex={i}/>,
-                     )*/
+                    formItems.push(
+                      <FormEnclosure
+                        billModel={billModel}
+                        groupIndex={g}
+                        childIndex={i}
+                        baseUrl={_baseURL}
+                        onTextChange={this.onTextChange.bind(this)}
+                      />,
+                    )
                     break
                   default:
                     break

+ 23 - 17
uas-office-web/uas-mobile/src/components/common/formNew/FormEnclosure.jsx

@@ -6,10 +6,10 @@
 import React, { Component } from 'react'
 import './formCommon.less'
 import { Upload } from 'antd'
-import { isObjNull } from '../../../utils/common/common.util'
+import { getBracketStr, isObjNull } from '../../../utils/common/common.util'
 import { Toast } from 'antd-mobile'
 import { UploadOutlined } from '@ant-design/icons'
-import BillModel from '../../../model/common/BillModel'
+import BillModel, { billReadOnly } from '../../../model/common/BillModel'
 
 let uploadFail = false
 
@@ -84,33 +84,36 @@ export default class FormEnclosure extends Component {
         action={this.props.baseUrl + '/mobile/uploadAttachs.action'}
         listType={'picture'}
         multiple={true}
+        disabled={billReadOnly(billModel)}
         fileList={billModel.fileList ? billModel.fileList : []}
         showUploadList={true}
         withCredentials={true}
         beforeUpload={this.beforeUpload}
         onChange={this.handleChange}
         // onPreview={this.handlePreview}
-        // onRemove={this.handleRemove}
+        onRemove={this.handleRemove}
         // onDownload={() => {}}
         // data={''}
         method={'post'}
         className={'upload-list-inline'}
       >
-        <div style={{ display: 'flex', alignItems: 'center' }}>
-          <div
-            className={'uploadBtn'}>
-            <UploadOutlined
-              style={{ color: 'white' }}/>
-            <span style={{ fontSize: '12px', marginLeft: '6px' }}>选择文件</span>
+        {
+          billReadOnly(billModel) ||
+          <div style={{ display: 'flex', alignItems: 'center' }}>
+            <div
+              className={'uploadBtn'}>
+              <UploadOutlined
+                style={{ color: 'white' }}/>
+              <span style={{ fontSize: '12px', marginLeft: '6px' }}>选择文件</span>
+            </div>
+            <span className='promptText'>(不能超过100MB)</span>
           </div>
-          <span className='promptText'>(不能超过100MB)</span>
-        </div>
+        }
       </Upload>
     </div>
   }
 
   handleChange = ({ fileList }) => {
-    console.log('filelist', fileList)
     if (uploadFail) {
       return
     }
@@ -122,15 +125,18 @@ export default class FormEnclosure extends Component {
       if (fileList) {
         fileList.forEach((file, index) => {
           file.enclosureId = (file.response && file.response.id)
-            ? file.response.id
-            : ''
+            ? getBracketStr(file.response.id)
+            : file.enclosureId
+          if (file.enclosureId) {
+            value = value + file.enclosureId + ';'
+          }
         })
       }
       billModel.fileList = fileList
       this.setState({ billModel })
-      // this.props.onTextChange &&
-      // this.props.onTextChange(this.props.groupIndex, this.props.childIndex,
-      //   value)
+      this.props.onTextChange &&
+      this.props.onTextChange(this.props.groupIndex, this.props.childIndex,
+        value)
     }
   }
 

+ 7 - 13
uas-office-web/uas-mobile/src/components/common/formNew/FormInput.jsx

@@ -17,7 +17,7 @@ import { isObjEmpty, isObjNull } from '../../../utils/common/common.util'
 import moment from 'moment'
 import BillModel, {
   billGetValue, billIsDate, billIsHtml, billIsMultiLine, billIsNum,
-  billIsSelect,
+  billIsSelect, billReadOnly,
 } from '../../../model/common/BillModel'
 
 export default class FormInput extends Component {
@@ -150,15 +150,13 @@ export default class FormInput extends Component {
   getTextCom (billModel) {
     return <TextareaItem
       className='form-input-value' autoHeight
-      placeholder={(billModel.readOnly ||
-        billModel.editable === 'F')
+      placeholder={billReadOnly(billModel)
         ? ''
         : (billIsSelect(billModel)
           ? '请选择'
           : '请输入')}
       clear={true}
-      editable={(billModel.readOnly ||
-        billModel.editable === 'F')
+      editable={billReadOnly(billModel)
         ? false
         : (billIsSelect(billModel)
           ? false
@@ -201,10 +199,8 @@ export default class FormInput extends Component {
         dismissText: '取消',
       }}
       mode={type === 'DT' ? 'datetime' : 'date'}
-      extra={(billModel.readOnly ||
-        billModel.editable === 'F') ? ' ' : type === 'DT' ? '选择时间' : '选择日期'}
-      disabled={(billModel.readOnly ||
-        billModel.editable === 'F') ? true : false}
+      extra={billReadOnly(billModel) ? ' ' : type === 'DT' ? '选择时间' : '选择日期'}
+      disabled={billReadOnly(billModel) ? true : false}
       value={!isObjEmpty(billGetValue(billModel))
         ? new Date(billGetValue(billModel).replace(/\-/g, '/'))
         : ''}
@@ -227,14 +223,12 @@ export default class FormInput extends Component {
    */
   getNumCom (billModel) {
     return <InputItem className='form-input-value' clear
-                      placeholder={(billModel.readOnly ||
-                        billModel.editable === 'F')
+                      placeholder={billReadOnly(billModel)
                         ? ''
                         : (billIsSelect(billModel)
                           ? '请选择'
                           : '请输入')}
-                      editable={(billModel.readOnly ||
-                        billModel.editable === 'F') ? false : (billIsSelect(
+                      editable={billReadOnly(billModel) ? false : (billIsSelect(
                         billModel)
                         ? false
                         : true)}

+ 29 - 0
uas-office-web/uas-mobile/src/configs/antd.config.less

@@ -104,3 +104,32 @@
 .ant-empty-normal {
   margin: 65px 0 !important;
 }
+
+/********************附件**************************/
+.ant-upload-list-picture .ant-upload-list-item, .ant-upload-list-picture-card .ant-upload-list-item {
+  height: 54px !important;
+}
+
+.ant-upload-list-picture .ant-upload-list-item-name, .ant-upload-list-picture-card .ant-upload-list-item-name {
+  line-height: 36px !important;
+}
+
+.ant-upload-list-picture .ant-upload-list-item-thumbnail, .ant-upload-list-picture-card .ant-upload-list-item-thumbnail {
+  width: 36px !important;
+  height: 36px !important;
+  line-height: 44px !important;
+
+  & img {
+    width: 36px !important;
+    height: 36px !important;
+  }
+}
+
+.ant-upload-list-item-card-actions.picture {
+  top: 16px !important;
+  padding-right: 10px;
+}
+
+.ant-btn-icon-only.ant-btn-sm > * {
+  font-size: 18px !important;
+}

+ 4 - 0
uas-office-web/uas-mobile/src/model/common/BillModel.js

@@ -86,6 +86,10 @@ export function billGetDisplay (billModel) {
   return billModel.display || billGetValue(billModel)
 }
 
+export function billReadOnly (billModel) {
+  return (billModel.readOnly || billModel.editable === 'F')
+}
+
 /**
  * 字段是否显示
  * @param billModel