56 lines
2.2 KiB
TypeScript
56 lines
2.2 KiB
TypeScript
import { Dialog, DialogContent, DialogTitle } from '@mui/material';
|
||
import { useShallow } from 'zustand/shallow';
|
||
import { useHomeStore } from '../store';
|
||
import { useMemo } from 'react';
|
||
import { useLayoutStore } from '@/modules/layout/store';
|
||
export const Label = ({ label, children }: { label: string; children: React.ReactNode }) => {
|
||
return (
|
||
<div className='text-sm text-gray-500 w-full flex gap-2'>
|
||
<div className='min-w-[60px]'>{label}</div>
|
||
<div className=''>{children}</div>
|
||
</div>
|
||
);
|
||
};
|
||
export const SuccessModal = () => {
|
||
const { openSuccessModal, setOpenSuccessModal, appKey, version, filename } = useHomeStore(
|
||
useShallow((state) => ({
|
||
openSuccessModal: state.openSuccessModal,
|
||
setOpenSuccessModal: state.setOpenSuccessModal,
|
||
appKey: state.appKey, //
|
||
version: state.version, //
|
||
filename: state.filename, //
|
||
})),
|
||
);
|
||
const { me } = useLayoutStore(useShallow((state) => ({ me: state.me })));
|
||
const link = useMemo(() => {
|
||
const _currentHref = new URL(window.location.href);
|
||
const username = me?.username;
|
||
const newHref = new URL(`/${username}/${appKey}/`, _currentHref.origin);
|
||
return newHref.toString();
|
||
}, [me, appKey]);
|
||
return (
|
||
<Dialog open={openSuccessModal} onClose={() => setOpenSuccessModal(false)}>
|
||
<DialogTitle className='text-black'>部署成功</DialogTitle>
|
||
<DialogContent>
|
||
<div className='flex flex-col gap-2 w-[400px] min-h-[100px] text-black'>
|
||
<Label label='应用 Key: '>{appKey}</Label>
|
||
<Label label='版本:'>{version}</Label>
|
||
<Label label='访问地址:'>
|
||
<a href={link} className='text-blue-500' target='_blank' rel='noreferrer'>
|
||
{link}
|
||
</a>
|
||
</Label>
|
||
<Label label='配置地址:'>
|
||
<a href={`/app/edit/list`} className='text-blue-500' target='_self' rel='noreferrer'>
|
||
{`/app/edit/list`}
|
||
</a>
|
||
</Label>
|
||
<div className='mt-1 text-gray-500 italic' style={{ fontSize: 10 }}>
|
||
注: 如果需要其他人访问，需要设置共享。
|
||
</div>
|
||
</div>
|
||
</DialogContent>
|
||
</Dialog>
|
||
);
|
||
};
|