feat: 工单入口移动至Header栏 (#417)

* feat: 工单入口移动至Header栏

* feat: 工单入口移动至Header栏

Co-authored-by: Orange <orangemtony@gmail.com>

src/i18n/langs/cn.json

@@ -426,6 +426,7 @@
   },
   "route": {
     "": "",
+    "Ticket":"工单",
     "AdminUserCreate": "创建管理用户",
     "AdminUserDetail": "管理用户详情",
     "AdminUserList": "管理用户",

src/i18n/langs/en.json

@@ -425,6 +425,7 @@
   },
   "route": {
     "": "",
+    "Ticket": "Tickets",
     "AdminUserCreate": "Admin user create",
     "AdminUserDetail": "Admin user detail",
     "AdminUserList": "Admin users",

src/layout/components/NavHeader/Tickets.vue

@@ -0,0 +1,43 @@
+<template>
+  <div>
+    <el-link class="el-link" target="_blank" @click="goToTickets">{{ $t('route.Ticket') }}</el-link>
+    <el-badge v-if="getBadgeValue() !== 0" :value="getBadgeValue()" size="mini" type="primary" />
+  </div>
+</template>
+
+<script>
+import { getTicketOpenCount } from '@/api/ticket'
+
+export default {
+  name: 'WebTerminal',
+  data: function() {
+    return {
+      assignedTicketCount: 0
+    }
+  },
+  created() {
+    this.getTicketsOpenCount()
+  },
+  methods: {
+    getBadgeValue() {
+      return this.assignedTicketCount
+    },
+    getTicketsOpenCount() {
+      getTicketOpenCount(1).then(data => {
+        this.assignedTicketCount = data.count
+      })
+    },
+    goToTickets() {
+      this.$router.push({ name: 'TicketList' })
+    }
+  }
+}
+</script>
+
+<style scoped>
+.el-link {
+  color: #606266 !important;
+  font-size: 13px;
+  font-weight: 400
+}
+</style>

src/layout/components/NavHeader/index.vue

@@ -10,6 +10,9 @@
       <div class="header-item">
         <Language />
       </div>
+      <div v-if="publicSettings.TICKETS_ENABLED&&publicSettings.XPACK_LICENSE_IS_VALID" class="header-item">
+        <Tickets />
+      </div>
       <div class="header-item">
         <WebTerminal />
       </div>
@@ -27,6 +30,7 @@ import AccountDropdown from './AccountDropdown'
 import Help from './Help'
 import Language from './Language'
 import WebTerminal from './WebTerminal'
+import Tickets from './Tickets'
 
 export default {
   components: {
@@ -35,6 +39,7 @@ export default {
     AccountDropdown,
     Language,
     Help,
+    Tickets,
     WebTerminal
   },
   data() {
@@ -43,7 +48,7 @@ export default {
   },
   computed: {
     ...mapGetters([
-      'sidebar'
+      'sidebar', 'publicSettings'
     ])
   },
   methods: {

src/router/index.js

@@ -140,11 +140,12 @@ export const allRoleRoutes = [
     component: Layout,
     redirect: '/tickets/tickets/',
     children: TicketsRoutes,
+    hidden: true,
     meta: {
-      licenseRequired: true,
-      hidden: ({ settings }) => {
-        return !settings.TICKETS_ENABLED
-      }
+      licenseRequired: true
+      // hidden: ({ settings }) => {
+      //   return !settings.TICKETS_ENABLED
+      // }
     }
   },
   {

src/router/tickets.js

@@ -4,7 +4,8 @@ export default [
     path: 'tickets',
     name: 'TicketList',
     component: () => import('@/views/tickets/TicketList'),
-    meta: { title: i18n.t('route.Tickets'), icon: 'check-square-o', activeMenu: '/tickets/tickets' }
+    meta: { title: i18n.t('route.Tickets'), icon: 'check-square-o', activeMenu: '/tickets/tickets' },
+    hidden: true
   },
   {
     path: 'tickets/:id',