Commit bf756820 authored by XieZhiXiong's avatar XieZhiXiong
parents 931b7a51 27eac8db
......@@ -34,6 +34,7 @@ const config: any = {
['import', { libraryName: 'antd', libraryDirectory: 'es', style: true }, 'antd'],
['import', { libraryName: 'god', libraryDirectory: 'es', style: true }, 'god'],
['import', { libraryName: '@umijs/hooks', libraryDirectory: 'lib', camel2DashComponentName: false }, '@umijs/hooks'],// 将下划线转化关闭
isProduction && ['transform-remove-console', { "exclude": [ "error", "warn"] }], // 移除 console
],
history: {
type: 'browser', // 'brower' | 'hash'
......
......@@ -48,6 +48,7 @@
"@umijs/preset-react": "1.x",
"@umijs/test": "^3.2.0",
"antd-img-crop": "^3.12.0",
"babel-plugin-transform-remove-console": "^6.9.4",
"bizcharts": "^4.0.14",
"copy-to-clipboard": "^3.3.1",
"crypto-js": "^4.0.0",
......
......@@ -927,6 +927,11 @@ export enum SaleOrderInsideWorkState {
* 手工发货
*/
HAND_DELEVED_ORDER,
/**
* 不接受物流单
*/
NOT_ACCEPTED_DELIVERY,
}
// 支付外部状态
......@@ -1039,7 +1044,8 @@ export const SaleOrderInsideWorkStateTexts = {
24: '订单归档',
25: '待审核发货单',
26: '待确认物流单',
27: '待手工发货'
27: '待手工发货',
28: '不接受物流单',
}
// 订单流转记录外部状态
......
......@@ -33,7 +33,7 @@ interface AccountDetal {
const ItemRender: React.FC<Config> = (props) => {
const { isEdit, name, canEdit, value, image, changeEdit, pattern, message } = props;
const [validError, setValidError] = useState(false);
const [validError, setValidError] = useState(false);
// const [inputValue, setInputValue] = useState(value);
const handleClick = (name:string) => {
changeEdit(name, { isEdit: true }, 'change')
......@@ -55,7 +55,7 @@ const ItemRender: React.FC<Config> = (props) => {
// 确定提交
const handleConfirm = (name: string) => {
if(validError) {
return
return
}
changeEdit(name, { isEdit: false }, 'confirm');
}
......@@ -71,7 +71,7 @@ const ItemRender: React.FC<Config> = (props) => {
{isEdit ? <Input value={value} style={{width: '300px'}} onChange={(e) => handleChange(e.target.value, name)}/> : value}
</div>
{
canEdit
canEdit
? !isEdit
? <div className={styles.edit} style={{width: '300px'}} onClick={() => handleClick(name)} >
<FormOutlined />
......@@ -91,6 +91,12 @@ const ItemRender: React.FC<Config> = (props) => {
)
}
const PARAM_TO_TYPE = {
name: 1,
bankAccount: 2,
bankDeposit: 3,
}
const CorporateAccount = () => {
const [configs, setConfigs] = useState<Config[]>([]);
const [unsaved, setUnsaved] = useState<boolean>(false)
......@@ -115,17 +121,11 @@ const CorporateAccount = () => {
}
setConfigs(temp);
} else if(type == 'confirm') {
const postData = {
...datas,
[target.dataIndex]: target.value
}
console.log(postData);
///settle/accounts/corporate/account/update
PublicApi.postSettleAccountsCorporateAccountUpdate(postData)
PublicApi.postSettleAccountsCorporateAccountUpdateDetail({itemValue: target.value, itemType: PARAM_TO_TYPE[target.dataIndex]})
.then((data) => {
if(data.code == 1000) {
setUnsaved(false);
setDatas(postData);
// setDatas(postData);
temp[index] = {
...target,
...res,
......@@ -135,7 +135,7 @@ const CorporateAccount = () => {
}
})
}
}
useEffect(() => {
......@@ -193,11 +193,11 @@ const CorporateAccount = () => {
return (
<ItemRender key={item.name} {...item} changeEdit={changeEdit} />
)
})
})
}
<Prompt when={unsaved} message="信息还未保存,确定离开吗?"></Prompt>
</PageHeaderWrapper>
)
}
export default CorporateAccount
\ No newline at end of file
export default CorporateAccount
......@@ -22,3 +22,37 @@ export const SelectGoodsColumns: ColumnType<any>[] = [
dataIndex: 'brand',
}
]
export const ExternalListColumns: ColumnType<any>[] = [
{
title: '流转顺序号',
key: 'number',
dataIndex: 'number',
render:(text:any, record:any, index:number) => {return index + 1;}
},
{
title: '操作角色',
key: 'roleName',
dataIndex: 'roleName',
},
{
title: '状态',
key: 'status',
dataIndex: 'status',
},
{
title: '操作',
key: 'operationalProcess',
dataIndex: 'operationalProcess',
},
{
title: '操作时间',
key: 'brand',
dataIndex: 'brand',
},
{
title: '审核意见',
key: 'brand',
dataIndex: 'brand',
}
]
......@@ -8,7 +8,7 @@ import { PageHeaderWrapper } from '@ant-design/pro-layout';
import { LinkOutlined, PlusOutlined } from '@ant-design/icons';
import { PublicApi } from '@/services/api';
import ModalTable from '@/components/ModalTable';
import { SelectGoodsColumns } from './components/columns';
import { SelectGoodsColumns, ExternalListColumns } from './components/columns';
import { useRowSelectionTable } from '@/hooks/useRowSelectionTable';
import moment from 'moment';
import ModalTableOrder from './components/ModalTableOrder';
......@@ -201,12 +201,14 @@ const AddLogistics: React.FC<{}> = () => {
receiverName: res.data.receiveUserName,
receiverPhone: res.data.receiveUserTel,
receiverFullAddress: res.data.receiveAddress,
shipperAddressId: res.data.deliveryAddressId,
shipperFullAddress: res.data.deliveryAddress,
shipmentOrderCode: res.data.deliveryNo,
relevanceOrderCode: res.data.orderNo,
voucherTime: res.data.transactionTime,
externalState: res.data.state,
relevanceOrderCode: res.data.noticeNo,
shipmentOrderId: res.data.deliveryId,
relevanceOrderId: res.data.id,
voucherTime: res.data.createTime,
externalState: res.data.outerStatus,
}
form.setFieldsValue(obj);
setQuery({ ...obj })
......@@ -224,7 +226,7 @@ const AddLogistics: React.FC<{}> = () => {
voucherTime: res.data.applyTime,
relevanceOrderId: res.data.applyId,
externalState: res.data.state,
digest: res.data.applyAbstract
digest: res.data.applyAbstract,
}
form.setFieldsValue(obj);
setQuery({ ...obj })
......@@ -294,7 +296,9 @@ const AddLogistics: React.FC<{}> = () => {
externalState: res.data.status,
shipperAddressId: res.data.shipperAddressId,
shipperFullAddress: res.data.shipperFullAddress,
externalList: res.data.externalList
}
form.setFieldsValue(obj)
setQuery(obj)
setId(query.id)
setCreateType(res.data.createType)
......@@ -328,11 +332,12 @@ const AddLogistics: React.FC<{}> = () => {
case 1:
case 2:
case 3:
PublicApi.getWarehouseInvoicesProductList({ ...params, invoicesId: id }).then((res:any) => {
PublicApi.getWarehouseInvoicesProductList({ ...params, invoicesId: id }).then((res: any) => {
if (res.code === 1000) {
res.data.data.forEach(item => {
item.category = item.categoryName
item.brand = item.brandName
item.unit = item.unitName
})
resolve(res.data)
}
......@@ -375,7 +380,7 @@ const AddLogistics: React.FC<{}> = () => {
productName: item.productName,
categoryName: item.category,
brandName: item.brand,
unitName: item.unitName,
unitName: item.unit,
amount: item.amount,
carton: item.carton,
weight: item.weight,
......@@ -532,7 +537,10 @@ const AddLogistics: React.FC<{}> = () => {
/**打开选择商品 */
const handleVisible = () => {
console.log(query)
if(query.shipmentOrderId || query.relevanceOrderId) {
if (query.shipmentOrderCode || query.relevanceOrderCode) {
const list = [...detailList];
goodsRowCtl.setSelectRow(list)
goodsRowCtl.setSelectedRowKeys(list.map(v => v.productId));
setvisible(true)
} else {
message.error('请先选择要操作的对应发货单号或对应订单号/售后单')
......@@ -541,9 +549,11 @@ const AddLogistics: React.FC<{}> = () => {
/** 提交数据 */
const handleSubmit = async () => {
const basicRef = await form.validateFields().then(res => { return true }).catch(error => { return error });
const goodsRef = await goodsForm.validateFields().then(res => { return true }).catch(error => { return error });
const data = [...badge]
const params = { ...query };
const basicRef = await form.validateFields().then(res => { console.log(res); params.digest = res.digest; return true }).catch(error => { return error });
const goodsRef = await goodsForm.validateFields().then(res => { return true }).catch(error => { return error });
params.createType = createType;
if (basicRef.errorFields) {
data[0] = basicRef.errorFields.length;
setbadge(data);
......@@ -559,10 +569,9 @@ const AddLogistics: React.FC<{}> = () => {
setbadge(data)
const { pathname } = history.location;
const path = pathname.split('/')[pathname.split('/').length - 1];
const params = {...query};
params.detailList = detailList
if(path === 'edit') {
PublicApi.postLogisticsOrderWaitSubmitUpdate({...params }).then(res => {
if (path === 'edit') {
PublicApi.postLogisticsOrderWaitSubmitUpdate({ ...params }).then(res => {
if (res.code === 1000) {
history.goBack()
}
......@@ -588,7 +597,7 @@ const AddLogistics: React.FC<{}> = () => {
if (Object.keys(memberInfo).length > 0) {
PublicApi.getSettleAccountsPlatformConfigGetSettlementWay({ ...memberInfo }).then(res => {
if (res.code === 1000) {
const data = {...query}
const data = { ...query }
data.settlementWay = res.data;
setQuery(data)
}
......@@ -597,6 +606,44 @@ const AddLogistics: React.FC<{}> = () => {
})
}
}, [memberInfo])
/**跳转到售后/订单的详情 */
const jumpOrderDetail = (id: any) => {
switch (Number(createType)) {
case 1:
switch (Number(relevanceType)) {
case 1:
window.open(`/memberCenter/tranactionAbility/saleOrder/readyAddLogisticsOrder/preview?id=${id}`)
break;
case 2:
window.open(`/memberCenter/afterService/exchangeApplication/exchangePrAddLogistics/detail?id=${id}`)
break;
case 3:
window.open(`/memberCenter/afterService/exchangeManage/exchangePrAddLogistics/detail?id=${id}`)
break;
case 4:
window.open(`/memberCenter/afterService/returnApplication/returnPrAddLogistics/detail?id=${id}`)
break;
}
break;
case 2:
window.open(`/memberCenter/tranactionAbility/saleOrder/readyAddLogisticsOrder/preview?id=${id}`)
break;
case 3:
window.open(`/memberCenter/handling/confirm/pendingDelivered/detail?id=${id}`)
break;
case 4:
window.open(`/memberCenter/afterService/exchangeApplication/exchangePrAddLogistics/detail?id=${id}`)
break;
case 5:
window.open(`/memberCenter/afterService/exchangeManage/exchangePrAddLogistics/detail?id=${id}`)
break;
case 6:
window.open(`/memberCenter/afterService/returnApplication/returnPrAddLogistics/detail?id=${id}`)
break;
}
}
return (
<PageHeaderWrapper
onBack={() => history.goBack()}
......@@ -627,11 +674,13 @@ const AddLogistics: React.FC<{}> = () => {
<Form.Item label="物流单号" name='receiverName1'><span></span></Form.Item>
<Form.Item label='对应发货单号' name='shipmentOrderCode'>
<Search disabled={!!history.location.query.createType} readOnly value={Object.keys(query).length > 0 ? query.shipmentOrderCode : undefined} enterButton={<><LinkOutlined /> 选择</>} onSearch={() => setshippingvisible(true)} />
{query.shipmentOrderCode && <Button type='link'>查看单号详情</Button>}
{query.shipmentOrderCode && <Button type='link'
onClick={() => window.open(`/memberCenter/tranactionAbility/stockSellStorage/bills/detail?id=${query.shipmentOrderId}&preview=1`)}
>查看单号详情</Button>}
</Form.Item>
<Form.Item label='对应订单号/售后单' name='relevanceOrderCode'>
<Search disabled={!!history.location.query.createType} readOnly value={Object.keys(query).length > 0 ? query.relevanceOrderCode : undefined} enterButton={<><LinkOutlined /> 选择</>} onSearch={() => setinvoicesvisible(true)} />
{query.relevanceOrderCode && <Button type='link'>查看单号详情</Button>}
{query.relevanceOrderCode && <Button type='link' onClick={() => jumpOrderDetail(query.relevanceOrderId)}>查看单号详情</Button>}
</Form.Item>
<Form.Item label="收货方" name='receiverName'><span>{query.receiverName}/{query.receiverPhone}</span></Form.Item>
<Form.Item label="收货地址" name='receiverFullAddress'>
......@@ -674,7 +723,12 @@ const AddLogistics: React.FC<{}> = () => {
</Form>
</TabPane>
{/** 流转记录 */}
<TabPane key='tab-4' tab='流转记录' forceRender></TabPane>
<TabPane key='tab-4' tab='流转记录' forceRender>
<Table
columns={ExternalListColumns}
dataSource={query.externalList}
/>
</TabPane>
</Tabs>
</Card>
{/* 选择对应发货单 - createType === 1的时候才显示 */}
......
/*
* @Author: LeeJiancong
* @Date: 2020-07-30 17:23:48
* @LastEditors: LeeJiancong
* @LastEditTime: 2020-07-30 17:24:49
*/
export default {
default: {
padding: '2px 5px',
background: 'rgba(244,245,247,1)',
borderRadius: '4px'
},
confirm: {
color: '#3F7ED2',
padding: '2px 5px',
background: 'rgba(240, 248, 255, 1)',
borderRadius: '4px'
},
success: {
color: '#00B37A',
padding: '2px 5px',
background: 'rgba(235,247,242,1)',
borderRadius: '4px'
},
warn: {
color: '#E63F3B',
padding: '2px 5px',
background: 'rgba(255,235,230,1)',
borderRadius: '4px'
}
}
\ No newline at end of file
/*
* @Author: LeeJiancong
* @Date: 2020-07-30 17:23:48
* @LastEditors: LeeJiancong
* @LastEditTime: 2020-07-30 17:24:49
*/
export default {
default: {
padding: '2px 5px',
background: 'rgba(244,245,247,1)',
borderRadius: '4px'
},
confirm: {
color: '#3F7ED2',
padding: '2px 5px',
background: 'rgba(240, 248, 255, 1)',
borderRadius: '4px'
},
success: {
color: '#00B37A',
padding: '2px 5px',
background: 'rgba(235,247,242,1)',
borderRadius: '4px'
},
warn: {
color: '#E63F3B',
padding: '2px 5px',
background: 'rgba(255,235,230,1)',
borderRadius: '4px'
},
error: {
color: '#ff0404',
padding: '2px 5px',
background: 'rgba(247,235,235,1)',
borderRadius: '4px'
}
}
This diff is collapsed.
......@@ -174,7 +174,8 @@ const OrderList: React.FC<ListProps> = (props) => {
render: (text: any, reconds: any) => {
let component: ReactNode = null
if (text == 3) {
component = <><span style={statuStyle.success}>不接受物流单</span></>
//外部状态1-待提交2-待确认3-不接受物流单4-接受物流单
component = <><span style={statuStyle.error}>不接受物流单</span></>
} else if (text == 4) {
component = <><span style={statuStyle.warn}>接受物流单</span></>
} else if (text == 2) {
......@@ -194,7 +195,7 @@ const OrderList: React.FC<ListProps> = (props) => {
<>
{
(record.status === 1 || record.status === 4) &&
(record.status === 1 || record.status === 3) &&
<Button type="link" onClick={() => toEdit(record.id)}>编辑</Button>
}
......
......@@ -4,19 +4,20 @@
* @LastEditors: HJX
* @LastEditTime: 2020-11-19 15:25:54
*/
import React, { useState, useEffect} from 'react';
import React, { useState, useEffect } from 'react';
import { history } from 'umi';
import { Button, Card, Tabs, Space, Input } from 'antd';
import { PageHeaderWrapper } from '@ant-design/pro-layout';
import { PublicApi } from '@/services/api';
import PayWayRadio from './components/payWayRadio';
import PayWayTable from './components/payWayTable';
import { set } from 'mobx';
const { TabPane } = Tabs
const PayWaySetTemplate: React.FC<{}> = () => {
const [config, setconfig] = useState<any>([]);
const [payItem, setPayItem] = useState<any>([]);
const [step, setStep] = useState<Array<number>>([]);
const [obj, setObj] = useState<any>({});
const payWayConfigInfo = () => {
// 支付配置信息
return new Promise(resolve => {
......@@ -107,9 +108,9 @@ const PayWaySetTemplate: React.FC<{}> = () => {
setPayItem(data);
}
const onGet = (value:any, type:number, idx:number) => {
const onGet = (value: any, type: number, idx: number) => {
const data = [...payItem];
if(type === 1) {
if (type === 1) {
data[idx].payParametersAddListRequests = [...data[idx].payParametersAddListRequests, value]
} else {
data[idx].payParametersList.push(value)
......@@ -118,10 +119,10 @@ const PayWaySetTemplate: React.FC<{}> = () => {
}
/**删除 */
const onDel = (value:any, index:number, idx:number) => {
const onDel = (value: any, index: number, idx: number) => {
console.log(value, index, idx, 10086)
const data = [...payItem];
if(Number(value) === 1) {
if (Number(value) === 1) {
data[idx].payParametersAddListRequests.splice(index, 1);
data[idx].payParametersAddListRequests = [...data[idx].payParametersAddListRequests]
} else {
......@@ -131,14 +132,14 @@ const PayWaySetTemplate: React.FC<{}> = () => {
setPayItem([...data]);
}
/**编辑 */
const onEdit = (value:any, type:number, index:number, idx: number) => {
const onEdit = (value: any, type: number, index: number, idx: number) => {
console.log(value, type, index, idx)
const data = [...payItem];
if(type === 1) {
data[idx].payParametersAddListRequests[index] = {...value};
if (type === 1) {
data[idx].payParametersAddListRequests[index] = { ...value };
data[idx].payParametersAddListRequests = [...data[idx].payParametersAddListRequests]
} else {
data[idx].payParametersList[index] = {...value};
data[idx].payParametersList[index] = { ...value };
data[idx].payParametersList = [...data[idx].payParametersList]
}
console.log(data, 10086)
......@@ -150,12 +151,22 @@ const PayWaySetTemplate: React.FC<{}> = () => {
PublicApi.postPayMemberQueryPlatformUpdate({
platformPayWays: payItem
}).then(res => {
if(res.code === 1000) {
location.reload();
if (res.code === 1000) {
history.push('/memberCenter/payandSettle/paySetting/payParamsSetting')
// location.reload();
}
})
}
/** */
const handleBlur = (e, name, idx) => {
const data = [...payItem];
const assginObj = {...obj, ...{[name]: e.target.value}}
setObj(assginObj)
const arr: any[] = []
arr.push(assginObj)
data[idx].payParametersAddListRequests = [...arr]
}
return (
<PageHeaderWrapper
extra={<Button type='primary' onClick={onHnadleSubmit}>保存</Button>}
......@@ -189,16 +200,14 @@ const PayWaySetTemplate: React.FC<{}> = () => {
}
{
(payItem[idx].id === 6 && !!payItem[idx].isPitchOn) &&
payItem[idx].payParametersAddListRequests.map((item: any, index: number) => (
<div style={{ marginTop: 42 }} key={`space_${index}`}>
<Space direction="horizontal" size={16}>
初始申请额度不超过
<Input value={item.code} addonBefore="¥" />
允许满<Input value={item.value} />
天后申请上调<Input value={item.describe} addonAfter="%" />
</Space>
</div>
))
<div style={{ marginTop: 42 }}>
<Space direction="horizontal" size={16}>
初始申请额度不超过
<Input onChange={(e) => handleBlur(e, 'code', idx)} value={payItem[idx].payParametersAddListRequests.length > 0 ? payItem[idx].payParametersAddListRequests[0].code : undefined} addonBefore="¥" />
允许满<Input onChange={(e) => handleBlur(e, 'value', idx)} value={payItem[idx].payParametersAddListRequests.length > 0 ? payItem[idx].payParametersAddListRequests[0].value : undefined} />
天后申请上调<Input onChange={(e) => handleBlur(e, 'describe', idx)} value={payItem[idx].payParametersAddListRequests.length > 0 ? payItem[idx].payParametersAddListRequests[0].describe : undefined} addonAfter="%" />
</Space>
</div>
}
</>
......
......@@ -205,14 +205,15 @@ const CreateOrderElectronModal:React.FC<OrderElectronModalProps> = (props) => {
}
} else {
actions.setFieldState('usingElectronicContracts', state => {
state.value = 0
// state.value = 0
state.props["x-component-props"] = {
disabled: true
}
})
actions.setFieldValue('usingElectronicContracts', data.usingElectronicContracts || 0)
}
$('onFieldValueChange', 'contractTemplateId').subscribe(state => {
console.log(state.props)
// console.log(state.props)
})
// })
}}
......
......@@ -153,7 +153,6 @@ const OrderPayModal: React.FC<OrderPayModalProps> = (props) => {
if(qrCodeInfo.qrUrl) {
// @ts-ignore
PublicApi.getOrderPayResultsl({id, paymentInformationId: currentPayInfoId}).then(res => {
console.log(res)
if(res.code === 1000) {
if(res.data) {
setOpenTimer(0)
......@@ -170,14 +169,13 @@ const OrderPayModal: React.FC<OrderPayModalProps> = (props) => {
}
const handleConfirm = () => {
console.log(data,'data')
if (current === 0) {
if (checked.id) {
if (checked.id === 5) { // 线下支付
setCurrent(1)
setPayStep(1)
// 获取账户信息
PublicApi.getSettleAccountsCorporateAccountConfig({memberId: data.supplyMembersId}).then(res => {
// 获取对公账户信息
PublicApi.getSettleAccountsCorporateAccountConfig({memberId: data.supplyMembersId, memberRoleId: data.supplyMembersRoleId}).then(res => {
if(res.code === 1000) {
setBlankAccountInfo(res.data)
}
......@@ -261,7 +259,6 @@ const OrderPayModal: React.FC<OrderPayModalProps> = (props) => {
handleSubmitPay()
} else if (current === 2) {
// 开始提交授信支付数据 (需要输入支付密码)
console.log('开始提交授信支付数据', payPrice)
if(payPrice <= creditInfo.canUseQuota){
setPayStep(2)
setCurrent(1000)
......@@ -270,7 +267,6 @@ const OrderPayModal: React.FC<OrderPayModalProps> = (props) => {
}
} else if(current === 3) {
// 开始提交余额支付数据 (需要输入支付密码)
console.log('开始提交余额支付数据', payPrice)
if(payPrice <= balanceInfo){
setPayStep(2)
setCurrent(1000)
......@@ -279,7 +275,6 @@ const OrderPayModal: React.FC<OrderPayModalProps> = (props) => {
}
} else if(current === 5) {
// 开始提交货到付款数据
console.log('开始提交货到付款数据', payPrice)
handleSubmitPay()
}
......
......@@ -251,8 +251,9 @@ const PurchaseOrderDetail:React.FC<PurchaseOrderDetailProps> = (props) => {
history.goBack()
}, 1000)
// history.replace('/memberCenter/tranactionAbility/purchaseOrder/readyAddOrder')
} else {
setBtnLoading(false)
}
setBtnLoading(false)
} catch (error) {
setBtnLoading(false)
error?.message && message.error(error.message)
......
......@@ -87,6 +87,14 @@ export const usePaymentInfo = (ctx: ISchemaFormActions | ISchemaFormAsyncActions
if(options.filter(_item => _item.payType === 4).length)
options.filter(_item => _item.payType === 4)[0].disabled = false
}
// 多次支付也要禁用到付
if(ctx.getFieldValue('paymentInformationResponses').length > 1) {
if(options.filter(_item => _item.payType === 4).length)
options.filter(_item => _item.payType === 4)[0].disabled = true
} else {
if(options.filter(_item => _item.payType === 4).length)
options.filter(_item => _item.payType === 4)[0].disabled = false
}
}
}, [orderProducts, columns])
......
......@@ -66,6 +66,11 @@ export const useProductTable = (ctx: ISchemaFormActions | ISchemaFormAsyncAction
rowSelectionCtl.setSelectRow(newData)
rowSelectionCtl.setSelectedRowKeys(newData.map(v => v.id))
ctx.setFieldValue('orderProductRequests', newData)
// 商品行数变动 清空之前的支付信息
if (pageStatus === PageStatus.ADD) {
ctx.setFieldValue('paymentInformationResponses', [])
}
}
const [productColumns, setProductColumns] = useState(() => {
if (pageStatus === PageStatus.ADD) {
......
import React, { useState, useRef, useEffect } from 'react'
import styled from 'styled-components'
import { ISchemaFormProps, ISchemaFieldProps, ISchemaFieldComponentProps, createFormActions, useFieldState } from '@formily/antd'
import { Button, Space, Row, Col, Tag } from 'antd'
import { PlusOutlined, DeleteColumnOutlined, EditOutlined, DeleteOutlined, CaretUpOutlined, CaretDownOutlined, EyeOutlined } from '@ant-design/icons'
import cx from 'classnames'
import { PublicApi } from '@/services/api'
const SelectStyles = styled((props) => <div className='select-list' {...props}></div>)`
.select_style_border {
border: 1px solid #EEF0F3;
margin-top: 20px;
display: flex;
align-items: center;
justify-content: space-between;
padding: 8px 14px;
cursor: pointer;
line-height: 28px;
position:relative;
}
.select_style_border.active {
border: 1px solid #00B382;
}
.select_style_border.active::after {
content: '';
position: absolute;
width: 0;
height: 0;
border-bottom: 12px solid #00B37A;
border-left: 12px solid transparent;
bottom: 0;
right: 0;
z-index: 5;
}
`
enum ProcessTagColor {
'red',
'orange',
'purple',
'blue'
}
enum ProcessTagType {
'订单交易流程',
'售后换货流程',
'售后退货流程',
'售后维修流程'
}
const SelectProcesss = (props: ISchemaFieldComponentProps) => {
const [formInitValue, setFormInitValue] = useState<any>(null)
const [state, setFieldState] = useFieldState({
dataSource: [],
showMore: false
})
const { dataSource, showMore } = state
const { value, mutators, editable } = props
useEffect(() => {
PublicApi.getOrderTradingRulesTransactionProcessList().then(res => {
setFieldState({
dataSource: res.data,
showMore
})
})
}, [])
const showDataSource = showMore ? dataSource : [...dataSource].splice(0, 3)
const handleCheck = (id) => {
if (editable) {
mutators.change(id)
}
}
const toogleMore = () => {
setFieldState({
dataSource,
showMore: !showMore
})
}
const renderProcessType = (v: any) => {
return <Tag color={ProcessTagColor[v.type - 1]}>
{ProcessTagType[v.type - 1]}
</Tag>
}
return (
<div style={{ width: '100%' }}>
<SelectStyles>
{
showDataSource.map(v => <div key={v.id} onClick={() => handleCheck(v.id)} className={cx('select_style_border', value === v.id ? 'active' : '')}>
<div>
<Row style={{ color: '#303133' }}>
<Col>{v.name}</Col>
<Col style={{ marginLeft: 6 }}>
{
renderProcessType(v)
}
</Col>
</Row>
<div style={{ color: '#909399' }}>{v.explain}</div>
</div>
</div>)
}
</SelectStyles>
{dataSource.length > 3 &&
<div onClick={toogleMore} style={{ textAlign: 'center', cursor: 'pointer' }}>
显示更多{showMore ? <CaretDownOutlined /> : <CaretUpOutlined />}
</div>
}
</div>
)
}
SelectProcesss.defaultProps = {}
SelectProcesss.isFieldComponent = true;
export default SelectProcesss
\ No newline at end of file
import React, { useState, useRef, useEffect } from 'react'
import styled from 'styled-components'
import { ISchemaFormProps, ISchemaFieldProps, ISchemaFieldComponentProps, createFormActions, useFieldState } from '@formily/antd'
import { Button, Space, Row, Col, Tag } from 'antd'
import { PlusOutlined, DeleteColumnOutlined, EditOutlined, DeleteOutlined, CaretUpOutlined, CaretDownOutlined, EyeOutlined } from '@ant-design/icons'
import cx from 'classnames'
import { PublicApi } from '@/services/api'
const SelectStyles = styled((props) => <div className='select-list' {...props}></div>)`
.select_style_border {
border: 1px solid #EEF0F3;
margin-top: 20px;
display: flex;
align-items: center;
justify-content: space-between;
padding: 8px 14px;
cursor: pointer;
line-height: 28px;
position:relative;
}
.select_style_border.active {
border: 1px solid #00B382;
}
.select_style_border.active::after {
content: '';
position: absolute;
width: 0;
height: 0;
border-bottom: 12px solid #00B37A;
border-left: 12px solid transparent;
bottom: 0;
right: 0;
z-index: 5;
}
`
enum ProcessTagColor {
'red',
'orange',
'purple',
'blue',
'green'
}
enum ProcessTagType {
'订单交易流程',
'售后换货流程',
'售后退货流程',
'售后维修流程',
'加工生产流程'
}
const SelectProcesss = (props: ISchemaFieldComponentProps) => {
const [formInitValue, setFormInitValue] = useState<any>(null)
const [state, setFieldState] = useFieldState({
dataSource: [],
showMore: false
})
const { dataSource, showMore } = state
const { value, mutators, editable } = props
useEffect(() => {
PublicApi.getOrderTradingRulesTransactionProcessList().then(res => {
setFieldState({
dataSource: res.data,
showMore
})
})
}, [])
const showDataSource = showMore ? dataSource : [...dataSource].splice(0, 3)
const handleCheck = (id) => {
if (editable) {
mutators.change(id)
}
}
const toogleMore = () => {
setFieldState({
dataSource,
showMore: !showMore
})
}
const renderProcessType = (v: any) => {
return <Tag color={ProcessTagColor[v.type - 1]}>
{ProcessTagType[v.type - 1]}
</Tag>
}
return (
<div style={{ width: '100%' }}>
<SelectStyles>
{
showDataSource.map(v => <div key={v.id} onClick={() => handleCheck(v.id)} className={cx('select_style_border', value === v.id ? 'active' : '')}>
<div>
<Row style={{ color: '#303133' }}>
<Col>{v.name}</Col>
<Col style={{ marginLeft: 6 }}>
{
renderProcessType(v)
}
</Col>
</Row>
<div style={{ color: '#909399' }}>{v.explain}</div>
</div>
</div>)
}
</SelectStyles>
{dataSource.length > 3 &&
<div onClick={toogleMore} style={{ textAlign: 'center', cursor: 'pointer' }}>
显示更多{showMore ? <CaretDownOutlined /> : <CaretUpOutlined />}
</div>
}
</div>
)
}
SelectProcesss.defaultProps = {}
SelectProcesss.isFieldComponent = true;
export default SelectProcesss
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