optimize layout of index page

yhy
Dawn1Ocean 2024-03-12 20:33:29 +08:00
parent d83136a69c
commit 5bafff52ad
4 changed files with 63 additions and 21 deletions

View File

@ -49,7 +49,8 @@ class Card extends Component {
<View <View
style={{ style={{
marginLeft: 10, marginLeft: 10,
fontSize: 36, fontSize: 30,
fontWeight: 'bold',
}} }}
> >
{title} {title}

View File

@ -1,15 +1,26 @@
import React from 'react'; import React from 'react';
import { View } from '@tarojs/components'; import { View, Image } from '@tarojs/components';
import pt from '@/plain-text'; import pt from '@/plain-text';
import logo from '@/assets/images/UserPage/logo.png';
export default class TitleCard extends React.Component { export default class TitleCard extends React.Component {
render(): React.ReactNode { render(): React.ReactNode {
const mainPage = pt.get().mainPage; const mainPage = pt.get().mainPage;
return ( return (
<View className='at-row at-row__align--center'>
<View className='at-col at-col-1 at-col--auto'>
<Image
style='width: 50px; height: 50px; margin-left: 15px;'
src={logo}
/>
</View>
<View className='page-title'> <View className='page-title'>
<View className='at-article__h1'>{mainPage.mainTitleLine}</View> <View className='at-article__h1' style={{ fontWeight: 'bold' }}>
{mainPage.mainTitleLine}
</View>
<View className='at-article__h2'>{mainPage.subTitleLine}</View> <View className='at-article__h2'>{mainPage.subTitleLine}</View>
</View> </View>
</View>
); );
} }
} }

View File

@ -69,20 +69,20 @@ export default class MainPage extends Component<{}, MainPageState> {
dutyData: new DutyData(), dutyData: new DutyData(),
dutyInfoCard: { dutyInfoCard: {
title: pt.get().mainPage.cardTitle.dutyInfo, title: pt.get().mainPage.cardTitle.dutyInfo,
note: 'Tips', note: pt.get().mainPage.cardTips.dutyInfo,
extra: '额外信息', extra: pt.get().mainPage.extraInfo.dutyInfo,
content: () => <DutyInfo data={this.state.dutyData} />, content: () => <DutyInfo data={this.state.dutyData} />,
}, },
stepInfoCard: { stepInfoCard: {
title: pt.get().mainPage.cardTitle.stepInfo, title: pt.get().mainPage.cardTitle.stepInfo,
note: 'Tips 请在20:30以前取走自己的物品哦', note: pt.get().mainPage.cardTips.stepInfo,
extra: '额外信息', extra: pt.get().mainPage.extraInfo.dutyInfo,
content: () => <StepInfo />, content: () => <StepInfo />,
}, },
tipsInfoCard: { tipsInfoCard: {
title: pt.get().mainPage.cardTitle.tipsInfo, title: pt.get().mainPage.cardTitle.tipsInfo,
note: 'Tips', note: pt.get().mainPage.cardTips.tipsInfo,
extra: '额外信息', extra: pt.get().mainPage.extraInfo.dutyInfo,
content: () => <TipsInfo />, content: () => <TipsInfo />,
}, },
// rs: new RequestState(), // rs: new RequestState(),

View File

@ -6,6 +6,16 @@ export interface MainPageText {
stepInfo: string; stepInfo: string;
tipsInfo: string; tipsInfo: string;
}; };
cardTips: {
dutyInfo: string;
stepInfo: string;
tipsInfo: string;
};
extraInfo: {
dutyInfo: string;
stepInfo: string;
tipsInfo: string;
};
expandTitle: { expandTitle: {
stepInfo: string; stepInfo: string;
tipsInfo: string; tipsInfo: string;
@ -35,21 +45,31 @@ export const mainPageZhCn: MainPageText = {
stepInfo: '维修步骤', stepInfo: '维修步骤',
tipsInfo: '注意事项', tipsInfo: '注意事项',
}, },
cardTips: {
dutyInfo: '提示:可以先前往【维修】页面在线上预填写工单!',
stepInfo: '提示:请在 20:30 之前取走自己的物品哦!',
tipsInfo: '',
},
extraInfo: {
dutyInfo: '',
stepInfo: '',
tipsInfo: '',
},
expandTitle: { expandTitle: {
stepInfo: '查看维修步骤', stepInfo: '查看维修步骤',
tipsInfo: '查看注意事项', tipsInfo: '查看注意事项',
}, },
stepList: [ stepList: [
{ title: '线上填写工单' }, { title: '线上填写工单' },
{ title: '去`东三-204`实验室维修电脑' }, { title: '去【东三-204】实验室维修电脑' },
{ title: '等待电脑维修' }, { title: '等待电脑维修' },
{ title: '维修结束,取回电脑' }, { title: '维修结束,取回电脑' },
], ],
tipsList: [ tipsList: [
{ title: '戴尔、Surface、外星人、苹果电脑不能拆机哦~' }, { title: '戴尔/外星人、Surface、苹果电脑不能拆机哦~' },
{ title: '数据无价,请随时做好数据备份哦~' }, { title: '数据无价,请随时做好数据备份哦~' },
{ title: '204也是实验室,请遵守实验室纪律,请勿饮食~' }, { title: '204 也是实验室,请勿在内饮食~' },
{ title: '我们是志愿服务,不收任何礼物哦~' }, { title: '我们是志愿服务,不收任何礼物哦~' },
], ],
dutyCard: { dutyCard: {
offDuty: { offDuty: {
@ -84,21 +104,31 @@ export const mainPageEnUs: MainPageText = {
stepInfo: '维修步骤', stepInfo: '维修步骤',
tipsInfo: '注意事项', tipsInfo: '注意事项',
}, },
cardTips: {
dutyInfo: '提示:可以先前往【维修】页面,在线上预填写工单!',
stepInfo: '提示:请在 20:30 之前取走自己的物品哦!',
tipsInfo: '',
},
expandTitle: { expandTitle: {
stepInfo: '查看维修步骤', stepInfo: '查看维修步骤',
tipsInfo: '查看注意事项', tipsInfo: '查看注意事项',
}, },
extraInfo: {
dutyInfo: '',
stepInfo: '',
tipsInfo: '',
},
stepList: [ stepList: [
{ title: '线上填写工单' }, { title: '线上填写工单' },
{ title: '去`东三-204`实验室维修电脑' }, { title: '去【东三-204】实验室维修电脑' },
{ title: '等待电脑维修' }, { title: '等待电脑维修' },
{ title: '维修结束,取回电脑' }, { title: '维修结束,取回电脑' },
], ],
tipsList: [ tipsList: [
{ title: '戴尔、Surface、外星人、苹果电脑不能拆机哦~' }, { title: '戴尔/外星人、Surface、苹果电脑不能拆机哦~' },
{ title: '数据无价,请随时做好数据备份哦~' }, { title: '数据无价,请随时做好数据备份哦~' },
{ title: '204也是实验室,请遵守实验室纪律,请勿饮食~' }, { title: '204 也是实验室,请勿在内饮食~' },
{ title: '我们是志愿服务,不收任何礼物哦~' }, { title: '我们是志愿服务,不收任何礼物哦~' },
], ],
dutyCard: { dutyCard: {
offDuty: { offDuty: {