Merge branch 'yhy' into dev

package-lock.json

@@ -33,7 +33,7 @@
         "@pmmmwh/react-refresh-webpack-plugin": "^0.5.5",
         "@tarojs/cli": "3.6.24",
         "@tarojs/plugin-mock": "^0.0.9",
-				"@tarojs/plugin-platform-h5": "3.6.24",
+        "@tarojs/plugin-platform-h5": "^3.6.24",
         "@tarojs/taro-loader": "3.6.24",
         "@tarojs/test-utils-react": "^0.1.1",
         "@tarojs/webpack5-runner": "3.6.24",

package.json

@@ -55,6 +55,7 @@
     "@tarojs/runtime": "3.6.24",
     "@tarojs/shared": "3.6.24",
     "@tarojs/taro": "3.6.24",
+    "moment": "^2.30.1",
     "process": "^0.11.10",
     "react": "^18.0.0",
     "react-dom": "^18.0.0",
@@ -65,7 +66,7 @@
     "@pmmmwh/react-refresh-webpack-plugin": "^0.5.5",
     "@tarojs/cli": "3.6.24",
     "@tarojs/plugin-mock": "^0.0.9",
-		"@tarojs/plugin-platform-h5": "3.6.24",
+    "@tarojs/plugin-platform-h5": "^3.6.24",
     "@tarojs/taro-loader": "3.6.24",
     "@tarojs/test-utils-react": "^0.1.1",
     "@tarojs/webpack5-runner": "3.6.24",

src/assets/icons/MyTickets/fail.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1709907392895" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="9700" width="48" height="48" xmlns:xlink="http://www.w3.org/1999/xlink"><path d="M512 32C246.4 32 32 246.4 32 512s214.4 480 480 480 480-214.4 480-480S777.6 32 512 32z m160 566.4c19.2 19.2 19.2 51.2 0 73.6-19.2 19.2-51.2 19.2-73.6 0L512 585.6 425.6 672c-19.2 19.2-51.2 19.2-73.6 0-19.2-19.2-19.2-51.2 0-73.6l86.4-86.4-86.4-86.4c-19.2-19.2-19.2-51.2 0-73.6 19.2-19.2 51.2-19.2 73.6 0l86.4 86.4 86.4-86.4c19.2-19.2 51.2-19.2 73.6 0 19.2 19.2 19.2 51.2 0 73.6L585.6 512l86.4 86.4z" p-id="9701" fill="#d4237a"></path></svg>

src/assets/icons/MyTickets/finished.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1709907148592" class="icon" viewBox="0 0 1410 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4262" width="66.09375" height="48" xmlns:xlink="http://www.w3.org/1999/xlink"><path d="M385.420696 906.172765L1004.039509 20.583293a47.214703 47.214703 0 0 1 44.414648-20.276253c18.634842 1.448304 31.766129 10.524341 39.297309 27.035004a49.049221 49.049221 0 0 1-3.76559 49.145774L435.242346 1001.278045a49.531989 49.531989 0 0 1-31.669576 20.276253 44.800863 44.800863 0 0 1-36.207594-8.207055L18.806738 752.362906a48.469899 48.469899 0 0 1-18.05552-31.669576 47.311256 47.311256 0 0 1 9.076037-36.207594 44.028434 44.028434 0 0 1 31.669575-18.924502 49.918203 49.918203 0 0 1 36.207594 9.848465l307.716272 230.763066z m686.495982-461.622685a47.021595 47.021595 0 0 1-34.75929-13.517502 47.021595 47.021595 0 0 1-13.517502-34.75929c0-14.096823 4.441465-25.683253 13.517502-34.75929a47.021595 47.021595 0 0 1 34.75929-13.517502h289.660752c14.096823 0 25.5867 4.441465 34.75929 13.517502 8.979483 9.076037 13.517502 20.662467 13.517502 34.75929a47.021595 47.021595 0 0 1-13.517502 34.75929 47.021595 47.021595 0 0 1-34.75929 13.517502h-289.660752z m-193.107168 289.660752a47.021595 47.021595 0 0 1-34.75929-13.517502 47.021595 47.021595 0 0 1-13.517502-34.75929c0-14.096823 4.441465-25.683253 13.517502-34.75929a47.021595 47.021595 0 0 1 34.75929-13.517502h482.76792c14.096823 0 25.5867 4.441465 34.75929 13.517502 8.979483 9.076037 13.517502 20.662467 13.517502 34.75929a47.021595 47.021595 0 0 1-13.517502 34.75929 47.021595 47.021595 0 0 1-34.75929 13.517502h-482.76792z m-193.107168 289.660752a47.021595 47.021595 0 0 1-34.75929-13.517502 47.021595 47.021595 0 0 1-13.517502-34.75929c0-14.096823 4.441465-25.683253 13.517502-34.75929a47.021595 47.021595 0 0 1 34.75929-13.517502h675.875088c14.096823 0 25.5867 4.441465 34.75929 13.517502 8.979483 9.076037 13.517502 20.662467 13.517502 34.75929a47.021595 47.021595 0 0 1-13.517502 34.75929 47.021595 47.021595 0 0 1-34.75929 13.517502h-675.875088z" p-id="4263" fill="#8a8a8a"></path></svg>

