Skip to content

Commit

Permalink
fix 页面布局
Browse files Browse the repository at this point in the history
  • Loading branch information
@liziyi0914
liziyi0914 committed Jan 29, 2024
1 parent 452195c commit 1e9ccfc
Showing 1 changed file with 104 additions and 90 deletions.
194 changes: 104 additions & 90 deletions src/pages/Index.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
import React, { useCallback, useMemo, useState } from 'react';
import { App, Button, Divider, Form, Input, Upload } from 'antd';
import { BetaSchemaForm } from '@ant-design/pro-components';
import { BetaSchemaForm, ProForm } from '@ant-design/pro-components';
import { ProFormColumnsType } from '@ant-design/pro-form/es/components/SchemaForm/typing';
import ini from 'ini';
import { DownloadOutlined, GithubOutlined, UploadOutlined } from '@ant-design/icons';
Expand All @@ -12,11 +12,11 @@ const TEMPLATE = '[/Script/Pal.PalGameWorldSettings]\nOptionSettings=(%)\n';
const DEFAULT = 'Difficulty=None,DayTimeSpeedRate=1.000000,NightTimeSpeedRate=1.000000,ExpRate=1.000000,PalCaptureRate=1.000000,PalSpawnNumRate=1.000000,PalDamageRateAttack=1.000000,PalDamageRateDefense=1.000000,PlayerDamageRateAttack=1.000000,PlayerDamageRateDefense=1.000000,PlayerStomachDecreaceRate=1.000000,PlayerStaminaDecreaceRate=1.000000,PlayerAutoHPRegeneRate=1.000000,PlayerAutoHpRegeneRateInSleep=1.000000,PalStomachDecreaceRate=1.000000,PalStaminaDecreaceRate=1.000000,PalAutoHPRegeneRate=1.000000,PalAutoHpRegeneRateInSleep=1.000000,BuildObjectDamageRate=1.000000,BuildObjectDeteriorationDamageRate=1.000000,CollectionDropRate=1.000000,CollectionObjectHpRate=1.000000,CollectionObjectRespawnSpeedRate=1.000000,EnemyDropItemRate=1.000000,DeathPenalty=All,bEnablePlayerToPlayerDamage=False,bEnableFriendlyFire=False,bEnableInvaderEnemy=True,bActiveUNKO=False,bEnableAimAssistPad=True,bEnableAimAssistKeyboard=False,DropItemMaxNum=3000,DropItemMaxNum_UNKO=100,BaseCampMaxNum=128,BaseCampWorkerMaxNum=15,DropItemAliveMaxHours=1.000000,bAutoResetGuildNoOnlinePlayers=False,AutoResetGuildTimeNoOnlinePlayers=72.000000,GuildPlayerMaxNum=20,PalEggDefaultHatchingTime=72.000000,WorkSpeedRate=1.000000,bIsMultiplay=False,bIsPvP=False,bCanPickupOtherGuildDeathPenaltyDrop=False,bEnableNonLoginPenalty=True,bEnableFastTravel=True,bIsStartLocationSelectByMap=True,bExistPlayerAfterLogout=False,bEnableDefenseOtherGuildPlayer=False,CoopPlayerMaxNum=4,ServerPlayerMaxNum=32,ServerName="Default Palworld Server",ServerDescription="",AdminPassword="",ServerPassword="",PublicPort=8211,PublicIP="",RCONEnabled=False,RCONPort=25575,Region="",bUseAuth=True,BanListURL="https://api.palworldgame.com/api/banlist.txt"';

