refactor note card to component

src/components/NoteCard/NoteCard.config.ts

@@ -0,0 +1,3 @@
+export default {
+  component: true,
+};

src/components/NoteCard/NoteCard.tsx

@@ -0,0 +1,45 @@
+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 './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>
+          {note.op} {note.createdTime.format(timeFormat)}
+        </View>
+        <View>{message}</View>
+      </View>
+    );
+  }
+}

src/components/NoteList/NoteList.config.ts

@@ -0,0 +1,3 @@
+export default {
+  component: true,
+};

src/components/NoteList/NoteList.tsx

@@ -0,0 +1,25 @@
+import { Component, ReactNode } from 'react';
+import NoteCard from '@/components/NoteCard/NoteCard';
+import { TicketNote } from '@/pages/TicketDetail/TicketNote';
+import { View } from '@tarojs/components';
+
+interface NoteListProps {
+  noteList: Array<TicketNote>;
+}
+
+export default class NoteList extends Component<NoteListProps, {}> {
+  props: Readonly<NoteListProps> = {
+    noteList: [],
+  };
+  render(): ReactNode {
+    return (
+      <View>
+        {this.props.noteList.map((note, idx) => (
+          <View key={idx} style={{ marginTop: 8 }}>
+            <NoteCard note={note} />
+          </View>
+        ))}
+      </View>
+    );
+  }
+}