more convertion

This commit is contained in:
Olivier Gagnon 2021-08-28 00:11:42 -04:00
parent a8254e7144
commit 07c0b708d7
6 changed files with 71 additions and 68 deletions

@ -0,0 +1,5 @@
export interface IDivision {
name: string;
offices: IMap<IOfficeSpace>;
}

@ -0,0 +1,15 @@
export interface IOfficeSpace {
loc: string;
cost: number;
size: number;
comf: number;
beau: number;
tier: any;
minEne: number;
maxEne: number;
minHap: number;
maxHap: number;
maxMor: number;
employees: any;
employeeProd: any;
}

@ -6,7 +6,7 @@ interface IProps {
onClick: () => void;
}
export function HeaderTab(props: IProps) {
export function HeaderTab(props: IProps): React.ReactElement {
let className = "cmpy-mgmt-header-tab";
if (props.current) {
className += " current";

@ -1,66 +0,0 @@
// React Components for the Corporation UI's navigation tabs
// These are the tabs at the top of the UI that let you switch to different
// divisions, see an overview of your corporation, or create a new industry
import React from "react";
import { BaseReactComponent } from "./BaseReactComponent";
import { HeaderTab } from "./HeaderTab";
export class HeaderTabs extends BaseReactComponent {
renderTab(props) {
return (
<HeaderTab
current={props.current}
key={props.key}
onClick={props.onClick}
text={props.text}
/>
)
}
render() {
const overviewOnClick = () => {
this.routing().routeToOverviewPage();
this.corp().rerender();
}
const divisionOnClicks = {};
for (const division of this.corp().divisions) {
const name = division.name;
const onClick = () => {
this.routing().routeTo(name);
this.corp().rerender();
}
divisionOnClicks[name] = onClick;
}
return (
<div>
{
this.renderTab({
current: this.routing().isOnOverviewPage(),
key: "overview",
onClick: overviewOnClick,
text: this.corp().name,
})
}
{
this.corp().divisions.map((division) => {
return this.renderTab({
current: this.routing().isOn(division.name),
key: division.name,
onClick: divisionOnClicks[division.name],
text: division.name,
});
})
}
{
this.renderTab({
onClick: this.eventHandler().createNewIndustryPopup.bind(this.eventHandler()),
text: "Expand into new Industry",
})
}
</div>
)
}
}

@ -0,0 +1,49 @@
// React Components for the Corporation UI's navigation tabs
// These are the tabs at the top of the UI that let you switch to different
// divisions, see an overview of your corporation, or create a new industry
import React from "react";
import { HeaderTab } from "./HeaderTab";
import { IDivision } from "../IDivision";
interface IProps {
corp: any;
eventHandler: any;
routing: any;
}
export function HeaderTabs(props: IProps): React.ReactElement {
console.log(props);
function overviewOnClick() {
props.routing.routeToOverviewPage();
props.corp.rerender();
}
return (
<div>
<HeaderTab
current={props.routing.isOnOverviewPage()}
key={"overview"}
onClick={overviewOnClick}
text={props.corp.name}
/>
{
props.corp.divisions.map((division: IDivision) =>
<HeaderTab
current={props.routing.isOn(division.name)}
key={division.name}
onClick={() => {
props.routing.routeTo(division.name);
props.corp.rerender();
}}
text={division.name}
/>)
}
<HeaderTab
current={false}
onClick={props.eventHandler.createNewIndustryPopup}
text={"Expand into new Industry"}
/>
</div>
)
}

@ -9,7 +9,7 @@ export class CorporationRoot extends BaseReactComponent {
render() {
return (
<div>
<HeaderTabs {...this.props} />
<HeaderTabs corp={this.props.corp} eventHandler={this.props.eventHandler} routing={this.props.routing} />
<MainPanel {...this.props} />
</div>
)