const Page: React.FC = () => {
const {message} = App.useApp();
const { message } = App.useApp();
const [form] = Form.useForm();
const intl = useIntl();

const columns = useMemo(()=>{
const columns = useMemo(() => {
let data: ProFormColumnsType[] = [
{
title: 'Difficulty',
Expand Down Expand Up @@ -481,7 +481,7 @@ const Page: React.FC = () => {

for (let i = 0; i < data.length; i++) {
let item = data[i];
let title = intl.formatMessage({id: item.name});
let title = intl.formatMessage({ id: item.name });
if (item.valueType === 'select') {
let e = data[i]?.valueEnum as Record<string, string>;
for (let k in e) {
Expand All @@ -493,14 +493,14 @@ const Page: React.FC = () => {
continue;
}

let s = intl.formatMessage({id:`${item.name}.${k}`});
if (s!==v) {
let s = intl.formatMessage({ id: `${item.name}.${k}` });
if (s !== v) {
e[k] = s;
}
}
data[i]['valueEnum'] = e;
}
if (title!==item.name) {
if (title !== item.name) {
data[i].title = title;
data[i].tooltip = item.name;
}
Expand All @@ -511,8 +511,8 @@ const Page: React.FC = () => {

const [configText, setConfigText] = useState(TEMPLATE.replace('%', DEFAULT));

const updateConfig = useCallback((values: Record<string, any>)=>{
let line = columns.map(column=>{
const updateConfig = useCallback((values: Record<string, any>) => {
let line = columns.map(column => {
let key = column.name as string;
let value = values?.[key];
let type = column.valueType;
Expand All @@ -526,7 +526,7 @@ const Page: React.FC = () => {
} else if (type === 'digit') {
if (value === 0 || !value) {
return `${key}=0`;
} else if (((column?.fieldProps as any)?.step)==='0.000001') {
} else if (((column?.fieldProps as any)?.step) === '0.000001') {
return `${key}=${parseFloat(value).toFixed(6)}`;
} else {
return `${key}=${parseInt(value)}`;
Expand All @@ -542,9 +542,9 @@ const Page: React.FC = () => {
setConfigText(TEMPLATE.replace('%', line));
}, []);

const manualEditConfig = useCallback((config: string)=>{
const manualEditConfig = useCallback((config: string) => {
setConfigText(config);
let iniConf:{
let iniConf: {
'/Script/Pal'?: {
PalGameWorldSettings?: {
OptionSettings?: string;
Expand All @@ -563,11 +563,11 @@ const Page: React.FC = () => {

form.resetFields();

let values:Record<string, any> = {};
let values: Record<string, any> = {};

settings.split(',').forEach(setting=>{
let [k,v] = setting.split('=');
let column = columns.filter(c=>c?.name===k)?.[0];
settings.split(',').forEach(setting => {
let [k, v] = setting.split('=');
let column = columns.filter(c => c?.name === k)?.[0];
if (!column) {
return;
}
Expand All @@ -588,94 +588,108 @@ const Page: React.FC = () => {
}, [form]);

return (
<div className="flex justify-center">
<div className="w-192">
<div className="py-3 text-center font-semibold text-2xl">
<div>
Palworld 幻兽帕鲁
<div>
<div className="flex justify-center">
<div className="w-192">
<div className="py-3 text-center font-semibold text-2xl">
<div>
Palworld 幻兽帕鲁
</div>
<div>
ini配置文件编辑器
</div>
</div>
<div className="py-2 text-center">
<Button
icon={<GithubOutlined />}
href="https://github.com/liziyi0914/PalworldServerConfigEditor"
>Github</Button>
</div>
<div>
ini配置文件编辑器
<Input.TextArea
style={{
height: '8rem'
}}
placeholder="配置文件"
value={configText}
onChange={(e) => manualEditConfig(e.target.value)}
/>
</div>
</div>
<div className="py-2 text-center">
<Button
icon={<GithubOutlined/>}
href="https://github.com/liziyi0914/PalworldServerConfigEditor"
>Github</Button>
</div>
<div>
<Input.TextArea
placeholder="配置文件"
value={configText}
onChange={(e) => manualEditConfig(e.target.value)}
/>
</div>
<div className="py-2 flex justify-center gap-2">
<Upload
accept=".ini"
beforeUpload={(file)=>{
let reader = new FileReader();
reader.onload = (e)=>{
let text = e.target?.result as string;
manualEditConfig(text);
};
reader.readAsText(file);
return Upload.LIST_IGNORE;
}}
>
<Button icon={<UploadOutlined/>}>上传</Button>
</Upload>
<Button
onClick={()=>{
navigator.clipboard.readText().then(text=>{
manualEditConfig(text);
});
}}
>粘贴</Button>
<div className="flex flex-col justify-center">
<Divider type="vertical"/>
<div className="py-2 flex justify-center gap-2">
<Upload
accept=".ini"
beforeUpload={(file) => {
let reader = new FileReader();
reader.onload = (e) => {
let text = e.target?.result as string;
manualEditConfig(text);
};
reader.readAsText(file);
return Upload.LIST_IGNORE;
}}
>
<Button icon={<UploadOutlined />}>上传</Button>
</Upload>
<Button
onClick={() => {
navigator.clipboard.readText().then(text => {
manualEditConfig(text);
});
}}
>粘贴</Button>
<div className="flex flex-col justify-center">
<Divider type="vertical" />
</div>
<CopyToClipboard
text={configText}
onCopy={() => message.success('复制成功')}
>
<Button>复制</Button>
</CopyToClipboard>
<Button
type="primary"
icon={<DownloadOutlined />}
onClick={() => {
let fileName = 'PalWorldSettings.ini';
let blob = new Blob([configText]);
let downloadElement = document.createElement('a');
let href = window.URL.createObjectURL(blob);
downloadElement.href = href;
downloadElement.download = fileName;
document.body.appendChild(downloadElement);
downloadElement.click();
document.body.removeChild(downloadElement);
window.URL.revokeObjectURL(href);
}}
>下载</Button>
</div>
<CopyToClipboard
text={configText}
onCopy={()=>message.success('复制成功')}
>
<Button>复制</Button>
</CopyToClipboard>
<Button
type="primary"
icon={<DownloadOutlined/>}
onClick={()=>{
let fileName = 'PalWorldSettings.ini';
let blob = new Blob([configText]);
let downloadElement = document.createElement('a');
let href = window.URL.createObjectURL(blob);
downloadElement.href = href;
downloadElement.download = fileName;
document.body.appendChild(downloadElement);
downloadElement.click();
document.body.removeChild(downloadElement);
window.URL.revokeObjectURL(href);
}}
>下载</Button>
</div>
<div>
<BetaSchemaForm
</div>
<div className="flex justify-center">
<div className="w-3/4">
<ProForm
form={form}
autoFocus={false}
submitter={false}
onValuesChange={(_, values) => {
updateConfig(values);
}}
layout="horizontal"
labelCol={{ span: 12 }}
wrapperCol={{ span: 12 }}
columns={columns}
onValuesChange={(_,values) => {
updateConfig(values);
}}
/>
>
<div className="grid grid-cols-1 lg:grid-cols-2 xl:grid-cols-3 gap-x-4">
<BetaSchemaForm
layoutType="Embed"
columns={columns}
/>
</div>
</ProForm>
</div>
</div>
</div>
);
)
;
};

export default Page;

0 comments on commit 1e9ccfc

Please sign in to comment.