feature: 前端代码开发

StreamAzure · Jul 27, 2023 · c6f620b · c6f620b
1 parent 8c51088
commit c6f620b
Show file tree

Hide file tree

Showing 6 changed files with 6,096 additions and 6,047 deletions.
diff --git a/console-vue/package.json b/console-vue/package.json
@@ -17,6 +17,7 @@
     "less-loader": "5",
     "moment": "^2.29.4",
     "vue": "^3.2.13",
+    "vue-avatar": "^2.3.3",
     "vue-router": "^4.0.3"
   },
   "devDependencies": {

diff --git a/console-vue/src/components/header/index.vue b/console-vue/src/components/header/index.vue
@@ -3,10 +3,10 @@
     <div class="header-wrapper">
       <div>
         <img
-          @click="router.push('/ticketSearch')"
-          class="logo"
-          src="../../assets/logo.png"
-          alt="logo"
+            @click="router.push('/ticketSearch')"
+            class="logo"
+            src="../../assets/logo.png"
+            alt="logo"
         />
       </div>
       <div>
@@ -23,25 +23,78 @@
           <a href="https://magestack.cn/pages/be7463/" target="_blank">
             <li>社区</li>
           </a>
+          <a v-if="route.fullPath !== '/login'">
+            <Dropdown :trigger="['click']">
+              <li :style="{ padding: '0 0 0 30px' }">
+                <Avatar shape="square" style="background-color: #1890ff"
+                >{{ state.username?.slice(0, 1)?.toUpperCase() }}
+                </Avatar>
+              </li>
+              <template #overlay>
+                <Menu>
+                  <MenuItem>
+                    <a @click="() => router.push('/userInfo')">个人信息</a>
+                  </MenuItem>
+                  <MenuItem>
+                    <a @click="() => logout()">退出登录</a>
+                  </MenuItem>
+                </Menu>
+              </template>
+            </Dropdown>
+          </a>
         </ul>
       </div>
     </div>
   </Header>
 </template>
 
 <script setup>
-import { Layout } from 'ant-design-vue'
-import { useRouter } from 'vue-router'
-import { defineProps, toRefs } from 'vue'
+import {
+  Layout,
+  Avatar,
+  Dropdown,
+  Menu,
+  MenuItem,
+  message
+} from 'ant-design-vue'
+import { useRouter, useRoute } from 'vue-router'
+import { defineProps, reactive, toRefs, watch } from 'vue'
+import { fetchLogout } from '@/service'
+import Cookie from 'js-cookie'
+const username = Cookie.get('username')
 
-const { Header } = Layout
+const {Header} = Layout
 const props = defineProps({
   isLogin: Boolean
 })
 
-const { isLogin } = toRefs(props)
+const {isLogin} = toRefs(props)
+
+const state = reactive({
+  username: username
+})
 
 const router = useRouter()
+const route = useRoute()
+
+watch(
+    () => route.fullPath,
+    (newValue) => {
+      state.username = username
+    }
+)
+
+const logout = () => {
+  const token = Cookie.get('token')
+  fetchLogout({ accessToken: token }).then((res) => {
+    if (res.success) {
+      message.success('退出成功')
+      location.href = 'login'
+      Cookie.remove('token')
+      Cookie.remove('username')
+    }
+  })
+}
 </script>
 
 <style lang="scss" scoped>
@@ -86,6 +139,9 @@ const router = useRouter()
     li {
       padding: 0 30px;
     }
+    // &:last-child {
+    //   padding: 0 0 0 30px;
+    // }
   }
 }
 </style>
diff --git a/console-vue/src/views/buy-ticket/index.vue b/console-vue/src/views/buy-ticket/index.vue
@@ -448,12 +448,13 @@ watch(
   () => state.dataSource,
   (newValue) => {
     let isChooseSeat = true
+    newValue?.length &&
     newValue.reduce((cur, pre) => {
       if (cur && pre) {
         if (cur?.seatType !== pre?.seatType) {
           isChooseSeat = false
         }
-      }
+        }
     })
     state.isChooseSeat = isChooseSeat
   },

diff --git a/console-vue/src/views/order-list/index.vue b/console-vue/src/views/order-list/index.vue
@@ -18,8 +18,7 @@
         </div>
         <div>
           {{
-            ID_CARD_TYPE.find((item) => item.value === record?.idType)
-                ?.label
+            ID_CARD_TYPE.find((item) => item.value === record?.idType)?.label
           }}
         </div>
       </template>
@@ -68,19 +67,12 @@
 </template>
 
 <script setup>
-import {
-  Tabs,
-  TabPane,
-  Table,
-  Card,
-  Space,
-  Button,
-  Pagination
-} from 'ant-design-vue'
+import { Tabs, TabPane, Table, Card, Pagination } from 'ant-design-vue'
+
 import CarInfo from './components/show-card-info'
 import EditContent from './components/edit-content'
-import {fetchTicketList} from '@/service'
-import {reactive, watch, h} from 'vue'
+import { fetchTicketList } from '@/service'
+import { reactive, watch, h } from 'vue'
 import {
   ID_CARD_TYPE,
   SEAT_CLASS_TYPE_LIST,
@@ -175,23 +167,22 @@ watch(
         size: 10,
         statusType: newValue
       }).then((res) => {
-        console.log(res.data, 'res')
-        let dataSource = []
-        res.data.records.map((info) => {
-          info.passengerDetails?.map((item, index) => {
-            dataSource.push({
-              ...info,
-              ...item,
-              rowSpan: index === 0 ? info.passengerDetails.length : 0
-            })
+            console.log(res.data, 'res')
+            let dataSource = []
+            res.data.records.map((info) => {
+              info.passengerDetails?.map((item, index) => {
+                dataSource.push({
+                  ...info,
+                  ...item,
+                  rowSpan: index === 0 ? info.passengerDetails.length : 0
           })
         })
-        console.log(dataSource, 'datasource')
+      })
         state.dataSource = dataSource
         state.data = res.data
       })
     },
-    {immediate: true}
+    { immediate: true }
 )
 </script>
 

diff --git a/console-vue/vue.config.js b/console-vue/vue.config.js
@@ -2,7 +2,7 @@ module.exports = {
   devServer: {
     proxy: {
       '/api': {
-        target: 'http://7zw8r9.natappfree.cc',
+        target: 'http://127.0.0.1:9000',
         changeOrigin: true,
         ws: true
       }