src/assets/icons/MyTickets/repair.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1709907302076" class="icon" viewBox="0 0 1026 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="7483" width="48.09375" height="48" xmlns:xlink="http://www.w3.org/1999/xlink"><path d="M123.252 739.482L406.85 455.885l-60.34-60.34-287.64 287.64c-30.893 30.894-31.708 80.946-0.814 111.84l177.279 177.278c30.863 30.864 80.945 30.08 111.84-0.814l287.609-287.61-60.34-60.34-283.597 283.597-167.654-167.654z" p-id="7484" fill="#8a8a8a"></path><path d="M717.75 223.245l65.107-65.348 122.58 121.374-62.331 62.572-109.064 44.56a81.444 81.444 0 0 0-27.274 18.404L562.013 553.183l61.064 59.616 144.122-147.742 109.034-44.531a80.337 80.337 0 0 0 26.67-17.8l123.364-123.848-243.863-241.45L656.686 163.69c-7.452 7.452-13.365 16.382-17.408 26.097l-44.56 107.616-136.972 137.574 60.46 60.22 137.605-138.209c7.482-7.482 13.366-16.382 17.438-26.127l44.47-107.646z" p-id="7485" fill="#8a8a8a"></path><path d="M351.156 295.623L746.713 691.18q30.17 30.17 0 60.34t-60.34 0L290.816 355.962q-30.17-30.17 0-60.34t60.34 0zM222.24 728.35a42.667 42.667 0 0 1 60.31 1.055l24.739 25.584a42.667 42.667 0 0 1-61.366 59.254l-24.74-25.644a42.624 42.624 0 0 1 1.027-60.28z" p-id="7486" fill="#8a8a8a"></path></svg>

src/assets/icons/MyTickets/tick.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1709907338992" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="8608" width="48" height="48" xmlns:xlink="http://www.w3.org/1999/xlink"><path d="M832 0H192C85.952 0 0 86.016 0 192v640a192 192 0 0 0 192 192h640a192 192 0 0 0 192-192V192c0-105.984-85.952-192-192-192z m64 832c0 35.392-28.608 64-64 64H192a64 64 0 0 1-64-64V192c0-35.328 28.672-64 64-64h640a64 64 0 0 1 64 64v640zM669.376 330.88L443.136 557.12l-90.56-90.496c-24.96-25.024-65.472-25.024-90.496 0s-25.024 65.536 0 90.496l135.808 135.744a63.936 63.936 0 0 0 90.496 0l271.488-271.488c25.024-25.024 25.024-65.472 0-90.496s-65.472-25.024-90.496 0z" p-id="8609" fill="#12c53d"></path></svg>

src/pages/user/myTicket/myTicket.tsx

@@ -1,9 +1,116 @@
 import { Component, ReactNode } from 'react';
 import { View } from '@tarojs/components';
+import { AtList, AtListItem } 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 './myTicket.scss';
 
