Browse Source

app打包优化

main
cs 2 months ago
parent
commit
4f80438b4b
  1. 1
      src/components/action/Action.tsx
  2. 68
      src/pages/app/package/index.tsx
  3. 4
      src/service/app/package.ts
  4. 14
      src/store/app/package.ts
  5. 20
      src/types/app/package.d.ts

1
src/components/action/Action.tsx

@ -10,6 +10,7 @@ const Action = ({ title, as, children, ...props }: ActionProps) => {
const { styles } = useStyle() const { styles } = useStyle()
const isLink = as === 'a' || props.type === 'link' const isLink = as === 'a' || props.type === 'link'
//fixme 如果外部同时设置 as={'a'} disabled={true} ,这里a标签会置灰,但是仍可点击,为什么不直接用Button?
const Comp = isLink ? 'a' : Button const Comp = isLink ? 'a' : Button
return ( return (
<span className={styles.container}> <span className={styles.container}>

68
src/pages/app/package/index.tsx

@ -17,7 +17,6 @@ import {useStyle} from './style'
import {FilterOutlined} from '@ant-design/icons' import {FilterOutlined} from '@ant-design/icons'
import {getValueCount, unSetColumnRules} from '@/utils' import {getValueCount, unSetColumnRules} from '@/utils'
import {Table as ProTable} from '@/components/table' import {Table as ProTable} from '@/components/table'
import Switch from '@/components/switch'
import aPPServ from "@/service/app/package.ts"; import aPPServ from "@/service/app/package.ts";
import {useDialog} from "@/components/dialog"; import {useDialog} from "@/components/dialog";
@ -152,9 +151,8 @@ const AppPackage = () => {
allowClear: false allowClear: false
}, },
render: (_text, record) => { render: (_text, record) => {
//0未处理 1队列中 2打包中 3打包成功 4打包失败
return <Badge status={[record.os] as any} return <Badge status={[record.os] as any}
text={['Android', 'Windows'][record.status]}/>
text={['Android', 'Windows'][record.os]}/>
}, },
formItemProps: { formItemProps: {
rules: [ rules: [
@ -177,14 +175,6 @@ const AppPackage = () => {
} }
}, },
{ {
title: t(`${i18nPrefix}.columns.x_86`, '是否支持32位操作系统'),
dataIndex: 'x_86',
valueType: 'switch',
formItemProps: {
tooltip: 'Android则是arm-v7a',
}
},
{
title: t(`${i18nPrefix}.columns.splash_url`, 'Android启动页图片链接'), title: t(`${i18nPrefix}.columns.splash_url`, 'Android启动页图片链接'),
dataIndex: 'splash_url', dataIndex: 'splash_url',
valueType: 'input', valueType: 'input',
@ -305,31 +295,38 @@ const AppPackage = () => {
formItemProps: {hidden: true} formItemProps: {hidden: true}
}, },
{ {
title: t(`${i18nPrefix}.columns.package_name`, '包名'),
dataIndex: 'package_name',
title: t(`${i18nPrefix}.columns.app_name`, '应用名'),
dataIndex: 'app_name',
formItemProps: { formItemProps: {
rules: [ rules: [
{ {
required: true, required: true,
message: t('message.required', '名必填')
message: t('message.required', '应用名必填')
} }
] ]
} }
}, },
{ {
title: t(`${i18nPrefix}.columns.app_name`, '应用名'),
dataIndex: 'app_name',
title: t(`${i18nPrefix}.columns.pkgStatus`, '打包状态'),
dataIndex: 'pkgStatus.status',
render: (_text, record) => {
return <Badge
status={['default', 'processing', 'processing', 'success', 'error'][record.pkgStatus.status] as any}
text={['处理中', '队列中', '打包中', '打包成功', '打包失败'][record.pkgStatus.status]}/>
}
},
{
title: t(`${i18nPrefix}.columns.package_name`, '包名'),
dataIndex: 'package_name',
formItemProps: { formItemProps: {
rules: [ rules: [
{ {
required: true, required: true,
message: t('message.required', '应用名必填')
message: t('message.required', '名必填')
} }
] ]
} }
}, },
{ {
title: t(`${i18nPrefix}.columns.app_icon`, '应用图标'), title: t(`${i18nPrefix}.columns.app_icon`, '应用图标'),
dataIndex: 'app_icon', dataIndex: 'app_icon',
@ -374,11 +371,18 @@ const AppPackage = () => {
] ]
}, },
render: (_text, record) => { render: (_text, record) => {
//0未处理 1队列中 2打包中 3打包成功 4打包失败
return <Badge status={[record.os] as any} return <Badge status={[record.os] as any}
text={['Android', 'Windows'][record.status]}/>
text={['Android', 'Windows'][record.os]}/>
}
},
{
title: t(`${i18nPrefix}.columns.enable_traffic`, '是否已启用流量加速'),
dataIndex: 'enable_traffic',
render: (_text, record) => {
return <div>{['否', '是'][record.enable_traffic]}</div>
} }
}, },
{ {
title: t(`${i18nPrefix}.columns.splash_url`, '启动图'), title: t(`${i18nPrefix}.columns.splash_url`, '启动图'),
dataIndex: 'splash_url', dataIndex: 'splash_url',
@ -413,15 +417,6 @@ const AppPackage = () => {
dataIndex: 'key_pwd', dataIndex: 'key_pwd',
}, },
{ {
title: t(`${i18nPrefix}.columns.x_86`, '是否支持32位'),
dataIndex: 'x_86',
valueType: 'switch',
render: (_text, record) => {
return <Switch checked={record.x_86 === 1} size={'small'}/>
}
},
{
title: t(`${i18nPrefix}.columns.uid`, 'uid'), title: t(`${i18nPrefix}.columns.uid`, 'uid'),
dataIndex: 'uid', dataIndex: 'uid',
hideInTable: true, hideInTable: true,
@ -433,16 +428,25 @@ const AppPackage = () => {
title: t(`${i18nPrefix}.columns.option`, '操作'), title: t(`${i18nPrefix}.columns.option`, '操作'),
key: 'option', key: 'option',
valueType: 'option', valueType: 'option',
tooltip: '打包预计5分钟左右,需要刷新网页',
fixed: 'right', fixed: 'right',
render: (_, record) => [ render: (_, record) => [
<Action key="package" <Action key="package"
as={'a'} as={'a'}
loading={packageing} loading={packageing}
disabled={![0, 4].includes(record.status) || packageing}
disabled={[1, 2].includes(record.pkgStatus.status) || packageing}
onClick={() => { onClick={() => {
packageApp(record) packageApp(record)
}} }}
>{t('actions.package', '应用打包')}</Action>,
>{t('actions.package', '打包')}</Action>,
<Divider type={'vertical'}/>,
<Action key="download"
as={'a'}
type={'link'}
target={'_blank'}
href={record.pkgStatus.app_url}
disabled={!record.pkgStatus.app_url}
>{t('actions.download', '下载')}</Action>,
<Divider type={'vertical'}/>, <Divider type={'vertical'}/>,
<Action key="edit" <Action key="edit"
as={'a'} as={'a'}

4
src/service/app/package.ts

@ -24,6 +24,10 @@ const appPackage = {
check: async () => { check: async () => {
return await request.get<APP.IAppBoolRes>(`/package/traffic/check`) return await request.get<APP.IAppBoolRes>(`/package/traffic/check`)
}, },
getPkgStatus: async (params: any) => {
return await request.get<APP.IAppPkgStatus>(`/package/status`, { ...params })
},
} }
export default appPackage export default appPackage

14
src/store/app/package.ts

@ -33,7 +33,17 @@ export const appPackagesAtom = atomWithQuery((get) => {
return { return {
queryKey: [ 'appPackages', get(appPackageSearchAtom) ], queryKey: [ 'appPackages', get(appPackageSearchAtom) ],
queryFn: async ({ queryKey: [ , params ] }) => { queryFn: async ({ queryKey: [ , params ] }) => {
return await aPPServ.list(params as SearchParams)
const list = await aPPServ.list(params as SearchParams)
// 获取打包状态
await Promise.all(
list.data.rows?.map(async (row) => {
const pkgStatus = await aPPServ.getPkgStatus({ id: row.id })
row.pkgStatus = pkgStatus.data
return row
})
)
return list
}, },
select: res => { select: res => {
const data = res.data const data = res.data
@ -97,7 +107,7 @@ export const packageAppAtom = atomWithMutation((get) => {
return await aPPServ.package({ id: data.id }) return await aPPServ.package({ id: data.id })
}, },
onSuccess: (res) => { onSuccess: (res) => {
message.success('message.packageSuccess')
message.success('打包预计5分钟左右,请稍候刷新网页查看')
//更新列表 //更新列表
get(queryClientAtom).invalidateQueries({ queryKey: [ 'appPackages', get(appPackageSearchAtom) ] }) get(queryClientAtom).invalidateQueries({ queryKey: [ 'appPackages', get(appPackageSearchAtom) ] })
return res return res

20
src/types/app/package.d.ts

@ -21,9 +21,27 @@ export namespace APP {
message: string; message: string;
x_86: number; x_86: number;
uid: number; uid: number;
pkgStatus: IAppPkgStatus
} }
export interface IAppBoolRes{
/**
* Bool类型返回结果
*/
export interface IAppBoolRes {
success: boolean; success: boolean;
} }
/**
*
*/
export interface IAppPkgStatus {
id: number;
status: number; // 0未处理 1队列中 2打包中 3打包成功 4打包失败
message: string;
start_time: string;
end_time: string;
app_url: string;
position: number;
total: number;
}
} }
Loading…
Cancel
Save