!883 feat(im): 配置项增加IM即时通讯图标显示与隐藏

Merge pull request !883 from 梧桐听雨/master

src/layout/components/Setting/src/Setting.vue

@@ -123,6 +123,8 @@ const copyConfig = async () => {
       locale: ${appStore.getLocale},
       // 消息图标
       message: ${appStore.getMessage},
+      // IM 即时通讯图标
+      im: ${appStore.getIm},
       // 标签页
       tagsView: ${appStore.getTagsView},
       // 标签页

src/layout/components/Setting/src/components/InterfaceDisplay.vue

@@ -65,6 +65,13 @@ const messageChange = (show: boolean) => {
   appStore.setMessage(show)
 }
 
+// IM 即时通讯图标
+const im = ref(appStore.getIm)
+
+const imChange = (show: boolean) => {
+  appStore.setIm(show)
+}
+
 // 标签页
 const tagsView = ref(appStore.getTagsView)
 
@@ -184,6 +191,11 @@ watch(
       <ElSwitch v-model="message" @change="messageChange" />
     </div>
 
+    <div class="flex items-center justify-between">
+      <span class="text-14px">{{ t('setting.imIcon') }}</span>
+      <ElSwitch v-model="im" @change="imChange" />
+    </div>
+
     <div class="flex items-center justify-between">
       <span class="text-14px">{{ t('setting.tagsView') }}</span>
       <ElSwitch v-model="tagsView" @change="tagsViewChange" />

src/layout/components/ToolHeader.vue

@@ -47,6 +47,9 @@ const locale = computed(() => appStore.getLocale)
 // 消息图标
 const message = computed(() => appStore.getMessage)
 
+// IM即时通讯图标
+const im = computed(() => appStore.getIm)
+
 // 租户切换权限
 const hasTenantVisitPermission = computed(
   () => import.meta.env.VITE_APP_TENANT_ENABLE === 'true' && checkPermi(['system:tenant:visit'])
@@ -113,9 +116,11 @@ export default defineComponent({
             <Message class="custom-hover" color="var(--top-header-text-color)"></Message>
           ) : undefined}
           {/* IM 聊天入口 */}
-          <div class="custom-hover" onClick={goToChat}>
-            <Icon color="var(--top-header-text-color)" size={18} icon="ep:chat-dot-round" />
-          </div>
+          {im.value ? (
+            <div class="custom-hover" onClick={goToChat}>
+              <Icon color="var(--top-header-text-color)" size={18} icon="ep:chat-dot-round" />
+            </div>
+          ) : undefined}
           <UserInfo></UserInfo>
         </div>
       </div>

src/locales/en.ts

@@ -91,6 +91,7 @@ export default {
     sizeIcon: 'Size icon',
     localeIcon: 'Locale icon',
     messageIcon: 'Message icon',
+    imIcon: 'IM icon',
     tagsView: 'Tags view',
     logo: 'Logo',
     greyMode: 'Grey mode',
@@ -147,9 +148,9 @@ export default {
     qrcode: 'Scan the QR code to log in',
     btnRegister: 'Sign up',
     SmsSendMsg: 'code has been sent',
-    resetPassword: "Reset Password",
-    resetPasswordSuccess: "Reset Password Success",
-    invalidTenantName:"Invalid Tenant Name"
+    resetPassword: 'Reset Password',
+    resetPasswordSuccess: 'Reset Password Success',
+    invalidTenantName: 'Invalid Tenant Name'
   },
   captcha: {
     verify: 'Verify',

src/locales/zh-CN.ts

@@ -91,6 +91,7 @@ export default {
     sizeIcon: '尺寸图标',
     localeIcon: '多语言图标',
     messageIcon: '消息图标',
+    imIcon: '即时通讯图标',
     tagsView: '标签页',
     tagsViewImmerse: '标签页沉浸',
     logo: '标志',

src/store/modules/app.ts

@@ -22,6 +22,7 @@ interface AppState {
   size: boolean
   locale: boolean
   message: boolean
+  im: boolean
   tagsView: boolean
   tagsViewImmerse: boolean
   tagsViewIcon: boolean
@@ -60,6 +61,7 @@ export const useAppStore = defineStore('app', {
       size: true, // 尺寸图标
       locale: true, // 多语言图标
       message: true, // 消息图标
+      im: true, //IM即时通讯图标
       tagsView: true, // 标签页
       tagsViewImmerse: false, // 标签页沉浸
       tagsViewIcon: true, // 是否显示标签图标
@@ -132,6 +134,9 @@ export const useAppStore = defineStore('app', {
     getMessage(): boolean {
       return this.message
     },
+    getIm(): boolean {
+      return this.im
+    },
     getTagsView(): boolean {
       return this.tagsView
     },
@@ -246,6 +251,9 @@ export const useAppStore = defineStore('app', {
     setMessage(message: boolean) {
       this.message = message
     },
+    setIm(im: boolean) {
+      this.im = im
+    },
     setTagsView(tagsView: boolean) {
       this.tagsView = tagsView
     },