add entry for conclusion page

src/app.config.ts

@@ -11,6 +11,7 @@ export default defineAppConfig({
     'pages/TicketDetail/TicketDetail',
     'pages/TicketList/TicketList',
     'pages/AskLeave/AskLeave',
+    'pages/Conclusion/Conclusion',
     'pages/404/404',
   ],
   window: {

src/pages/Conclusion/Conclusion.config.ts

@@ -0,0 +1,3 @@
+export default definePageConfig({
+  usingComponents: {},
+});

src/pages/Conclusion/Conclusion.tsx

@@ -0,0 +1,190 @@
+import {
+  AtTextarea,
+  AtButton,
+  AtForm,
+  AtMessage,
+  AtInput,
+  AtList,
+  AtListItem,
+  AtModal,
+} from 'taro-ui';
+import { Component, ReactNode } from 'react';
+import Taro from '@tarojs/taro';
+import pt from '@/plain-text';
+import { Picker, View } from '@tarojs/components';
+import { askLeave } from '@/service/askleave';
+import './Conclusion.scss';
+
+const submitInterval = 5000;
+
+export default class ConclusionPage extends Component {
+  state = {
+    isLoading: false,
+    isDisable: false,
+    showModal: false,
+    range: [
+      ['周一', '周二', '周三', '周四', '周五', '周六', '周日'],
+      ['第一班', '第二班', '第三班'],
+    ],
+    shift: [0, 0],
+    reason: '',
+    substitute: '',
+  };
+
+  componentDidMount(): void {
+    Taro.setNavigationBarTitle({
+      title: pt.get().navBar.askLeave,
+    });
+  }
+
+  onShiftSelect(event) {
+    this.setState({
+      shift: event.detail.value,
+    });
+    console.log(event);
+  }
+
+  onModalClose() {
+    this.setState({
+      showModal: false,
+    });
+    setTimeout(() => {
+      this.setState({
+        isDisable: false,
+      });
+    }, submitInterval);
+  }
+
+  onModalCancel() {
+    this.setState({
+      showModal: false,
+    });
+    setTimeout(() => {
+      this.setState({
+        isDisable: false,
+      });
+    }, submitInterval);
+  }
+
+  onModalConfirm() {
+    this.setState({
+      showModal: false,
+    });
+    askLeave(this);
+    setTimeout(() => {
+      this.setState({
+        isDisable: false,
+      });
+    }, submitInterval);
+  }
+
+  handleReasonChange(reason: string) {
+    this.setState({
+      reason,
+    });
+  }
+
+  handleSubstituteChange(substitute: string) {
+    this.setState({
+      substitute,
+    });
+  }
+
+  onSubmit() {
+    this.setState({
+      isDisable: true,
+    });
+    if (this.state.reason == '') {
+      Taro.atMessage({
+        message: pt.get().button.submitText.blank,
+        type: 'error',
+      });
+      setTimeout(() => {
+        this.setState({
+          isDisable: false,
+        });
+      }, submitInterval);
+      return;
+    }
+    if (this.state.substitute == '') {
+      this.setState({
+        showModal: true,
+      });
+      return;
+    }
+    askLeave(this);
+    setTimeout(() => {
+      this.setState({
+        isDisable: false,
+      });
+    }, submitInterval);
+  }
+  render(): ReactNode {
+    return (
+      <View style={{ marginTop: '30rpx', width: '94%', marginLeft: '3%' }}>
+        <AtMessage />
+        <AtModal
+          isOpened={this.state.showModal}
+          title={pt.get().askLeave.modal.title}
+          cancelText={pt.get().modal.cancel}
+          confirmText={pt.get().modal.confirm}
+          onClose={this.onModalClose.bind(this)}
+          onCancel={this.onModalCancel.bind(this)}
+          onConfirm={this.onModalConfirm.bind(this)}
+          content={pt.get().askLeave.modal.content}
+        />
+        <AtForm onSubmit={this.onSubmit.bind(this)}>
+          <View style={{ width: '98%', marginLeft: '1%' }}>
+            <Picker
+              mode='multiSelector'
+              range={this.state.range}
+              onChange={this.onShiftSelect.bind(this)}
+              value={this.state.shift}
+            >
+              <AtList>
+                <AtListItem
+                  title={pt.get().askLeave.shift.title}
+                  extraText={
+                    pt.get().askLeave.shift.week[this.state.shift[0]] +
+                    pt.get().askLeave.shift.shift[this.state.shift[1]]
+                  }
+                />
+              </AtList>
+            </Picker>
+          </View>
+          <View
+            className='at-article__h3'
+            style={{ marginTop: '20rpx', marginBottom: '20rpx' }}
+          >
+            {pt.get().askLeave.reason.title}
+          </View>
+          <AtTextarea
+            value={this.state.reason}
+            onChange={this.handleReasonChange.bind(this)}
+            maxLength={200}
+            placeholder={pt.get().askLeave.reason.placeHolder}
+          />
+
+          <AtInput
+            name='substitute'
+            title={pt.get().askLeave.substitute.title}
+            type='text'
+            placeholder={pt.get().askLeave.substitute.placeHolder}
+            value={this.state.substitute}
+            onChange={this.handleSubstituteChange.bind(this)}
+          />
+          <View>
+            <AtButton
+              loading={this.state.isLoading}
+              formType='submit'
+              type='primary'
+              disabled={this.state.isDisable}
+            >
+              {pt.get().button.buttonText.submit}
+            </AtButton>
+          </View>
+        </AtForm>
+      </View>
+    );
+  }
+}

src/pages/index/index.tsx

@@ -153,6 +153,12 @@ export default class MainPage extends Component<{}, MainPageState> {
     });
   }
 
