Skip to content

J
jinfa-admin
Commit a7754ee3 authored by XieZhiXiong's avatar XieZhiXiong
Browse files
Options

Merge branch 'dev' into test

parents b4b621b1 7f97fee0
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 1204 additions and 646 deletions
src/components/MellowCard/index.tsx
View file @ a7754ee3
/*
* @Author: XieZhiXiong
* @Date: 2020-08-26 17:32:45
* @LastEditors: XieZhiXiong
* @LastEditTime: 2020-09-29 14:47:49
* @Description: 基于 antd Card 封装的适合项目 UI 的 Card，使用方式跟 antd Card 一样，这里只是修改了样式
*/
import React from 'react';
import { Card } from 'antd';
import classNames from 'classnames';
import { CardProps } from 'antd/lib/card';
import styled from 'styled-components'
import styles from './index.less';
const Wrap = styled(props => <div {...props}/>)`
> .ant-card {
border-radius: 8px;
.ant-card-head {
border-bottom: none;
.ant-card-head-title {
line-height: 24px;
padding-bottom: 0;
font-size: 16px;
font-weight: 500;
color: rgba(23, 43, 77, 1);
}
}
.ant-card-body {
padding: 14px 24px 24px;
}
}
&.fullHeight {
height: 100%;
.ant-card {
height: 100%;
display: flex;
flex-direction: column !important;
.ant-card-head {
flex-shrink: 0;
}
.ant-card-body {
flex: 1;
}
}
}
`
export interface MellowCardProps extends CardProps {
blockClassName?: string;
fullHeight?: boolean; // 是否占满父级的高度，一般用于多列使用改组件的情况
}
const MellowCard: React.FC<MellowCardProps> = props => {
const { children, blockClassName, fullHeight, ...rest } = props;
const cls = classNames({
'fullHeight': fullHeight,
});
return (
<Wrap className={cls}>
<Card bordered={false} {...rest}>
{children}
</Card>
</Wrap>
)
};
/*
* @Author: XieZhiXiong
* @Date: 2020-08-26 17:32:45
* @LastEditors: XieZhiXiong
* @LastEditTime: 2020-12-29 15:06:05
* @Description: 基于 antd Card 封装的适合项目 UI 的 Card，使用方式跟 antd Card 一样，这里只是修改了样式
*/
import React from 'react';
import { Card } from 'antd';
import classNames from 'classnames';
import { CardProps } from 'antd/lib/card';
import styled from 'styled-components'
import styles from './index.less';
const Wrap = styled(props => <div {...props}/>)`
> .ant-card {
border-radius: 8px;
.ant-card-head {
border-bottom: none;
.ant-card-head-title {
line-height: 24px;
padding-bottom: 0;
font-size: 16px;
font-weight: 500;
color: rgba(23, 43, 77, 1);
}
}
.ant-card-body {
padding: 14px 24px 24px;
}
}
&.fullHeight {
height: 100%;
.ant-card {
height: 100%;
display: flex;
flex-direction: column !important;
.ant-card-head {
flex-shrink: 0;
}
.ant-card-body {
flex: 1;
}
}
}
`
export interface MellowCardProps extends CardProps {
blockClassName?: string;
fullHeight?: boolean; // 是否占满父级的高度，一般用于多列使用改组件的情况
}
const MellowCard: React.FC<MellowCardProps> = props => {
const { children, blockClassName, fullHeight, ...rest } = props;
const cls = classNames({
'fullHeight': fullHeight,
});
return (
<Wrap className={cls}>
<Card bordered={false} {...rest}>
{children}
</Card>
</Wrap>
)
};
export default MellowCard;
\ No newline at end of file
src/components/NiceForm/components/AntUpload/index.tsx 0 → 100644
View file @ a7754ee3
import React from 'react'
import { connect } from '@formily/react-schema-renderer'
import { Button, Upload as AntdUpload } from 'antd'
import styled from 'styled-components'
import { toArr, isArr, isEqual, mapStyledProps } from './shared'
import {
LoadingOutlined,
PlusOutlined,
UploadOutlined,
InboxOutlined
} from '@ant-design/icons'
const { Dragger: UploadDragger } = AntdUpload
const exts = [
{
ext: /\.docx?$/i,
icon: '//img.alicdn.com/tfs/TB1n8jfr1uSBuNjy1XcXXcYjFXa-200-200.png'
},
{
ext: /\.pptx?$/i,
icon: '//img.alicdn.com/tfs/TB1ItgWr_tYBeNjy1XdXXXXyVXa-200-200.png'
},
{
ext: /\.jpe?g$/i,
icon: '//img.alicdn.com/tfs/TB1wrT5r9BYBeNjy0FeXXbnmFXa-200-200.png'
},
{
ext: /\.pdf$/i,
icon: '//img.alicdn.com/tfs/TB1GwD8r9BYBeNjy0FeXXbnmFXa-200-200.png'
},
{
ext: /\.png$/i,
icon: '//img.alicdn.com/tfs/TB1BHT5r9BYBeNjy0FeXXbnmFXa-200-200.png'
},
{
ext: /\.eps$/i,
icon: '//img.alicdn.com/tfs/TB1G_iGrVOWBuNjy0FiXXXFxVXa-200-200.png'
},
{
ext: /\.ai$/i,
icon: '//img.alicdn.com/tfs/TB1B2cVr_tYBeNjy1XdXXXXyVXa-200-200.png'
},
{
ext: /\.gif$/i,
icon: '//img.alicdn.com/tfs/TB1DTiGrVOWBuNjy0FiXXXFxVXa-200-200.png'
},
{
ext: /\.svg$/i,
icon: '//img.alicdn.com/tfs/TB1uUm9rY9YBuNjy0FgXXcxcXXa-200-200.png'
},
{
ext: /\.xlsx?$/i,
icon: '//img.alicdn.com/tfs/TB1any1r1OSBuNjy0FdXXbDnVXa-200-200.png'
},
{
ext: /\.psd?$/i,
icon: '//img.alicdn.com/tfs/TB1_nu1r1OSBuNjy0FdXXbDnVXa-200-200.png'
},
{
ext: /\.(wav|aif|aiff|au|mp1|mp2|mp3|ra|rm|ram|mid|rmi)$/i,
icon: '//img.alicdn.com/tfs/TB1jPvwr49YBuNjy0FfXXXIsVXa-200-200.png'
},
{
ext: /\.(avi|wmv|mpg|mpeg|vob|dat|3gp|mp4|mkv|rm|rmvb|mov|flv)$/i,
icon: '//img.alicdn.com/tfs/TB1FrT5r9BYBeNjy0FeXXbnmFXa-200-200.png'
},
{
ext: /\.(zip|rar|arj|z|gz|iso|jar|ace|tar|uue|dmg|pkg|lzh|cab)$/i,
icon: '//img.alicdn.com/tfs/TB10jmfr29TBuNjy0FcXXbeiFXa-200-200.png'
},
{
ext: /\.[^.]+$/i,
icon: '//img.alicdn.com/tfs/TB10.R4r3mTBuNjy1XbXXaMrVXa-200-200.png'
}
]
const UploadPlaceholder = styled(props => (
<div>
{props.loading ? <LoadingOutlined /> : <PlusOutlined />}
<div className={'ant-upload-text'}>上传</div>
</div>
))``
const testOpts = (ext, options) => {
if (options && isArr(options.include)) {
return options.include.some(url => ext.test(url))
}
if (options && isArr(options.exclude)) {
return !options.exclude.some(url => ext.test(url))
}
return true
}
const getImageByUrl = (url, options) => {
for (let i = 0; i < exts.length; i++) {
if (exts[i].ext.test(url) && testOpts(exts[i].ext, options)) {
return exts[i].icon || url
}
}
return url
}
const normalizeFileList = fileList => {
if (fileList && fileList.length) {
return fileList.map(file => {
return file.response ? {
uid: file.uid,
status: file.status,
name: file.name,
url: file.downloadURL || file.imgURL || file.url,
...file.response,
thumbUrl: file.imgURL || getImageByUrl(file.downloadURL || file.url, {
exclude: ['.png', '.jpg', '.jpeg', '.gif']
})
} : file;
})
}
return []
}
const shallowClone = val => {
let result = isArr(val)
? [...val]
: typeof val === 'object'
? { ...val }
: val
if (isArr(result)) {
result = result.map(item => ({
...item,
// 必须要有一个不重复的uid
uid:
item.uid ||
Math.random()
.toFixed(16)
.slice(2, 10)
}))
}
return result
}
export interface IUploaderState {
value: any[]
}
// TODO 能不能直接引用 antd 里面的接口定义呢 ?
export declare type UploadListType = 'text' | 'picture' | 'picture-card'
export interface IUploaderProps {
onChange: (value: any[]) => void
locale: { [name: string]: any }
value: any[]
listType?: UploadListType
}
export const Upload = connect({
getProps: mapStyledProps
})(
class Uploader extends React.Component<IUploaderProps, IUploaderState> {
public static defaultProps = {
action:
'https://www.easy-mock.com/mock/5b713974309d0d7d107a74a3/alifd/upload',
listType: 'text',
multiple: true,
className: 'antd-uploader'
}
readonly state: IUploaderState
constructor(props) {
super(props)
this.state = {
value: shallowClone(toArr(props.value))
}
}
public onRemoveHandler = file => {
const { value } = this.state
const fileList = []
value.forEach(item => {
if (item.uid !== file.uid) {
fileList.push(item)
}
})
this.props.onChange(fileList)
}
public onChangeHandler = ({ fileList }) => {
const { onChange } = this.props
fileList = toArr(fileList)
if (
fileList.every(file => {
if (
file.status === 'done' ||
file.imgURL ||
file.downloadURL ||
file.url ||
file.thumbUrl
)
return true
if (file.response) {
if (
file.response.imgURL ||
file.response.downloadURL ||
file.response.url ||
file.response.thumbUrl
)
return true
}
return false
}) &&
fileList.length
) {
fileList = normalizeFileList(fileList)
this.setState(
{
value: fileList
},
() => {
onChange(fileList.length > 0 ? fileList : undefined)
}
)
} else {
this.setState({
value: fileList
})
}
}
public componentDidUpdate(preProps) {
if (this.props.value && !isEqual(this.props.value, preProps.value)) {
this.setState({
value: shallowClone(this.props.value)
})
}
}
public render() {
// eslint-disable-next-line @typescript-eslint/no-unused-vars
const { listType, locale, onChange, value, ...others } = this.props
if (listType.indexOf('card') > -1) {
return (
<AntdUpload
{...others}
fileList={this.state.value}
onChange={this.onChangeHandler}
onRemove={this.onRemoveHandler}
listType={'picture-card'}
>
<UploadPlaceholder />
</AntdUpload>
)
}
if (listType.indexOf('dragger') > -1) {
return (
<UploadDragger
{...others}
fileList={this.state.value}
onChange={this.onChangeHandler}
onRemove={this.onRemoveHandler}
// TODO image 类型是跟 picture 一样 ?
listType={listType.indexOf('image') > -1 ? 'picture' : 'text'}
>
<p className={'ant-upload-drag-icon'}>
<InboxOutlined />
</p>
<p className={'ant-upload-text'}>拖拽上传</p>
</UploadDragger>
)
}
return (
<AntdUpload
{...others}
fileList={this.state.value}
onChange={this.onChangeHandler}
onRemove={this.onRemoveHandler}
listType={listType}
>
<Button style={{ margin: '0 0 10px' }}>
<UploadOutlined />
{(locale && locale.uploadText) || '上传文件'}
</Button>
</AntdUpload>
)
}
}
)
export default Upload
src/components/NiceForm/components/AntUpload/shared.tsx 0 → 100644
View file @ a7754ee3
import React from 'react'
import { mapTextComponent, mapStyledProps, normalizeCol } from '@formily/antd'
import { Select as AntSelect } from 'antd'
import { SelectProps as AntSelectProps } from 'antd/lib/select'
import styled from 'styled-components'
import { isArr, FormPath } from '@formily/shared'
export * from '@formily/shared'
export const compose = (...args: any[]) => {
return (payload: any, ...extra: any[]) => {
return args.reduce((buf, fn) => {
return buf !== undefined ? fn(buf, ...extra) : fn(payload, ...extra)
}, payload)
}
}
interface SelectOption {
label: React.ReactText
value: any
[key: string]: any
}
type SelectProps = AntSelectProps & {
dataSource?: SelectOption[]
}
const createEnum = (enums: any) => {
if (isArr(enums)) {
return enums.map(item => {
if (typeof item === 'object') {
return {
...item
}
} else {
return {
label: item,
value: item
}
}
})
}
return []
}
export const Select: React.FC<SelectProps> = styled((props: SelectProps) => {
const { dataSource = [], onChange, ...others } = props
const children = createEnum(dataSource).map(item => {
const { label, value, ...others } = item
return (
<AntSelect.Option
key={value}
{...others}
title={label as string}
value={value}
>
{label}
</AntSelect.Option>
)
})
return (
<AntSelect
className={props.className}
{...others}
onChange={(value: any, options: any) => {
onChange(
value,
isArr(options)
? options.map(item => ({
...item,
props: undefined
}))
: {
...options,
props: undefined //干掉循环引用
}
)
}}
>
{children}
</AntSelect>
)
})`
min-width: 100px;
width: 100%;
`
export const acceptEnum = (component: React.JSXElementConstructor<any>) => {
return ({ dataSource, ...others }) => {
if (dataSource) {
return React.createElement(Select, { dataSource, ...others })
} else {
return React.createElement(component, others)
}
}
}
export const transformDataSourceKey = (component, dataSourceKey) => {
return ({ dataSource, ...others }) => {
return React.createElement(component, {
[dataSourceKey]: dataSource,
...others
})
}
}
export const createMatchUpdate = (name: string, path: string) => (
targetName: string,
targetPath: string,
callback: () => void
) => {
if (targetName || targetPath) {
if (targetName) {
if (FormPath.parse(targetName).matchAliasGroup(name, path)) {
callback()
}
} else if (targetPath) {
if (FormPath.parse(targetPath).matchAliasGroup(name, path)) {
callback()
}
}
} else {
callback()
}
}
export { mapTextComponent, mapStyledProps, normalizeCol }
src/components/NiceForm/components/AntUpload/style.ts 0 → 100644
View file @ a7754ee3
import 'antd/lib/upload/style/index'
\ No newline at end of file
src/components/NiceForm/index.tsx
View file @ a7754ee3
......@@ -26,6 +26,7 @@ import { Checkbox } from '@formily/antd-components';
import DateSelect from './components/DateSelect';
import DateRangePickerUnix from './components/DateRangePickerUnix';
import SmilingFace from './components/SmilingFace';
import AntUpload from './components/AntUpload';
import './index.less'
export interface NiceFormProps extends IAntdSchemaFormProps {}
......@@ -96,6 +97,7 @@ export const componentExport = {
DateSelect,
DateRangePickerUnix,
SmilingFace,
AntUpload,
}
const NiceForm: React.FC<NiceFormProps> = props => {
const { children, components, ...reset } = props;
......
src/pages/comment/manage/index.less
View file @ a7754ee3
@import '../../../global/styles/utils.less';
.productName {
.textOverflow();
}
\ No newline at end of file
src/pages/comment/manage/index.tsx
View file @ a7754ee3
This diff is collapsed.
src/pages/content/advertisement/advertisementInfo.tsx
View file @ a7754ee3
......@@ -3,8 +3,8 @@ import { PageHeaderWrapper } from "@ant-design/pro-layout";
import ReutrnEle from '@/components/ReturnEle';
import { usePageStatus } from '@/hooks/usePageStatus';
import { history, Prompt } from 'umi';
import { Card, Modal } from 'antd';
import { SchemaForm, createFormActions, FormButtonGroup, Submit, Reset } from '@formily/antd'
import { Card } from 'antd';
import { SchemaForm, createFormActions, FormButtonGroup, Submit, FormEffectHooks } from '@formily/antd'
import advertisementInfoSchema from './schema/advertisementInfoSchema';
import { Input, Select, Button } from 'antd';
// import CustomUpload from '@/components/NiceForm/components/CustomUpload';
......@@ -12,8 +12,28 @@ import { PublicApi } from '@/services/api';
import { useInitialValues } from '../hooks/useInitialValues';
import CustomUpload from '../components/WrapCustomUpload';
import useCustomValidator from '../hooks/useValidator'
import { sortedList, ADVERTISE_WEB_COLUMN_TYPE, ADVERTISE_APP_COLUMN_TYPE} from '../utils/utils';
enum ChannelEnum {
WEB = 1,
APP = 2,
}
const WEB_COLUMN_TYPE = Object.keys(ADVERTISE_WEB_COLUMN_TYPE).map((item) => {
return {
label: ADVERTISE_WEB_COLUMN_TYPE[item],
value: parseInt(item)
}
})
const APP_COLUMN_TYPE = Object.keys(ADVERTISE_APP_COLUMN_TYPE).map((item) => {
return {
label: ADVERTISE_APP_COLUMN_TYPE[item],
value: parseInt(item)
}
})
const actions = createFormActions();
const { onFieldValueChange$ } = FormEffectHooks;
const AdvertisementInfo = () => {
useCustomValidator()
......@@ -24,14 +44,14 @@ const AdvertisementInfo = () => {
const isEdit = id && !preview;
const isAdd = !id && !preview;
const isView = id && preview;
const handleSubmit = (value) => {
console.log(value)
// const { title, columnType, sort, link, imageUrl} = value;
const serviceActions = isAdd
? PublicApi.postManageContentAdvertAdd
: PublicApi.postManageContentAdvertUpdate
let tempData = value;
const postData = isAdd ? tempData : {...tempData, id};
setSubmitLoading(true);
......@@ -44,6 +64,25 @@ const AdvertisementInfo = () => {
})
}
const formEffects = () => () => {
onFieldValueChange$('channel').subscribe(fieldState => {
const isActive = fieldState.active;
let options: {label: string, value: number| string}[] = []
if(fieldState.value === ChannelEnum.WEB) {
options = WEB_COLUMN_TYPE
} else {
options = APP_COLUMN_TYPE
}
actions.setFieldState('columnType', (state) => {
state.props["x-component-props"]["options"] = options;
if(isActive) {
state.value = "";
}
})
})
}
const handleCancel = () => {
history.push('/content/advertisement')
}
......@@ -64,11 +103,12 @@ const AdvertisementInfo = () => {
initialValues={initialValues?.data}
onSubmit={handleSubmit}
editable={isAdd || isEdit}
effects={formEffects()}
expressionScope={{
label: (
<div>
{
isAdd || isEdit
isAdd || isEdit
? <span style={{color: '#ff4d4f'}}>* </span>
: null
}
......@@ -78,12 +118,12 @@ const AdvertisementInfo = () => {
}}
>
{
isAdd || isEdit
isAdd || isEdit
? (
<FormButtonGroup offset={3}>
<Submit loading={submitLoading}>提交</Submit>
<Button onClick={handleCancel}>取消</Button>
</FormButtonGroup>
</FormButtonGroup>
)
: <></>
}
......@@ -94,4 +134,4 @@ const AdvertisementInfo = () => {
)
}
export default AdvertisementInfo
\ No newline at end of file
export default AdvertisementInfo
src/pages/content/advertisement/schema/advertisementInfoSchema.tsx
View file @ a7754ee3
import { sortedList, ADVERTISE_COLUMN_TYPE } from '../../utils/utils';
const columnType = (() => {
const res = Object.keys(ADVERTISE_COLUMN_TYPE).map((item) => {
return {
label: ADVERTISE_COLUMN_TYPE[item],
value: parseInt(item)
}
})
return res;
})()
import { sortedList, } from '../../utils/utils';
const sortListOptions = sortedList(1, 6);
......@@ -38,16 +28,31 @@ const schema = {
},
{
limitByte: true, // 自定义校验规则
maxByte: 60,
maxByte: 60,
}
]
},
channel: {
title: '投放渠道',
type: 'string',
"x-component": 'Select',
'x-component-props': {
options: [
{ label: 'Web', value: 1 },
{ label: 'App', value: 2 },
],
},
"x-rules": [{
"required": true,
"message": "请选择投放渠道"
}],
},
columnType: {
title: '栏目',
type: 'string',
'x-component': 'Select',
'x-component-props': {
options: columnType
options: []
},
"x-rules": [{
"required": true,
......@@ -73,7 +78,7 @@ const schema = {
"x-rules": [
{
limitByte: true, // 自定义校验规则
maxByte: 100,
maxByte: 100,
}
]
},
......@@ -90,10 +95,10 @@ const schema = {
"required": true,
"message": "请上传图片"
},
},
},
}
}
}
}
export default schema
\ No newline at end of file
export default schema
src/pages/content/advertisement/schema/index.tsx
View file @ a7754ee3
......@@ -3,7 +3,8 @@ import { DownOutlined } from '@ant-design/icons';
import { TimeList } from '../../statusList';
import moment from 'moment';
import React from 'react';
import {ADVERTISE_COLUMN_TYPE} from '../../utils/utils';
import {ADVERTISE_WEB_COLUMN_TYPE, ADVERTISE_APP_COLUMN_TYPE} from '../../utils/utils';
const ALL_TYPE = Object.assign({}, ADVERTISE_WEB_COLUMN_TYPE, ADVERTISE_APP_COLUMN_TYPE);
const CustomTimeList = [{label: '全部', value: 0}].concat(TimeList.slice(1));
......@@ -23,7 +24,7 @@ const columns = [
title: '栏目', dataIndex: 'columnType',
render: (text, record) => {
return (
<div>{ADVERTISE_COLUMN_TYPE[text]}</div>
<div>{ALL_TYPE[text]}</div>
)
},
},
......
src/pages/content/utils/utils.tsx
View file @ a7754ee3
......@@ -55,13 +55,18 @@ const sortedList = (start, end) => {
return res
}
// 内容管理 - 广告栏目
const ADVERTISE_COLUMN_TYPE = {
"1": "会员首页-活动广告1",
"2": "会员首页-活动广告2",
// 内容管理 - 广告栏目
const ADVERTISE_WEB_COLUMN_TYPE = {
"1": "会员首页-活动广告1",
"2": "会员首页-活动广告2",
"3": "会员首页-活动广告3"
}
const ADVERTISE_APP_COLUMN_TYPE = {
"4": '找店铺广告图',
"5": "人气店铺广告图"
}
// 内容管理 - 公告栏目
const ANNOUNCE_COLUMN_TYPE = {
'1': '会员首页公告',
......@@ -83,7 +88,7 @@ const POSITION = {
}
/**
* 将字典转换成 {label: 'xx', value: 1}
* @param maps
* @param maps
*/
const transfer2Options = (maps) => {
const res = Object.keys(maps).map((item) => {
......@@ -101,9 +106,11 @@ export {
setTableDataSource,
getTableDataSource,
sortedList,
ADVERTISE_COLUMN_TYPE,
ADVERTISE_WEB_COLUMN_TYPE,
ADVERTISE_APP_COLUMN_TYPE,
// ADVERTISE_COLUMN_TYPE,
ANNOUNCE_COLUMN_TYPE,
transfer2Options,
SCENE,
POSITION
}
\ No newline at end of file
}
src/pages/member/memberLevel/schema/index.tsx
View file @ a7754ee3
import { ISchema } from '@formily/antd';
import { FORM_FILTER_PATH } from '@/formSchema/const';
export const levelSchema: ISchema = {
type: 'object',
properties: {
MEGA_LAYOUI: {
type: 'object',
'x-component': 'mega-layout',
properties: {
topLayout: {
type: 'object',
'x-component': 'mega-layout',
'x-component-props': {
grid: true,
},
properties: {
levelTag: {
type: 'string',
'x-component': 'Search',
'x-component-props': {
placeholder: '搜索',
},
},
},
},
[FORM_FILTER_PATH]: {
type: 'object',
'x-component': 'flex-layout',
'x-component-props': {
rowStyle: {
flexWrap: 'nowrap',
},
colStyle: {
marginLeft: 20,
},
},
properties: {
roleName: {
type: 'string',
'x-component': 'Input',
'x-component-props': {
placeholder: '角色名称',
allowClear: true,
},
},
submit: {
'x-component': 'Submit',
'x-component-props': {
children: '查询',
},
},
},
},
},
},
},
};
import { ISchema } from '@formily/antd';
import { FORM_FILTER_PATH } from '@/formSchema/const';
export const levelSchema: ISchema = {
type: 'object',
properties: {
MEGA_LAYOUI: {
type: 'object',
'x-component': 'mega-layout',
properties: {
topLayout: {
type: 'object',
'x-component': 'mega-layout',
'x-component-props': {
grid: true,
},
properties: {
levelTag: {
type: 'string',
'x-component': 'Search',
'x-component-props': {
placeholder: '搜索',
tip: '输入 会员等级标签 进行搜索',
},
},
},
},
[FORM_FILTER_PATH]: {
type: 'object',
'x-component': 'flex-layout',
'x-component-props': {
rowStyle: {
flexWrap: 'nowrap',
},
colStyle: {
marginLeft: 20,
},
},
properties: {
roleName: {
type: 'string',
'x-component': 'Input',
'x-component-props': {
placeholder: '角色名称',
allowClear: true,
},
},
submit: {
'x-component': 'Submit',
'x-component-props': {
children: '查询',
},
},
},
},
},
},
},
};
src/pages/member/schema/auditSchema.ts
View file @ a7754ee3
import { ISchema } from '@formily/antd';
import { FORM_FILTER_PATH } from '@/formSchema/const';
export const auditSchema: ISchema = {
type: 'object',
properties: {
MEGA_LAYOUT: {
type: 'object',
'x-component': 'mega-layout',
properties: {
topLayout: {
type: 'object',
'x-component': 'mega-layout',
'x-component-props': {
grid: true,
},
properties: {
ctl: {
type: 'object',
'x-component': 'Children',
'x-component-props': {
children: '{{controllerBtns}}',
},
},
name: {
type: 'string',
'x-component': 'Search',
'x-component-props': {
placeholder: '搜索',
},
},
},
},
[FORM_FILTER_PATH]: {
type: 'object',
'x-component': 'flex-layout',
'x-component-props': {
colStyle: {
marginLeft: 20,
},
},
properties: {
memberTypeId: {
type: 'string',
default: undefined,
enum: [],
'x-component-props': {
placeholder: '会员类型(全部)',
allowClear: true,
},
},
// status: {
// type: 'string',
// default: undefined,
// enum: [],
// 'x-component-props': {
// placeholder: '会员状态(全部)',
// allowClear: true,
// },
// },
roleId: {
type: 'string',
default: undefined,
enum: [],
'x-component-props': {
placeholder: '会员角色(全部)',
allowClear: true,
},
},
level: {
type: 'string',
default: undefined,
enum: [],
'x-component-props': {
placeholder: '会员等级(全部)',
allowClear: true,
},
},
source: {
type: 'string',
default: undefined,
enum: [],
'x-component-props': {
placeholder: '申请来源(全部)',
allowClear: true,
},
},
'[startDate, endDate]': {
type: 'string',
default: '',
'x-component': 'dateSelect',
'x-component-props': {
placeholder: '时间范围(全部)',
allowClear: true,
},
},
submit: {
'x-component': 'Submit',
'x-mega-props': {
span: 1,
},
'x-component-props': {
children: '查询',
},
},
},
},
},
},
},
};
export const auditModalSchema: ISchema = {
type: 'object',
properties: {
MEGA_LAYOUT: {
type: 'object',
'x-component': 'mega-layout',
'x-component-props': {
labelAlign: 'top',
},
properties: {
agree: {
type: 'string',
default: 1,
enum: [
{ label: '审核通过', value: 1 },
{ label: '审核不通过', value: 0 },
],
'x-component': 'radio',
'x-component-props': {},
},
reason: {
type: 'string',
title: '审核不通过原因',
'x-component': 'textarea',
required: true,
'x-component-props': {
placeholder: '在此输入你的内容，最长120个字符，60个汉字',
rows: 5,
},
'x-rules': [
{
limitByte: true, // 自定义校验规则
maxByte: 120,
}
],
},
},
},
},
};
import { ISchema } from '@formily/antd';
import { FORM_FILTER_PATH } from '@/formSchema/const';
export const auditSchema: ISchema = {
type: 'object',
properties: {
MEGA_LAYOUT: {
type: 'object',
'x-component': 'mega-layout',
properties: {
topLayout: {
type: 'object',
'x-component': 'mega-layout',
'x-component-props': {
grid: true,
},
properties: {
ctl: {
type: 'object',
'x-component': 'Children',
'x-component-props': {
children: '{{controllerBtns}}',
},
},
name: {
type: 'string',
'x-component': 'Search',
'x-component-props': {
placeholder: '搜索',
tip: '输入 会员名称 进行搜索',
},
},
},
},
[FORM_FILTER_PATH]: {
type: 'object',
'x-component': 'flex-layout',
'x-component-props': {
colStyle: {
marginLeft: 20,
},
},
properties: {
memberTypeId: {
type: 'string',
default: undefined,
enum: [],
'x-component-props': {
placeholder: '会员类型(全部)',
allowClear: true,
},
},
// status: {
// type: 'string',
// default: undefined,
// enum: [],
// 'x-component-props': {
// placeholder: '会员状态(全部)',
// allowClear: true,
// },
// },
roleId: {
type: 'string',
default: undefined,
enum: [],
'x-component-props': {
placeholder: '会员角色(全部)',
allowClear: true,
},
},
level: {
type: 'string',
default: undefined,
enum: [],
'x-component-props': {
placeholder: '会员等级(全部)',
allowClear: true,
},
},
source: {
type: 'string',
default: undefined,
enum: [],
'x-component-props': {
placeholder: '申请来源(全部)',
allowClear: true,
},
},
'[startDate, endDate]': {
type: 'string',
default: '',
'x-component': 'dateSelect',
'x-component-props': {
placeholder: '时间范围(全部)',
allowClear: true,
},
},
submit: {
'x-component': 'Submit',
'x-mega-props': {
span: 1,
},
'x-component-props': {
children: '查询',
},
},
},
},
},
},
},
};
export const auditModalSchema: ISchema = {
type: 'object',
properties: {
MEGA_LAYOUT: {
type: 'object',
'x-component': 'mega-layout',
'x-component-props': {
labelAlign: 'top',
},
properties: {
agree: {
type: 'string',
default: 1,
enum: [
{ label: '审核通过', value: 1 },
{ label: '审核不通过', value: 0 },
],
'x-component': 'radio',
'x-component-props': {},
},
reason: {
type: 'string',
title: '审核不通过原因',
'x-component': 'textarea',
required: true,
'x-component-props': {
placeholder: '在此输入你的内容，最长120个字符，60个汉字',
rows: 5,
},
'x-rules': [
{
limitByte: true, // 自定义校验规则
maxByte: 120,
}
],
},
},
},
},
};
src/pages/message/index.tsx
View file @ a7754ee3
......@@ -36,24 +36,33 @@ const Message: React.FC<{}> = () => {
}
const handleRead = (id, url: string) => {
console.log("当前功能还未开发")
// PublicApi.getReportMessageMemberRead({id: id})
// .then((data) => {
// if(url) {
// if(/http/.test(url)) {
// location.href = url
// } else {
// history.push(url);
// }
// } else {
// getList(pagination);
// }
// })
PublicApi.postReportMessagePlatformRead({id: id})
.then((data) => {
if(url) {
if(/http/.test(url)) {
location.href = url
} else {
history.push(url);
}
return;
}
if(data.code === 1000) {
getList(pagination)
}
})
}
const handleAllMessageRead = () => {
PublicApi.postReportMessagePlatformReadAll()
.then(({code, data}) => {
if(code === 1000) {
getList(pagination);
}
})
}
const renderMessage = (data) => {
return (
<div onClick={() => handleRead(data.id, data.url)}>
<div onClick={() => handleRead(data.id, data.url)} style={{cursor: "pointer"}}>
<StatusTag type={data.type == 1 ? 'primary' : 'success'} title={data.type === 1 ? '系统消息' : '平台消息'} />
<span className={styles.messageTitle}>{data.title || ''}</span>
<span className={styles.messageText}>{data.content || ''}</span>
......@@ -69,7 +78,7 @@ const Message: React.FC<{}> = () => {
<Card>
<div className={styles.header}>
<Button type="primary" icon={<PlusOutlined />} onClick={()=>history.push('/message/messageList/add')} >新建</Button>
<Button type="link" >全部已读</Button>
<Button type="link" onClick={handleAllMessageRead}>全部已读</Button>
</div>
<List
itemLayout="horizontal"
......
src/pages/orderSystem/index.tsx
View file @ a7754ee3
......@@ -186,15 +186,15 @@ export const baseOrderListColumns: any[] = [
filters: Object.entries(PurchaseOrderOutWorkStateTexts).map(([key, value]) => ({text: value, value: Number(key)})),
onFilter: (value, record) => value === record.externalState,
},
{
title: '内部状态',
align: 'center',
dataIndex: 'interiorState',
key: 'interiorState',
render: (text) => <StatusColors status={text} type='inside'/>,
filters: Object.entries(PurchaseOrderInsideWorkStateTexts).map(([key, value]) => ({text: value, value: Number(key)})),
onFilter: (value, record) => value === record.interiorState,
},
// {
// title: '内部状态',
// align: 'center',
// dataIndex: 'interiorState',
// key: 'interiorState',
// render: (text) => <StatusColors status={text} type='inside'/>,
// filters: Object.entries(PurchaseOrderInsideWorkStateTexts).map(([key, value]) => ({text: value, value: Number(key)})),
// onFilter: (value, record) => value === record.interiorState,
// },
]
// 销售订单查询
......
src/pages/returnManage/components/RefundModal/Balance/index.tsx
View file @ a7754ee3
import React, { useState } from 'react';
import { Descriptions, Space, Button } from 'antd';
interface bankAccount {
id: number,
name: string,
bankAccount: string,
bankDeposit: string,
memberId: number,
};
interface BalanceProps {
/**
* 弹窗需要的数据值
*/
value: {[key: string]: any};
/**
* 关闭事件
*/
handleModalVisible: () => void;
/**
* 弹窗内确认事件
*/
handleConfirm: (values: {[key: string]: any}, modalName: string) => void;
/**
* 弹窗提交 loading
*/
submitLoading: boolean;
};
const Balance: React.FC<BalanceProps> = ({
handleModalVisible,
handleConfirm,
value,
submitLoading,
}) => {
const [bankAccount, setBankAccount] = useState<bankAccount>({
id: 0,
name: '',
bankAccount: '',
bankDeposit: '',
memberId: 0,
});
return (
<>
<Descriptions title="账户余额信息" column={1}>
<Descriptions.Item label="账户可用余额">￥500000.00</Descriptions.Item>
<Descriptions.Item label="当前退款金额">
<span style={{ color: '#EF6260' }}>￥6000.00</span>
</Descriptions.Item>
</Descriptions>
<div style={{ marginTop: 20, textAlign: 'center' }}>
<Space>
<Button onClick={handleModalVisible}>
取消
</Button>
<Button
type="primary"
onClick={() => handleConfirm(value, 'balance')}
loading={submitLoading}
>
退款
</Button>
</Space>
</div>
</>
)
};
import React, { useEffect, useState } from 'react';
import { Descriptions, Space, Button, Spin } from 'antd';
import { PublicApi } from '@/services/api';
interface BalanceProps {
/**
* 弹窗需要的数据值
*/
value: {[key: string]: any};
/**
* 关闭事件
*/
handleModalVisible: () => void;
/**
* 弹窗内确认事件
*/
handleConfirm: (values: {[key: string]: any}, modalName: string) => void;
/**
* 弹窗提交 loading
*/
submitLoading: boolean;
/**
* 采购商id
*/
purchaserId: number,
/**
* 采购商角色id
*/
purchaserRoleId: number,
};
const Balance: React.FC<BalanceProps> = ({
handleModalVisible,
handleConfirm,
value,
submitLoading,
purchaserId,
purchaserRoleId,
}) => {
const [balance, setBalance] = useState(0);
const [loading, setLoading] = useState(false);
const getPayAssetAccountGetUserBalance = () => {
if (!purchaserId || !purchaserRoleId) {
return;
}
setLoading(true);
PublicApi.getPayAssetAccountGetChildUserBalance({
childMemberId: `${purchaserId}`,
childMemberRoleId: `${purchaserRoleId}`,
}).then(res => {
if (res.code === 1000) {
setBalance(res.data);
}
}).finally(() => {
setLoading(false);
});
};
useEffect(() => {
getPayAssetAccountGetUserBalance();
}, []);
return (
<Spin spinning={loading}>
<Descriptions title="账户余额信息" column={1}>
<Descriptions.Item label="账户可用余额">￥{balance}</Descriptions.Item>
<Descriptions.Item label="当前退款金额">
<span style={{ color: '#EF6260' }}>￥{value.refundAmount}</span>
</Descriptions.Item>
</Descriptions>
<div style={{ marginTop: 20, textAlign: 'center' }}>
<Space>
<Button onClick={handleModalVisible}>
取消
</Button>
<Button
type="primary"
onClick={() => handleConfirm(value, 'balance')}
loading={submitLoading}
>
退款
</Button>
</Space>
</div>
</Spin>
)
};
export default Balance;
\ No newline at end of file
src/pages/returnManage/components/RefundModal/UploadVoucher/index.tsx
View file @ a7754ee3
import React, { useState } from 'react';
import { Button, Space, message } from 'antd';
import { createFormActions } from '@formily/antd';
import NiceForm from '@/components/NiceForm';
import { uploadVoucherModalSchema } from './schema';
const uploadVoucherFormActions = createFormActions();
interface bankAccount {
name: string,
bankAccount: string,
bankDeposit: string,
};
interface UploadVoucherProps {
/**
* 弹窗需要的数据值
*/
value: {[key: string]: any};
/**
* 关闭事件
*/
handleModalVisible: () => void;
/**
* 弹窗内确认事件
*/
handleConfirm: (values: {[key: string]: any}, modalName: string) => void;
/**
* 弹窗提交 loading
*/
submitLoading: boolean;
};
const UploadVoucher: React.FC<UploadVoucherProps> = ({
handleConfirm,
handleModalVisible,
value,
submitLoading,
}) => {
const [bankAccount, setBankAccount] = useState<bankAccount>({
name: '',
bankAccount: '',
bankDeposit: '',
});
const beforeUploadVoucher = file => {
console.log(file.size)
if (file.size / 1024 > 200) {
message.warning('图片大小超过200K');
return Promise.reject();
}
};
const handleUploadVoucherSubmit = values => {
const { fileList = [] } = values;
if (handleConfirm) {
if (!bankAccount || !bankAccount.name) {
message.error('没有收款账户相关信息，无法退款');
return;
}
handleConfirm({
...value,
payProve: {
...values,
fileList: fileList.map(item => item.status === 'done' && ({
name: item.name,
proveUrl: item.data.url,
})).filter(Boolean),
},
}, 'uploadVoucher');
}
};
return (
<>
<NiceForm
previewPlaceholder=""
initialValues={bankAccount}
effects={($, { setFieldState }) => {
}}
expressionScope={{
beforeUpload: beforeUploadVoucher,
}}
actions={uploadVoucherFormActions}
schema={uploadVoucherModalSchema}
onSubmit={handleUploadVoucherSubmit}
/>
<div style={{ marginTop: 20, textAlign: 'center' }}>
<Space>
<Button onClick={handleModalVisible}>
取消
</Button>
<Button
type="primary"
onClick={() => uploadVoucherFormActions.submit()}
loading={submitLoading}
>
退款
</Button>
</Space>
</div>
</>
)
};
import React, { useState, useEffect } from 'react';
import { Button, Space, message, Spin } from 'antd';
import { createFormActions } from '@formily/antd';
import { PublicApi } from '@/services/api';
import NiceForm from '@/components/NiceForm';
import { uploadVoucherModalSchema } from './schema';
const uploadVoucherFormActions = createFormActions();
interface BankAccount {
name: string,
bankAccount: string,
bankDeposit: string,
id: number,
};
interface UploadVoucherProps {
/**
* 弹窗需要的数据值
*/
value: {[key: string]: any};
/**
* 关闭事件
*/
handleModalVisible: () => void;
/**
* 弹窗内确认事件
*/
handleConfirm: (values: {[key: string]: any}, modalName: string) => void;
/**
* 弹窗提交 loading
*/
submitLoading: boolean;
/**
* 采购商id
*/
purchaserId: number,
/**
* 采购商角色id
*/
purchaserRoleId: number,
};
const UploadVoucher: React.FC<UploadVoucherProps> = ({
handleConfirm,
handleModalVisible,
value,
submitLoading,
purchaserId,
purchaserRoleId,
}) => {
const [bankAccount, setBankAccount] = useState<BankAccount>({
name: '',
bankAccount: '',
bankDeposit: '',
id: 0,
});
const [loading, setLoading] = useState(false);
// 获取对公账户信息
const getSettleAccountsGetMemberAccountConfig = () => {
if (!purchaserId || !purchaserRoleId) {
return;
}
setLoading(true);
PublicApi.getSettleAccountsGetMemberAccountConfig({
memberId: `${purchaserId}`,
roleId: `${purchaserRoleId}`,
}).then(res => {
if (res.code === 1000) {
setBankAccount(res.data);
}
}).finally(() => {
setLoading(false);
});
};
useEffect(() => {
getSettleAccountsGetMemberAccountConfig();
}, []);
const beforeUploadVoucher = file => {
if (file.size / 1024 > 200) {
message.warning('图片大小超过200K');
return Promise.reject();
}
};
const handleUploadVoucherSubmit = values => {
const { fileList = [], id, ...rest } = values;
if (handleConfirm) {
if (!bankAccount || !bankAccount.id) {
message.error('没有收款账户相关信息，无法退款');
return;
}
handleConfirm({
...value,
payProve: {
...rest,
fileList: fileList.map(item => item.status === 'done' && ({
name: item.name,
proveUrl: item.data.url,
})).filter(Boolean),
},
}, 'uploadVoucher');
}
};
return (
<Spin spinning={loading}>
<NiceForm
previewPlaceholder=""
value={bankAccount}
effects={($, { setFieldState }) => {
}}
expressionScope={{
beforeUpload: beforeUploadVoucher,
}}
actions={uploadVoucherFormActions}
schema={uploadVoucherModalSchema}
onSubmit={handleUploadVoucherSubmit}
/>
<div style={{ marginTop: 20, textAlign: 'center' }}>
<Space>
<Button onClick={handleModalVisible}>
取消
</Button>
<Button
type="primary"
onClick={() => uploadVoucherFormActions.submit()}
loading={submitLoading}
>
退款
</Button>
</Space>
</div>
</Spin>
)
};
export default UploadVoucher;
\ No newline at end of file
src/pages/returnManage/components/RefundModal/index.tsx
View file @ a7754ee3
import React, { Suspense } from 'react';
import { Modal } from 'antd';
const UploadVoucher = React.lazy(() => import('./UploadVoucher'));
const Balance = React.lazy(() => import('./Balance'));
const Credit = React.lazy(() => import('./Credit'));
const COD = React.lazy(() => import('./COD'));
export interface RefundModalProps {
/**
* 是否可见
*/
visible: boolean;
/**
* 对应的弹窗名称
*/
modalName: string;
/**
* 关闭事件
*/
handleModalVisible: () => void;
/**
* 弹窗内确认事件
*/
handleConfirm: (values: {[key: string]: any}, modalName: string) => void;
/**
* 弹窗需要的数据值
*/
value: {[key: string]: any};
/**
* 弹窗提交 loading
*/
submitLoading: boolean;
};
const RefundModal: React.FC<RefundModalProps> = ({
visible = false,
modalName = 'uploadVoucher',
handleModalVisible,
handleConfirm,
value,
submitLoading,
}) => {
const tempMap = {
uploadVoucher: {
width: 600,
title: '上传退款凭证',
render: () => (
<Suspense fallback={null}>
<UploadVoucher
value={value}
handleConfirm={handleConfirm}
handleModalVisible={handleModalVisible}
submitLoading={submitLoading}
/>
</Suspense>
),
},
balance: {
width: 600,
title: '退款处理',
render: () => (
<Suspense fallback={null}>
<Balance
value={value}
handleConfirm={handleConfirm}
handleModalVisible={handleModalVisible}
submitLoading={submitLoading}
/>
</Suspense>
),
},
credit: {
width: 600,
title: '退款处理',
render: () => (
<Suspense fallback={null}>
<Credit
value={value}
handleConfirm={handleConfirm}
handleModalVisible={handleModalVisible}
submitLoading={submitLoading}
/>
</Suspense>
),
},
COD: {
width: 500,
title: '货到付款退款确认',
render: () => (
<Suspense fallback={null}>
<COD
value={value}
handleConfirm={handleConfirm}
handleModalVisible={handleModalVisible}
submitLoading={submitLoading}
/>
</Suspense>
),
},
};
const template = tempMap[modalName] || {
width: 640,
title: '标题',
render: () => ('没有找到 modal 模板'),
};
return (
<Modal
width={template.width}
title={template.title}
visible={visible}
footer={null}
onCancel={() => handleModalVisible()}
destroyOnClose
>
{template.render()}
</Modal>
);
};
import React, { Suspense } from 'react';
import { Modal } from 'antd';
const UploadVoucher = React.lazy(() => import('./UploadVoucher'));
const Balance = React.lazy(() => import('./Balance'));
const Credit = React.lazy(() => import('./Credit'));
const COD = React.lazy(() => import('./COD'));
export interface RefundModalProps {
/**
* 是否可见
*/
visible: boolean;
/**
* 对应的弹窗名称
*/
modalName: string;
/**
* 关闭事件
*/
handleModalVisible: () => void;
/**
* 弹窗内确认事件
*/
handleConfirm: (values: {[key: string]: any}, modalName: string) => void;
/**
* 弹窗需要的数据值
*/
value: {[key: string]: any};
/**
* 弹窗提交 loading
*/
submitLoading: boolean;
};
const RefundModal: React.FC<RefundModalProps> = ({
visible = false,
modalName = 'uploadVoucher',
handleModalVisible,
handleConfirm,
value,
submitLoading,
}) => {
const {
purchaserId,
purchaserRoleId,
supplierId,
supplierRoleId,
...rest
} = value;
const tempMap = {
uploadVoucher: {
width: 600,
title: '上传退款凭证',
render: () => (
<Suspense fallback={null}>
<UploadVoucher
value={rest}
purchaserId={purchaserId}
purchaserRoleId={purchaserRoleId}
handleConfirm={handleConfirm}
handleModalVisible={handleModalVisible}
submitLoading={submitLoading}
/>
</Suspense>
),
},
balance: {
width: 600,
title: '退款处理',
render: () => (
<Suspense fallback={null}>
<Balance
value={rest}
purchaserId={purchaserId}
purchaserRoleId={purchaserRoleId}
handleConfirm={handleConfirm}
handleModalVisible={handleModalVisible}
submitLoading={submitLoading}
/>
</Suspense>
),
},
credit: {
width: 600,
title: '退款处理',
render: () => (
<Suspense fallback={null}>
<Credit
value={rest}
handleConfirm={handleConfirm}
handleModalVisible={handleModalVisible}
submitLoading={submitLoading}
/>
</Suspense>
),
},
COD: {
width: 500,
title: '货到付款退款确认',
render: () => (
<Suspense fallback={null}>
<COD
value={rest}
handleConfirm={handleConfirm}
handleModalVisible={handleModalVisible}
submitLoading={submitLoading}
/>
</Suspense>
),
},
};
const template = tempMap[modalName] || {
width: 640,
title: '标题',
render: () => ('没有找到 modal 模板'),
};
return (
<Modal
width={template.width}
title={template.title}
visible={visible}
footer={null}
onCancel={() => handleModalVisible()}
destroyOnClose
>
{template.render()}
</Modal>
);
};
export default RefundModal;
\ No newline at end of file
yarn.lock
View file @ a7754ee3
This source diff could not be displayed because it is too large. You can view the blob instead.
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