import { View } from '@tarojs/components';
import { Component, ReactNode } from 'react';
import { TicketNote, StatusStr } from '@/pages/TicketDetail/TicketNote';
import pt from '@/plain-text';
import { timeFormat } from '@/utils';
import { AtDivider } from 'taro-ui';
import './NoteCard.scss';

interface NoteCardProps {
  note: TicketNote;
}

export default class NoteCard extends Component<NoteCardProps, {}> {
  props: Readonly<NoteCardProps> = {
    note: new TicketNote(),
  };

  render(): ReactNode {
    var message = '';
    const note = this.props.note;
    const td = pt.get().ticketDetail;
    const createMessage = td.createTicketMessage;
    const modifyMessage = td.statusModifyMessage;
    const prefix = td.statusModifyPrefix;

    switch (note.type) {
      case 0:
        message = createMessage;
        break;
      case 1:
        message = note.content;
        break;
      case 2:
        message = prefix + modifyMessage.get(note.content as StatusStr) || '';
        break;
    }

    return (
      <View>
        <View className='at-article__h2'>{note.op}</View>
        <View className='at-article__info'>
          {note.createdTime.format(timeFormat)}
        </View>
        <View className='at-article__p'>{message}</View>
        <AtDivider />
      </View>
    );
  }
}
