Commit 5bb4f29b authored by 前端-许佳敏's avatar 前端-许佳敏
parents c8d6033e 600f70a4
...@@ -66,22 +66,30 @@ import { useValueLinkageEffect, FormPath, FormEffectHooks } from '@formily/antd' ...@@ -66,22 +66,30 @@ import { useValueLinkageEffect, FormPath, FormEffectHooks } from '@formily/antd'
* ` * `
*/ */
export const useLinkEnumEffect = (childKey, transformFn?) => { export const useLinkEnumEffect = (childKey, transformFn?) => {
const { onFieldValueChange$ } = FormEffectHooks
useValueLinkageEffect({ useValueLinkageEffect({
type: 'value:linkage', type: 'value:linkage',
resolve: ({origin, target}, { setFieldState, getFieldState }) => { resolve: ({ origin, target }, { setFieldState, getFieldState }) => {
getFieldState(origin, state => { getFieldState(origin, state => {
const { originData = [] } = state const { originData = [] } = state
setFieldState(target, targetState => { setFieldState(target, targetState => {
if (state.value === undefined) {
} else {
const result = originData.find(v => v.id === state.value)[childKey] || [] const result = originData.find(v => v.id === state.value)[childKey] || []
targetState.value = '' if (state.modified) {
targetState.value = undefined
}
targetState.originData = result targetState.originData = result
targetState.props.enum = transformFn ? transformFn(result) : result targetState.props.enum = transformFn ? transformFn(result) : result
}
}) })
}) })
}, },
reject: ({target}, { setFieldState, getFieldState }) => { reject: ({ target }, { setFieldState, getFieldState }) => {
setFieldState(target, targetState => { setFieldState(target, targetState => {
targetState.value = '' targetState.value = undefined
targetState.props.enum = [] targetState.props.enum = []
}) })
} }
......
...@@ -2,7 +2,7 @@ import React, { useState, useEffect, useRef } from 'react'; ...@@ -2,7 +2,7 @@ import React, { useState, useEffect, useRef } from 'react';
import { usePageStatus } from '@/hooks/usePageStatus'; import { usePageStatus } from '@/hooks/usePageStatus';
import { history } from 'umi'; import { history } from 'umi';
import { PageHeaderWrapper } from '@ant-design/pro-layout'; import { PageHeaderWrapper } from '@ant-design/pro-layout';
import { SaveOutlined } from '@ant-design/icons'; import { SaveOutlined, PlusOutlined } from '@ant-design/icons';
import { createFormActions, FormEffectHooks } from '@formily/antd'; import { createFormActions, FormEffectHooks } from '@formily/antd';
import { Button, Card } from 'antd'; import { Button, Card } from 'antd';
import ReutrnEle from '@/components/ReturnEle'; import ReutrnEle from '@/components/ReturnEle';
...@@ -16,7 +16,9 @@ const { onFieldValueChange$ } = FormEffectHooks; ...@@ -16,7 +16,9 @@ const { onFieldValueChange$ } = FormEffectHooks;
const AddBills: React.FC<{}> = (props: any) => { const AddBills: React.FC<{}> = (props: any) => {
const ref = useRef({}); const ref = useRef({});
const { pageStatus, preview, id } = usePageStatus();
const [warehouseList, setWarehouseList] = useState<any>([]); const [warehouseList, setWarehouseList] = useState<any>([]);
const [invoicesTypeList, setInvoicesTypeList] = useState<any>([]);
const [relevance, setRelevance] = useState(1); const [relevance, setRelevance] = useState(1);
// 订单 // 订单
...@@ -156,36 +158,53 @@ const AddBills: React.FC<{}> = (props: any) => { ...@@ -156,36 +158,53 @@ const AddBills: React.FC<{}> = (props: any) => {
}, },
]; ];
// useEffect(() => { // 弹出单据明细
// PublicApi.getWarehouseWarehouseList({ const handleAddMemberBtn = () => {};
// current: '1',
// pageSize: '10000',
// }).then((res: any) => {
// let list = [];
// for (let item of res.data) {
// list.push({ label: item.name, value: item.id });
// }
// setWarehouseList(list);
// });
// }, []);
// 删除选中单据明细
const handleDeleteTable = id => {}; const handleDeleteTable = id => {};
const tableAddButton = (
<Button
style={{ marginBottom: 16 }}
block
icon={<PlusOutlined />}
onClick={handleAddMemberBtn}
type="dashed"
>
添加单据明细
</Button>
);
useEffect(() => {
PublicApi.getWarehouseInvoicesTypeAll().then(res => {
setInvoicesTypeList(getList(res.data));
});
PublicApi.getWarehouseWarehouseAll().then(res => {
setWarehouseList(getList(res.data));
});
}, []);
// 重组(单据类型、对应仓库)列表数据
const getList = list => {
let newList = [];
for (let item of list) {
newList.push({ label: item.name, value: item.id });
}
return newList;
};
const handleSubmit = value => { const handleSubmit = value => {
if (usePageStatus().pageStatus === 0) if (pageStatus === 0)
return PublicApi.postWarehouseInvoicesAdd({ ...value }).then(res => { return PublicApi.postWarehouseInvoicesAdd({ ...value }).then(res => {
if (res.data.code === 1000) { if (res.code === 1000) return history.goBack();
history.goBack();
}
}); });
else else
return PublicApi.postWarehouseInvoicesUpdata({ return PublicApi.postWarehouseInvoicesUpdata({
id: usePageStatus().id, id: usePageStatus().id,
...value, ...value,
}).then(res => { }).then(res => {
if (res.data.code === 1000) { if (res.code === 1000) return history.goBack();
history.goBack();
}
}); });
}; };
return ( return (
...@@ -193,14 +212,14 @@ const AddBills: React.FC<{}> = (props: any) => { ...@@ -193,14 +212,14 @@ const AddBills: React.FC<{}> = (props: any) => {
onBack={() => history.goBack()} onBack={() => history.goBack()}
backIcon={<ReutrnEle description="返回" />} backIcon={<ReutrnEle description="返回" />}
title={ title={
usePageStatus().pageStatus === 0 pageStatus === 0
? '新建单据' ? '新建单据'
: usePageStatus().pageStatus === 1 : pageStatus === 1
? '编辑单据' ? '编辑单据'
: '查看单据' : '查看单据'
} }
extra={ extra={
usePageStatus().preview != '1' preview != '1'
? [ ? [
<Button <Button
key="1" key="1"
...@@ -218,6 +237,7 @@ const AddBills: React.FC<{}> = (props: any) => { ...@@ -218,6 +237,7 @@ const AddBills: React.FC<{}> = (props: any) => {
<NiceForm <NiceForm
expressionScope={{ expressionScope={{
tableColumns, tableColumns,
tableAddButton,
}} }}
effects={$ => { effects={$ => {
$('onFieldValueChange', 'relevanceInvoices').subscribe(state => { $('onFieldValueChange', 'relevanceInvoices').subscribe(state => {
...@@ -234,6 +254,7 @@ const AddBills: React.FC<{}> = (props: any) => { ...@@ -234,6 +254,7 @@ const AddBills: React.FC<{}> = (props: any) => {
onSubmit={handleSubmit} onSubmit={handleSubmit}
actions={addSchemaAction} actions={addSchemaAction}
schema={getBillsDetailSchema({ schema={getBillsDetailSchema({
invoicesTypeList,
warehouseList, warehouseList,
relevance, relevance,
modalColumns, modalColumns,
......
...@@ -16,10 +16,12 @@ import { PublicApi } from '@/services/api'; ...@@ -16,10 +16,12 @@ import { PublicApi } from '@/services/api';
const formActions = createFormActions(); const formActions = createFormActions();
// 模拟请求 const Bills: React.FC<{}> = () => {
const fetchData = (params: any) => { const ref = useRef<any>({});
return new Promise((resolve, reject) => { const [selectedRowKeys, setSelectedRowKeys] = useState<Array<string>>([]);
PublicApi.getWarehouseInvoicesList({ const [visibleModal, setVisibleModal] = useState(false);
const [moreVisible, setMoreVisible] = useState(false);
const [searchKey, setSearchKey] = useState({
invoicesNo: '', invoicesNo: '',
invoicesType: '', invoicesType: '',
invoicesAbstract: '', invoicesAbstract: '',
...@@ -29,19 +31,7 @@ const fetchData = (params: any) => { ...@@ -29,19 +31,7 @@ const fetchData = (params: any) => {
endTransactionTime: '', endTransactionTime: '',
orderNo: '', orderNo: '',
state: '', state: '',
current: params.current,
pageSize: params.pageSize,
}).then(res => {
resolve(res.data);
});
}); });
};
const Bills: React.FC<{}> = () => {
const ref = useRef<any>({});
const [selectedRowKeys, setSelectedRowKeys] = useState<Array<string>>([]);
const [visibleModal, setVisibleModal] = useState(false);
const [moreVisible, setMoreVisible] = useState(false);
const menu = ( const menu = (
<Menu onClick={e => handleBatchDel(e)}> <Menu onClick={e => handleBatchDel(e)}>
...@@ -159,6 +149,19 @@ const Bills: React.FC<{}> = () => { ...@@ -159,6 +149,19 @@ const Bills: React.FC<{}> = () => {
}, },
]; ];
// 模拟请求
const fetchData = (params: any) => {
return new Promise((resolve, reject) => {
PublicApi.getWarehouseInvoicesList({
...searchKey,
current: params.current,
pageSize: params.pageSize,
}).then(res => {
resolve(res.data);
});
});
};
const handleAdd = () => {}; const handleAdd = () => {};
const rowSelection = { const rowSelection = {
......
...@@ -270,6 +270,7 @@ export const getBillsDetailSchema = params => { ...@@ -270,6 +270,7 @@ export const getBillsDetailSchema = params => {
modalSchema = productionDetailSchema; modalSchema = productionDetailSchema;
modalTitle = '选择生产通知单'; modalTitle = '选择生产通知单';
} }
const relevanceInvoices = const relevanceInvoices =
params.relevance != 5 params.relevance != 5
? { ? {
...@@ -305,7 +306,6 @@ export const getBillsDetailSchema = params => { ...@@ -305,7 +306,6 @@ export const getBillsDetailSchema = params => {
} }
: {}; : {};
console.log('params', params);
const billsDetailSchema: ISchema = { const billsDetailSchema: ISchema = {
type: 'object', type: 'object',
properties: { properties: {
...@@ -335,16 +335,7 @@ export const getBillsDetailSchema = params => { ...@@ -335,16 +335,7 @@ export const getBillsDetailSchema = params => {
name: { name: {
type: 'string', type: 'string',
title: '单据类型', title: '单据类型',
enum: [ enum: params.invoicesTypeList,
{ label: '采购入库单', value: '1' },
{ label: '销售发货单', value: '2' },
{ label: '加工入库单', value: '3' },
{ label: '加工发货单', value: '4' },
{ label: '退货发货单', value: '5' },
{ label: '退货入库单', value: '6' },
{ label: '换货发货单', value: '7' },
{ label: '换货入库单', value: '8' },
],
'x-component-props': { 'x-component-props': {
placeholder: '请选择', placeholder: '请选择',
}, },
...@@ -414,7 +405,9 @@ export const getBillsDetailSchema = params => { ...@@ -414,7 +405,9 @@ export const getBillsDetailSchema = params => {
type: 'array:number', type: 'array:number',
'x-component': 'MultTable', 'x-component': 'MultTable',
'x-component-props': { 'x-component-props': {
rowKey: 'memberId',
columns: '{{tableColumns}}', columns: '{{tableColumns}}',
prefix: '{{tableAddButton}}',
}, },
default: [ default: [
{ id: 1, name: '名称', type: '类型' }, { id: 1, name: '名称', type: '类型' },
......
...@@ -16,37 +16,48 @@ import { PublicApi } from '@/services/api'; ...@@ -16,37 +16,48 @@ import { PublicApi } from '@/services/api';
const addSchemaAction = createFormActions(); const addSchemaAction = createFormActions();
const AddWarehouse: React.FC<{}> = (props: any) => { const AddWarehouse: React.FC<{}> = props => {
const ref = useRef({}); const ref = useRef<any>({});
const { pageStatus, preview, id } = usePageStatus();
const [formValue, setFormValue] = useState<any>({});
useEffect(() => { useEffect(() => {
console.log(usePageStatus()); if (pageStatus != 0) {
PublicApi.getWarehouseInvoicesTypeDetails({
id: id,
}).then(res => {
setFormValue(res.data);
}); });
}
}, []);
const handleSubmit = value => { const handleSubmit = value => {
if (usePageStatus().pageStatus === 0) { if (pageStatus === 0) {
PublicApi.postWarehouseInvoicesTypeAdd({ ...value }); PublicApi.postWarehouseInvoicesTypeAdd({ ...value }).then(res => {
if (res.code === 1000) return history.goBack();
});
} else { } else {
PublicApi.postWarehouseInvoicesTypeUpdate({ PublicApi.postWarehouseInvoicesTypeUpdate({
id: usePageStatus().id, id: id,
...value, ...value,
}).then(res => {
if (res.code === 1000) return history.goBack();
}); });
} }
history.goBack();
}; };
return ( return (
<PageHeaderWrapper <PageHeaderWrapper
onBack={() => history.goBack()} onBack={() => history.goBack()}
backIcon={<ReutrnEle description="返回" />} backIcon={<ReutrnEle description="返回" />}
title={ title={
usePageStatus().pageStatus === 0 pageStatus === 0
? '新建单据类型' ? '新建单据类型'
: usePageStatus().pageStatus === 1 : pageStatus === 1
? '编辑单据类型' ? '编辑单据类型'
: '查看单据类型' : '查看单据类型'
} }
extra={ extra={
usePageStatus().preview != '1' preview != '1'
? [ ? [
<Button <Button
key="1" key="1"
...@@ -62,7 +73,8 @@ const AddWarehouse: React.FC<{}> = (props: any) => { ...@@ -62,7 +73,8 @@ const AddWarehouse: React.FC<{}> = (props: any) => {
> >
<Card> <Card>
<SchemaForm <SchemaForm
editable={usePageStatus().preview != '1'} value={formValue}
editable={preview != '1'}
actions={addSchemaAction} actions={addSchemaAction}
components={{ Input, Select }} components={{ Input, Select }}
onSubmit={value => handleSubmit(value)} onSubmit={value => handleSubmit(value)}
...@@ -74,7 +86,7 @@ const AddWarehouse: React.FC<{}> = (props: any) => { ...@@ -74,7 +86,7 @@ const AddWarehouse: React.FC<{}> = (props: any) => {
x-component="Input" x-component="Input"
x-component-props={{ x-component-props={{
placeholder: '最长10个字符', placeholder: '最长10个字符',
maxLength: 10, maxLength: 5,
}} }}
required required
/> />
......
...@@ -11,33 +11,19 @@ import { ...@@ -11,33 +11,19 @@ import {
Space, Space,
Popconfirm, Popconfirm,
} from 'antd'; } from 'antd';
import { import { PlusOutlined } from '@ant-design/icons';
PlusOutlined,
PlayCircleOutlined,
PauseCircleOutlined,
} from '@ant-design/icons';
import EyePreview from '@/components/EyePreview'; import EyePreview from '@/components/EyePreview';
import StatusSwitch from '@/components/StatusSwitch'; import StatusSwitch from '@/components/StatusSwitch';
import { StandardTable } from 'god'; import { StandardTable } from 'god';
import { ColumnType } from 'antd/lib/table/interface'; import { ColumnType } from 'antd/lib/table/interface';
import style from './index.less';
import { PublicApi } from '@/services/api'; import { PublicApi } from '@/services/api';
// 模拟请求
const fetchData = (params: any) => {
return new Promise((resolve, reject) => {
PublicApi.getWarehouseInvoicesTypeList({
current: params.current,
pageSize: params.pageSize,
}).then(res => {
resolve(res.data);
});
});
};
const billsType: React.FC<{}> = () => { const billsType: React.FC<{}> = () => {
const ref = useRef({}); const ref = useRef<any>({});
const [searchName, setSearchName] = useState(''); const [searchKey, setSearchKey] = useState<any>({
name: '',
state: '',
});
const columns: ColumnType<any>[] = [ const columns: ColumnType<any>[] = [
{ {
...@@ -97,6 +83,8 @@ const billsType: React.FC<{}> = () => { ...@@ -97,6 +83,8 @@ const billsType: React.FC<{}> = () => {
align: 'center', align: 'center',
render: (text: any, record: any) => ( render: (text: any, record: any) => (
<> <>
{record.state != 1 ? (
<>
<Button <Button
type="link" type="link"
onClick={() => onClick={() =>
...@@ -117,28 +105,60 @@ const billsType: React.FC<{}> = () => { ...@@ -117,28 +105,60 @@ const billsType: React.FC<{}> = () => {
<Button type="link">删除</Button> <Button type="link">删除</Button>
</Popconfirm> </Popconfirm>
</> </>
) : (
''
)}
</>
), ),
}, },
]; ];
const handleReset = () => {}; // 模拟请求
const fetchData = (params: any) => {
return new Promise((resolve, reject) => {
PublicApi.getWarehouseInvoicesTypeList({
...searchKey,
current: params.current,
pageSize: params.pageSize,
}).then(res => {
resolve(res.data);
});
});
};
const handleModify = (record: object) => { const handleModify = (record: any) => {
// 通过传入的params字符串判断是修改那种类型的数据 PublicApi.postWarehouseInvoicesTypeStateUpdate({
console.log('执行状态修改', record); id: record.id,
state: record.state === 1 ? 0 : 1,
}).then(res => {
if (res.code === 1000) return ref.current.reload();
});
}; };
const handleDelete = record => { const handleDelete = record => {
PublicApi.postWarehouseInvoicesTypeDelete({ PublicApi.postWarehouseInvoicesTypeDelete({
id: record.id, id: record.id,
}).then(res => {}); }).then(res => {
if (res.code === 1000) return ref.current.reload();
});
}; };
return ( return (
<PageHeaderWrapper> <PageHeaderWrapper>
<Card> <Card>
<StandardTable <StandardTable
tableProps={{ rowKey: 'id' }} tableProps={{
rowKey: 'id',
onChange: (pagination, filters, sorter) => {
let state =
sorter.order === 'ascend'
? 1
: sorter.order === 'descend'
? 0
: '';
setSearchKey({ ...searchKey, state: state });
},
}}
columns={columns} columns={columns}
currentRef={ref} currentRef={ref}
fetchTableData={(params: any) => fetchData(params)} fetchTableData={(params: any) => fetchData(params)}
...@@ -168,12 +188,25 @@ const billsType: React.FC<{}> = () => { ...@@ -168,12 +188,25 @@ const billsType: React.FC<{}> = () => {
> >
<Input.Search <Input.Search
style={{ width: '232px' }} style={{ width: '232px' }}
value={searchName} value={searchKey.name}
placeholder="搜索" placeholder="搜索"
onChange={e => setSearchName(e.target.value)} onChange={e =>
setSearchKey({ ...searchKey, name: e.target.value })
}
onSearch={(val, e) => {
e.preventDefault();
ref.current.reload();
}}
/> />
</Tooltip> </Tooltip>
<Button onClick={() => handleReset()}>重置</Button> <Button
onClick={() => {
setSearchKey({ name: '', state: '' });
ref.current.reload();
}}
>
重置
</Button>
</Space> </Space>
</Col> </Col>
</Row> </Row>
......
import React, { useState, useEffect, useRef } from 'react';
import { usePageStatus } from '@/hooks/usePageStatus';
import { history } from 'umi';
import { PageHeaderWrapper } from '@ant-design/pro-layout';
import { SaveOutlined } from '@ant-design/icons';
import { createFormActions, FormEffectHooks } from '@formily/antd';
import { Button, Card } from 'antd';
import ReutrnEle from '@/components/ReturnEle';
import {
SchemaForm,
SchemaMarkupField as Field,
FormMegaLayout,
} from '@formily/antd';
import { Input, Select } from '@formily/antd-components';
import { PublicApi } from '@/services/api';
import { useLinkageUtils } from '@/utils/formEffectUtils';
import {useLinkEnumEffect} from '@/components/NiceForm/linkages/linkEnum'
const addSchemaAction = createFormActions();
const { onFormMount$ } = FormEffectHooks;
const AddWarehouse: React.FC<{}> = (props: any) => {
const ref = useRef({});
const { pageStatus, preview, id } = usePageStatus();
const [provinceList, setProvinceList] = useState([]);
const [cityList, setCityList] = useState([]);
const [areaList, setAreaList] = useState([]);
const [telCodeList, setTelCodeList] = useState<any>([]);
const [formValue, setFormValue] = useState<any>({});
useEffect(() => {
let formValues;
// 获取详情
if (pageStatus != 0) {
PublicApi.getWarehouseWarehouseDetails({
id: usePageStatus().id,
}).then(res => {
formValues = res.data;
setFormValue(res.data);
});
}
// 获取省市区
// PublicApi.getManageAreaAll().then(res => {
// let provinceOptions = [];
// for (let item of res.data) {
// provinceOptions.push({
// label: item.name,
// value: item.id,
// areaResponses: item.areaResponses,
// });
// }
// setProvinceList(provinceOptions);
// if (pageStatus != 0) {
// getSubAddressList('province', provinceOptions, formValues.provinceId);
// getSubAddressList('city', cityList, formValues.cityId);
// }
// });
// 获取手机code
PublicApi.getManageGetTelCode().then(res => {
setTelCodeList(res.data);
});
}, []);
const getAddressList = (type, id?) => {
let options = [];
if (type === 'province') {
provinceList.find(target => {
if (target.value === id) {
for (let item of target.areaResponses) {
options.push({ label: item.name, value: item.id });
}
setCityList(options);
}
});
} else {
cityList.find(target => {
if (target.value === id) {
for (let item of target.areaResponses) {
options.push({ label: item.name, value: item.id });
}
setAreaList(options);
}
});
}
};
const getSubAddressList = (type, list, id) => {
let options = [];
list.find(target => {
if (target.value === id) {
for (let item of target.areaResponses) {
options.push({ label: item.name, value: item.id });
}
if (type === 'province') return setCityList(options);
if (type === 'city') return setAreaList(options);
}
});
};
const handleSubmit = value => {
if (pageStatus === 0)
return PublicApi.postWarehouseWarehouseAdd({ ...value }).then(res => {
if (res.code === 1000) return history.goBack();
});
else
return PublicApi.postWarehouseWarehouseUpdate({
id: id,
...value,
}).then(res => {
if (res.code === 1000) return history.goBack();
});
};
return (
<PageHeaderWrapper
onBack={() => history.goBack()}
backIcon={<ReutrnEle description="返回" />}
title={
pageStatus === 0
? '新建仓库'
: pageStatus === 1
? '编辑仓库'
: '查看仓库'
}
extra={
preview != '1'
? [
<Button
key="1"
type="primary"
icon={<SaveOutlined />}
onClick={() => addSchemaAction.submit()}
>
保存
</Button>,
]
: []
}
>
<Card>
<SchemaForm
value={formValue}
editable={preview != '1'}
actions={addSchemaAction}
effects={($, { setFieldState }) => {
$('onFormMount').subscribe(state => {
PublicApi.getManageAreaAll().then(res => {
const { data } = res
setFieldState('provinceId', targetState => {
targetState.originData = data
targetState.props.enum = data.map(v => ({
label: v.name,
value: v.id
}))
})
})
});
useLinkEnumEffect('areaResponses', result => result.map(v => ({
label: v.name,
value: v.id
})))
// $('onFieldValueChange', 'provinceId').subscribe(state => {
// const origin = areaData.current.find(v => v.id === state.value)?.areaResponses
// console.log(origin)
// useLinkageUtils().enum('cityId', origin)
// })
}}
components={{ Input, Select, Textarea: Input.TextArea }}
onSubmit={value => handleSubmit(value)}
>
<FormMegaLayout labelCol={4} labelAlign="left" wrapperCol={12}>
<Field name="name" title="仓库名称" x-component="Input" required />
<FormMegaLayout label="仓库地址" wrapperCol={24} required>
<FormMegaLayout grid full autoRow columns={3}>
<Field
name="provinceId"
enum={provinceList}
x-component="Select"
x-component-props={{
placeholder: '- 省 -',
onChange: val => getAddressList('province', val),
}}
required
/>
<Field
name="cityId"
enum={cityList}
x-component="Select"
x-component-props={{
placeholder: '- 市 -',
onChange: val => getAddressList('city', val),
}}
required
/>
<Field
name="areaId"
enum={areaList}
x-component="Select"
x-component-props={{
placeholder: '- 县/区 -',
}}
required
/>
</FormMegaLayout>
<Field
name="address"
x-component="Textarea"
x-component-props={{
placeholder: '请输入详细地址(最长50个字符,25个汉字)',
rules: [{ message: '请输入详细地址' }],
}}
required
/>
</FormMegaLayout>
<Field name="principal" title="仓库负责人" x-component="Input" />
<FormMegaLayout label="联系电话" grid full wrapperCol={24}>
<Field
name="telCode"
enum={telCodeList}
x-component="Select"
x-component-props={{ placeholder: '请选择' }}
/>
<Field
x-mega-props={{ span: 3 }}
name="tel"
x-component="Input"
x-component-props={{
placeholder: '请输入你的手机号码',
maxLength: 11,
}}
/>
</FormMegaLayout>
</FormMegaLayout>
</SchemaForm>
</Card>
</PageHeaderWrapper>
);
};
export default AddWarehouse;
import React, { useState, useEffect, useRef } from 'react'; import React, { useState, useEffect, useRef } from 'react';
import { usePageStatus } from '@/hooks/usePageStatus';
import { history } from 'umi'; import { history } from 'umi';
import { PageHeaderWrapper } from '@ant-design/pro-layout'; import { PageHeaderWrapper } from '@ant-design/pro-layout';
import { SaveOutlined } from '@ant-design/icons'; import { SaveOutlined } from '@ant-design/icons';
import { createFormActions } from '@formily/antd'; import { createFormActions, FormEffectHooks } from '@formily/antd';
import { Button, Card } from 'antd'; import { Button, Card } from 'antd';
import ReutrnEle from '@/components/ReturnEle'; import ReutrnEle from '@/components/ReturnEle';
import { import NiceForm from '@/components/NiceForm';
SchemaForm, import { warehouseDetailSchema } from './schema';
SchemaMarkupField as Field, import { useLinkEnumEffect } from '@/components/NiceForm/linkages/linkEnum';
FormMegaLayout, import { useAsyncSelect } from '@/formSchema/effects/useAsyncSelect';
} from '@formily/antd'; import { usePageStatus, PageStatus } from '@/hooks/usePageStatus';
import { Input, Select } from '@formily/antd-components'; import { useInitValue } from '@/formSchema/effects/useInitValue';
import { PublicApi } from '@/services/api'; import { PublicApi } from '@/services/api';
const addSchemaAction = createFormActions(); const addSchemaAction = createFormActions();
const AddWarehouse: React.FC<{}> = (props: any) => { const AddWarehouse: React.FC<{}> = (props: any) => {
const ref = useRef({}); const { pageStatus, preview, id } = usePageStatus();
const [provinceList, setProvinceList] = useState([]); const initValue = useInitValue(PublicApi.getWarehouseWarehouseDetails);
const [cityList, setCityList] = useState([]);
const [areaList, setAreaList] = useState([]);
// 初始获取各省选项 // 获取手机code
useEffect(() => { const fetchTelCode = async () => {
getAddressList('province'); const { data } = await PublicApi.getManageGetTelCode();
}, []); return data;
const getAddressList = (type, id?) => {
PublicApi.getManageAreaByPcodeAll({ pcode: getCode(type, id) }).then(
res => {
let options = [];
for (let item of res.data) {
options.push({ label: item.name, value: item.id, code: item.code });
}
if (type === 'province') {
setProvinceList(options);
} else if (type === 'city') {
setCityList(options);
setAreaList([]);
} else {
setAreaList(options);
}
},
);
}; };
// 获取地区code,用于请求下级地区 const handleSubmit = value => {
const getCode = (type, id) => { if (pageStatus === 0)
let code = ''; return PublicApi.postWarehouseWarehouseAdd({ ...value }).then(res => {
if (type === 'province') return '100000'; if (res.code === 1000) return history.goBack();
if (type === 'city') {
provinceList.find(target => {
if (target.value === id) {
code = target.code;
}
}); });
} else { else
cityList.find(target => { return PublicApi.postWarehouseWarehouseUpdate({
if (target.value === id) { id: id,
code = target.code; ...value,
} }).then(res => {
if (res.code === 1000) return history.goBack();
}); });
}
return code;
};
const handleSubmit = value => {
console.log(value);
PublicApi.postWarehouseWarehouseAdd({ ...value }).then(res => {});
}; };
return ( return (
<PageHeaderWrapper <PageHeaderWrapper
onBack={() => history.goBack()} onBack={() => history.goBack()}
backIcon={<ReutrnEle description="返回" />} backIcon={<ReutrnEle description="返回" />}
title={ title={
usePageStatus().pageStatus === 0 pageStatus === 0
? '新建仓库' ? '新建仓库'
: usePageStatus().pageStatus === 1 : pageStatus === 1
? '编辑仓库' ? '编辑仓库'
: '查看仓库' : '查看仓库'
} }
extra={ extra={
usePageStatus().preview != '1' preview != '1'
? [ ? [
<Button <Button
key="1" key="1"
...@@ -97,73 +65,35 @@ const AddWarehouse: React.FC<{}> = (props: any) => { ...@@ -97,73 +65,35 @@ const AddWarehouse: React.FC<{}> = (props: any) => {
} }
> >
<Card> <Card>
<SchemaForm <NiceForm
editable={usePageStatus().preview != '1'} previewPlaceholder="loading..."
actions={addSchemaAction} editable={pageStatus !== PageStatus.PREVIEW}
components={{ Input, Select, Textarea: Input.TextArea }} effects={($, { setFieldState }) => {
onSubmit={value => handleSubmit(value)} $('onFormMount').subscribe(state => {
> PublicApi.getManageAreaAll().then(res => {
<FormMegaLayout labelCol={4} labelAlign="left" wrapperCol={12}> const { data } = res;
<Field name="name" title="仓库名称" x-component="Input" required /> setFieldState('provinceId', targetState => {
<FormMegaLayout label="仓库地址" wrapperCol={24} required> targetState.originData = data;
<FormMegaLayout grid full autoRow columns={3}> targetState.props.enum = data.map(v => ({
<Field label: v.name,
name="provinceId" value: v.id,
enum={provinceList} }));
x-component="Select" });
x-component-props={{ });
placeholder: '- 省 -', });
onChange: val => getAddressList('city', val), useLinkEnumEffect('areaResponses', result =>
}} result.map(v => ({
required label: v.name,
/> value: v.id,
<Field })),
name="cityId" );
enum={cityList} useAsyncSelect('telCode', fetchTelCode);
x-component="Select"
x-component-props={{
placeholder: '- 市 -',
onChange: val => getAddressList('area', val),
}}
required
/>
<Field
name="areaId"
enum={areaList}
x-component="Select"
x-component-props={{
placeholder: '- 县/区 -',
}}
required
/>
</FormMegaLayout>
<Field
name="address"
x-component="Textarea"
x-component-props={{
placeholder: '请输入详细地址(最长50个字符,25个汉字)',
rules: [{ message: '请输入详细地址' }],
}} }}
required initialValues={initValue}
/> onSubmit={handleSubmit}
</FormMegaLayout> actions={addSchemaAction}
<Field name="principal" title="仓库负责人" x-component="Input" /> schema={warehouseDetailSchema}
<FormMegaLayout label="联系电话" grid full wrapperCol={24}>
<Field
name="countryCode"
enum={['1', '2', '3', '4']}
x-component="Select"
x-component-props={{ placeholder: '请选择' }}
/>
<Field
x-mega-props={{ span: 3 }}
name="tel"
x-component="Input"
x-component-props={{ placeholder: '请输入你的手机号码' }}
/> />
</FormMegaLayout>
</FormMegaLayout>
</SchemaForm>
</Card> </Card>
</PageHeaderWrapper> </PageHeaderWrapper>
); );
......
...@@ -19,21 +19,12 @@ import { ColumnType } from 'antd/lib/table/interface'; ...@@ -19,21 +19,12 @@ import { ColumnType } from 'antd/lib/table/interface';
import style from './index.less'; import style from './index.less';
import { PublicApi } from '@/services/api'; import { PublicApi } from '@/services/api';
// 模拟请求
const fetchData = (params: any) => {
return new Promise((resolve, reject) => {
PublicApi.getWarehouseWarehouseList({
current: params.current,
pageSize: params.pageSize,
}).then(res => {
resolve(res.data);
});
});
};
const WareHouse: React.FC<{}> = () => { const WareHouse: React.FC<{}> = () => {
const ref = useRef({}); const ref = useRef<any>({});
const [searchName, setSearchName] = useState(''); const [searchKey, setSearchKey] = useState<any>({
name: '',
state: '',
});
const columns: ColumnType<any>[] = [ const columns: ColumnType<any>[] = [
{ {
...@@ -96,6 +87,8 @@ const WareHouse: React.FC<{}> = () => { ...@@ -96,6 +87,8 @@ const WareHouse: React.FC<{}> = () => {
align: 'center', align: 'center',
render: (text: any, record: any) => ( render: (text: any, record: any) => (
<> <>
{record.state != 1 ? (
<>
<Button <Button
type="link" type="link"
onClick={() => onClick={() =>
...@@ -115,22 +108,41 @@ const WareHouse: React.FC<{}> = () => { ...@@ -115,22 +108,41 @@ const WareHouse: React.FC<{}> = () => {
<Button type="link">删除</Button> <Button type="link">删除</Button>
</Popconfirm> </Popconfirm>
</> </>
) : (
''
)}
</>
), ),
}, },
]; ];
const handleReset = () => {}; // 模拟请求
const fetchData = (params: any) => {
return new Promise((resolve, reject) => {
PublicApi.getWarehouseWarehouseList({
...searchKey,
current: params.current,
pageSize: params.pageSize,
}).then(res => {
resolve(res.data);
});
});
};
const handleModify = (record: object) => { const handleModify = record => {
// 通过传入的params字符串判断是修改那种类型的数据 PublicApi.postWarehouseWarehouseStartRoStop({
console.log('执行状态修改', record); id: record.id,
state: record.state === 1 ? 0 : 1,
}).then(res => {
if (res.code === 1000) return ref.current.reload();
});
}; };
const handleDelete = record => { const handleDelete = record => {
PublicApi.getWarehouseInvoicesDetailsList({ PublicApi.postWarehouseWarehouseDelete({
invoicesId: record.id, id: record.id,
}).then(res => { }).then(res => {
// if(res.data.) if (res.code === 1000) return ref.current.reload();
}); });
}; };
...@@ -138,7 +150,18 @@ const WareHouse: React.FC<{}> = () => { ...@@ -138,7 +150,18 @@ const WareHouse: React.FC<{}> = () => {
<PageHeaderWrapper> <PageHeaderWrapper>
<Card> <Card>
<StandardTable <StandardTable
tableProps={{ rowKey: 'id' }} tableProps={{
rowKey: 'id',
onChange: (pagination, filters, sorter) => {
let state =
sorter.order === 'ascend'
? 1
: sorter.order === 'descend'
? 0
: '';
setSearchKey({ ...searchKey, state: state });
},
}}
columns={columns} columns={columns}
currentRef={ref} currentRef={ref}
fetchTableData={(params: any) => fetchData(params)} fetchTableData={(params: any) => fetchData(params)}
...@@ -171,12 +194,25 @@ const WareHouse: React.FC<{}> = () => { ...@@ -171,12 +194,25 @@ const WareHouse: React.FC<{}> = () => {
title={<span>输入仓库名称进行搜索</span>} title={<span>输入仓库名称进行搜索</span>}
> >
<Input.Search <Input.Search
value={searchName} value={searchKey.name}
placeholder="搜索" placeholder="搜索"
onChange={e => setSearchName(e.target.value)} onChange={e =>
setSearchKey({ ...searchKey, name: e.target.value })
}
onSearch={(val, e) => {
e.preventDefault();
ref.current.reload();
}}
/> />
</Tooltip> </Tooltip>
<Button onClick={() => handleReset()}>重置</Button> <Button
onClick={() => {
setSearchKey({ name: '', state: '' });
ref.current.reload();
}}
>
重置
</Button>
</Space> </Space>
</Col> </Col>
</Row> </Row>
......
import { ISchema } from '@formily/antd';
import { FORM_FILTER_PATH } from '@/formSchema/const';
export const warehouseSchema: ISchema = {
type: 'object',
properties: {
megaLayout: {
type: 'object',
'x-component': 'mega-layout',
properties: {
search: {
type: 'string',
'x-component': 'Search',
'x-mega-props': {},
'x-component-props': {
placeholder: '搜索',
},
},
[FORM_FILTER_PATH]: {
type: 'object',
'x-component': 'mega-layout',
visible: false,
'x-component-props': {
inline: true,
},
properties: {
invoicesNo: {
type: 'string',
'x-component-props': {
placeholder: '单据号',
},
},
invoicesAbstract: {
type: 'string',
'x-component-props': {
placeholder: '单据摘要',
},
},
memberName: {
type: 'string',
'x-component-props': {
placeholder: '会员名称',
},
},
orderNo: {
type: 'string',
'x-component-props': {
placeholder: '订单号',
},
},
invoicesType: {
type: 'string',
'x-component-props': {
placeholder: '请选择单据类型',
},
enum: [],
},
inventory: {
type: 'string',
'x-component-props': {
placeholder: '请选择对应仓库',
},
enum: [],
},
state: {
type: 'string',
'x-component-props': {
placeholder: '请选择单据状态',
},
enum: [],
},
time: {
type: 'string',
'x-component-props': {
placeholder: '请选择交易时间',
},
enum: [],
},
},
},
},
},
},
};
export const warehouseDetailSchema: ISchema = {
type: 'object',
properties: {
MEGA_LAYOUT: {
type: 'object',
'x-component': 'mega-layout',
'x-component-props': {
labelCol: 4,
wrapperCol: 12,
labelAlign: 'left',
},
properties: {
name: {
type: 'string',
title: '仓库名称',
'x-component-props': {
placeholder: '请输入',
},
required: true,
},
MEGA_LAYOUT1: {
type: 'object',
'x-component': 'mega-layout',
'x-component-props': {
label: '仓库名称',
wrapperCol: 24,
required: true,
},
properties: {
MEGA_LAYOUT1_1: {
type: 'object',
'x-component': 'mega-layout',
'x-component-props': {
grid: true,
full: true,
autoRow: true,
columns: 3,
},
properties: {
provinceId: {
type: 'string',
enum: [],
'x-component-props': {
placeholder: '- 省 -',
},
'x-linkages': [
{
type: 'value:linkage',
condition: '{{!!$value}}',
origin: 'provinceId',
target: 'cityId',
},
],
required: true,
},
cityId: {
type: 'string',
enum: [],
'x-component-props': {
placeholder: '- 市 -',
},
'x-linkages': [
{
type: 'value:linkage',
condition: '{{!!$value}}',
origin: 'cityId',
target: 'areaId',
},
],
required: true,
},
areaId: {
type: 'string',
enum: [],
'x-component-props': {
placeholder: '- 县 / 区 -',
},
required: true,
},
},
},
address: {
type: 'string',
'x-component': 'TextArea',
'x-component-props': {
placeholder: '请输入详细地址(最长50个字符,25个汉字)',
},
required: true,
},
},
},
principal: {
type: 'string',
title: '仓库负责人',
'x-component-props': {},
},
MEGA_LAYOUT2: {
type: 'object',
'x-component': 'mega-layout',
'x-component-props': {
label: '联系电话',
wrapperCol: 24,
},
properties: {
MEGA_LAYOUT2_1: {
type: 'object',
'x-component': 'mega-layout',
'x-component-props': {
grid: true,
full: true,
},
properties: {
telCode: {
type: 'string',
enum: [],
'x-component-props': {
placeholder: '',
},
},
tel: {
type: 'string',
'x-mega-props': { span: 3 },
'x-component-props': {
placeholder: '请输入你的手机号码',
maxLength: 11,
},
},
},
},
},
},
},
},
},
};
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