add reminder structure in ticketdetail

src/pages/TicketDetail/TicketDetail.tsx

@@ -6,6 +6,7 @@ import {
   AtActionSheet,
   AtActionSheetItem,
   AtButton,
+  AtCheckbox,
   AtFloatLayout,
   AtForm,
   AtMessage,
@@ -30,6 +31,7 @@ interface TicketDetailState {
   isMember: boolean;
   showOreoModal: boolean;
   showCommentLayout: boolean;
+  showReminderLayout: boolean;
   showRetrieveModal: boolean;
   showStatusSheet: boolean;
   showPickModal: boolean;
@@ -48,6 +50,10 @@ interface TicketDetailState {
   isCommentLoading: boolean;
   isCommentDisable: boolean;
   isCommentDisable_main: boolean;
+  isReminderLoading: boolean;
+  isReminderDisable: boolean;
+  reminderList: Array<number>;
+  statusToBe: number;
 }
 
 export default class TicketDetail extends Component<{}, TicketDetailState> {
@@ -56,6 +62,7 @@ export default class TicketDetail extends Component<{}, TicketDetailState> {
     isMember: false,
     showOreoModal: false,
     showCommentLayout: false,
+    showReminderLayout: false,
     showRetrieveModal: false,
     showStatusSheet: false,
     showPickModal: false,
@@ -74,6 +81,10 @@ export default class TicketDetail extends Component<{}, TicketDetailState> {
     isCommentLoading: false,
     isCommentDisable: false,
     isCommentDisable_main: false,
+    isReminderDisable: false,
+    isReminderLoading: false,
+    reminderList: [],
+    statusToBe: 0,
   };
 
   componentDidMount(): void {
@@ -128,6 +139,12 @@ export default class TicketDetail extends Component<{}, TicketDetailState> {
     });
   }
 
+  handleReminderCancel(): void {
+    this.setState({
+      showReminderLayout: false,
+    });
+  }
+
   handleRetrieveCancel(): void {
     this.setState({
       showRetrieveModal: false,
@@ -193,7 +210,14 @@ export default class TicketDetail extends Component<{}, TicketDetailState> {
       showStatusSheet: false,
       isStatusDisable: true,
     });
+    if (status == 3 || status == 5 || status == 7) {
+      this.setState({
+        showReminderLayout: true,
+        statusToBe: status,
+      });
+    } else {
       changeStatus(this, status);
+    }
     setTimeout(() => {
       this.setState({
         isStatusDisable: false,
@@ -234,6 +258,57 @@ export default class TicketDetail extends Component<{}, TicketDetailState> {
     }, submitInterval);
   }
 
+  handleReminderChange(reminderList: Array<number>) {
+    this.setState({
+      reminderList: reminderList,
+    });
+    return reminderList;
+  }
+
+  onReminderSubmit() {
+    this.setState({
+      isReminderDisable: true,
+    });
+    if (
+      this.state.reminderList.includes(1) &&
+      this.state.reminderList.includes(3)
+    ) {
+      this.setState({
+        showReminderLayout: false,
+      });
+      changeStatus(this, this.state.statusToBe);
+    } else {
+      Taro.atMessage({
+        message: pt.get().button.submitText.blank,
+        type: 'error',
+      });
+    }
+    setTimeout(() => {
+      this.setState({
+        isReminderDisable: false,
+      });
+    }, submitInterval);
+  }
+
+  reminderOption = [
+    {
+      value: 0,
+      label: pt.get().repairPage.checkboxText.none,
+    },
+    {
+      value: 1,
+      label: pt.get().repairPage.checkboxText.usbDisk,
+    },
+    {
+      value: 2,
+      label: pt.get().repairPage.checkboxText.mouseOrReceiver,
+    },
+    {
+      value: 3,
+      label: pt.get().repairPage.checkboxText.powerAdapter,
+    },
+  ];
+
   render(): ReactNode {
     const middleButton = this.state.isMember ? (
       <View>
@@ -402,6 +477,27 @@ export default class TicketDetail extends Component<{}, TicketDetailState> {
             </AtButton>
           </AtForm>
         </AtFloatLayout>
+        <AtFloatLayout
+          isOpened={this.state.showReminderLayout}
+          title={pt.get().ticketDetail.reminder.title}
+          onClose={this.handleReminderCancel.bind(this)}
+        >
+          <AtForm onSubmit={this.onReminderSubmit.bind(this)}>
+            <AtCheckbox
+              options={this.reminderOption}
+              selectedList={this.state.reminderList}
+              onChange={this.handleReminderChange.bind(this)}
+            />
+            <AtButton
+              loading={this.state.isReminderLoading}
+              formType='submit'
+              type='primary'
+              disabled={this.state.isReminderDisable}
+            >
+              {pt.get().button.buttonText.submit}
+            </AtButton>
+          </AtForm>
+        </AtFloatLayout>
         <AtActionSheet
           isOpened={this.state.showStatusSheet}
           cancelText={pt.get().ticketDetail.status.cancel}

src/plain-text/TicketDetail.ts

@@ -22,6 +22,9 @@ export interface TicketDetailText {
     pick: string;
     status: string;
   };
+  reminder: {
+    title: string;
+  };
   comment: {
     title: string;
     placeholder: string;
@@ -72,6 +75,9 @@ export const ticketDetailZhCn: TicketDetailText = {
     createTicketMessage: '创建了维修',
     statusModifyPrefix: '将维修状态改为：',
   },
+  reminder: {
+    title: '注意事项！',
+  },
   status: {
     title: '请选择要改变成为的状态',
     cancel: '取消',
@@ -117,6 +123,9 @@ export const ticketDetailEnUs: TicketDetailText = {
     createTicketMessage: 'Created ticket',
     statusModifyPrefix: 'Modified repair status to: ',
   },
+  reminder: {
+    title: 'Reminder',
+  },
   status: {
     title: 'Please select the status you want to modify to',
     cancel: 'Cancel',