Skip to content

J
jinfa-platform
Commit f3e76fca authored by 卢均锐's avatar 卢均锐
Browse files
Options

chore: 采购竞价 输入框验证整合代码

parent 489574eb
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 146 additions and 187 deletions
src/pages/transaction/purchaseAbility/purchaseBid/components/submitResultModal/index.tsx
View file @ f3e76fca
......@@ -5,132 +5,128 @@ import { UploadOutlined, DeleteOutlined, LinkOutlined } from '@ant-design/icons'
import { getAuth } from '@/utils/auth'
import { validatorByte } from '../../validator';
import styles from './index.less';
interface SubmitResultModalProps {
title: string,
visible: boolean,
onCancel: () => void,
onOk: (signUpIdea: string, urls: any) => void,
confirmLoading: boolean
title: string,
visible: boolean,
onCancel: () => void,
onOk: (signUpIdea: string, urls: any) => void,
confirmLoading: boolean
}
const SubmitResultModal: React.FC<SubmitResultModalProps> = (props: any) => {
const { title, visible, onCancel, onOk, confirmLoading } = props;
const [form] = Form.useForm();
const [files, setFiles] = useState([]);
const [loading, setloading] = useState(false);
const { token } = getAuth() || {}
const { title, visible, onCancel, onOk, confirmLoading } = props;
const [form] = Form.useForm();
const [files, setFiles] = useState([]);
const [loading, setloading] = useState(false);
const { token } = getAuth() || {}
/**判断文件类型和大小 */
const beforeDocUpload = (file: any) => {
const isLt20M = file.size / 1024 / 1024 < 20;
if (!isLt20M) {
message.error('上传文件大小不超过 20M!');
}
return isLt20M;
}
// 上传回调
const handleChange = ({ file }) => {
const arr: any = files;
setloading(true);
if (file.response) {
if (file.response.code === 1000) {
arr.push({
name: file.name,
url: file.response.data
})
setloading(false);
}
}
setFiles([...arr])
form.setFieldsValue({ upload: 'ok' })
/**判断文件类型和大小 */
const beforeDocUpload = (file: any) => {
const isLt20M = file.size / 1024 / 1024 < 20;
if (!isLt20M) {
message.error('上传文件大小不超过 20M!');
}
// 删除附件
const removeFiles = (index: any) => {
const arr = [...files];
arr.splice(index, 1);
setFiles(arr);
arr.length <= 0 && form.setFieldsValue({ upload: '' })
}
const formSubmit = () => {
form.validateFields().then(res => {
onOk && onOk(res.opinion, files);
return isLt20M;
}
// 上传回调
const handleChange = ({ file }) => {
const arr: any = files;
setloading(true);
if (file.response) {
if (file.response.code === 1000) {
arr.push({
name: file.name,
url: file.response.data
})
setloading(false);
}
}
setFiles([...arr])
form.setFieldsValue({ upload: 'ok' })
}
// 删除附件
const removeFiles = (index: any) => {
const arr = [...files];
arr.splice(index, 1);
setFiles(arr);
arr.length <= 0 && form.setFieldsValue({ upload: '' })
}
return (
<Modal
width={600}
title={title}
visible={visible}
onCancel={onCancel}
onOk={() => { formSubmit() }}
afterClose={() => {
form.resetFields()
setFiles([])
}}
confirmLoading={confirmLoading}
const formSubmit = () => {
form.validateFields().then(res => {
onOk && onOk(res.opinion, files);
})
}
return (
<Modal
width={600}
title={title}
visible={visible}
onCancel={onCancel}
onOk={() => { formSubmit() }}
afterClose={() => {
form.resetFields()
setFiles([])
}}
confirmLoading={confirmLoading}
>
<Form
form={form}
layout={'vertical'}
className={styles.revise_style}
>
<Form.Item
label='授标意见'
name='opinion'
rules={[
{ required: true, message: '请输入授标意见' },
{
validator: (r, v) => validatorByte(v, 200)
}
]}
>
<Form
form={form}
layout={'vertical'}
className={styles.revise_style}
>
<Form.Item
label='授标意见'
name='opinion'
rules={[
{ required: true, message: '请输入授标意见' }, () => ({
validator(_, value) {
let _str = value;
_str = _str.replace(/[\u4E00-\u9FA5]/g, "AA");
if (_str.length > 200) {
return Promise.reject(new Error('最长200个字符，100个汉字'));
} else {
return Promise.resolve();
}
},
})
]}
>
<Input.TextArea rows={3} maxLength={200} placeholder="最长200个字符，100个汉字" />
</Form.Item>
<Form.Item
label='附件'
name='upload'
rules={[{ required: true, message: '请上传附件' }]}>
<div className={styles.upload_data}>
{files.length > 0 && files.map((v, index) => (
<div key={index} className={styles.upload_item}>
<div className={styles.upload_left}>
<LinkOutlined />
<span>{v.name}</span>
</div>
<div className={styles.upload_right} onClick={() => removeFiles(index)}>
<DeleteOutlined />
</div>
</div>
))}
</div>
<Upload
action="/api/file/file/upload"
data={{ fileType: UPLOAD_TYPE }}
showUploadList={false}
accept='.doc,.docx,.pdf,.ppt,.pptx,.xls,.xlsx'
beforeUpload={beforeDocUpload}
onChange={handleChange}
headers={{ token }}
>
<Button loading={loading} icon={<UploadOutlined />}>上传文件</Button>
<div style={{ marginTop: '8px' }}>一次上传一个文件，每个附件大小不能超过 20M</div>
</Upload>
</Form.Item>
</Form>
</Modal>
)
<Input.TextArea rows={3} maxLength={200} placeholder="最长200个字符，100个汉字" />
</Form.Item>
<Form.Item
label='附件'
name='upload'
rules={[{ required: true, message: '请上传附件' }]}>
<div className={styles.upload_data}>
{files.length > 0 && files.map((v, index) => (
<div key={index} className={styles.upload_item}>
<div className={styles.upload_left}>
<LinkOutlined />
<span>{v.name}</span>
</div>
<div className={styles.upload_right} onClick={() => removeFiles(index)}>
<DeleteOutlined />
</div>
</div>
))}
</div>
<Upload
action="/api/file/file/upload"
data={{ fileType: UPLOAD_TYPE }}
showUploadList={false}
accept='.doc,.docx,.pdf,.ppt,.pptx,.xls,.xlsx'
beforeUpload={beforeDocUpload}
onChange={handleChange}
headers={{ token }}
>
<Button loading={loading} icon={<UploadOutlined />}>上传文件</Button>
<div style={{ marginTop: '8px' }}>一次上传一个文件，每个附件大小不能超过 20M</div>
</Upload>
</Form.Item>
</Form>
</Modal>
)
}
export default SubmitResultModal;
\ No newline at end of file
export default SubmitResultModal;
src/pages/transaction/purchaseAbility/purchaseBid/readyAdd/components/condition.tsx
View file @ f3e76fca
import React, { useState, useEffect } from 'react';
import { Form, Row, Col, Input, DatePicker, Select } from 'antd';
import { Form, Input, DatePicker, Select } from 'antd';
import moment from 'moment';
import { PublicApi } from '@/services/api';
import { validatorByte } from '../../validator';
import style from './index.less';
const { TextArea } = Input;
......@@ -143,17 +145,10 @@ const Condition: React.FC<Iprops> = (props: any) => {
label="报价要求"
name="offer"
rules={[
{ required: true, message: '请输入报价要求' }, () => ({
validator(_, value) {
let _str = value;
_str = _str.replace(/[\u4E00-\u9FA5]/g, "AA");
if (_str.length > 100) {
return Promise.reject(new Error('最长100个字符，50个汉字'));
} else {
return Promise.resolve();
}
},
})
{ required: true, message: '请输入报价要求' },
{
validator: (r, v) => validatorByte(v, 100)
}
]}
>
<TextArea rows={3} maxLength={100} placeholder="最长100个字符，50个汉字" />
......@@ -162,19 +157,11 @@ const Condition: React.FC<Iprops> = (props: any) => {
label="付款方式"
name="paymentType"
rules={[
{ required: true, message: '请输入付款方式' }, () => ({
validator(_, value) {
let _str = value;
_str = _str.replace(/[\u4E00-\u9FA5]/g, "AA");
if (_str.length > 100) {
return Promise.reject(new Error('最长100个字符，50个汉字'));
} else {
return Promise.resolve();
}
},
})
{ required: true, message: '请输入付款方式' },
{
validator: (r, v) => validatorByte(v, 100)
}
]}
>
<TextArea rows={3} maxLength={100} placeholder="最长100个字符，50个汉字" />
</Form.Item>
......@@ -182,19 +169,11 @@ const Condition: React.FC<Iprops> = (props: any) => {
label="税费要求"
name="taxes"
rules={[
{ required: true, message: '请输入税费要求' }, () => ({
validator(_, value) {
let _str = value;
_str = _str.replace(/[\u4E00-\u9FA5]/g, "AA");
if (_str.length > 100) {
return Promise.reject(new Error('最长100个字符，50个汉字'));
} else {
return Promise.resolve();
}
},
})
{ required: true, message: '请输入税费要求' },
{
validator: (r, v) => validatorByte(v, 100)
}
]}
>
<TextArea rows={3} maxLength={100} placeholder="最长100个字符，50个汉字" />
</Form.Item>
......@@ -202,19 +181,11 @@ const Condition: React.FC<Iprops> = (props: any) => {
label="物流要求"
name="logistics"
rules={[
{ required: true, message: '请输入物流要求' }, () => ({
validator(_, value) {
let _str = value;
_str = _str.replace(/[\u4E00-\u9FA5]/g, "AA");
if (_str.length > 100) {
return Promise.reject(new Error('最长100个字符，50个汉字'));
} else {
return Promise.resolve();
}
},
})
{ required: true, message: '请输入物流要求' },
{
validator: (r, v) => validatorByte(v, 100)
}
]}
>
<TextArea rows={3} maxLength={100} placeholder="最长100个字符，50个汉字" />
</Form.Item>
......@@ -222,19 +193,11 @@ const Condition: React.FC<Iprops> = (props: any) => {
label="包装要求"
name="packRequire"
rules={[
{ required: true, message: '请输入包装要求' }, () => ({
validator(_, value) {
let _str = value;
_str = _str.replace(/[\u4E00-\u9FA5]/g, "AA");
if (_str.length > 100) {
return Promise.reject(new Error('最长100个字符，50个汉字'));
} else {
return Promise.resolve();
}
},
})
{ required: true, message: '请输入包装要求' },
{
validator: (r, v) => validatorByte(v, 100)
}
]}
>
<TextArea rows={3} maxLength={100} placeholder="最长100个字符，50个汉字" />
</Form.Item>
......@@ -242,19 +205,11 @@ const Condition: React.FC<Iprops> = (props: any) => {
label="其他要求"
name="otherRequire"
rules={[
{ required: true, message: '请输入其他要求' }, () => ({
validator(_, value) {
let _str = value;
_str = _str.replace(/[\u4E00-\u9FA5]/g, "AA");
if (_str.length > 100) {
return Promise.reject(new Error('最长100个字符，50个汉字'));
} else {
return Promise.resolve();
}
},
})
{ required: true, message: '请输入其他要求' },
{
validator: (r, v) => validatorByte(v, 100)
}
]}
>
<TextArea rows={3} maxLength={100} placeholder="最长100个字符，50个汉字" />
</Form.Item>
......
src/pages/transaction/purchaseAbility/purchaseBid/validator/index.ts 0 → 100644
View file @ f3e76fca
export const validatorByte = (value: any, limitNumber: number) => {
let _str = value;
_str = _str.replace(/[\u4E00-\u9FA5]/g, "AA");
if (_str.length > limitNumber) {
return Promise.reject(new Error(`最长${limitNumber}个字符，${limitNumber/2}个汉字`));
} else {
return Promise.resolve();
}
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment