mock/api.ts

@@ -38,7 +38,7 @@ export default {
     success: true,
     data: mytickets,
   },
-  'GET /tickets/info': {
+  'GET /tickets/info/': {
     success: true,
     data: ticketInfo,
   },

src/pages/TicketDetail/TicketDetail.tsx

@@ -4,43 +4,15 @@ import { getCurrentInstance } from '@tarojs/runtime';
 import Taro from '@tarojs/taro';
 import pt from '@/plain-text';
 import { AtSteps } from 'taro-ui';
-import moment from 'moment';
-import { RequestState } from '@/service';
-import { getTicketInfo } from '@/service/ticketsInfo';
 
 interface StepItemData {
   title: string;
 }
 
-export class TicketInfo {
-  id: number;
-  type: 0 | 1;
-  device: string;
-  deviceModel: string;
-  description: string;
-  createdTime: moment.Moment;
-  status: 1 | 2 | 3 | 4 | 5;
-}
-
-export class TicketNote {
-  id: number;
-  op: string;
-  type: 0 | 1 | 2;
-  content: string;
-  createdTime: moment.Moment;
-}
-
-function renderNote(n: TicketNote): JSX.Element {
-  return <View>{n.id}</View>;
-}
-
 interface TicketDetailState {
   id: number;
   current: number;
   items: Array<StepItemData>;
-  ticketInfo: TicketInfo;
-  notes: Array<TicketNote>;
-  rs: RequestState;
 }
 
 export default class TicketDetail extends Component<{}, TicketDetailState> {
@@ -48,11 +20,7 @@ export default class TicketDetail extends Component<{}, TicketDetailState> {
     id: 0,
     current: 0,
     items: [],
-    ticketInfo: new TicketInfo(),
-    notes: [new TicketNote()],
-    rs: new RequestState(),
   };
-
   componentDidMount(): void {
     const navBar = pt.get().navBar;
     Taro.setNavigationBarTitle({
@@ -65,27 +33,16 @@ export default class TicketDetail extends Component<{}, TicketDetailState> {
       id: id,
       items: items,
     });
-
-    getTicketInfo(this);
   }
-
   render(): ReactNode {
-    if (this.state.rs.loading) {
-      return <View>Loading</View>;
-    } else if (!this.state.rs.success) {
-      return <View>Request failed</View>;
-    }
-
     return (
       <View>
-        <View>{this.state.ticketInfo.deviceModel}</View>
         <AtSteps
           items={this.state.items}
           current={this.state.current}
           onChange={() => {}}
         />
         <View>TicketDetail: {this.state.id}</View>
-        <View>{this.state.notes.map(item => renderNote(item))}</View>
       </View>
     );
   }

src/pages/repair/repair.tsx

@@ -1,37 +1,10 @@
-import { View } from '@tarojs/components';
+import { View, Text } from '@tarojs/components';
 import { Component, ReactNode } from 'react';
 import Taro from '@tarojs/taro';
-import { AtForm, AtInput, AtButton, AtRadio, AtCheckbox } from 'taro-ui';
+import type CustomTabBar from '../../custom-tab-bar';
-import pt from '@/plain-text';
-import PageFooter from '@/components/PageFooter/PageFooter';
-import { submitTicket } from '@/service/submitTicket';
-import type CustomTabBar from '@/custom-tab-bar';
 import './repair.scss';
 
-interface RepairPageState {
+export default class RepairPage extends Component {
-  type: 0 | 1;
-  device: string;
-  deviceModel: string;
-  owner: string;
-  phone: string;
-  description: string;
-  isLoading: boolean;
-  isDisable: boolean;
-  checkedList: Array<number>;
-}
-
-export default class RepairPage extends Component<{}, RepairPageState> {
-  state = {
-    type: 1 as 0 | 1,
-    device: '',
-    deviceModel: '',
-    owner: '',
-    phone: '',
-    description: '',
-    isLoading: false,
-    isDisable: false,
-    checkedList: [0],
-  };
   // 以下是TabBar相关
   pageCtx = Taro.getCurrentInstance().page;
   componentDidShow() {
@@ -40,160 +13,10 @@ export default class RepairPage extends Component<{}, RepairPageState> {
   }
   // 以上是TabBar相关
 
-  handleTypeChange(type: 0 | 1) {
-    this.setState({
-      type: type,
-    });
-    return type;
-  }
-
-  handleDeviceChange(device: string) {
-    this.setState({
-      device: device,
-    });
-    return device;
-  }
-
-  handleDeviceModelChange(deviceModel: string) {
-    this.setState({
-      deviceModel: deviceModel,
-    });
-    return deviceModel;
-  }
-
-  handleOwnerChange(owner: string) {
-    this.setState({
-      owner: owner,
-    });
-    return owner;
-  }
-
-  handlePhoneChange(phone: string) {
-    this.setState({
-      phone: phone,
-    });
-    return phone;
-  }
-
-  handleDescriptionChange(description: string) {
-    this.setState({
-      description: description,
-    });
-    return description;
-  }
-
-  checkboxOption = [
-    {
-      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,
-    },
-    {
-      value: 4,
-      label: pt.get().repairPage.checkboxText.others.label,
-      desc: pt.get().repairPage.checkboxText.others.desc,
-    },
-  ];
-
-  handleCheckboxChange(checkedList: Array<number>) {
-    this.setState({
-      checkedList: checkedList,
-    });
-    return checkedList;
-  }
-
-  onSubmit() {
-    submitTicket(this);
-  }
-
   render(): ReactNode {
     return (
       <View>
-        <AtForm onSubmit={this.onSubmit.bind(this)}>
+        <Text>Repair Page</Text>
-          <AtRadio
-            options={[
-              { label: pt.get().repairPage.typeText.appliance, value: 0 },
-              { label: pt.get().repairPage.typeText.computer, value: 1 },
-            ]}
-            value={this.state.type}
-            onClick={this.handleTypeChange.bind(this)}
-          />
-          <AtInput
-            clear
-            required
-            name='device'
-            title={pt.get().repairPage.deviceText.title}
-            type='text'
-            placeholder={pt.get().repairPage.deviceText.placeholder}
-            value={this.state.device}
-            onChange={this.handleDeviceChange.bind(this)}
-          />
-          <AtInput
-            clear
-            required
-            name='deviceModel'
-            title={pt.get().repairPage.deviceText.title}
-            type='text'
-            placeholder={pt.get().repairPage.deviceText.placeholder}
-            value={this.state.deviceModel}
-            onChange={this.handleDeviceModelChange.bind(this)}
-          />
-          <AtInput
-            clear
-            required
-            name='owner'
-            title={pt.get().repairPage.ownerText.title}
-            type='text'
-            placeholder={pt.get().repairPage.ownerText.placeholder}
-            value={this.state.owner}
-            onChange={this.handleOwnerChange.bind(this)}
-          />
-          <AtInput
-            clear
-            required
-            name='phone'
-            title={pt.get().repairPage.phoneText.title}
-            type='number'
-            placeholder={pt.get().repairPage.phoneText.placeholder}
-            value={this.state.phone}
-            onChange={this.handlePhoneChange.bind(this)}
-          />
-          <AtInput
-            clear
-            required
-            name='description'
-            title={pt.get().repairPage.descriptionText.title}
-            type='text'
-            placeholder={pt.get().repairPage.descriptionText.placeholder}
-            value={this.state.description}
-            onChange={this.handleDescriptionChange.bind(this)}
-          />
-          <AtCheckbox
-            options={this.checkboxOption}
-            selectedList={this.state.checkedList}
-            onChange={this.handleCheckboxChange.bind(this)}
-          />
-          <AtButton
-            loading={this.state.isLoading}
-            formType='submit'
-            type='primary'
-            disabled={this.state.isDisable}
-          >
-            {pt.get().button.buttonText.submit}
-          </AtButton>
-        </AtForm>
-        <PageFooter />
       </View>
     );
   }

src/plain-text/RepairPage.ts

@@ -1,110 +0,0 @@
-export interface RepairPageText {
-  typeText: {
-    computer: string;
-    appliance: string;
-  };
-  deviceText: {
-    title: string;
-    placeholder: string;
-  };
-  deviceModelText: {
-    title: string;
-    placeholder: string;
-  };
-  ownerText: {
-    title: string;
-    placeholder: string;
-  };
-  phoneText: {
-    title: string;
-    placeholder: string;
-  };
-  descriptionText: {
-    title: string;
-    placeholder: string;
-  };
-  checkboxText: {
-    none: string;
-    usbDisk: string;
-    mouseOrReceiver: string;
-    powerAdapter: string;
-    others: {
-      label: string;
-      desc: string;
-    };
-  };
-}
-
-export const repairPageZhCn: RepairPageText = {
-  typeText: {
-    computer: '电脑',
-    appliance: '电器',
-  },
-  deviceText: {
-    title: '设备品牌',
-    placeholder: '如：ROG',
-  },
-  deviceModelText: {
-    title: '设备型号',
-    placeholder: '如：幻 14 2022',
-  },
-  ownerText: {
-    title: '机主姓名',
-    placeholder: '如：晓洋',
-  },
-  phoneText: {
-    title: '联系方式',
-    placeholder: '如：18888888888',
-  },
-  descriptionText: {
-    title: '问题描述',
-    placeholder: '如：ZJUWLAN 无法登入校内网站',
-  },
-  checkboxText: {
-    none: '无附件',
-    usbDisk: 'U 盘',
-    mouseOrReceiver: '鼠标/接收器',
-    powerAdapter: '电源适配器',
-    others: {
-      label: '其他',
-      desc: '请于评论中详述',
-    },
-  },
-};
-
-export const repairPageEnUs: RepairPageText = {
-  typeText: {
-    computer: '电脑',
-    appliance: '电器',
-  },
-  deviceText: {
-    title: '设备品牌',
-    placeholder: 'e.g. ROG',
-  },
-  deviceModelText: {
-    title: '设备型号',
-    placeholder: 'e.g. Zephyrus G14 2022',
-  },
-  ownerText: {
-    title: '机主姓名',
-    placeholder: 'e.g. Dean Ma',
-  },
-  phoneText: {
-    title: '联系方式',
-    placeholder: 'e.g. 18888888888',
-  },
-  descriptionText: {
-    title: '问题描述',
-    placeholder: 'e.g. ZJUWLAN 无法登入校内网站',
-  },
-  checkboxText: {
-    none: '无附件',
-    usbDisk: 'U 盘',
-    mouseOrReceiver: '鼠标/接收器',
-    powerAdapter: '电源适配器',
-    others: {
-      label: '其他',
-      desc: '请于评论中详述',
-    },
-  },
-};

src/plain-text/index.ts

@@ -9,7 +9,6 @@ import { ButtonText, buttonEnUs, buttonZhCn } from './Button';
 import { MemberPageText, memberPageEnUs, memberPageZhCn } from './MemberPage';
 import { TicketListText, ticketListEnUs, ticketListZhCn } from './TicketList';
 import { NavBarTitle, navBarTitleEnUs, navBarTitleZhCh } from './NavBarTitle';
-import { RepairPageText, repairPageEnUs, repairPageZhCn } from './RepairPage';
 import {
   TicketDetailText,
   ticketDetailEnUs,
@@ -28,7 +27,6 @@ interface TextRecord {
   memberPage: MemberPageText;
   ticketList: TicketListText;
   navBar: NavBarTitle;
-  repairPage: RepairPageText;
   ticketDetail: TicketDetailText;
 }
 
@@ -44,7 +42,6 @@ const textZhCn: TextRecord = {
   memberPage: memberPageZhCn,
   ticketList: ticketListZhCn,
   navBar: navBarTitleZhCh,
-  repairPage: repairPageZhCn,
   ticketDetail: ticketDetailZhCn,
 };
 
@@ -60,7 +57,6 @@ const textEnUs: TextRecord = {
   memberPage: memberPageEnUs,
   ticketList: ticketListEnUs,
   navBar: navBarTitleEnUs,
-  repairPage: repairPageEnUs,
   ticketDetail: ticketDetailEnUs,
 };
 

src/service/submitTicket.ts

@@ -1,44 +0,0 @@
-import RepairPage from '@/pages/repair/repair';
-import Taro from '@tarojs/taro';
-import pt from '@/plain-text';
-import { getUrl } from '.';
-
-export function submitTicket(that: RepairPage) {
-  that.setState({
-    isLoading: true,
-  });
-  Taro.request({
-    url: getUrl('/tickets/create'),
-    method: 'POST',
-    data: {
-      token: 'token_test',
-      type: that.state.type,
-      device: that.state.device,
-      deviceModel: that.state.deviceModel,
-      owner: that.state.owner,
-      phone: that.state.phone,
-      description: that.state.description,
-      accessories: that.state.checkedList,
-    },
-  })
-    .then(res => {
-      console.log(res.data);
-      that.setState({
-        isLoading: false,
-      });
-      Taro.atMessage({
-        message: pt.get().button.submitText.success,
-        type: 'success',
-      });
-    })
-    .catch(err => {
-      console.log(err);
-      that.setState({
-        isLoading: false,
-      });
-      Taro.atMessage({
-        message: pt.get().button.submitText.error + err.toString(),
-        type: 'error',
-      });
-    });
-}

src/service/ticketsInfo.ts

@@ -1,65 +0,0 @@
-import TicketDetail, {
-  TicketInfo,
-  TicketNote,
-} from '@/pages/TicketDetail/TicketDetail';
-import Taro from '@tarojs/taro';
-import moment from 'moment';
-import { getUrl } from '.';
-
-export function getTicketInfo(that: TicketDetail) {
-  Taro.request({
-    url: getUrl('/tickets/info'),
-    method: 'GET',
-    data: {
-      id: that.state.id,
-    },
-  })
-    .then(res => {
-      if (!res.data.success) {
-        that.setState({
-          rs: {
-            loading: false,
-            success: false,
-          },
-        });
-      } else {
-        const data = res.data.data;
-        const ticketDetail: TicketInfo = {
-          id: data.id,
-          type: data.type,
-          device: data.device,
-          deviceModel: data.deviceModel,
-          description: data.description,
-          createdTime: moment(),
-          status: data.status,
-        };
-        const notes: Array<TicketNote> = [];
-        data.notes.map(item => {
-          notes.push({
-            id: item.id,
-            op: item.op,
-            type: item.type,
-            content: item.content,
-            createdTime: moment(),
-          });
-        });
-        that.setState({
-          ticketInfo: ticketDetail,
-          notes: notes,
-          rs: {
-            loading: false,
-            success: true,
-          },
-        });
-      }
-    })
-    .catch(reason => {
-      that.setState({
-        rs: {
-          loading: false,
-          success: false,
-        },
-      });
-      console.log(reason);
-    });
-}