Merge pull request #1085 from jumpserver/pr@dev@feat_annoucement

perf: 完成公告功能

src/components/Announcement/index.vue

@@ -0,0 +1,63 @@
+<template>
+  <el-alert
+    v-if="enabled && !isViewed()"
+    type="success"
+    :center="false"
+    :title="title"
+    @close="onClose"
+  >
+    <span> {{ announcement.content }}</span>
+    <span v-if="announcement.link">
+      <el-link :href="announcement.link" target="_blank" class="link-more">
+        {{ $t('common.ViewMore') }}
+      </el-link>
+      <i class="fa fa-share-square-o" />
+    </span>
+  </el-alert>
+</template>
+
+<script>
+import { mapGetters } from 'vuex'
+
+export default {
+  name: 'Announcement',
+  data() {
+    return {
+      viewedKey: 'AnnouncementViewed'
+    }
+  },
+  computed: {
+    ...mapGetters([
+      'publicSettings'
+    ]),
+    announcement() {
+      const ann = this.publicSettings.ANNOUNCEMENT
+      return { id: ann['ID'], subject: ann['SUBJECT'], content: ann['CONTENT'], link: ann['LINK'] }
+    },
+    enabled() {
+      return this.publicSettings.ANNOUNCEMENT_ENABLED
+    },
+    title() {
+      return this.$t('common.Announcement') + ': ' + this.announcement.subject
+    }
+  },
+  methods: {
+    onClose() {
+      localStorage.setItem(this.viewedKey, this.announcement.id)
+    },
+    isViewed() {
+      const viewedId = localStorage.getItem(this.viewedKey)
+      return viewedId === this.announcement.id
+    }
+  }
+}
+</script>
+
+<style scoped>
+.link-more {
+  font-size: 10px;
+  margin-left: 10px;
+  border-bottom: solid 1px;
+}
+
+</style>

src/components/index.js

@@ -26,3 +26,4 @@ export { default as AccountListTable } from './AccountListTable/index'
 export { default as AppAccountListTable } from './AppAccountListTable'
 export { default as AssetRelationCard } from './AssetRelationCard'
 export { default as MFAVerifyDialog } from './MFAVerifyDialog'
+export { default as Announcement } from './Announcement'

src/i18n/langs/cn.json

