Skip to content

J
jinfa-platform
Commit 832446b5 authored by XieZhiXiong's avatar XieZhiXiong
Browse files
Options

developing

parent 937eb628
Hide whitespace changes
Inline Side-by-side
Showing with 486 additions and 35 deletions
src/components/NiceForm/components/CustomRelevance.tsx
View file @ 832446b5
import React, { useState, useEffect } from 'react';
import { Input, Button } from 'antd';
import { Input, Button, message } from 'antd';
import { LinkOutlined } from '@ant-design/icons';
import styled from 'styled-components';
import { useRowSelectionTable } from '@/hooks/useRowSelectionTable';
......@@ -12,6 +12,7 @@ const RowStyleLayout = styled(props => <div {...props} />)`
border-color: #6b778c;
background-color: #6b778c;
border-radius: 0;
height: 100%;
}
.ant-input-group-addon {
......@@ -35,7 +36,8 @@ const Relevance = props => {
formilyProps,
tableProps = {},
fetchTableData,
title = '选择',
title = '选择',
tip = '', // 点击按钮前的提示，用于前提需要提示的场景
} = props.props['x-component-props'];
const tableRowKey = tableProps.rowKey || 'id';
......@@ -63,13 +65,21 @@ const Relevance = props => {
setVisible(false);
};
const handleModalVisible = () => {
if (!fetchTableData) {
message.warning(tip || '请传入 fetchTableData 属性，否则Table 将无法发起请求');
return;
}
setVisible(true);
};
return (
<RowStyleLayout>
<Input
value={
tableRowLableKey ?
value.map(item => item[tableRowLableKey]).join(',') :
'请指明 lableKey 值'
''
}
addonAfter={(
<>
......@@ -78,7 +88,7 @@ const Relevance = props => {
type="primary"
className="relevance"
icon={<LinkOutlined />}
onClick={() => setVisible(true)}
onClick={handleModalVisible}
block
>
{title}
......
src/constants/index.ts
View file @ 832446b5
......@@ -329,4 +329,14 @@ export const ORDER_TYPE2 = {
// 会员角色类型
export const MEMBER_ROLE_TYPE_SERVICE_PROVIDER = 1; // 服务提供者
export const MEMBER_ROLE_TYPE_SERVICE_CONSUMER = 2; // 服务消费者
\ No newline at end of file
export const MEMBER_ROLE_TYPE_SERVICE_CONSUMER = 2; // 服务消费者
// 单据类型
export const DOC_TYPE_PURCHASE_RECEIPT = 'S001'; // 采购入库单
export const DOC_TYPE_SALES_INVOICE = 'S002'; // 销售发货单
export const DOC_TYPE_PROCESS_RECEIPT = 'S003'; // 加工入库单
export const DOC_TYPE_PROCESS_INVOICE = 'S004'; // 加工发货单
export const DOC_TYPE_RETURN_INVOICE = 'S005'; // 退货发货单
export const DOC_TYPE_RETURN_RECEIPT = 'S006'; // 退货入库单
export const DOC_TYPE_EXCHANGE_INVOICE = 'S007'; // 换货发货单
export const DOC_TYPE_EXCHANGE_RECEIPT = 'S008'; // 换货入库单
\ No newline at end of file
src/pages/transaction/stockSellStorage/bills/addBills/effects/useBusinessEffects.ts
View file @ 832446b5
......@@ -2,7 +2,7 @@
* @Author: XieZhiXiong
* @Date: 2020-09-16 15:16:47
* @LastEditors: XieZhiXiong
* @LastEditTime: 2020-09-16 20:16:05
* @LastEditTime: 2020-09-17 21:17:00
* @Description: 联动逻辑相关
*/
import { FormEffectHooks, FormPath } from '@formily/antd';
......@@ -15,13 +15,22 @@ import {
DEPENDENT_DOC_RETURN,
DEPENDENT_DOC_PRODUCTION,
DEPENDENT_DOC_INTERNAL,
DOC_TYPE_PURCHASE_RECEIPT,
DOC_TYPE_SALES_INVOICE,
DOC_TYPE_PROCESS_RECEIPT,
DOC_TYPE_PROCESS_INVOICE,
DOC_TYPE_RETURN_INVOICE,
DOC_TYPE_RETURN_RECEIPT,
DOC_TYPE_EXCHANGE_INVOICE,
DOC_TYPE_EXCHANGE_RECEIPT,
} from '@/constants';
import Search from '@/components/NiceForm/components/Search';
import Submit from '@/components/NiceForm/components/Submit';
import DateSelect from '@/components/NiceForm/components/DateSelect';
import { FORM_FILTER_PATH } from '@/formSchema/const';
import { PublicApi } from '@/services/api';
import { orderBillSchema } from '../schema';
import { orderBillSchema, invoicesEnum } from '../schema';
import { a } from '@/pages/editor/configs/componentConfigs/HTML';
const {
......@@ -143,6 +152,7 @@ const fetchOrderList = async (params: any) => {
return [];
};
// 获取关联组件对应的 params
const getParams = type => {
const params = {
modalProps: {
......@@ -217,9 +227,75 @@ const getParams = type => {
return params;
};
const freeEnumItem = (data: {[key: string]: any}[], keyName: string, value: any) => {
if (!Array.isArray(data)) {
return;
}
data.forEach(item => {
if (item[keyName] === value) {
item.disabled = false;
} else {
item.disabled = true;
}
});
};
export const useBusinessEffects = (context, actions) => {
const { getFieldValue, setFieldValue } = actions;
const {
getFieldValue,
setFieldValue,
getFieldState,
setFieldState,
} = actions;
const linkage = useLinkageUtils();
// 根据 单据类型 联动 对应单据所选项
onFieldValueChange$('invoicesTypeId').subscribe(fieldState => {
const origin = fieldState.originAsyncData;
const current = origin.find(item => item.id === fieldState.value);
const newEnum = [...getFieldState('relevanceInvoices', state => state.props.enum)];
if (!current) {
return;
}
switch (current.number) {
// 采购入库单、销售发货单只能选择 订单
case DOC_TYPE_PURCHASE_RECEIPT:
case DOC_TYPE_SALES_INVOICE: {
freeEnumItem(newEnum, 'value', DEPENDENT_DOC_ORDER);
break;
}
// 加工入库单、加工发货单只能选择 生产通知单
case DOC_TYPE_PROCESS_RECEIPT:
case DOC_TYPE_PROCESS_INVOICE: {
freeEnumItem(newEnum, 'value', DEPENDENT_DOC_PRODUCTION);
break;
}
// 退货发货单、退货入库单只能选择 退货申请单
case DOC_TYPE_RETURN_INVOICE:
case DOC_TYPE_RETURN_RECEIPT: {
freeEnumItem(newEnum, 'value', DEPENDENT_DOC_RETURN);
break;
}
// 换货发货单、换货入库单只能选择 换货申请单
case DOC_TYPE_EXCHANGE_INVOICE:
case DOC_TYPE_EXCHANGE_RECEIPT: {
freeEnumItem(newEnum, 'value', DEPENDENT_DOC_EXCHANGE);
break;
}
default: {
freeEnumItem(newEnum, 'value', DEPENDENT_DOC_INTERNAL);
break;
}
}
linkage.value('relevanceInvoices', undefined);
linkage.enum('relevanceInvoices', newEnum);
});
onFieldInputChange$('inventoryId').subscribe(fieldState => {
const current = fieldState.originAsyncData.find(item => item.id === fieldState.value);
......@@ -228,15 +304,16 @@ export const useBusinessEffects = (context, actions) => {
}
});
// 对应单据改变
onFieldValueChange$('relevanceInvoices').subscribe(fieldState => {
const params = getParams(fieldState.value);
linkage.componentProps('relevanceInvoicesId', params);
});
// 关联单据改变
onFieldValueChange$('relevanceInvoicesId').subscribe(fieldState => {
console.log('fieldState.value', fieldState.value)
const relevanceInvoicesVal = getFieldValue('relevanceInvoices');
const first = fieldState.value[0];
const first = fieldState.value && fieldState.value[0];
if (!first) {
return;
......@@ -247,6 +324,22 @@ export const useBusinessEffects = (context, actions) => {
setFieldValue('memberName', first.supplyMembersName);
setFieldValue('address', '暂无收货地址');
setFieldValue('transport', '暂无物流方式');
// 根据选择的订单查询 订单对应的商品，并给 Table 的商品下拉框赋值
PublicApi.getOrderProcurementOrderProductList({
id: first.id,
}).then(res => {
if (res.code === 1000) {
const goodOptions = res.data.map(item => ({
label: `${item.productId}/${item.productName}/￥${item.price}`,
value: item.id,
}));
setFieldState('applyMember.*.good', state => {
FormPath.setIn(state, 'originAsyncData', res.data);
FormPath.setIn(state, 'props.enum', goodOptions);
});
}
});
break;
}
......@@ -278,4 +371,31 @@ export const useBusinessEffects = (context, actions) => {
break;
}
});
// 关联明细 商品下拉框 联动商品ID、单价
onFieldInputChange$('applyMember.*.good').subscribe(fieldState => {
const { name, originAsyncData, value } = fieldState;
const current = originAsyncData.find(item => item.id === value);
if (!current) {
return;
}
setFieldState(
FormPath.transform(name, /\d/, $1 => {
return `applyMember.${$1}.goodId`
}),
state => {
state.value = current.productId;
}
);
setFieldState(
FormPath.transform(name, /\d/, $1 => {
return `applyMember.${$1}.price`
}),
state => {
state.value = `￥${current.price}`;
}
);
});
}
\ No newline at end of file
src/pages/transaction/stockSellStorage/bills/addBills/index.tsx
View file @ 832446b5
import React, { useState, useEffect, useRef } from 'react';
import { usePageStatus } from '@/hooks/usePageStatus';
import { Button, Card, message } from 'antd';
import { Radio, ArrayTable } from '@formily/antd-components';
import { history } from 'umi';
import { usePageStatus } from '@/hooks/usePageStatus';
import { PageHeaderWrapper } from '@ant-design/pro-layout';
import { SaveOutlined, PlusOutlined } from '@ant-design/icons';
import { createFormActions, FormEffectHooks } from '@formily/antd';
import { Button, Card } from 'antd';
import { useRowSelectionTable } from '@/hooks/useRowSelectionTable';
import { PublicApi } from '@/services/api';
import ReutrnEle from '@/components/ReturnEle';
import NiceForm from '@/components/NiceForm';
import { getBillsDetailSchema, orderBillSchema } from './schema';
import ModalTable from '@/components/ModalTable';
import Search from '@/components/NiceForm/components/Search';
import Submit from '@/components/NiceForm/components/Submit';
import { useStateFilterSearchLinkageEffect } from '@/formSchema/effects/useFilterSearch';
import { FORM_FILTER_PATH } from '@/formSchema/const';
import { useAsyncSelect } from '@/formSchema/effects/useAsyncSelect';
import { getBillsDetailSchema, goodsSearchSchema } from './schema';
import { createEffects } from './effects';
const addSchemaAction = createFormActions();
......@@ -24,6 +33,9 @@ const AddBills: React.FC<{}> = (props: any) => {
const [modalColumns, setModalColumns] = useState([]);
const [visible, setVisible] = useState(false);
const [productRowSelection, productRowCtl] = useRowSelectionTable({ type: 'checkbox' });
const tableColumns = [
{ dataIndex: 'id', title: 'ID' },
{
......@@ -51,8 +63,67 @@ const AddBills: React.FC<{}> = (props: any) => {
},
];
const goodsColumns: any[] = [
{
title: '货号',
dataIndex: 'id',
align: 'center',
render: (_, record) => record.code,
},
{
title: '货品名称',
dataIndex: 'name',
align: 'center',
},
{
title: '规格型号',
dataIndex: 'type',
align: 'center',
},
{
title: '品类',
dataIndex: ['customerCategory', 'name'],
align: 'center',
},
{
title: '品牌',
dataIndex: ['brand', 'name'],
align: 'center',
},
]
// 获取品牌
const fetchBrand = async () => {
const res = await PublicApi.getProductSelectGetSelectBrand({
name: '',
});
if (res.code === 1000) {
return res.data;
}
return [];
}
// 获取会员品类
const fetchCustomerCategory = async () => {
const res = await PublicApi.getProductSelectGetSelectCustomerCategory({
name: '',
});
if (res.code === 1000) {
return res.data;
}
return [];
}
// 弹出单据明细
const handleAddMemberBtn = () => {};
const handleAdd = () => {
const relevanceInvoicesIdVal = addSchemaAction.getFieldValue('relevanceInvoicesId');
console.log('relevanceInvoicesIdVal', relevanceInvoicesIdVal);
if (!relevanceInvoicesIdVal) {
message.warning('请选择对应单据');
return;
}
setVisible(true);
};
// 删除选中单据明细
const handleDeleteTable = id => {};
......@@ -62,7 +133,7 @@ const AddBills: React.FC<{}> = (props: any) => {
style={{ marginBottom: 16 }}
block
icon={<PlusOutlined />}
onClick={handleAddMemberBtn}
onClick={handleAdd}
type="dashed"
>
添加单据明细
......@@ -87,6 +158,37 @@ const AddBills: React.FC<{}> = (props: any) => {
});
};
// 选择单据明细
const handleOkAddProduct = async () => {
console.log('productRowCtl.selectRow', productRowCtl.selectRow)
const values = productRowCtl.selectRow.map(item => ({
code: item.code,
name: item.name,
type: item.type,
category: item.customerCategory.name,
brand: item.brand.name,
unitName: item.unitName,
costPrice: `￥${item.costPrice}`,
good: undefined,
goodId: '',
price: '',
quantity: '',
amount: '',
}));
addSchemaAction.setFieldValue('applyMember', values);
setVisible(false);
}
const fetchProductList = async (params) => {
const res = await PublicApi.getProductGoodsGetGoodsList({
...params,
})
if (res.code === 1000) {
return res.data
}
return [];
}
return (
<PageHeaderWrapper
onBack={() => history.goBack()}
......@@ -119,6 +221,10 @@ const AddBills: React.FC<{}> = (props: any) => {
tableColumns,
tableAddButton,
}}
components={{
RadioGroup: Radio.Group,
ArrayTable,
}}
effects={($, actions) => createEffects($, actions)}
onSubmit={handleSubmit}
actions={addSchemaAction}
......@@ -128,6 +234,41 @@ const AddBills: React.FC<{}> = (props: any) => {
})}
/>
</Card>
<ModalTable
modalTitle='选择货品'
confirm={handleOkAddProduct}
cancel={() => setVisible(false)}
visible={visible}
columns={goodsColumns}
rowSelection={productRowSelection}
fetchTableData={params => fetchProductList(params)}
formilyProps={
{
ctx: {
schema: goodsSearchSchema,
components: {
Search,
Submit,
} ,
effects: ($, actions) => {
useStateFilterSearchLinkageEffect(
$,
actions,
'name',
FORM_FILTER_PATH,
);
useAsyncSelect('brandId', fetchBrand, ['name', 'id']);
useAsyncSelect('customerCategoryId', fetchCustomerCategory, ['name', 'id']);
},
inline: false,
}
}
}
tableProps={{
rowKey: 'id',
}}
/>
</PageHeaderWrapper>
);
};
......
src/pages/transaction/stockSellStorage/bills/addBills/schema/index.ts
View file @ 832446b5
......@@ -273,17 +273,41 @@ export const getBillsDetailSchema = params => {
required: true,
},
relevanceInvoices: {
type: 'radio',
title: '对应单据',
required: true,
type: 'string',
'x-rules': [
{
required: true,
message: '请选择对应单据',
},
],
enum: [
{ label: '订单', value: DEPENDENT_DOC_ORDER },
{ label: '换货申请单', value: DEPENDENT_DOC_EXCHANGE },
{ label: '退货申请单', value: DEPENDENT_DOC_RETURN },
{ label: '生产通知单', value: DEPENDENT_DOC_PRODUCTION },
{ label: '内部单据', value: DEPENDENT_DOC_INTERNAL },
{
label: '订单',
value: DEPENDENT_DOC_ORDER,
disabled: true,
},
{
label: '换货申请单',
value: DEPENDENT_DOC_EXCHANGE,
disabled: true,
},
{
label: '退货申请单',
value: DEPENDENT_DOC_RETURN,
disabled: true,
},
{
label: '生产通知单',
value: DEPENDENT_DOC_PRODUCTION,
disabled: true,
},
{
label: '内部单据',
value: DEPENDENT_DOC_INTERNAL,
disabled: true,
},
],
default: 1,
},
// 这是用 Mega-Layout 设置独立作用域，不然会被 Form 的布局影响到弹窗的布局
MEGA_LAYOUT1_1: {
......@@ -299,6 +323,7 @@ export const getBillsDetailSchema = params => {
'x-component': 'CustomRelevance',
'x-component-props': {
title: '关联',
tip: '请选择对应单据',
},
'x-mega-props': {
wrapperCol: 12,
......@@ -349,18 +374,89 @@ export const getBillsDetailSchema = params => {
labelAlign: 'left',
},
properties: {
addBtn: {
type: 'object',
'x-component': 'Children',
'x-component-props': {
children: '{{tableAddButton}}'
},
},
applyMember: {
type: 'array:number',
'x-component': 'MultTable',
type: 'array',
'x-component': 'ArrayTable',
'x-component-props': {
rowKey: 'memberId',
columns: '{{tableColumns}}',
prefix: '{{tableAddButton}}',
renderAddition: () => null,
},
default: [
{ id: 1, name: '名称', type: '类型' },
{ id: 2, name: '名称1', type: '类型1' },
],
items: {
type: 'object',
properties: {
code: {
type: 'string',
title: '货号',
'x-component': 'Text',
},
name: {
type: 'string',
title: '货品名称',
'x-component': 'Text',
},
type: {
type: 'string',
title: '规格型号',
'x-component': 'Text',
},
category: {
type: 'string',
title: '品类',
'x-component': 'Text',
},
brand: {
type: 'string',
title: '品牌',
'x-component': 'Text',
},
unitName: {
type: 'string',
title: '单位',
'x-component': 'Text',
},
costPrice: {
type: 'string',
title: '成本价',
'x-component': 'Text',
},
good: {
type: 'string',
title: '商品名称',
enum: [],
'x-component-props': {
allowClear: true,
},
},
goodId: {
type: 'string',
title: '商品ID',
'x-component': 'Text',
},
price: {
type: 'string',
title: '单价',
'x-component': 'Text',
},
quantity: {
type: 'string',
title: '单据数量',
'x-component-props': {
allowClear: true,
},
},
amount: {
type: 'string',
title: '金额',
'x-component': 'Text',
},
},
}
},
},
},
......@@ -459,4 +555,76 @@ export const orderBillSchema: ISchema = {
},
},
},
};
\ No newline at end of file
};
export const goodsSearchSchema: ISchema = {
type: 'object',
properties: {
megaLayout: {
type: 'object',
'x-component': 'Mega-Layout',
properties: {
name: {
type: 'string',
'x-component': 'Search',
'x-mega-props': {},
'x-component-props': {
placeholder: '搜索',
align: 'flex-start',
},
},
[FORM_FILTER_PATH]: {
type: 'object',
'x-component': 'Mega-Layout',
'x-component-props': {
grid: true,
full: true,
autoRow: true,
columns: 3,
},
properties: {
code: {
type: 'string',
'x-component-props': {
placeholder: '货号',
allowClear: true,
},
},
orderThe: {
type: 'string',
'x-component-props': {
placeholder: '规格型号',
allowClear: true,
},
},
customerCategoryId: {
type: 'string',
'x-component-props': {
placeholder: '品类',
allowClear: true,
},
},
brandId: {
type: 'string',
enum: [],
'x-component-props': {
placeholder: '品牌',
allowClear: true,
},
},
submit: {
'x-component': 'Submit',
'x-mega-props': {
span: 1,
},
'x-component-props': {
children: '查询',
}
}
},
},
},
},
},
}
\ No newline at end of file
src/pages/transaction/stockSellStorage/billsType/index.tsx
View file @ 832446b5
......@@ -63,6 +63,7 @@ const billsType: React.FC<{}> = () => {
sorter: (a, b) => a.state - b.state,
render: (text: any, record: any) => (
<StatusSwitch
fieldNames="state"
handleConfirm={() => handleModify(record)}
record={record}
/>
......
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