diff --git a/project.private.config.json b/project.private.config.json
index 3c85d24..2d1aff5 100644
--- a/project.private.config.json
+++ b/project.private.config.json
@@ -3,6 +3,7 @@
   "projectname": "EVA-Notify",
   "setting": {
     "compileHotReLoad": true,
-    "urlCheck": false
+    "urlCheck": false,
+    "bigPackageSizeSupport": true
   }
 }
\ No newline at end of file
diff --git a/src/app.config.ts b/src/app.config.ts
index 0f19d97..6e6846e 100644
--- a/src/app.config.ts
+++ b/src/app.config.ts
@@ -9,6 +9,7 @@ export default defineAppConfig({
     'pages/user/about/about',
     'pages/user/report/report',
     'pages/user/member/member',
+    'pages/TicketDetail/TicketDetail',
   ],
   window: {
     backgroundTextStyle: 'light',
diff --git a/src/pages/TicketDetail/TicketDetail.config.ts b/src/pages/TicketDetail/TicketDetail.config.ts
new file mode 100644
index 0000000..a9ca517
--- /dev/null
+++ b/src/pages/TicketDetail/TicketDetail.config.ts
@@ -0,0 +1,3 @@
+export default definePageConfig({
+  usingComponents: {},
+});
diff --git a/src/pages/TicketDetail/TicketDetail.scss b/src/pages/TicketDetail/TicketDetail.scss
new file mode 100644
index 0000000..e69de29
diff --git a/src/pages/TicketDetail/TicketDetail.tsx b/src/pages/TicketDetail/TicketDetail.tsx
new file mode 100644
index 0000000..592dfe1
--- /dev/null
+++ b/src/pages/TicketDetail/TicketDetail.tsx
@@ -0,0 +1,25 @@
+import { Component, ReactNode } from 'react';
+import { View } from '@tarojs/components';
+import { getCurrentInstance } from '@tarojs/runtime';
+import Taro from '@tarojs/taro';
+import pt from '@/plain-text';
+
+export default class TicketDetail extends Component {
+  state = {
+    id: 0,
+  };
+  componentDidMount(): void {
+    const navBar = pt.get().navBar;
+    Taro.setNavigationBarTitle({
+      title: navBar.ticketDetail,
+    });
+    const { router } = getCurrentInstance();
+    const id = router?.params.id;
+    this.setState({
+      id: id,
+    });
+  }
+  render(): ReactNode {
+    return <View>TicketDetail: {this.state.id}</View>;
+  }
+}
diff --git a/src/pages/user/about/about.tsx b/src/pages/user/about/about.tsx
index c9fb205..d18177c 100644
--- a/src/pages/user/about/about.tsx
+++ b/src/pages/user/about/about.tsx
@@ -1,8 +1,15 @@
 import { Component, ReactNode } from 'react';
 import { View } from '@tarojs/components';
+import Taro from '@tarojs/taro';
+import pt from '@/plain-text';
 import './about.scss';
 
 export default class SettingsPage extends Component {
+  componentDidMount(): void {
+    Taro.setNavigationBarTitle({
+      title: pt.get().navBar.user.about,
+    });
+  }
   render(): ReactNode {
     return <View></View>;
   }
diff --git a/src/pages/user/inform/inform.tsx b/src/pages/user/inform/inform.tsx
index 4897103..01a3d5e 100644
--- a/src/pages/user/inform/inform.tsx
+++ b/src/pages/user/inform/inform.tsx
@@ -15,6 +15,13 @@ export default class InformPage extends Component {
     isLoading: false,
     isDisable: false,
   };
+
+  componentDidMount(): void {
+    Taro.setNavigationBarTitle({
+      title: pt.get().navBar.user.inform,
+    });
+  }
+
   handleChangePhone(phone: string) {
     this.setState({
       phone: phone,
diff --git a/src/pages/user/member/member.tsx b/src/pages/user/member/member.tsx
index 5c810a1..59082dc 100644
--- a/src/pages/user/member/member.tsx
+++ b/src/pages/user/member/member.tsx
@@ -14,6 +14,11 @@ export default class MemberPage extends Component {
     isLoading: false,
     isDisable: false,
   };
+  componentDidMount(): void {
+    Taro.setNavigationBarTitle({
+      title: pt.get().navBar.user.member,
+    });
+  }
   handleChangeStuid(stuid: string) {
     this.setState({
       stuid: stuid,
diff --git a/src/pages/user/myTicket/myTicket.tsx b/src/pages/user/myTicket/myTicket.tsx
index 6f2385c..8bdf5b5 100644
--- a/src/pages/user/myTicket/myTicket.tsx
+++ b/src/pages/user/myTicket/myTicket.tsx
@@ -14,6 +14,7 @@ import './myTicket.scss';
 type FixStatus = 1 | 2 | 3 | 4 | 5;
 
 class TicketListItem {
+  id: number;
   brand: string;
   model: string;
   status: FixStatus;
@@ -21,11 +22,13 @@ class TicketListItem {
   iconMap: Map<FixStatus, string>;
 
   constructor(
+    id: number,
     brand: string,
     model: string,
     status: FixStatus,
     createAt: moment.Moment,
   ) {
+    this.id = id;
     this.brand = brand;
     this.model = model;
     this.status = status;
@@ -48,6 +51,11 @@ class TicketListItem {
         extraText={tl.statusMap.get(this.status)}
         arrow='right'
         thumb={this.iconMap.get(this.status)}
+        onClick={() => {
+          Taro.navigateTo({
+            url: '/pages/TicketDetail/TicketDetail?id=' + this.id,
+          });
+        }}
       />
     );
   }
@@ -57,10 +65,13 @@ export default class SettingsPage extends Component {
   state = {
     loading: true,
     success: false,
-    fixList: [new TicketListItem('华硕', '天选3', 3, moment())],
+    fixList: [new TicketListItem(0, '', '', 1, moment())],
   };
 
   componentDidMount(): void {
+    Taro.setNavigationBarTitle({
+      title: pt.get().navBar.user.myTicket,
+    });
     Taro.request({
       url: getUrl('/user/mytickets'),
       method: 'GET',
@@ -82,6 +93,7 @@ export default class SettingsPage extends Component {
           fixList: res.data.data.list.map(
             item =>
               new TicketListItem(
+                item.id,
                 item.device,
                 item.deviceModel,
                 item.status,
diff --git a/src/pages/user/report/report.tsx b/src/pages/user/report/report.tsx
index 096bf74..dd8ed1c 100644
--- a/src/pages/user/report/report.tsx
+++ b/src/pages/user/report/report.tsx
@@ -13,6 +13,13 @@ export default class SettingsPage extends Component {
     isLoading: false,
     isDisable: false,
   };
+
+  componentDidMount(): void {
+    Taro.setNavigationBarTitle({
+      title: pt.get().navBar.user.report,
+    });
+  }
+
   handleChange(report: string) {
     this.setState({
       report,
diff --git a/src/plain-text/NavBarTitle.ts b/src/plain-text/NavBarTitle.ts
new file mode 100644
index 0000000..ea3c799
--- /dev/null
+++ b/src/plain-text/NavBarTitle.ts
@@ -0,0 +1,32 @@
+export interface NavBarTitle {
+  ticketDetail: string;
+  user: {
+    myTicket: string;
+    report: string;
+    member: string;
+    inform: string;
+    about: string;
+  };
+}
+
+export const navBarTitleZhCh: NavBarTitle = {
+  ticketDetail: '工单详情',
+  user: {
+    myTicket: '我的工单',
+    report: '意见反馈',
+    inform: '我的信息',
+    about: '关于我们',
+    member: '协会成员登录',
+  },
+};
+
+export const navBarTitleEnUs: NavBarTitle = {
+  ticketDetail: 'Ticket Detail',
+  user: {
+    myTicket: 'My Tickets',
+    report: 'Report',
+    inform: 'Information',
+    about: 'About us',
+    member: 'Member login',
+  },
+};
diff --git a/src/plain-text/index.ts b/src/plain-text/index.ts
index 87bd533..79765d1 100644
--- a/src/plain-text/index.ts
+++ b/src/plain-text/index.ts
@@ -8,6 +8,7 @@ import { AboutPageText, aboutPageEnUs, aboutPageZhCn } from './AboutPage';
 import { ButtonText, buttonEnUs, buttonZhCn } from './Button';
 import { MemberPageText, memberPageEnUs, memberPageZhCn } from './MemberPage';
 import { TicketListText, ticketListEnUs, ticketListZhCn } from './TicketList';
+import { NavBarTitle, navBarTitleEnUs, navBarTitleZhCh } from './NavBarTitle';
 
 interface TextRecord {
   pageFooter: PageFooterText;
@@ -20,6 +21,7 @@ interface TextRecord {
   button: ButtonText;
   memberPage: MemberPageText;
   ticketList: TicketListText;
+  navBar: NavBarTitle;
 }
 
 const textZhCn: TextRecord = {
@@ -33,6 +35,7 @@ const textZhCn: TextRecord = {
   button: buttonZhCn,
   memberPage: memberPageZhCn,
   ticketList: ticketListZhCn,
+  navBar: navBarTitleZhCh,
 };
 
 const textEnUs: TextRecord = {
@@ -46,6 +49,7 @@ const textEnUs: TextRecord = {
   button: buttonEnUs,
   memberPage: memberPageEnUs,
   ticketList: ticketListEnUs,
+  navBar: navBarTitleEnUs,
 };
 
 // type Lang = 'zh_CN' | 'en_US' | ...;