+  conclusionPage() {
+    Taro.navigateTo({
+      url: '/pages/Conclusion/Conclusion',
+    });
+  }
+
   render(): ReactNode {
     const mainPage = pt.get().mainPage;
     const memberPage = pt.get().memberPage;
@@ -185,6 +191,7 @@ export default class MainPage extends Component<{}, MainPageState> {
               <ExpandItem
                 title={memberPage.expandTitle.admin}
                 content={
+                  <View style={{ marginBottom: '40rpx' }}>
                     <View
                       style={{
                         display: 'flex',
@@ -226,6 +233,12 @@ export default class MainPage extends Component<{}, MainPageState> {
                         </AtButton>
                       </View>
                     </View>
+                    <View>
+                      <AtButton type='primary' onClick={this.conclusionPage}>
+                        {pt.get().button.indexText.conclusion}
+                      </AtButton>
+                    </View>
+                  </View>
                 }
               />
             ) : (

src/plain-text/Button.ts

@@ -13,6 +13,10 @@ export interface ButtonText {
   memberText: {
     auth: string;
   };
+  indexText: {
+    conclusion: string;
+    askLeave: string;
+  };
   loginText: {
     success: string;
     error: string;
@@ -39,6 +43,10 @@ export const buttonZhCn: ButtonText = {
   memberText: {
     auth: '协会统一身份认证登录',
   },
+  indexText: {
+    conclusion: '提交值班总结',
+    askLeave: '我要请假',
+  },
   loginText: {
     success: '登录成功',
     error: '登录失败',
@@ -65,6 +73,10 @@ export const buttonEnUs: ButtonText = {
   memberText: {
     auth: 'EVA Auth Login Entry',
   },
+  indexText: {
+    conclusion: 'Submit Duty Conclusion',
+    askLeave: 'Ask for Leave',
+  },
   loginText: {
     success: 'Login Success',
     error: 'Login Failed',

src/plain-text/MainPage.ts

@@ -4,6 +4,7 @@ export interface MainPageText {
     reason: string;
   };
   askLeave: string;
+  conclusion: string;
   titleLine: {
     main: string;
     sub: string;
@@ -50,6 +51,7 @@ export const mainPageZhCn: MainPageText = {
     reason: '正常下班',
   },
   askLeave: '我要请假',
+  conclusion: '提交值班总结',
   titleLine: {
     main: '您好，这里是E志者协会',
     sub: '维修请至【东三-204】实验室',
@@ -120,6 +122,7 @@ export const mainPageEnUs: MainPageText = {
     reason: 'Normal shift',
   },
   askLeave: 'Ask for leave',
+  conclusion: 'Submit Duty Conclusion',
   titleLine: {
     main: 'Hi! This is EVA.',
     sub: 'For maintenance, please go to [204 Lab, E3 building]',

src/plain-text/NavBarTitle.ts

@@ -3,6 +3,7 @@ export interface NavBarTitle {
   ticketDetail: string;
   ticketList: string;
   askLeave: string;
+  conclusion: string;
   user: {
     myTicket: string;
     report: string;
@@ -18,6 +19,7 @@ export const navBarTitleZhCn: NavBarTitle = {
   ticketDetail: '工单详情',
   ticketList: '所有工单',
   askLeave: '请假单填写',
+  conclusion: '值班总结',
   user: {
     myTicket: '我的工单',
     report: '意见反馈',
@@ -33,6 +35,7 @@ export const navBarTitleEnUs: NavBarTitle = {
   ticketDetail: 'Ticket Detail',
   ticketList: 'All Tickets',
   askLeave: 'Ask for leave',
+  conclusion: 'Duty Conclusion',
   user: {
     myTicket: 'My Tickets',
     report: 'Report',