Haina
/
GHHub
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: postForm 增加业务错误校验，搜索帐号，新增、编辑账号

Browse Source
perf/export-docx
Jimmy Liow 1 year ago
parent f22c9eb497
commit 2cb059cc06
3 changed files with 247 additions and 152 deletions
Show Stats Download Patch File Download Diff File

108
src/stores/Account.js
Unescape Escape View File

@ -0,0 +1,108 @@
import { create } from 'zustand'
import { fetchJSON, postForm } from '@/utils/request'
import { HT_HOST } from "@/config"
import { usingStorage } from '@/hooks/usingStorage'
export const postAccountStatus = async (formData) => {
const { errcode, result } = await postForm(
`${HT_HOST}/service-CooperateSOA/set_account_status`, formData)
return errcode !== 0 ? {} : result
}
export const fetchAccountList = async (params) => {
const { errcode, result } = await fetchJSON(
`${HT_HOST}/service-CooperateSOA/search_account`, params)
return errcode !== 0 ? {} : result
}
export const postAccountForm = async (formData) => {
const { errcode, result } = await postForm(
`${HT_HOST}/service-CooperateSOA/new_or_update_account`, formData)
return errcode !== 0 ? {} : result
}
export const fetchRoleList = async () => {
const { errcode, result } = await fetchJSON(
`${HT_HOST}/service-CooperateSOA/get_role_list`)
return errcode !== 0 ? {} : result
}
const useAccountStore = create((set, get) => ({
accountList: [],
selectedAccount: null,
selectAccount: (account) => {
set(() => ({
selectedAccount: account
}))
},
disableAccount: async (accountId) => {
const formData = new FormData()
formData.append('wu_id', accountId)
formData.append('account_status', 'enable')
const result = await postAccountStatus(formData)
console.info(result)
},
saveOrUpdateAccount: async (formValues) => {
const { selectedAccount } = get()
const { userId } = usingStorage()
const formData = new FormData()
formData.append('wu_id', selectedAccount.userId)
formData.append('lmi_sn', selectedAccount.lmi_sn)
formData.append('lmi2_sn', selectedAccount.lmi2_sn)
formData.append('user_name', formValues.username)
formData.append('real_name', formValues.realname)
formData.append('email', formValues.email)
formData.append('travel_agency_id', formValues.travelAgencyId)
formData.append('roles', formValues.roleId)
formData.append('opi_sn', userId)
return postAccountForm(formData)
},
searchAccountByCriteria: async (formValues) => {
const searchParams = {
username: formValues.username,
realname: formValues.realname,
lgc: 2
}
const resultArray = await fetchAccountList(searchParams)
const mapAccoutList = resultArray.map((r) => {
return {
userId: r.wu_id,
lmi_sn: r.lmi_sn,
lmi2_sn: r.lmi2_sn,
username: r.user_name,
realname: r.real_name,
email: r.email,
lastLogin: r.wu_lastlogindate,
travelAgency: r.travel_agency_name,
travelAgencyId: r.travel_agency_id,
roleId: r.roles,
role: r.roles_name,
}
})
set(() => ({
accountList: mapAccoutList
}))
},
}))
export default useAccountStore

1
src/utils/request.js
Unescape Escape View File

@ -106,6 +106,7 @@ export function postForm(url, data) {
}
}).then(checkStatus)
.then(response => response.json())
.then(checkBizCode)
.catch(error => {
throw error
})

290
src/views/account/Management.jsx
Unescape Escape View File