@@ -233,6 +233,8 @@
     "ReLogin": "重新登录"
   },
   "common": {
+    "ViewMore": "查看更多",
+    "Announcement": "公告",
     "Logging": "日志记录",
     "Database": "数据库记录",
     "Params": "参数",
@@ -778,6 +780,7 @@
     }
   },
   "setting": {
+    "Feature": "功能",
     "AlibabaCloud": "阿里云",
     "TencentCloud": "腾讯云",
     "Radius": "Radius",

src/i18n/langs/en.json

@@ -231,6 +231,8 @@
     "ReLogin": "Re-Login"
   },
   "common": {
+    "ViewMore": "View more",
+    "Announcement": "Announcement",
     "Logging": "Logging",
     "Database": "Database",
     "Params": "Params",
@@ -761,6 +763,7 @@
     }
   },
   "setting": {
+    "Feature": "Feature",
     "SMSProvider": "SMS provider",
     "SMS": "SMS setting",
     "AlibabaCloud": "Alibaba cloud",

src/userviews/assets/index.vue

@@ -1,13 +1,18 @@
 <template>
-  <GenericTreeListPage :table-config="tableConfig" :header-actions="headerActions" :tree-setting="treeSetting" />
+  <div>
+    <Announcement />
+    <GenericTreeListPage :table-config="tableConfig" :header-actions="headerActions" :tree-setting="treeSetting" />
+  </div>
 </template>
 
 <script>
 import GenericTreeListPage from '@/layout/components/GenericTreeListPage/index'
+import { Announcement } from '@/components'
 import { SystemUserFormatter, DialogDetailFormatter } from '@/components/TableFormatters'
 export default {
   components: {
-    GenericTreeListPage
+    GenericTreeListPage,
+    Announcement
   },
   data() {
     return {
@@ -192,4 +197,10 @@ export default {
     cursor: not-allowed;
     background-color:rgba(192,196,204,0.28) !important;
   }
+
+  .link-more {
+    margin-left: 10px;
+    border-bottom: solid 1px;
+    font-size: 12px
+  }
 </style>

src/views/dashboard/index.vue

@@ -1,5 +1,6 @@
 <template>
   <Page>
+    <Announcement />
     <ResourceSummary />
     <DatesLoginSummary />
     <TopAndLatestSummary />
@@ -7,6 +8,7 @@
 </template>
 
 <script>
+import { Announcement } from '@/components'
 import { Page } from '@/layout/components'
 import ResourceSummary from './ResourceSummary'
 import DatesLoginSummary from './DatesLoginSummary'
@@ -15,7 +17,11 @@ import TopAndLatestSummary from './TopAndLatestSummary'
 export default {
   name: 'Dashboard',
   components: {
-    Page, DatesLoginSummary, ResourceSummary, TopAndLatestSummary
+    Page,
+    DatesLoginSummary,
+    ResourceSummary,
+    TopAndLatestSummary,
+    Announcement
   },
   data() {
     return {

src/views/settings/Basic/announcement.vue

@@ -0,0 +1,75 @@
+<template>
+  <div>
+    <el-button v-if="!value" type="default" size="mini" @click="visible=true">{{ $t('setting.Enable') }}</el-button>
+    <el-button v-else type="primary" size="mini" @click="visible=true">{{ $t('setting.Setting') }}</el-button>
+    <Dialog
+      v-if="visible"
+      :visible.sync="visible"
+      :title="title"
+      :destroy-on-close="true"
+      :show-cancel="false"
+      :show-confirm="false"
+      width="70%"
+      v-on="$listeners"
+    >
+      <GenericCreateUpdateForm v-bind="config" @submitSuccess="submitSuccess" />
+    </Dialog>
+  </div>
+</template>
+
+<script>
+import Dialog from '@/components/Dialog'
+import { GenericCreateUpdateForm } from '@/layout/components'
+export default {
+  name: 'Announcement',
+  components: {
+    Dialog, GenericCreateUpdateForm
+  },
+  props: {
+    value: {
+      type: Boolean,
+      required: true
+    }
+  },
+  data() {
+    return {
+      title: this.$t('common.Announcement'),
+      visible: false,
+      config: {
+        fields: [
+          ['', ['ANNOUNCEMENT_ENABLED', 'ANNOUNCEMENT']]
+        ],
+        fieldsMeta: {
+          ANNOUNCEMENT: {
+            fields: [
+              'SUBJECT', 'CONTENT', 'LINK'
+            ],
+            fieldsMeta: {
+              CONTENT: {
+                el: {
+                  rows: 5
+                }
+              }
+            }
+          }
+        },
+        successUrl: { name: 'Settings', params: { activeMenu: 'Basic' }},
+        url: '/api/v1/settings/setting/?category=basic',
+        submitMethod() {
+          return 'patch'
+        }
+      }
+    }
+  },
+  methods: {
+    submitSuccess(res) {
+      this.$emit('input', !!res[this.enableField])
+      this.visible = false
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+</style>

src/views/settings/Basic/index.vue

@@ -9,6 +9,7 @@
       :submit-method="submitMethod"
       :has-detail-in-msg="false"
       :on-perform-success="onPerformSuccess"
+      class="form"
     />
   </IBox>
 </template>
@@ -17,6 +18,7 @@
 import GenericCreateUpdateForm from '@/layout/components/GenericCreateUpdateForm'
 import { IBox } from '@/components'
 import rules from '@/components/DataForm/rules'
+import Announcement from './announcement'
 
 export default {
   name: 'Basic',
@@ -32,6 +34,11 @@ export default {
             'SITE_URL', 'USER_GUIDE_URL',
             'GLOBAL_ORG_DISPLAY_NAME'
           ]
+        ],
+        [
+          this.$t('setting.Feature'), [
+            'TICKETS_ENABLED', 'ANNOUNCEMENT_ENABLED'
+          ]
         ]
       ],
       fieldsMeta: {
@@ -42,6 +49,10 @@ export default {
           hidden: () => {
             return !this.$store.getters.hasValidLicense
           }
+        },
+        ANNOUNCEMENT_ENABLED: {
+          // label: '公告',
+          component: Announcement
         }
       },
       successUrl: { name: 'Settings', params: { activeMenu: 'Basic' }},
@@ -60,5 +71,8 @@ export default {
 </script>
 
 <style scoped>
+.form >>> .form-buttons {
+  padding-top: 30px;
+}
 
 </style>

src/views/settings/Other.vue

@@ -22,7 +22,7 @@ export default {
         [
           this.$t('common.Basic'),
           [
-            'EMAIL_SUFFIX', 'TICKETS_ENABLED'
+            'EMAIL_SUFFIX'
           ]
         ],
         [

src/views/settings/SMS/index.vue

@@ -68,7 +68,7 @@ export default {
 
 <style scoped>
 .form >>> .form-buttons {
-  padding-top: 50px;
+  padding-top: 30px;
 }
 
 </style>

src/views/settings/index.vue

@@ -12,7 +12,7 @@
 import TabPage from '@/layout/components/TabPage'
 import AutoDataForm from '@/components/AutoDataForm'
 import IBox from '@/components/IBox'
-import Basic from './Basic'
+import Basic from './Basic/index'
 import Email from './Email/index'
 import Auth from './Auth'
 import Ldap from './Ldap'