From 2fd629d479be84655f9b995dd4193cd9a3841794 Mon Sep 17 00:00:00 2001 From: FrozenArcher Date: Mon, 11 Mar 2024 22:19:32 +0800 Subject: [PATCH] start refactor --- src/pages/user/about/about.tsx | 2 +- src/pages/user/myTicket/TicketListItem.tsx | 57 +++++++++++ src/pages/user/myTicket/myTicket.tsx | 108 +++------------------ src/pages/user/report/report.tsx | 2 +- src/service/index.ts | 9 ++ src/service/myTicket.ts | 51 ++++++++++ 6 files changed, 131 insertions(+), 98 deletions(-) create mode 100644 src/pages/user/myTicket/TicketListItem.tsx create mode 100644 src/service/myTicket.ts diff --git a/src/pages/user/about/about.tsx b/src/pages/user/about/about.tsx index d18177c..81b9fba 100644 --- a/src/pages/user/about/about.tsx +++ b/src/pages/user/about/about.tsx @@ -4,7 +4,7 @@ import Taro from '@tarojs/taro'; import pt from '@/plain-text'; import './about.scss'; -export default class SettingsPage extends Component { +export default class AboutPage extends Component { componentDidMount(): void { Taro.setNavigationBarTitle({ title: pt.get().navBar.user.about, diff --git a/src/pages/user/myTicket/TicketListItem.tsx b/src/pages/user/myTicket/TicketListItem.tsx new file mode 100644 index 0000000..316c2e5 --- /dev/null +++ b/src/pages/user/myTicket/TicketListItem.tsx @@ -0,0 +1,57 @@ +import { AtListItem } from 'taro-ui'; +import repair from '@/assets/icons/MyTickets/repair.svg'; +import finished from '@/assets/icons/MyTickets/finished.svg'; +import tick from '@/assets/icons/MyTickets/tick.svg'; +import fail from '@/assets/icons/MyTickets/fail.svg'; +import pt from '@/plain-text'; +import Taro from '@tarojs/taro'; + +type FixStatus = 1 | 2 | 3 | 4 | 5; + +export class TicketListItem { + id: number; + brand: string; + model: string; + status: FixStatus; + createAt: moment.Moment; + iconMap: Map; + + constructor( + id: number, + brand: string, + model: string, + status: FixStatus, + createAt: moment.Moment, + ) { + this.id = id; + this.brand = brand; + this.model = model; + this.status = status; + this.createAt = createAt; + this.iconMap = new Map([ + [1, repair], + [2, repair], + [3, finished], + [4, tick], + [5, fail], + ]); + } + + render(): JSX.Element { + const tl = pt.get().ticketList; + return ( + { + Taro.navigateTo({ + url: '/pages/TicketDetail/TicketDetail?id=' + this.id, + }); + }} + /> + ); + } +} diff --git a/src/pages/user/myTicket/myTicket.tsx b/src/pages/user/myTicket/myTicket.tsx index 8bdf5b5..6f43722 100644 --- a/src/pages/user/myTicket/myTicket.tsx +++ b/src/pages/user/myTicket/myTicket.tsx @@ -1,121 +1,37 @@ import { Component, ReactNode } from 'react'; import { View } from '@tarojs/components'; -import { AtList, AtListItem } from 'taro-ui'; +import { AtList } from 'taro-ui'; import Taro from '@tarojs/taro'; import moment from 'moment'; -import repair from '@/assets/icons/MyTickets/repair.svg'; -import finished from '@/assets/icons/MyTickets/finished.svg'; -import tick from '@/assets/icons/MyTickets/tick.svg'; -import fail from '@/assets/icons/MyTickets/fail.svg'; import pt from '@/plain-text'; -import { getUrl } from '@/service'; +import { RequestState } from '@/service'; +import { getMyTicketList } from '@/service/myTicket'; import './myTicket.scss'; +import { TicketListItem } from './TicketListItem'; -type FixStatus = 1 | 2 | 3 | 4 | 5; - -class TicketListItem { - id: number; - brand: string; - model: string; - status: FixStatus; - createAt: moment.Moment; - iconMap: Map; - - constructor( - id: number, - brand: string, - model: string, - status: FixStatus, - createAt: moment.Moment, - ) { - this.id = id; - this.brand = brand; - this.model = model; - this.status = status; - this.createAt = createAt; - this.iconMap = new Map([ - [1, repair], - [2, repair], - [3, finished], - [4, tick], - [5, fail], - ]); - } - - render(): JSX.Element { - const tl = pt.get().ticketList; - return ( - { - Taro.navigateTo({ - url: '/pages/TicketDetail/TicketDetail?id=' + this.id, - }); - }} - /> - ); - } +interface MyTicketState { + fixList: Array; + rs: RequestState; } -export default class SettingsPage extends Component { +export default class MyTicketPage extends Component<{}, MyTicketState> { state = { - loading: true, - success: false, fixList: [new TicketListItem(0, '', '', 1, moment())], + rs: new RequestState(), }; componentDidMount(): void { Taro.setNavigationBarTitle({ title: pt.get().navBar.user.myTicket, }); - Taro.request({ - url: getUrl('/user/mytickets'), - method: 'GET', - data: { - token: 'token_test', - }, - }) - .then(res => { - if (!res.data.success) { - this.setState({ - loading: false, - success: false, - }); - return; - } - this.setState({ - loading: false, - success: true, - fixList: res.data.data.list.map( - item => - new TicketListItem( - item.id, - item.device, - item.deviceModel, - item.status, - moment(), - ), - ), - }); - }) - .catch(reason => { - this.setState({ - loading: false, - success: false, - }); - console.log(reason); - }); + getMyTicketList(this); } render(): ReactNode { - if (this.state.loading) { + if (this.state.rs.loading) { return loading; } - if (!this.state.success) { + if (!this.state.rs.success) { return Failed; } const fixListRenderer = this.state.fixList.map(item => item.render()); diff --git a/src/pages/user/report/report.tsx b/src/pages/user/report/report.tsx index dd8ed1c..5e282d8 100644 --- a/src/pages/user/report/report.tsx +++ b/src/pages/user/report/report.tsx @@ -7,7 +7,7 @@ import './report.scss'; const submitInterval = 5000; -export default class SettingsPage extends Component { +export default class ReportPage extends Component { state = { report: '', isLoading: false, diff --git a/src/service/index.ts b/src/service/index.ts index 0617a44..24ab353 100644 --- a/src/service/index.ts +++ b/src/service/index.ts @@ -1,5 +1,14 @@ import process from 'process'; +export class RequestState { + loading: boolean; + success: boolean; + constructor() { + this.loading = true; + this.success = false; + } +} + /** * Get URL of backend * @param path Relative path to base url, begins with `/` diff --git a/src/service/myTicket.ts b/src/service/myTicket.ts new file mode 100644 index 0000000..7f81c19 --- /dev/null +++ b/src/service/myTicket.ts @@ -0,0 +1,51 @@ +import MyTicketPage from '@/pages/user/myTicket/myTicket'; +import { TicketListItem } from '@/pages/user/myTicket/TicketListItem'; +import Taro from '@tarojs/taro'; +import moment from 'moment'; +import { getUrl } from '.'; + +export function getMyTicketList(that: MyTicketPage) { + Taro.request({ + url: getUrl('/user/mytickets'), + method: 'GET', + data: { + token: 'token_test', + }, + }) + .then(res => { + if (!res.data.success) { + that.setState({ + rs: { + loading: false, + success: false, + }, + }); + return; + } + that.setState({ + rs: { + loading: false, + success: true, + }, + fixList: res.data.data.list.map( + item => + new TicketListItem( + item.id, + item.device, + item.deviceModel, + item.status, + moment(), + ), + ), + }); + }) + .catch(reason => { + that.setState({ + rs: { + loading: false, + success: false, + }, + }); + console.log(reason); + }); +}