Commit b0008c71 authored by 前端-黄佳鑫's avatar 前端-黄佳鑫

feat: 请款单流程接口接入

parent f93120a6
......@@ -19,21 +19,21 @@
// ]
// 0418 token
module.exports = [
{ name: 'LogisticsV2', token: '5b6895dc979cdfab94633c2e4560a93447433a9d6fd21a104cc7172de4a4ca37', categoryIds: [0], }, // 物流能力v2
{ name: 'ProductV2', token: 'f29e9838081cc781c714c9097e1c2d97710f089d1d63a165558f21d2061a2404', categoryIds: [0], }, // 商品服务V2
{ name: 'TemplateV2', token: '3ec622ca65837d19c73a0ccca73da613b9aa1895f4f9143bf3eb98c8f605e66e', categoryIds: [0], }, // 页面模板服务V2
{ name: 'PayV2', token: 'ed541f0943fbc761e47c5d413a7776186bf67c43f99d1e91214ae122cee465c0', categoryIds: [0], }, // 支付服务
{ name: 'SearchV2', token: 'b0423596740a30283a6b70343800e2e174a6560a127232194771573848f67163', categoryIds: [0], }, // 搜索服务V2
{ name: 'PurchaseV2', token: 'c8b34b7cf918b96f849df658601f3d845b0c6a265de64337d8a908bbc633470d', categoryIds: [0] }, // 采购服务V2
{ name: 'SettleV2', token: '47a1140c81879627e572bc52110ee0adcdc78c643a64f71c372effb35a026188', categoryIds: [0] }, // 结算服务v2
{ name: 'TransactionV2', token: 'd2c967e2d0ee89056d3ff01ba9e95c0444e53a3080ca6c4f0115e0cebc9dc76b', categoryIds: [0] }, // 交易服务V2
{ name: 'ContractV2', token: 'd8193b85000801f3a193c2f29b85914ade3ba3d5da2edac400e17f8938ddd70f', categoryIds: [0] }, // 合同能力V2
{ name: 'OrderNewV2', token: '8bdfa25f6af5ded9d4dbdbcbf46b4ab152171330a47b32eee3743a192192a165', categoryIds: [0], }, //订单服务V2 New
{ name: 'MemberV2', token: '7f9275059dca64485b5a21e0eb6f5cd0dddc9e30c5b03059471403fc5de82413', categoryIds: [0]}, //会员服务 V2
{ name: 'ReportV2', token: 'e8cbde5466eed9b42f6cf96970ca7fbf8c7c426b428ac1afe73e7e43ae90e445', categoryIds: [0]}, // 报表服务v2 首页
{ name: 'EnhanceV2', token: '7522ffe44cc00a0f3a1223a80113e7913293c00121f9106bcc22dcd3fc0ab380', categoryIds: [0], }, // 加工服务v2
{ name: 'MessageV2', token: '6dd48310418fa369d74b9d197e01b210703301060ae0fe11837e4f70a1278bd3', categoryIds: [0], }, // 消息中心v2
{ name: 'MarketingV2', token: 'da33eca17ea2afd5dd5416f5ea5a5e45b481d1484518cd8fcad20c4289d0109b', categoryIds: [0], }, // 营销能力
{ name: 'LogisticsV2', token: '5b6895dc979cdfab94633c2e4560a93447433a9d6fd21a104cc7172de4a4ca37', categoryIds: [0], }, // 物流能力v2
{ name: 'ProductV2', token: 'f29e9838081cc781c714c9097e1c2d97710f089d1d63a165558f21d2061a2404', categoryIds: [0], }, // 商品服务V2
{ name: 'TemplateV2', token: '3ec622ca65837d19c73a0ccca73da613b9aa1895f4f9143bf3eb98c8f605e66e', categoryIds: [0], }, // 页面模板服务V2
{ name: 'PayV2', token: 'ed541f0943fbc761e47c5d413a7776186bf67c43f99d1e91214ae122cee465c0', categoryIds: [0], }, // 支付服务
{ name: 'SearchV2', token: 'b0423596740a30283a6b70343800e2e174a6560a127232194771573848f67163', categoryIds: [0], }, // 搜索服务V2
{ name: 'PurchaseV2', token: 'c8b34b7cf918b96f849df658601f3d845b0c6a265de64337d8a908bbc633470d', categoryIds: [0] }, // 采购服务V2
{ name: 'SettleV2', token: '6f7d802cb60ffe7eae5e199db8b70a8ec9f26837ec56b578a747520054be0a42', categoryIds: [0] }, // 结算服务v2-220518
{ name: 'TransactionV2', token: 'd2c967e2d0ee89056d3ff01ba9e95c0444e53a3080ca6c4f0115e0cebc9dc76b', categoryIds: [0] }, // 交易服务V2
{ name: 'ContractV2', token: 'd8193b85000801f3a193c2f29b85914ade3ba3d5da2edac400e17f8938ddd70f', categoryIds: [0] }, // 合同能力V2
{ name: 'OrderNewV2', token: '8bdfa25f6af5ded9d4dbdbcbf46b4ab152171330a47b32eee3743a192192a165', categoryIds: [0], }, // 订单服务V2 New
{ name: 'MemberV2', token: '7f9275059dca64485b5a21e0eb6f5cd0dddc9e30c5b03059471403fc5de82413', categoryIds: [0]}, // 会员服务 V2
{ name: 'ReportV2', token: 'e8cbde5466eed9b42f6cf96970ca7fbf8c7c426b428ac1afe73e7e43ae90e445', categoryIds: [0]}, // 报表服务v2 首页
{ name: 'EnhanceV2', token: '7522ffe44cc00a0f3a1223a80113e7913293c00121f9106bcc22dcd3fc0ab380', categoryIds: [0], }, // 加工服务v2
{ name: 'MessageV2', token: '6dd48310418fa369d74b9d197e01b210703301060ae0fe11837e4f70a1278bd3', categoryIds: [0], }, // 消息中心v2
{ name: 'MarketingV2', token: 'da33eca17ea2afd5dd5416f5ea5a5e45b481d1484518cd8fcad20c4289d0109b', categoryIds: [0], }, // 营销能力
{ name: 'AfterServiceV2', token: '7d8ead30acaa11c08921837d2bb5b507c9f8b8cdf795b15b47239ed1d8f79892', categoryIds: [0], }, // 售后能力V2
{ name: 'ManageV2', token: '0c0eb3719da2751a0acf843f5416ca950115f524013ec6a2e163e55c754b4518', categoryIds: [0] }, // 平台后台v2
{ name: 'ManageV2', token: '0c0eb3719da2751a0acf843f5416ca950115f524013ec6a2e163e55c754b4518', categoryIds: [0] }, // 平台后台v2
]
......@@ -183,14 +183,30 @@ const AuthConfigRoute: RouterChild = {
noMargin: true,
},
{
// 编辑请款单流程规则
path: '/memberCenter/systemSetting/processManagement/invoiceProcessEng/edit',
name: '编辑请款单流程规则',
component: '@/pages/systemSetting/processEng/invoiceProcessEng/add',
hideInMenu: true,
noMargin: true,
},
{
// 请款单流程规则详情
path: '/memberCenter/systemSetting/processManagement/invoiceProcessEng/preview',
name: '请款单流程规则详情',
component: '@/pages/systemSetting/processEng/invoiceProcessEng/add',
hideInMenu: true,
noMargin: true,
},
{
/** 请购单流程规则配置列表 */
path: '/memberCenter/systemSetting/processEng/buyingRequisitionProcess',
path: '/memberCenter/systemSetting/processManagement/buyingRequisitionProcess',
name: '请购单流程规则配置',
component: '@/pages/systemSetting/processEng/buyingRequisitionProcess'
},
{
/** 查看请购单流程规则配置 */
path: '/memberCenter/systemSetting/processEng/buyingRequisitionProcess/detail',
path: '/memberCenter/systemSetting/processManagement/buyingRequisitionProcess/detail',
name: '查看请购单流程规则配置',
component: '@/pages/systemSetting/processEng/buyingRequisitionProcess/detail',
hideInMenu: true,
......@@ -198,7 +214,7 @@ const AuthConfigRoute: RouterChild = {
},
{
/** 新增请购单流程规则配置 */
path: '/memberCenter/systemSetting/processEng/buyingRequisitionProcess/add',
path: '/memberCenter/systemSetting/processManagement/buyingRequisitionProcess/add',
name: '新增请购单流程规则配置',
component: '@/pages/systemSetting/processEng/buyingRequisitionProcess/add',
hideInMenu: true,
......@@ -206,7 +222,7 @@ const AuthConfigRoute: RouterChild = {
},
{
/** 编辑请购单流程规则配置 */
path: '/memberCenter/systemSetting/processEng/buyingRequisitionProcess/edit',
path: '/memberCenter/systemSetting/processManagement/buyingRequisitionProcess/edit',
name: '编辑请购单流程规则配置',
component: '@/pages/systemSetting/processEng/buyingRequisitionProcess/edit',
hideInMenu: true,
......
......@@ -26,8 +26,7 @@ import ProcurementRoute from './procurementRoute';
// import contracRoute from './contracRoute';
// export const routes = [CommodityRoute, MemberRoute, ShopRoute, ChannelRoute, TranactionRoute, AfterService, PayandSettleRoute, LogisticsRoute, AuthConfigRoute, HandlingRoute, BalaceRoute]
// const isDev = process.env.NODE_ENV === 'development'
const isDev = false
const isDev = process.env.NODE_ENV === 'development'
const homeRoute = {
path: `/memberCenter/home`,
......
......@@ -3,8 +3,8 @@ import { ColumnType } from 'antd/lib/table/interface';
/** 流程规则ID */
export const id: ColumnType<any> = {
title: '流程规则ID',
key: 'id',
dataIndex: 'id',
key: 'processId',
dataIndex: 'processId',
}
/** 流程规则名称 */
......
import React, { Fragment, useState } from 'react';
import React, { Fragment, useEffect, useState } from 'react';
import PeripheralLayout from '@/pages/transaction/components/detailLayout';
import { Button, Form } from 'antd';
import { Button, Form, message } from 'antd';
import { SaveOutlined } from '@ant-design/icons';
import ProcessEngLayout from './components/processEng';
import ProcessSelectLayout from './components/processSelect';
import InvoiceTypeLayout from './components/invoiceType';
import { getColor } from '@/components/FormProgress';
import { getSettleAccountsApplyAmountProcessGetInfo, postSettleAccountsApplyAmountProcessSave, postSettleAccountsApplyAmountProcessUpdate } from '@/services/SettleV2Api';
import { history } from 'umi';
export const layout: any = {
colon: false,
......@@ -26,10 +28,14 @@ const progress = {
}
const AddInvoiceProcessEng: React.FC<{}> = () => {
const [form] = Form.useForm();
const { query: { processId }, pathname } = history.location;
const [path] = useState(pathname.split('/')[pathname.split('/').length - 1]);
const [percent, setPercent] = useState<number>(0);
const [loading, setLoading] = useState<boolean>(false);
/**计算输入框输入了百分之多少 */
const onFieldsChange = (allValues) => {
const onFieldsChange = () => {
const allValues = form.getFieldsValue();
const values = Object.values(allValues);
let num = 0;
values.forEach(_item => {
......@@ -40,6 +46,44 @@ const AddInvoiceProcessEng: React.FC<{}> = () => {
setPercent(Number(((num / values.length) * 100)))
}
const handleSubmit = () => {
let fetchApi = (path === 'edit' ? postSettleAccountsApplyAmountProcessUpdate : postSettleAccountsApplyAmountProcessSave)
form.validateFields().then(values => {
setLoading(true)
const params = {
...values,
}
path === 'edit' && (params.processId = processId)
fetchApi({ ...params }).then(res => {
if (res.code !== 1000) {
setLoading(false)
return
}
history.goBack()
})
})
}
useEffect(() => {
if (processId) {
getSettleAccountsApplyAmountProcessGetInfo({ processId: processId.toString() }).then(res => {
if (res.code !== 1000) {
message.error(res.message)
return
}
const { data } = res
console.log(data, 'data')
form.setFieldsValue({
'name': data.name,
'baseProcessId': data.baseProcessId,
'processSuitableType': data.suitableApplyAmountType
})
onFieldsChange()
})
}
}, [])
return (
<Fragment>
<PeripheralLayout
......@@ -61,15 +105,17 @@ const AddInvoiceProcessEng: React.FC<{}> = () => {
<Button
icon={<SaveOutlined />}
type="primary"
onClick={() => handleSubmit()}
loading={loading}
>
保存
</Button>
}
components={
<Form {...layout} onFieldsChange={(_, allValues) => onFieldsChange(allValues)}>
<ProcessEngLayout />
<ProcessSelectLayout />
<InvoiceTypeLayout />
<Form form={form} {...layout} onFieldsChange={() => onFieldsChange()}>
<ProcessEngLayout disabled={path === 'preview'} />
<ProcessSelectLayout disabled={path === 'preview'} onFieldsChange={onFieldsChange} />
<InvoiceTypeLayout disabled={path === 'preview'} />
</Form>
}
/>
......
......@@ -7,19 +7,18 @@ import styles from './index.less';
interface InvoiceTypeProps {
/** FormInstance */
form?: FormInstance,
disabled?: boolean,
}
const InvoiceTypeLayout: React.FC<InvoiceTypeProps> = (props: any) => {
const { form } = props;
const { form, disabled } = props;
const mock = [
{value: 1, label: '物料对账单'},
{value: 2, label: '采购询价合同'},
{value: 3, label: '采购招标合同'},
{value: 4, label: '采购竞价合同'},
{value: 5, label: '请购单合同'},
{value: 6, label: '采购请购单'},
{value: 9, label: '采购询价合同'},
{value: 11, label: '采购招标合同'},
{value: 10, label: '采购竞价合同'},
{value: 12, label: '请购单合同'},
{value: 14, label: '采购请购单'},
]
return (
......@@ -31,12 +30,12 @@ const InvoiceTypeLayout: React.FC<InvoiceTypeProps> = (props: any) => {
classNames={styles['invoice-type']}
>
<Form.Item
name='invoiceType'
name='processSuitableType'
rules={[
{ required: true, message: '请选择请款类型' },
]}
>
<Radio.Group>
<Radio.Group disabled={disabled}>
{mock.map(_item => (
<Radio key={_item.value} value={_item.value}>{_item.label}</Radio>
))}
......
......@@ -7,11 +7,11 @@ import { validatorByte } from '@/utils/regExp';
interface ProcessEngProps {
/** FormInstance */
form?: FormInstance,
disabled?: boolean
}
const ProcessEngLayout: React.FC<ProcessEngProps> = (props: any) => {
const { form } = props;
const { form, disabled } = props;
return (
<CardLayout
......@@ -30,7 +30,7 @@ const ProcessEngLayout: React.FC<ProcessEngProps> = (props: any) => {
{ validator: (rule, value, callback) => validatorByte(rule, value, callback, 48) }
]}
>
<Input placeholder='最长48个字符,24个汉字' />
<Input placeholder='最长48个字符,24个汉字' disabled={disabled} />
</Form.Item>
</Col>
</Row>
......
import React from 'react';
import { Form, Radio, Space } from 'antd';
import React, { useEffect, useState } from 'react';
import { Form, Radio, message, Skeleton } from 'antd';
import { FormInstance } from 'antd/es/form/Form';
import CardLayout from '../card';
import styles from './index.less';
import { getSettleAccountsApplyAmountProcessBaseList, GetSettleAccountsApplyAmountProcessBaseListResponse } from '@/services/SettleV2Api';
import { isEmpty } from 'lodash';
interface ProcessSelectProps {
/** FormInstance */
form?: FormInstance,
onFieldsChange?: () =>void,
disabled?: boolean,
}
const ProcessSelectLayout: React.FC<ProcessSelectProps> = (props: any) => {
const { form, onFieldsChange, disabled } = props;
const [dataSource, setDataSource] = useState<GetSettleAccountsApplyAmountProcessBaseListResponse>([])
const { form } = props;
const mock = [
{ id: 1, name: '请款单流程--0级', value: '-', tag: '请款单流程' },
{ id: 2, name: '请款单流程--1级', value: '1-待提交请款单', tag: '请款单流程' },
{ id: 3, name: '请款单流程--2级', value: '1-待审核请款单(一级) —>2-待提交请款单', tag: '请款单流程' },
{ id: 4, name: '请款单流程--3级', value: '1-待审核请款单(一级) —>2-审核请款单(二级)—>3-待提交请款单', tag: '请款单流程' },
]
useEffect(() => {
getSettleAccountsApplyAmountProcessBaseList().then(res => {
if (res.code !== 1000) {
message.error(res.message)
return
}
onFieldsChange()
setDataSource(res.data)
})
}, [])
return (
<CardLayout
......@@ -28,26 +36,31 @@ const ProcessSelectLayout: React.FC<ProcessSelectProps> = (props: any) => {
bodyStyle={{ paddingBottom: '1px' }}
classNames={styles['select-box']}
>
<Form.Item
name='processSelect'
rules={[
{ required: true, message: '请选择流程' },
]}
>
<Radio.Group>
{mock.map(_item => (
<Radio key={_item.id} value={_item.id}>
<div className={styles['box']}>
<div className={styles['box-clerk']}>
<div className={styles['box-clerk-name']}>{_item.name}</div>
<div className={styles['box-clerk-value']}>{_item.value}</div>
</div>
<div className={styles['box-tag']}>{_item.tag}</div>
</div>
</Radio>
))}
</Radio.Group>
</Form.Item>
{
!isEmpty(dataSource) ? (
<Form.Item
name='baseProcessId'
rules={[
{ required: true, message: '请选择流程' },
]}
>
<Radio.Group disabled={disabled}>
{dataSource.map(_item => (
<Radio key={_item.baseProcessId} value={_item.baseProcessId}>
<div className={styles['box']}>
<div className={styles['box-clerk']}>
<div className={styles['box-clerk-name']}>{_item.processName}</div>
<div className={styles['box-clerk-value']}>{_item.description}</div>
</div>
<div className={styles['box-tag']}>{_item.processTypeName}</div>
</div>
</Radio>
))}
</Radio.Group>
</Form.Item>
) : (
<Skeleton active />
)}
</CardLayout>
)
}
......
import React from 'react';
import React, { useRef, useState } from 'react';
import { history, Link } from 'umi';
import { Button, Switch } from 'antd';
import { Button, message, Popconfirm, Switch } from 'antd';
import moment from 'moment';
import { PlusOutlined } from '@ant-design/icons';
import TableLayout from '@/components/TableLayout';
import { ColumnType } from 'antd/lib/table/interface';
import { getSettleAccountsApplyAmountProcessDelete, getSettleAccountsApplyAmountProcessPage, postSettleAccountsApplyAmountProcessStatusUpdate } from '@/services/SettleV2Api'
import { createTime, id, name, operation, processName, status } from '../../columns';
import AuthButton from '@/components/AuthButton';
const InvoiceProcessEng: React.FC<{}> = () => {
const ref = useRef<any>({});
const format = (text, fmt?: string) => {
return <>{moment(text).format(fmt || "YYYY-MM-DD HH:mm:ss")}</>
}
const mock = [
{
id: 1,
name: '物料对账单请款流程',
processName: '请款单流程-2级',
createTime: 1650614111890,
status: 1,
const [deleteLoading, setDeleteLoading] = useState<boolean>(false);
/** 修改状态 */
const handleChecked = (record) => {
let status = (record.status === 1 ? 0 : 1);
const params = {
processId: record.processId,
status: status
}
]
postSettleAccountsApplyAmountProcessStatusUpdate({ ...params }).then(res => {
if (res.code !== 1000) {
message.error(res.message)
return
}
ref.current.reload()
})
}
const fetchDeleteBatch = (processId) => {
getSettleAccountsApplyAmountProcessDelete({ processId }).then(res => {
if (res.code !== 1000) {
message.error(res.message)
return
}
ref.current.reload();
})
}
const columns: ColumnType<any>[] = [
{
......@@ -29,7 +47,7 @@ const InvoiceProcessEng: React.FC<{}> = () => {
},
{
...name,
render: (_text) => <Link to='#'>{_text}</Link>
render: (_text, record) => <Link to={`/memberCenter/systemSetting/processManagement/invoiceProcessEng/preview?processId=${record.processId}`}>{_text}</Link>
},
{
...processName,
......@@ -40,21 +58,33 @@ const InvoiceProcessEng: React.FC<{}> = () => {
},
{
...status,
render: (_text) => <Switch checked={!!_text} />
render: (_text, record) => <Switch checked={!!_text} onChange={() => handleChecked(record)} />
},
{
...operation,
render: (_text) => <>
<Button type='link'>编辑</Button>
<Button type='link'>删除</Button>
render: (_text, record) => <>
{ !!!record.status &&
<>
<AuthButton btnCode='invoiceProcessEng.edit' >
<Button type='link' href={`/memberCenter/systemSetting/processManagement/invoiceProcessEng/edit?processId=${record.processId}`} >编辑</Button>
</AuthButton>
<AuthButton btnCode='invoiceProcessEng.del' >
<Popconfirm okButtonProps={{ loading: deleteLoading }} title='确定删除么?' okText='是' cancelText='否' onConfirm={() => fetchDeleteBatch(record.processId)}>
<Button type='link'>删除</Button>
</Popconfirm>
</AuthButton>
</>
}
</>
},
]
return (
<TableLayout
reload={ref}
columns={columns}
fetch={mock}
rowKey='processId'
fetch={getSettleAccountsApplyAmountProcessPage}
schema={{
type: "object",
properties: {
......@@ -83,7 +113,7 @@ const InvoiceProcessEng: React.FC<{}> = () => {
}
}
}}
controllerBtns={<Button type='primary' icon={<PlusOutlined />} onClick={() => history.push('/memberCenter/systemSetting/processEng/invoiceProcessEng/add')}>新增</Button>}
controllerBtns={<Button type='primary' icon={<PlusOutlined />} onClick={() => history.push('/memberCenter/systemSetting/processManagement/invoiceProcessEng/add')}>新增</Button>}
/>
)
}
......
......@@ -4,13 +4,16 @@
align-items: center;
justify-content: space-between;
padding: 8px 16px;
.titleBox {
display: flex;
align-items: center;
.goBack {
font-size: 14px;
color: #909399;
}
.titleContext {
color: #303133;
font-size: 16px;
......@@ -21,29 +24,37 @@
}
}
}
.anchor {
display: flex;
padding: 0 16px;
}
.layout {
margin: 24px;
:global {
.ant-card {
margin-bottom: 24px;
.ant-card-head {
> .ant-card-head-wrapper {
>.ant-card-head-wrapper {
padding: 12px 0;
}
}
.ant-card-extra {
padding: 0 0;
.ant-radio-button-wrapper {
height: 24px;
line-height: 23px;
}
.ant-radio-button-wrapper:hover {
color: #606266;
}
.ant-radio-button-wrapper-checked:not(.ant-radio-button-wrapper-disabled) {
color: #fff;
background: #6B778C;
......@@ -51,29 +62,36 @@
}
}
}
.god-table-control {
margin-bottom: 0;
}
}
}
:global {
.ant-anchor {
display: flex;
.ant-anchor-ink {
display: none;
}
.ant-anchor-link {
padding: 14px 0 !important;
margin: 0 16px;
.ant-anchor-link-title {
font-size: 14px;
color: #909399;
}
}
.ant-anchor-link-active {
position: relative;
border-bottom: 2px solid #00B37A;
box-sizing: border-box;
.ant-anchor-link-title {
font-weight: 500;
color: #303133;
......@@ -83,3 +101,11 @@
}
}
:global {
* [disabled],
.ant-radio-wrapper-disabled {
pointer-events: none !important;
}
}
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