From 162b7a7d099a2e94dbbc2a89146a669394570e82 Mon Sep 17 00:00:00 2001
From: Dawn_Ocean <1785590531@qq.com>
Date: Thu, 7 Mar 2024 00:52:14 +0800
Subject: [PATCH] add report page; optimize style

---
 src/app.config.ts                      |  1 +
 src/pages/user/inform/inform.tsx       | 19 ++++++++-
 src/pages/user/report/report.config.ts |  3 ++
 src/pages/user/report/report.scss      |  0
 src/pages/user/report/report.tsx       | 54 ++++++++++++++++++++++++++
 src/pages/user/settings/settings.tsx   | 12 ++++--
 src/pages/user/user.tsx                | 14 +++++++
 7 files changed, 98 insertions(+), 5 deletions(-)
 create mode 100644 src/pages/user/report/report.config.ts
 create mode 100644 src/pages/user/report/report.scss
 create mode 100644 src/pages/user/report/report.tsx

diff --git a/src/app.config.ts b/src/app.config.ts
index 90cad7a..f4d2930 100644
--- a/src/app.config.ts
+++ b/src/app.config.ts
@@ -5,6 +5,7 @@ export default defineAppConfig({
     'pages/user/user',
     'pages/user/inform/inform',
     'pages/user/settings/settings',
+    'pages/user/report/report',
   ],
   window: {
     backgroundTextStyle: 'light',
diff --git a/src/pages/user/inform/inform.tsx b/src/pages/user/inform/inform.tsx
index 051ae9d..1edfa36 100644
--- a/src/pages/user/inform/inform.tsx
+++ b/src/pages/user/inform/inform.tsx
@@ -6,6 +6,7 @@ export default class InformPage extends Component {
   state = {
     phone: '',
     name: '',
+    isLoading: false,
   };
   handleChangePhone(phone: string) {
     this.setState({
@@ -20,7 +21,13 @@ export default class InformPage extends Component {
     return name;
   }
   onSubmit() {
+    this.setState({
+      isLoading: true,
+    });
     console.log(this.state.name, this.state.phone);
+    this.setState({
+      isLoading: false,
+    });
   }
   onReset() {
     this.setState({
@@ -52,8 +59,16 @@ export default class InformPage extends Component {
           value={this.state.name}
           onChange={this.handleChangeName.bind(this)}
         />
-        <AtButton formType='submit'>提交</AtButton>
-        <AtButton formType='reset'>重置</AtButton>
+        <AtButton
+          loading={this.state.isLoading}
+          formType='submit'
+          type='primary'
+        >
+          提交
+        </AtButton>
+        <AtButton formType='reset' type='secondary'>
+          清空
+        </AtButton>
       </AtForm>
     );
   }
diff --git a/src/pages/user/report/report.config.ts b/src/pages/user/report/report.config.ts
new file mode 100644
index 0000000..a9ca517
--- /dev/null
+++ b/src/pages/user/report/report.config.ts
@@ -0,0 +1,3 @@
+export default definePageConfig({
+  usingComponents: {},
+});
diff --git a/src/pages/user/report/report.scss b/src/pages/user/report/report.scss
new file mode 100644
index 0000000..e69de29
diff --git a/src/pages/user/report/report.tsx b/src/pages/user/report/report.tsx
new file mode 100644
index 0000000..6df6c4a
--- /dev/null
+++ b/src/pages/user/report/report.tsx
@@ -0,0 +1,54 @@
+import { AtTextarea, AtButton, AtForm } from 'taro-ui';
+import { Component, ReactNode } from 'react';
+import './report.scss';
+
+export default class SettingsPage extends Component {
+  state = {
+    report: '',
+    isLoading: false,
+  };
+  handleChange(report: string) {
+    this.setState({
+      report,
+    });
+  }
+  onSubmit() {
+    this.setState({
+      isLoading: true,
+    });
+    console.log(this.state.report);
+    this.setState({
+      isLoading: false,
+    });
+  }
+  onReset() {
+    this.setState({
+      Report: '',
+    });
+  }
+  render(): ReactNode {
+    return (
+      <AtForm
+        onSubmit={this.onSubmit.bind(this)}
+        onReset={this.onReset.bind(this)}
+      >
+        <AtTextarea
+          value={this.state.report}
+          onChange={this.handleChange.bind(this)}
+          maxLength={200}
+          placeholder='无论是有关于小程序的建议，还是关于E志者协会的建议，都可以提出来哦！'
+        />
+        <AtButton
+          loading={this.state.isLoading}
+          formType='submit'
+          type='primary'
+        >
+          提交
+        </AtButton>
+        <AtButton formType='reset' type='secondary'>
+          清空
+        </AtButton>
+      </AtForm>
+    );
+  }
+}
diff --git a/src/pages/user/settings/settings.tsx b/src/pages/user/settings/settings.tsx
index f8c2e86..07a14ad 100644
--- a/src/pages/user/settings/settings.tsx
+++ b/src/pages/user/settings/settings.tsx
@@ -1,10 +1,16 @@
-import { View } from '@tarojs/components';
+import { AtButton } from 'taro-ui';
 import { Component, ReactNode } from 'react';
-import Taro from '@tarojs/taro';
 import './settings.scss';
 
 export default class SettingsPage extends Component {
+  handleQuit() {
+    console.log('Quit');
+  }
   render(): ReactNode {
-    return <View></View>;
+    return (
+      <AtButton type='primary' onClick={this.handleQuit.bind(this)}>
+        退出账号
+      </AtButton>
+    );
   }
 }
diff --git a/src/pages/user/user.tsx b/src/pages/user/user.tsx
index 9640322..d26009b 100644
--- a/src/pages/user/user.tsx
+++ b/src/pages/user/user.tsx
@@ -26,6 +26,12 @@ export default class UserPage extends Component {
     });
   }
 
+  reportPage() {
+    Taro.navigateTo({
+      url: '/pages/user/report/report',
+    });
+  }
+
   render(): ReactNode {
     return (
       <View>
@@ -45,6 +51,14 @@ export default class UserPage extends Component {
             iconInfo={{ size: 25, color: '#FF4949', value: 'filter' }}
             onClick={this.settingsPage}
           />
+          <AtListItem
+            title='意见反馈'
+            note='有什么想说的都可以告诉我们哦！'
+            extraText=''
+            arrow='right'
+            iconInfo={{ size: 25, color: '#E69966', value: 'message' }}
+            onClick={this.reportPage}
+          />
         </AtList>
       </View>
     );