wrap up detailframework in atcard in repair page

README.md

@@ -58,6 +58,7 @@
 ## 主页
 
 1.  信息显示
+    1. 不显示是哪一班，只显示今日值班时间
 2.  （协会成员）相关信息
 3.  提醒事项
 4.  如何联系到协会
@@ -68,8 +69,21 @@
 2.  维修进度提示
 3.  （面向协会成员）维修列表
 
+## 成员
+
+1. 最近七天内未取回的工单列表
+2. 值班组长上传本班相关信息
+3. 现在自己是否要值班（值班时间显示）
+
+
 ## 我的
 
 1.  更改手机号等个人信息（手机号可以填写多个）
 2.  （备选）修改用户名、头像
 3.  设置真名（可帮助预填写工单）
+
+# 主席团管理页面
+
+1. 值班表导入、更新
+2. 成员权限管理
+3. 特殊维修时间（如学园维修）、值班信息更新

mock/mytickets.json

@@ -3,7 +3,7 @@
     {
       "id": 6830,
       "type": 1,
-      "status": 5,
+      "status": 2,
       "device": "主机",
       "deviceModel": "技嘉",
       "owner": "武技栏",

mock/ticketInfo.json

@@ -1,5 +1,5 @@
 {
-  "id": 6847,
+  "id": 6830,
   "type": 1,
   "device": "华硕",
   "deviceModel": "灵耀X14",
@@ -8,7 +8,7 @@
   "description": "清灰",
   "workers": [],
   "createdTime": "2024-03-07T19:52:48.523303",
-  "status": 5,
+  "status": 2,
   "isConfirmed": false,
   "notes": [
     {

mock/uncompleted.json

@@ -1,7 +1,7 @@
 {
   "list": [
     {
-      "id": 6830,
+      "id": 6832,
       "type": 1,
       "status": 2,
       "device": "ROG",

src/components/DetailFramework/DetailFramework.tsx

@@ -1,14 +1,21 @@
 import { View } from '@tarojs/components';
-import { AtCard, AtSteps } from 'taro-ui';
 import { Component, ReactNode } from 'react';
 import Taro from '@tarojs/taro';
-import { TicketInfo, TicketNote } from '@/pages/TicketDetail/TicketNote';
-import NoteList from '@/components/NoteList/NoteList';
-import PageFooter from '@/components/PageFooter/PageFooter';
+import {
+  ShowElements,
+  TicketInfo,
+  TicketNote,
+} from '@/pages/TicketDetail/TicketNote';
 import pt from '@/plain-text';
 import { RequestState } from '@/service';
 import { getTicketInfo } from '@/service/ticketsInfo';
 import { FixStatus } from '@/common';
+import { AtCard, AtSteps } from 'taro-ui';
+import NoteList from '../NoteList/NoteList';
+
+interface StepItemData {
+  title: string;
+}
 
 const mapStatusStep: Map<FixStatus, 0 | 1 | 2 | 3> = new Map([
   [1, 0],
@@ -18,10 +25,6 @@ const mapStatusStep: Map<FixStatus, 0 | 1 | 2 | 3> = new Map([
   [5, 3],
 ]);
 
-interface StepItemData {
-  title: string;
-}
-
 interface DetailFrameworkState {
   current: number;
   items: Array<StepItemData>;
@@ -33,6 +36,7 @@ interface DetailFrameworkState {
 interface DetailFrameworkProps {
   middleButton: JSX.Element;
   id: number;
+  isInfoShow: { [key: string]: boolean };
 }
 
 export default class DetailFramework extends Component<
@@ -52,16 +56,20 @@ export default class DetailFramework extends Component<
     Taro.setNavigationBarTitle({
       title: navBar.ticketDetail,
     });
-    const items = pt.get().ticketDetail.stepItems;
-    this.setState({
-      items: items,
-    });
     getTicketInfo(this, this.props.id);
   }
 
   props: Readonly<DetailFrameworkProps> = {
     middleButton: <View></View>,
     id: 0,
+    isInfoShow: {
+      device: true,
+      createdTime: true,
+      description: true,
+      current: true,
+      notelist: true,
+      showAllNotes: true,
+    },
   };
 
   render(): ReactNode {
@@ -74,18 +82,27 @@ export default class DetailFramework extends Component<
     const status = this.state.ticketInfo.status;
     this.setState({
       current: mapStatusStep.get(status) || 0,
+      items: pt.get().ticketDetail.stepItems,
     });
 
-    return (
-      <View>
+    const elements: ShowElements = {
+      device: this.props.isInfoShow['device'] ? (
         <View className='at-article__h1'>
           {this.state.ticketInfo.device +
             ' ' +
             this.state.ticketInfo.deviceModel}
         </View>
+      ) : (
+        <View></View>
+      ),
+      createdTime: this.props.isInfoShow['createdTime'] ? (
         <View className='at-article__info'>
           {pt.get().common.createdAtText(this.state.ticketInfo.createdTime)}
         </View>
+      ) : (
+        <View></View>
+      ),
+      description: this.props.isInfoShow['description'] ? (
         <View style={{ marginTop: 10, marginBottom: 10 }}>
           <AtCard title={pt.get().ticketDetail.descTitle}>
             <View className='at-article__h3'>
@@ -93,6 +110,10 @@ export default class DetailFramework extends Component<
             </View>
           </AtCard>
         </View>
+      ) : (
+        <View></View>
+      ),
+      current: this.props.isInfoShow['current'] ? (
         <View style={{ padding: 10 }}>
           <AtSteps
             items={this.state.items}
@@ -100,13 +121,34 @@ export default class DetailFramework extends Component<
             onChange={() => {}}
           />
         </View>
+      ) : (
+        <View></View>
+      ),
+      notelist: this.props.isInfoShow['notelist'] ? (
+        this.props.isInfoShow['showAllNotes'] ? (
+          <View style={{ padding: 10 }}>
+            <NoteList noteList={this.state.notes} />
+          </View>
+        ) : (
+          <View style={{ padding: 10 }}>
+            <NoteList
+              noteList={[this.state.notes[this.state.notes.length - 1]]}
+            />
+          </View>
+        )
+      ) : (
+        <View></View>
+      ),
+    };
 
+    return (
+      <View>
+        {elements.device}
+        {elements.createdTime}
+        {elements.description}
+        {elements.current}
         {this.props.middleButton}
-
-        <View style={{ padding: 10 }}>
-          <NoteList noteList={this.state.notes} />
-        </View>
-        <PageFooter />
+        {elements.notelist}
       </View>
     );
   }

src/components/TicketListItem/TicketListItem.config.ts

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

src/pages/TicketDetail/TicketDetail.tsx

@@ -4,6 +4,7 @@ import { getCurrentInstance } from '@tarojs/runtime';
 import pt from '@/plain-text';
 import { AtButton } from 'taro-ui';
 import DetailFramework from '@/components/DetailFramework/DetailFramework';
+import PageFooter from '@/components/PageFooter/PageFooter';
 
 interface TicketDetailState {
   id: number;
@@ -43,9 +44,23 @@ export default class TicketDetail extends Component<{}, TicketDetailState> {
       </View>
     );
 
+    const isInfoShow = {
+      device: true,
+      createdTime: true,
+      description: true,
+      current: true,
+      notelist: true,
+      showAllNotes: true,
+    };
+
     return (
       <View>
-        <DetailFramework middleButton={middleButton} id={this.state.id} />
+        <DetailFramework
+          middleButton={middleButton}
+          id={this.state.id}
+          isInfoShow={isInfoShow}
+        />
+        <PageFooter />
       </View>
     );
   }

src/pages/TicketDetail/TicketNote.ts

@@ -18,4 +18,12 @@ export class TicketNote {
   createdTime: moment.Moment;
 }
 
+export class ShowElements {
+  device: JSX.Element;
+  createdTime: JSX.Element;
+  description: JSX.Element;
+  current: JSX.Element;
+  notelist: JSX.Element;
+}
+
 export type StatusStr = '1' | '2' | '3' | '4' | '5';

src/pages/index/TitleCard.tsx

@@ -12,6 +12,7 @@ export default class TitleCard extends React.Component {
           <Image
             style='width: 50px; height: 50px; margin-left: 15px;'
             src={logo}
+            mode='aspectFit'
           />
         </View>
         <View className='page-title'>

src/pages/repair/repair.tsx

@@ -15,6 +15,8 @@ import PageFooter from '@/components/PageFooter/PageFooter';
 import { submitTicket } from '@/service/submitTicket';
 import type CustomTabBar from '@/custom-tab-bar';
 import repairLogo from '@/assets/icons/RepairPage/repair.svg';
+import DetailFramework from '@/components/DetailFramework/DetailFramework';
+import { getCurrentTicket } from '@/service/currentTicket';
 import './repair.scss';
 
 interface RepairPageState {
@@ -27,10 +29,22 @@ interface RepairPageState {
   isLoading: boolean;
   isDisable: boolean;
   checkedList: Array<number>;
+  currentTicketsId: Array<number>;
 }
 
 const submitInterval = 5000;
 
+const middleButton = <View></View>;
+
+const isInfoShow = {
+  device: true,
+  createdTime: true,
+  description: false,
+  current: true,
+  notelist: true,
+  showAllNotes: false,
+};
+
 export default class RepairPage extends Component<{}, RepairPageState> {
   state = {
     type: 1 as 0 | 1,
@@ -42,9 +56,12 @@ export default class RepairPage extends Component<{}, RepairPageState> {
     isLoading: false,
     isDisable: true,
     checkedList: [0],
+    currentTicketsId: [] as Array<number>,
   };
 
   componentDidMount(): void {
+    getCurrentTicket(this, middleButton, isInfoShow);
+
     setTimeout(() => {
       this.setState({
         isDisable: false,
@@ -145,9 +162,20 @@ export default class RepairPage extends Component<{}, RepairPageState> {
   }
 
   render(): ReactNode {
+    const ticketsRenderer = this.state.currentTicketsId.map((id, idx) => (
+      <AtCard key={idx}>
+        <DetailFramework
+          id={id}
+          isInfoShow={isInfoShow}
+          middleButton={middleButton}
+        />
+      </AtCard>
+    ));
+    console.log(ticketsRenderer);
     return (
       <View>
         <AtMessage />
+        {ticketsRenderer}
         <AtCard
           note={pt.get().repairPage.cardText.note}
           title={pt.get().repairPage.cardText.title}

src/pages/user/myTicket/myTicket.tsx

@@ -6,8 +6,8 @@ import moment from 'moment';
 import pt from '@/plain-text';
 import { RequestState } from '@/service';
 import { getMyTicketList } from '@/service/myTicket';
+import { TicketListItem } from '@/components/TicketListItem/TicketListItem';
 import './myTicket.scss';
-import { TicketListItem } from './TicketListItem';
 
 interface MyTicketState {
   fixList: Array<TicketListItem>;

src/pages/user/user.tsx

@@ -111,6 +111,7 @@ export default class UserPage extends Component {
             onTap={this.onTapImage}
             style='width: 100px;height: 100px;'
             src={logo}
+            mode='aspectFit'
           />
         </View>
         <AtToast

src/plain-text/Button.ts

@@ -41,7 +41,7 @@ export const buttonEnUs: ButtonText = {
     error: 'Error: ',
   },
   loginText: {
-    success: '登录成功',
-    error: '登录失败',
+    success: 'Login Success',
+    error: 'Login Failed',
   },
 };

src/plain-text/InformPage.ts

@@ -23,10 +23,10 @@ export const informPageZhCn: InformPageText = {
 export const informPageEnUs: InformPageText = {
   phoneText: {
     title: 'Phone',
-    placeholder: '便于查询工单',
+    placeholder: 'Used for querying tickets',
   },
   nameText: {
     title: 'Real Name',
-    placeholder: '必填，与工单绑定',
+    placeholder: '(Required) Bounded to your ticket',
   },
 };

src/plain-text/MainPage.ts

@@ -97,21 +97,21 @@ export const mainPageZhCn: MainPageText = {
 };
 
 export const mainPageEnUs: MainPageText = {
-  mainTitleLine: '您好，这里是E志者协会',
-  subTitleLine: '维修请至【东三-204】实验室',
+  mainTitleLine: 'Hi! This is EVA.',
+  subTitleLine: 'For maintenance, please go to [204 Lab, E3 building]',
   cardTitle: {
-    dutyInfo: '204 值班情况',
-    stepInfo: '维修步骤',
-    tipsInfo: '注意事项',
+    dutyInfo: 'Duty Situation',
+    stepInfo: 'Maintenance Steps',
+    tipsInfo: 'Tips',
   },
   cardTips: {
-    dutyInfo: '提示：可以先前往【维修】页面，在线上预填写工单！',
-    stepInfo: '提示：请在 20:30 之前取走自己的物品哦！',
+    dutyInfo: 'Tips: Please go to [Repair] and filling out tickets online.',
+    stepInfo: 'Tips: Please retrieve your devices before 20:30!',
     tipsInfo: '',
   },
   expandTitle: {
-    stepInfo: '查看维修步骤',
-    tipsInfo: '查看注意事项',
+    stepInfo: 'Check for maintenance steps',
+    tipsInfo: 'Check for tips',
   },
   extraInfo: {
     dutyInfo: '',
@@ -119,38 +119,38 @@ export const mainPageEnUs: MainPageText = {
     tipsInfo: '',
   },
   stepList: [
-    { title: '线上填写工单' },
-    { title: '去【东三-204】实验室维修电脑' },
-    { title: '等待电脑维修' },
-    { title: '维修结束，取回电脑' },
+    { title: 'Filling out tickets online' },
+    { title: 'Go to [204 Lab, E3 building] for maintenance' },
+    { title: 'Waiting for the device maintenance' },
+    { title: 'The maintenance is over, retrieve the device' },
   ],
   tipsList: [
-    { title: '戴尔/外星人、Surface、苹果电脑不能拆机哦~' },
-    { title: '数据无价，请随时做好数据备份哦~' },
-    { title: '204 也是实验室，请勿在内饮食~' },
-    { title: '我们是志愿服务，不收取任何礼物哦~' },
+    { title: 'Dell/Alienware, Surface, Apple cannot be dissassembled.' },
+    { title: 'Data is priceless, please backup your data at any time!' },
+    { title: '204 is also a laboratory. Do not eat inside.' },
+    { title: 'We are volunteers and do not take any gifts.' },
   ],
   dutyCard: {
     offDuty: {
-      title: '未值班',
-      reason: (s) => '值班停止原因：' + s,
-      recoverTime: (t) => '恢复值班时间：' + t,
+      title: 'Off Duty',
+      reason: (s) => 'Reason for cessation of duty: ' + s,
+      recoverTime: (t) => 'Resumption of duty: ' + t,
     },
     inDuty: {
-      title: '值班中',
+      title: 'On Duty',
       currentDutyText: (c) => {
         switch (c) {
           case 'off':
-            return '当前未值班';
+            return 'Currently not on duty';
           case '1':
-            return '第一班 13:30-16:00';
+            return '1st Shift 13:30-16:00';
           case '2':
-            return '第二班 16:00-18:00';
+            return '2nd Shift 16:00-18:00';
           case '3':
-            return '第三班 18:00-20:30';
+            return '3rd Shift 18:00-20:30';
         }
       },
-      inDutyCnt: (n) => '当前值班人数：' + n,
+      inDutyCnt: (n) => 'EVA members on duty: ' + n,
     },
   },
 };

src/plain-text/MemberPage.ts

@@ -23,10 +23,10 @@ export const memberPageZhCn: MemberPageText = {
 export const memberPageEnUs: MemberPageText = {
   stuidText: {
     title: 'Student ID',
-    placeholder: '与统一身份认证学号一致',
+    placeholder: 'Consistent with EVA Auth',
   },
   passwdText: {
     title: 'Password',
-    placeholder: '与 EVA 统一身份认证一致',
+    placeholder: 'Consistent with EVA Auth',
   },
 };

src/plain-text/RepairPage.ts

@@ -1,4 +1,10 @@
 export interface RepairPageText {
+  currentTicket: {
+    errorMessage: string;
+    title: string;
+    note: string;
+    extra: string;
+  };
   typeText: {
     computer: string;
     appliance: string;
@@ -40,6 +46,12 @@ export interface RepairPageText {
 }
 
 export const repairPageZhCn: RepairPageText = {
+  currentTicket: {
+    errorMessage: '未获取到工单！',
+    title: '',
+    note: '',
+    extra: '',
+  },
   typeText: {
     computer: '电脑',
     appliance: '电器',
@@ -81,42 +93,48 @@ export const repairPageZhCn: RepairPageText = {
 };
 
 export const repairPageEnUs: RepairPageText = {
+  currentTicket: {
+    errorMessage: '未获取到工单！',
+    title: '',
+    note: '',
+    extra: '',
+  },
   typeText: {
-    computer: '电脑',
-    appliance: '电器',
+    computer: 'Computer',
+    appliance: 'Appliance',
   },
   deviceText: {
-    title: '设备品牌',
+    title: 'Brand',
     placeholder: 'e.g. ROG',
   },
   deviceModelText: {
-    title: '设备型号',
+    title: 'Device Model',
     placeholder: 'e.g. Zephyrus G14 2022',
   },
   ownerText: {
-    title: '机主姓名',
+    title: 'Name',
     placeholder: 'e.g. Dean Ma',
   },
   phoneText: {
-    title: '联系方式',
+    title: 'Tel',
     placeholder: 'e.g. 18888888888',
   },
   descriptionText: {
-    title: '问题描述',
-    placeholder: 'e.g. ZJUWLAN 无法登入校内网站',
+    title: 'Problem Description',
+    placeholder: 'e.g. ZJUWLAN inaccessable',
   },
   checkboxText: {
-    none: '无附件',
-    usbDisk: 'U 盘',
-    mouseOrReceiver: '鼠标/接收器',
-    powerAdapter: '电源适配器',
+    none: 'None',
+    usbDisk: 'USB Disk',
+    mouseOrReceiver: 'Mouse/Receiver',
+    powerAdapter: 'Power Adapter',
     others: {
-      label: '其他',
-      desc: '请于评论中详述',
+      label: 'Others',
+      desc: 'Please elaborate in the comments',
     },
   },
   cardText: {
-    note: '工单描述请尽量简短哦！',
-    title: '预填写工单',
+    note: 'Please keep the ticket description as short as possible',
+    title: 'Pre-filling working tickets',
   },
 };

src/plain-text/ReportPage.ts

@@ -9,5 +9,5 @@ export const reportPageZhCn: ReportPageText = {
 
 export const reportPageEnUs: ReportPageText = {
   placeHolderText:
-    '无论是有关于小程序的建议，还是关于E志者协会的建议，都可以提出来哦！',
+    'Feel free to post your suggestions about the weapp or about us!',
 };

src/plain-text/TicketDetail.ts

@@ -40,7 +40,7 @@ export const ticketDetailEnUs: TicketDetailText = {
     { title: 'Created' },
     { title: 'Repairing' },
     { title: 'Finished' },
-    { title: 'Retrived' },
+    { title: 'Retrieved' },
   ],
   createTicketMessage: 'Created ticket',
   statusModifyPrefix: 'Modified repair status to: ',
@@ -48,10 +48,10 @@ export const ticketDetailEnUs: TicketDetailText = {
     ['1', 'Repairing'],
     ['2', '2(?)'],
     ['3', '3(?)'],
-    ['4', 'Device to be taken home'],
+    ['4', 'Device to be retrieved'],
     ['5', 'Ticket finished'],
   ]),
   descTitle: 'Problem description',
-  tookAway: 'Already took home',
+  tookAway: 'Already retrieved',
   addNote: 'Add a comment',
 };

src/plain-text/TicketList.ts

@@ -20,13 +20,13 @@ export const ticketListZhCn: TicketListText = {
 
 export const ticketListEnUs: TicketListText = {
   createdAt: (time) => {
-    return '创建于' + ' ' + time;
+    return 'Created at' + ' ' + time;
   },
   statusMap: new Map([
-    [1, '创建成功'],
-    [2, '维修中'],
-    [3, '待取回'],
-    [4, '已取回'],
-    [5, '已取回'],
+    [1, 'Created'],
+    [2, 'Repairing'],
+    [3, 'Pending Retrieval'],
+    [4, 'Retrieved'],
+    [5, 'Retrieved'],
   ]),
 };

src/plain-text/UserPage.ts

@@ -54,27 +54,27 @@ export const userPageZhCn: UserPageText = {
 
 export const userPageEnUs: UserPageText = {
   memberEntry: {
-    front: '再点击 ',
-    behind: ' 次以进入协会成员登录页面',
+    front: 'Click ',
+    behind: ' more times to enter member login page',
   },
   ticketColumn: {
-    title: '我的工单',
-    note: '在这里查看历史工单！',
+    title: 'My Tickets',
+    note: 'View the history of your tickets here!',
   },
   infoColumn: {
-    title: '我的信息',
-    note: '能帮助亦可更好地找到你哦！',
+    title: 'My Information',
+    note: 'It will help us contact you!',
   },
   settingsColumn: {
     title: 'Settings',
-    note: '在这里配置小程序',
+    note: 'Configure the applet here!',
   },
   reportColumn: {
-    title: '意见反馈',
-    note: '有什么想说的都可以告诉亦可哦！',
+    title: 'Report',
+    note: 'Let us know if you have any suggestions!',
   },
   aboutColumn: {
-    title: '关于我们',
-    note: '查看开发者信息',
+    title: 'About Us',
+    note: 'View developer information.',
   },
 };

src/service/currentTicket.ts

@@ -0,0 +1,35 @@
+import RepairPage from '@/pages/repair/repair';
+import Taro from '@tarojs/taro';
+import { TicketListItem } from '@/components/TicketListItem/TicketListItem';
+import pt from '@/plain-text';
+import DetailFramework from '@/components/DetailFramework/DetailFramework';
+import { getUrl } from '.';
+
+export function getCurrentTicket(that: RepairPage, middleButton, isInfoShow) {
+  Taro.request({
+    url: getUrl('/user/mytickets'),
+    method: 'GET',
+    data: {
+      token: 'token_test',
+    },
+  })
+    .then((res) => {
+      const data = res.data.data;
+      let newIdList: Array<number> = [];
+      data.list.map((ticket: TicketListItem) => {
+        if (ticket['status'] !== 5) {
+          newIdList.push(ticket.id);
+        }
+      });
+      that.setState({
+        currentTicketsId: newIdList,
+      });
+    })
+    .catch((err) => {
+      console.log(err);
+      Taro.atMessage({
+        message: pt.get().button.submitText.error + err.toString(),
+        type: 'error',
+      });
+    });
+}

src/service/myTicket.ts

@@ -1,5 +1,5 @@
 import MyTicketPage from '@/pages/user/myTicket/myTicket';
-import { TicketListItem } from '@/pages/user/myTicket/TicketListItem';
+import { TicketListItem } from '@/components/TicketListItem/TicketListItem';
 import Taro from '@tarojs/taro';
 import moment from 'moment';
 import { getUrl } from '.';
@@ -13,20 +13,15 @@ export function getMyTicketList(that: MyTicketPage) {
     },
   })
     .then((res) => {
+      let former = that.state.rs;
       if (!res.data.success) {
         that.setState({
-          rs: {
-            loading: false,
-            success: false,
-          },
+          rs: former.trans(false),
         });
         return;
       }
       that.setState({
-        rs: {
-          loading: false,
-          success: true,
-        },
+        rs: former.trans(true),
         fixList: res.data.data.list.map(
           (item) =>
             new TicketListItem(
@@ -40,11 +35,9 @@ export function getMyTicketList(that: MyTicketPage) {
       });
     })
     .catch((reason) => {
+      let former = that.state.rs;
       that.setState({
-        rs: {
-          loading: false,
-          success: false,
-        },
+        rs: former.trans(false),
       });
       console.log(reason);
     });