perf: 完成公告功能

src/components/Announcement/index.vue

@@ -1,6 +1,6 @@
 <template>
   <el-alert
-    v-if="!isViewed()"
+    v-if="enabled && !isViewed()"
     type="success"
     :center="false"
     :title="this.$t('common.Announcement') + ': ' + announcement.subject"
@@ -8,39 +8,50 @@
   >
     <span> {{ announcement.content }}</span>
     <span v-if="announcement.link">
-      <el-link :href="announcement.link" class="link-more"> 查看更多</el-link> <i class="fa fa-share-square-o" />
+      <el-link :href="announcement.link" target="_blank" class="link-more"> 查看更多</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',
-      announcement: {
-        id: 'abcd',
-        subject: '伟大的中国共产党万岁, 伟大中华民族万岁，伟大的中国人民万岁',
-        content: '人民民日报刊发“宣言”文章：我们为什么能够成功，1840年鸦片战争以后，国家蒙辱、人民蒙难、文明蒙尘，\n' +
-          '      中华民族遭受了前所未有的劫难。从此，实现中华民族伟大复兴就成为中国人民和中华民族最伟大的梦想，成为近代以来中国全部历史的主题。\n' +
-          '      为了实现民族复兴的梦想，中国人民奋起抗争，各种力量前仆后继，各种方案轮番试验.',
-        link: 'https://www.qq.com'
-      }
+      viewedKey: 'AnnouncementViewed'
+    }
+  },
+  computed: {
+    ...mapGetters([
+      'publicSettings'
+    ]),
+    announcement() {
+      const ann = this.publicSettings.ANNOUNCEMENT
+      return { subject: ann['SUBJECT'], content: ann['CONTENT'], link: ann['LINK'] }
+    },
+    enabled() {
+      return this.publicSettings.ANNOUNCEMENT_ENABLED
     }
   },
   methods: {
     onClose() {
-      localStorage.setItem(this.viewedKey, this.announcement.id)
+      localStorage.setItem(this.viewedKey, this.announcement.subject)
     },
     isViewed() {
       const viewedId = localStorage.getItem(this.viewedKey)
-      return viewedId === this.announcement.id
+      return viewedId === this.announcement.subject
     }
   }
 }
 </script>
 
 <style scoped>
+.link-more {
+  font-size: 10px;
+  margin-left: 10px;
+  border-bottom: solid 1px;
+}
 
 </style>

src/views/settings/Basic/announcement.vue

@@ -0,0 +1,70 @@
+<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: '公告',
+      visible: false,
+      config: {
+        fields: [
+          ['', ['ANNOUNCEMENT_ENABLED', 'ANNOUNCEMENT']]
+        ],
+        fieldsMeta: {
+          ANNOUNCEMENT: {
+            fields: [
+              'SUBJECT', 'CONTENT', 'LINK'
+            ],
+            fieldsMeta: {
+            }
+          }
+        },
+        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'
           ]
+        ],
+        [
+          '功能', [
+            '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'