-export default class SettingsPage extends Component {
-  render(): ReactNode {
-    return <View></View>;
+type FixStatus = 1 | 2 | 3 | 4 | 5;
+
+class TicketListItem {
+  brand: string;
+  model: string;
+  status: FixStatus;
+  createAt: moment.Moment;
+  iconMap: Map<FixStatus, string>;
+
+  constructor(
+    brand: string,
+    model: string,
+    status: FixStatus,
+    createAt: moment.Moment,
+  ) {
+    this.brand = brand;
+    this.model = model;
+    this.status = status;
+    this.createAt = createAt;
+    this.iconMap = new Map<FixStatus, string>([
+      [1, repair],
+      [2, repair],
+      [3, finished],
+      [4, tick],
+      [5, fail],
+    ]);
+  }
+
+  render(): JSX.Element {
+    const tl = pt.get().ticketList;
+    return (
+      <AtListItem
+        title={this.brand + ' ' + this.model}
+        note={tl.createdAt(this.createAt.format('YYYY-MM-DD HH:mm'))}
+        extraText={tl.statusMap.get(this.status)}
+        arrow='right'
+        thumb={this.iconMap.get(this.status)}
+      />
+    );
+  }
+}
+
+export default class SettingsPage extends Component {
+  state = {
+    loading: true,
+    success: false,
+    fixList: [new TicketListItem('华硕', '天选3', 3, moment())],
+  };
+
+  componentDidMount(): void {
+    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.device,
+                item.deviceModel,
+                item.status,
+                moment(),
+              ),
+          ),
+        });
+      })
+      .catch(reason => {
+        this.setState({
+          loading: false,
+          success: false,
+        });
+        console.log(reason);
+      });
+  }
+
+  render(): ReactNode {
+    if (this.state.loading) {
+      return <View>loading</View>;
+    }
+    if (!this.state.success) {
+      return <View>Failed</View>;
+    }
+    const fixListRenderer = this.state.fixList.map(item => item.render());
+    return (
+      <View>
+        <AtList>{fixListRenderer}</AtList>
+      </View>
+    );
   }
 }

src/plain-text/TicketList.ts

@@ -0,0 +1,32 @@
+type FixStatus = 1 | 2 | 3 | 4 | 5;
+
+export interface TicketListText {
+  createdAt(time: string): string;
+  statusMap: Map<FixStatus, string>;
+}
+
+export const ticketListZhCn: TicketListText = {
+  createdAt: time => {
+    return '创建于' + ' ' + time;
+  },
+  statusMap: new Map([
+    [1, '创建成功'],
+    [2, '维修中'],
+    [3, '待取回'],
+    [4, '已取回'],
+    [5, '已取回'],
+  ]),
+};
+
+export const ticketListEnUs: TicketListText = {
+  createdAt: time => {
+    return '创建于' + ' ' + time;
+  },
+  statusMap: new Map([
+    [1, '创建成功'],
+    [2, '维修中'],
+    [3, '待取回'],
+    [4, '已取回'],
+    [5, '已取回'],
+  ]),
+};

src/plain-text/index.ts

@@ -7,6 +7,7 @@ import { InformPageText, informPageZhCn, informPageEnUs } from './InformPage';
 import { AboutPageText, aboutPageEnUs, aboutPageZhCn } from './AboutPage';
 import { ButtonText, buttonEnUs, buttonZhCn } from './Button';
 import { MemberPageText, memberPageEnUs, memberPageZhCn } from './MemberPage';
+import { TicketListText, ticketListEnUs, ticketListZhCn } from './TicketList';
 
 interface TextRecord {
   pageFooter: PageFooterText;
@@ -18,6 +19,7 @@ interface TextRecord {
   aboutPage: AboutPageText;
   button: ButtonText;
   memberPage: MemberPageText;
+  ticketList: TicketListText;
 }
 
 const textZhCn: TextRecord = {
@@ -30,6 +32,7 @@ const textZhCn: TextRecord = {
   aboutPage: aboutPageZhCn,
   button: buttonZhCn,
   memberPage: memberPageZhCn,
+  ticketList: ticketListZhCn,
 };
 
 const textEnUs: TextRecord = {
@@ -42,6 +45,7 @@ const textEnUs: TextRecord = {
   aboutPage: aboutPageEnUs,
   button: buttonEnUs,
   memberPage: memberPageEnUs,
+  ticketList: ticketListEnUs,
 };
 
 // type Lang = 'zh_CN' | 'en_US' | ...;