import { Component, ReactNode } from 'react';
import { View } from '@tarojs/components';
import pt from '@/plain-text';

export class DutyData {
  constructor() {
    this.isInDuty = false;
    this.inDutyCnt = 3;
    this.currentDuty = '2';
    this.offDutyReason = '学园维修';
    this.dutyRecoverTime = '下周一';
  }

  isInDuty: boolean;
  inDutyCnt: number;
  currentDuty: 'off' | '1' | '2' | '3';
  offDutyReason: string; // from backend
  dutyRecoverTime: string; // from backend
}

export class DutyInfo extends Component {
  props = {
    data: new DutyData(),
  };

  offDutyContent(): ReactNode {
    const data = this.props.data;
    const od = pt.get().mainPage.dutyCard.offDuty;
    return (
      <View>
        <View>{od.title}</View>
        <View>{od.reason(data.offDutyReason)}</View>
        <View>{od.recoverTime(data.dutyRecoverTime)}</View>
      </View>
    );
  }

  inDutyContent(): ReactNode {
    const data = this.props.data;
    const id = pt.get().mainPage.dutyCard.inDuty;
    return (
      <View>
        <View>{id.title}</View>
        <View>{id.currentDutyText(data.currentDuty)}</View>
        <View>{id.inDutyCnt(data.inDutyCnt)}</View>
      </View>
    );
  }

  render(): ReactNode {
    if (this.props.data.isInDuty) {
      return this.inDutyContent();
    } else {
      return this.offDutyContent();
    }
  }
}