@ -4,7 +4,8 @@ import { ExclamationCircleFilled } from '@ant-design/icons'
import { useTranslation } from 'react-i18next'
import useFormStore from '@/stores/Form'
import useAuthStore from '@/stores/Auth'
import useReservationStore from '@/stores/Reservation'
import useAccountStore from '@/stores/Account'
import { fetchRoleList } from '@/stores/Account'
import SearchForm from '@/components/SearchForm'
import RequireAuth from '@/components/RequireAuth'
import { PERM_ROLE_NEW } from '@/config'
@ -134,9 +135,9 @@ function Management() {
},
]
function accountRender(text) {
function accountRender(text, account) {
return (
<Button type='link' onClick={() => setAccountModalOpen(true)}>{text}</Button>
<Button type='link' onClick={() => onAccountSeleted(account)}>{text}</Button>
)
}
@ -146,11 +147,11 @@ function Management() {
)
}
function actionRender() {
function actionRender(text, account) {
return (
<Space key='actionRenderSpace' size='middle'>
<Button type='link' key='disable' onClick={() => showDisableConfirm()}>{t('account:action.disable')}</Button>
<Button type='link' key='resetPassword' onClick={() => showResetPasswordConfirm()}>{t('account:action.resetPassword')}</Button>
<Button type='link' key='disable' onClick={() => showDisableConfirm(account)}>{t('account:action.disable')}</Button>
<Button type='link' key='resetPassword' onClick={() => showResetPasswordConfirm(account)}>{t('account:action.resetPassword')}</Button>
</Space>
)
}
@ -160,68 +161,36 @@ function Management() {
setPermissionValue(newValue)
}
const onAccountSeleted = async (account) => {
selectAccount(account)
console.info(account)
const roleList = await fetchRoleList()
setRoleAllList(roleList.map(r => {
return {
value: r.role_id,
label: r.role_name,
disabled: r.role_id === 1
}
}))
setAccountModalOpen(true)
}
const [permissionValue, setPermissionValue] = useState(['0-0-0'])
const [isAccountModalOpen, setAccountModalOpen] = useState(false)
const [isRoleModalOpen, setRoleModalOpen] = useState(false)
const [dataLoading, setDataLoading] = useState(false)
const [accountList, setaccountList] = useState([
{
key: 1,
username: 'bjyiran',
realname: '怡小芳',
travelAgency: '三千界',
email: 'xiaofang@yiran.com',
role: '国内供应商',
lastLogin: '2024-06-12 13:53'
},
{
key: 2,
username: 'int-robin',
realname: 'Robin',
travelAgency: 'IAT',
email: 'robin@int.com',
role: '海外供应商',
lastLogin: '2024-06-12 13:53'
},
{
key: 3,
username: 'betty-wu',
realname: '吴雪',
travelAgency: '桂林国旅',
email: 'betty@hainatravel.com',
role: '客服组',
lastLogin: '2024-06-12 13:53'
},
{
key: 4,
username: 'lancy',
realname: '吴金倩',
travelAgency: '海纳国旅',
email: 'lancy@hainatravel.com',
role: '产品组',
lastLogin: '2024-06-12 13:53'
},
{
key: 5,
username: 'LYJ',
realname: '廖一军',
travelAgency: '海纳国际旅行社',
email: 'lyj@hainatravel.com',
role: 'Web 开发组,海外测试供应商',
lastLogin: '2024-06-12 13:53'
}
])
const formValuesToSub = useFormStore((state) => state.formValuesToSub)
const [roleAllList, setRoleAllList] = useState([])
const [editAccountForm, editRoleForm] = Form.useForm()
const [fetchReservationList] =
useReservationStore((state) =>
[state.fetchAllGuideList, state.fetchReservationList, state.reservationList, state.reservationPage, state.cityList, state.selectReservation, state.getCityListByReservationId])
const [searchAccountByCriteria, accountList, disableAccount, selectedAccount, saveOrUpdateAccount, selectAccount] =
useAccountStore((state) =>
[state.searchAccountByCriteria, state.accountList, state.disableAccount, state.selectedAccount, state.saveOrUpdateAccount, state.selectAccount])
const { notification, modal } = App.useApp()
const handleAccountOk = () => {
console.info('handleAccountOk')
console.info(editAccountForm)
}
const handleAccountCancel = () => {
@ -229,49 +198,54 @@ function Management() {
}
const handleRoleOk = () => {
console.info('handleRoleOk')
}
const handleRoleCancel = () => {
setRoleModalOpen(false)
}
const onFinish = (values) => {
const onAccountFinish = (values) => {
console.log(values)
saveOrUpdateAccount(values)
.catch(ex => {
console.info(ex.message)
notification.error({
message: 'Notification',
description: ex.message,
placement: 'top',
duration: 4,
})
})
}
const onFinishFailed = (error) => {
const onAccountFinishFailed = (error) => {
console.log('Failed:', error)
// form.resetFields()
}
// 默认重新搜索第一页，所有状态的计划
const onSearchClick = (current = 1, status = null) => {
}
const showDisableConfirm = () => {
const showDisableConfirm = (account) => {
modal.confirm({
title: 'Do you want to disable this account?',
icon: <ExclamationCircleFilled />,
content: 'Username: Ivy, Realname: 怡小芳',
content: `Username: ${account.username}, Realname: ${account.realname}`,
onOk() {
console.log('OK')
disableAccount(account.userId)
},
onCancel() {
console.log('Cancel')
},
})
}
const showResetPasswordConfirm = () => {
const showResetPasswordConfirm = (account) => {
modal.confirm({
title: 'Do you want to reset password?',
icon: <ExclamationCircleFilled />,
content: 'Username: Ivy, Realname: 怡小芳',
content: `Username: ${account.username}, Realname: ${account.realname}`,
onOk() {
console.log('OK')
console.log('ResetPassword')
},
onCancel() {
console.log('Cancel')
},
})
}
@ -280,77 +254,92 @@ function Management() {
<>
<Modal
centered
okButtonProps={{
autoFocus: true,
htmlType: 'submit',
}}
title={t('account:management.newAccount')}
open={isAccountModalOpen} onOk={handleAccountOk} onCancel={handleAccountCancel}
>
<Form
destroyOnClose
modalRender={(dom) => (
<Form
name='AccountForm'
form={editAccountForm}
initialValues={selectedAccount}
layout='vertical'
size='large'
style={{
maxWidth: 600,
}}
onFinish={onFinish}
onFinishFailed={onFinishFailed}
onFinish={onAccountFinish}
onFinishFailed={onAccountFinishFailed}
autoComplete='off'
>
<Form.Item><Title level={2}>{t('account:management.newAccount')}</Title></Form.Item>
<Form.Item
label={t('account:management.username')}
name='username'
rules={[
{
required: true,
message: t('account:Validation.username'),
},
]}
>
<Input />
</Form.Item>
<Form.Item
label={t('account:management.realname')}
name='realname'
rules={[
{
required: true,
message: t('account:Validation.realname'),
},
]}
>
<Input />
</Form.Item>
<Form.Item label={t('account:management.travelAgency')}>
<Select>
<Select.Option value='1'>供应商1</Select.Option>
<Select.Option value='2'>地接2</Select.Option>
<Select.Option value='3'>国内供应商3</Select.Option>
<Select.Option value='4'>海外供应商4</Select.Option>
<Select.Option value='5'>还有什么？</Select.Option>
</Select>
</Form.Item>
<Form.Item
label={t('account:management.email')}
name='email'
rules={[
{
required: true,
message: t('account:Validation.email'),
},
]}
>
<Input />
</Form.Item>
<Form.Item label={t('account:management.role')}>
<Select>
<Select.Option value='1'>客服组</Select.Option>
<Select.Option value='2'>产品组</Select.Option>
<Select.Option value='3'>国内供应商</Select.Option>
<Select.Option value='4'>海外供应商</Select.Option>
<Select.Option value='5'>技术研发部</Select.Option>
<Select.Option value='0' disabled>系统管理员</Select.Option>
</Select>
</Form.Item>
</Form>
{dom}
</Form>
)}
>
<Form.Item
label={t('account:management.username')}
name='username'
rules={[
{
required: true,
message: t('account:Validation.username'),
},
]}
>
<Input />
</Form.Item>
<Form.Item
label={t('account:management.realname')}
name='realname'
rules={[
{
required: true,
message: t('account:Validation.realname'),
},
]}
>
<Input />
</Form.Item>
<Form.Item
label={t('account:management.email')}
name='email'
rules={[
{
required: true,
message: t('account:Validation.email'),
},
]}
>
<Input />
</Form.Item>
<Form.Item
label={t('account:management.travelAgency')}
name='travelAgencyId'
rules={[
{
required: true,
message: t('account:Validation.travelAgency'),
},
]}
>
<Select options={[{ value: 33032, label: 'test海外地接B' }]}></Select>
</Form.Item>
<Form.Item
label={t('account:management.role')}
name='roleId'
rules={[
{
required: true,
message: t('account:Validation.role'),
},
]}
>
<Select options={roleAllList}>
</Select>
</Form.Item>
</Modal>
{/* Role Edit */}
<Modal
@ -365,8 +354,8 @@ function Management() {
style={{
maxWidth: 800,
}}
onFinish={onFinish}
onFinishFailed={onFinishFailed}
onFinish={onAccountFinish}
onFinishFailed={onAccountFinishFailed}
autoComplete='off'
>
<Form.Item><Title level={2}>{t('account:management.newRole')}</Title></Form.Item>
@ -407,10 +396,6 @@ function Management() {
<Space direction='vertical' style={{ width: '100%' }}>
<Title level={3}>{t('account:management.tile')}</Title>
<SearchForm
// initialValue={
// {
// }
// }
fieldsConfig={{
shows: ['username', 'realname', 'dates'],
fieldProps: {
@ -419,19 +404,19 @@ function Management() {
}}
onSubmit={(err, formValues, filedsVal) => {
console.info(formValues)
// setDataLoading(true)
// fetchReservationList(formVal)
// .catch(ex => {
// notification.error({
// message: 'Notification',
// description: ex.message,
// placement: 'top',
// duration: 4,
// })
// })
// .finally(() => {
// setDataLoading(false)
// })
setDataLoading(true)
searchAccountByCriteria(formValues)
.catch(ex => {
notification.error({
message: 'Notification',
description: ex.message,
placement: 'top',
duration: 4,
})
})
.finally(() => {
setDataLoading(false)
})
}}
/>
<Row>
@ -449,6 +434,7 @@ function Management() {
<Table
bordered
loading={dataLoading}
rowKey='username'
pagination={{
showQuickJumper: true,
showLessItems: true,

Write Preview
Loading…
Cancel
Save