Commit ea7fe076 authored by 前端-李俊鑫's avatar 前端-李俊鑫

fix: 自营商城配置问题修复

parent 0448815e
/* /*
* @Author: XieZhiXiong * @Author: XieZhiXiong
* @Date: 2021-05-11 10:46:57 * @Date: 2021-05-11 10:46:57
* @LastEditors: XieZhiXiong * @LastEditors: Crayon
* @LastEditTime: 2021-05-18 15:47:20 * @LastEditTime: 2021-10-14 09:56:42
* @Description: 申请单基础信息 * @Description: 申请单基础信息
*/ */
import React, { CSSProperties } from 'react'; import React, { CSSProperties } from 'react';
import { Descriptions } from 'antd'; import { Descriptions } from 'antd';
import MellowCard, { MellowCardProps } from '@/components/MellowCard'; import MellowCard, { MellowCardProps } from '@/components/MellowCard';
import styles from './index.less'; import styles from './index.less';
export interface ColumnProps { export interface ColumnProps {
span?: number, span?: number,
contentStyle?: CSSProperties, contentStyle?: CSSProperties,
labelStyle?: CSSProperties, labelStyle?: CSSProperties,
} }
export interface DataItem { export interface DataItem {
/** /**
* 标题 * 标题
*/ */
title: React.ReactNode, title: React.ReactNode,
/** /**
* 值 * 值
*/ */
value: React.ReactNode, value: React.ReactNode,
/** /**
* DescriptionItem 描述列 props * DescriptionItem 描述列 props
*/ */
columnProps?: ColumnProps, columnProps?: ColumnProps,
} }
interface IProps extends MellowCardProps { interface IProps extends MellowCardProps {
/** /**
* 数据 * 数据
*/ */
data: DataItem[], data: DataItem[],
}; };
const defaultColumnProps: ColumnProps = { const defaultColumnProps: ColumnProps = {
labelStyle: { labelStyle: {
width: 104, width: 104,
}, },
}; };
const AfterServiceBasicInfo: React.FC<IProps> = (props: IProps) => { const AfterServiceBasicInfo: React.FC<IProps> = (props: IProps) => {
const { data, ...rest } = props; const { data, ...rest } = props;
return ( return (
<MellowCard <MellowCard
title="基本信息" title="基本信息"
bodyStyle={{ bodyStyle={{
paddingBottom: 0, paddingBottom: 0,
}} }}
className={styles.basicInfo} className={styles.basicInfo}
{...rest} {...rest}
> >
<Descriptions column={3}> <Descriptions column={3}>
{data.map((item, index) => ( {data.map((item, index) => (
<Descriptions.Item <Descriptions.Item
key={index} key={index}
label={item.title} label={item.title}
{...({...defaultColumnProps, ...item.columnProps} || defaultColumnProps)} {...({...defaultColumnProps, ...item.columnProps} || defaultColumnProps)}
> >
{item.value} {item.value}
</Descriptions.Item> </Descriptions.Item>
))} ))}
</Descriptions> </Descriptions>
</MellowCard> </MellowCard>
); );
}; };
export default AfterServiceBasicInfo; export default AfterServiceBasicInfo;
...@@ -3,7 +3,7 @@ import { Image, Button, Form, Spin, Row, Col, Switch, Space, Input, Empty } from ...@@ -3,7 +3,7 @@ import { Image, Button, Form, Spin, Row, Col, Switch, Space, Input, Empty } from
import { FormOutlined } from '@ant-design/icons'; import { FormOutlined } from '@ant-design/icons';
import { PublicApi } from '@/services/api'; import { PublicApi } from '@/services/api';
import { MALL_ENV, MALL_PROPERTY, ENV_COLOR, ENV_BG_COLOR } from './constant' import { MALL_ENV, MALL_PROPERTY, ENV_COLOR, ENV_BG_COLOR } from './constant'
import { validatorByte } from '@/utils/regExp'; import { validatorByte, validatorAllTrim } from '@/utils/regExp';
import { PageHeaderWrapper } from '@ant-design/pro-layout' import { PageHeaderWrapper } from '@ant-design/pro-layout'
import UploadImage from '@/components/UploadImage' import UploadImage from '@/components/UploadImage'
import styles from './index.less' import styles from './index.less'
...@@ -48,6 +48,7 @@ const OwnMallConfigure = () => { ...@@ -48,6 +48,7 @@ const OwnMallConfigure = () => {
PublicApi.postManageActivityShopRuleUpdate({ id, ...values }).then(res => { PublicApi.postManageActivityShopRuleUpdate({ id, ...values }).then(res => {
if (res.code === 1000) { if (res.code === 1000) {
getMallList() getMallList()
showEdit({ id }, false)
} }
}).finally(() => { }).finally(() => {
setSaveLoading(false) setSaveLoading(false)
...@@ -109,7 +110,7 @@ const OwnMallConfigure = () => { ...@@ -109,7 +110,7 @@ const OwnMallConfigure = () => {
<Col> <Col>
{ {
item.isEdit ? item.isEdit ?
<Form.Item <Form.Item
name='logoUrl' name='logoUrl'
rules={[{ required: true, message: "请上传商城LOGO" }]} rules={[{ required: true, message: "请上传商城LOGO" }]}
> >
...@@ -130,11 +131,12 @@ const OwnMallConfigure = () => { ...@@ -130,11 +131,12 @@ const OwnMallConfigure = () => {
<Col className={styles.right}> <Col className={styles.right}>
{ {
item.isEdit ? item.isEdit ?
<Form.Item <Form.Item
name='name' name='name'
rules={[ rules={[
{ required: true, message: '请填写商城名称' }, { required: true, message: '请填写商城名称' },
{ validator: (r, v, c) => validatorByte(r, v, c, 40) } { validator: (r, v, c) => validatorByte(r, v, c, 40) },
{ validator: (r, v, c) => validatorAllTrim(v, c, '商城名称') },
]} ]}
> >
<Input/> <Input/>
...@@ -155,7 +157,7 @@ const OwnMallConfigure = () => { ...@@ -155,7 +157,7 @@ const OwnMallConfigure = () => {
<div className={styles.title}>商城描述:</div> <div className={styles.title}>商城描述:</div>
{ {
item.isEdit ? item.isEdit ?
<Form.Item <Form.Item
name='describe' name='describe'
rules={[ rules={[
{ validator: (r, v, c) => validatorByte(r, v, c, 160) } { validator: (r, v, c) => validatorByte(r, v, c, 160) }
......
import { values } from 'mobx'; import { values } from 'mobx';
/** /**
* @param str:string 需要校验的字符串 * @param str:string 需要校验的字符串
* @param type:string 需要校验的类型 * @param type:string 需要校验的类型
*/ */
export const checkRegExp = (str:string, type:string) => { export const checkRegExp = (str:string, type:string) => {
switch (type) { switch (type) {
case 'phone': //手机号码 case 'phone': //手机号码
return /^1[3|4|5|6|7|8|9][0-9]{9}$/.test(str); return /^1[3|4|5|6|7|8|9][0-9]{9}$/.test(str);
case 'tel': //座机 case 'tel': //座机
return /^(0\d{2,3}-\d{7,8})(-\d{1,4})?$/.test(str); return /^(0\d{2,3}-\d{7,8})(-\d{1,4})?$/.test(str);
case 'card': //身份证 case 'card': //身份证
return /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/.test(str); return /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/.test(str);
case 'pwd': //密码以字母开头,长度在6~18之间,只能包含字母、数字和下划线 case 'pwd': //密码以字母开头,长度在6~18之间,只能包含字母、数字和下划线
return /^[a-zA-Z]\w{5,17}$/.test(str) return /^[a-zA-Z]\w{5,17}$/.test(str)
case 'postal': //邮政编码 case 'postal': //邮政编码
return /[1-9]\d{5}(?!\d)/.test(str); return /[1-9]\d{5}(?!\d)/.test(str);
case 'QQ': //QQ号 case 'QQ': //QQ号
return /^[1-9][0-9]{4,9}$/.test(str); return /^[1-9][0-9]{4,9}$/.test(str);
case 'email': //邮箱 case 'email': //邮箱
return /^[\w-]+(\.[\w-]+)*@[\w-]+(\.[\w-]+)+$/.test(str); return /^[\w-]+(\.[\w-]+)*@[\w-]+(\.[\w-]+)+$/.test(str);
case 'money': //金额(小数点2位) case 'money': //金额(小数点2位)
return /^\d*(?:\.\d{0,2})?$/.test(str); return /^\d*(?:\.\d{0,2})?$/.test(str);
case 'URL': //网址 case 'URL': //网址
return /(http|ftp|https):\/\/[\w\-_]+(\.[\w\-_]+)+([\w\-\.,@?^=%&:/~\+#]*[\w\-\@?^=%&/~\+#])?/.test(str) return /(http|ftp|https):\/\/[\w\-_]+(\.[\w\-_]+)+([\w\-\.,@?^=%&:/~\+#]*[\w\-\@?^=%&/~\+#])?/.test(str)
case 'IP': //IP case 'IP': //IP
return /((?:(?:25[0-5]|2[0-4]\\d|[01]?\\d?\\d)\\.){3}(?:25[0-5]|2[0-4]\\d|[01]?\\d?\\d))/.test(str); return /((?:(?:25[0-5]|2[0-4]\\d|[01]?\\d?\\d)\\.){3}(?:25[0-5]|2[0-4]\\d|[01]?\\d?\\d))/.test(str);
case 'date': //日期时间 case 'date': //日期时间
return /^(\d{4})\-(\d{2})\-(\d{2}) (\d{2})(?:\:\d{2}|:(\d{2}):(\d{2}))$/.test(str) || /^(\d{4})\-(\d{2})\-(\d{2})$/.test(str) return /^(\d{4})\-(\d{2})\-(\d{2}) (\d{2})(?:\:\d{2}|:(\d{2}):(\d{2}))$/.test(str) || /^(\d{4})\-(\d{2})\-(\d{2})$/.test(str)
case 'number': //数字 case 'number': //数字
return /^[0-9]$/.test(str); return /^[0-9]$/.test(str);
case 'english': //英文 case 'english': //英文
return /^[a-zA-Z]+$/.test(str); return /^[a-zA-Z]+$/.test(str);
case 'chinese': //中文 case 'chinese': //中文
return /^[\\u4E00-\\u9FA5]+$/.test(str); return /^[\\u4E00-\\u9FA5]+$/.test(str);
case 'lower': //小写 case 'lower': //小写
return /^[a-z]+$/.test(str); return /^[a-z]+$/.test(str);
case 'upper': //大写 case 'upper': //大写
return /^[A-Z]+$/.test(str); return /^[A-Z]+$/.test(str);
case 'HTML': //HTML标记 case 'HTML': //HTML标记
return /<("[^"]*"|'[^']*'|[^'">])*>/.test(str); return /<("[^"]*"|'[^']*'|[^'">])*>/.test(str);
default: default:
return true; return true;
} }
} }
/** /**
* 区别校验 汉字 和 字符 长度 * 区别校验 汉字 和 字符 长度
* @param rule * @param rule
* @param value 表单输入的值 * @param value 表单输入的值
* @param callback * @param callback
* @param maxByte:number 最大字符数 * @param maxByte:number 最大字符数
*/ */
export const validatorByte = (rule, value, callback, maxByte: number) => { export const validatorByte = (rule, value, callback, maxByte: number) => {
try { try {
if(value){ if(value){
let str = value let str = value
str = str.replace(/[\u4e00-\u9fa5]/g, 'OO') str = str.replace(/[\u4e00-\u9fa5]/g, 'OO')
if(str.length > maxByte) if(str.length > maxByte)
throw new Error(`最多输入${maxByte}个字符,${Math.floor(maxByte / 2)}个汉字`); throw new Error(`最多输入${maxByte}个字符,${Math.floor(maxByte / 2)}个汉字`);
else else
callback() callback()
} else { } else {
callback() callback()
} }
} catch (err) { } catch (err) {
callback(err) callback(err)
} }
} }
\ No newline at end of file
/**
* 校验内容是否为纯空格
* @param value 表单输入的值
* @param callback
* @param name 字段名称
*/
export const validatorAllTrim = (value, callback, name = '') => {
try {
if(value){
if(value.trim().length === 0)
throw new Error(`${name}不可为空`);
else
callback()
} else {
callback()
}
} catch (err) {
callback(err)
}
}
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