feat：工作台导航栏调整

apps/work-bench/.env.development

@@ -6,3 +6,4 @@ VUE_APP_BASE_URL='/home'
 VUE_APP_BASE_PUBLIC='/'
 VUE_APP_BASE_SITE='https://jybx3-webtest.jydev.jianyu360.com'
 VUE_APP_BASE_LOGO='https://cdn-ali.jianyu360.com/images/swordfish/sf_01_new.png?v=0928'
+VUE_APP_SIMPLE_LOGO='https://cdn-ali.jianyu360.com/common-module/public/image/logo_new.png?v=0928'

apps/work-bench/.env.production

@@ -6,3 +6,4 @@ VUE_APP_BASE_URL='/page_workDesktop'
 VUE_APP_BASE_PUBLIC='/page_workDesktop/'
 VUE_APP_BASE_SITE=''
 VUE_APP_BASE_LOGO='https://cdn-ali.jianyu360.com/images/swordfish/sf_01_new.png?v=0928'
+VUE_APP_SIMPLE_LOGO='https://cdn-ali.jianyu360.com/common-module/public/image/logo_new.png?v=0928'

apps/work-bench/public/index.html

@@ -4,7 +4,7 @@
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <meta name="viewport" content="width=device-width,initial-scale=1.0">
-    <link rel="stylesheet" href="https://cdn-common.jianyu360.com/cdn/assets/iconfont/pc/23.10.26/iconfont.css">
+    <link rel="stylesheet" href="https://cdn-common.jianyu360.com/cdn/assets/iconfont/pc/24.2.21/iconfont.css">
     <title>工作台</title>
     <% if (process.env.NODE_ENV === 'production') { %>
         <script src="/common-module/public/head.js?v=<%= htmlWebpackPlugin.options.assets.version %>"></script>
@@ -15,7 +15,7 @@
       <strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
     </noscript>
     <div id="app"></div>
-    <script src="https://cdn-common.jianyu360.com/cdn/assets/iconfont/pc/23.10.26/iconfont.js"></script>
+    <script src="https://cdn-common.jianyu360.com/cdn/assets/iconfont/pc/24.2.21/iconfont.js"></script>
     <script src="//cdn-common.jianyu360.com/cdn/lib/jquery/3.5.1/jquery.min.js"></script>
 
     <% if (process.env.NODE_ENV === 'production') { %>

apps/work-bench/src/components/NavUserInfo.vue

@@ -255,7 +255,7 @@ export default {
 </style>
 <style scoped lang="scss">
 .nav-user-info-module {
-  margin-left: 48px;
+  margin-left: 20px;
   cursor: pointer;
 }
 

apps/work-bench/src/store/modules/work-bench.js

@@ -184,10 +184,11 @@ export default {
       size: 20
     }) {
       try {
-        const { code, data = [], unread = 0 } = await ajaxGetMessages(payload)
+        const { code, data = [], unread = 0, toDoUnread = 0 } = await ajaxGetMessages(payload)
         if (code === 0) {
           commit('navbar/setMessages', data || [])
           commit('navbar/changeCount', unread)
+          commit('navbar/changeTodoCount', toDoUnread)
         }
       } catch (error) {
         console.log(error)

packages/work-bench-frame/packages/components/Navbar/components/item.vue

@@ -64,7 +64,7 @@ export default {
 }
 
 ::v-deep .el-badge__content.is-fixed {
-  top: -2px;
+  top: 0;
   right: 16px;
   line-height: 16px;
   background-color: #ff3a20;

packages/work-bench-frame/packages/components/Navbar/index.vue

@@ -2,73 +2,87 @@
   <div class="navbar-group">
     <div class="logo">
       <img :src="logo" alt="logo" @click="goSiteHome">
+      <h1>剑鱼工作台</h1>
     </div>
     <div class="navbar-content-group">
-      <!--   头部搜索模块   -->
-      <navbar-search class="search-module"></navbar-search>
-      <div class="nav-group">
+      <div class="website-group">
         <div
-          class="nav-item"
-          :class="nav.class"
-          v-for="(nav, index) in navs"
+          class="website-item"
+          v-for="(site, index) in websites"
           :key="index"
-          @click="onSelectNav(nav)"
+          @click="onWebsiteNav(site)"
         >
-          <template v-if="nav.plugin">
-            <navbar-item :badge="nav.badge" :svg="nav.svg" :nav="nav" v-popover:[nav.plugin]></navbar-item>
-          </template>
-          <navbar-item :badge="nav.badge" :svg="nav.svg" :nav="nav" v-else></navbar-item>
+         <i class="iconfont" :class="site.icon"></i>
+         <span>{{site.label}}</span>
         </div>
-        <!--    提供自定义用户信息插槽    -->
-        <slot name="nav-user-info" v-bind:info="userInfo"></slot>
-        <el-popover
-          popper-class="nav-popover"
-          ref="navInfo"
-          placement="bottom"
-          trigger="hover"
-          :visible-arrow="false"
-        >
-          <div class="nav-user-info-group">
-            <navbar-item :nav="{ icon: userInfo.avatar }" mode="vertical">
-              <div class="info-group">
-                <span v-if="userInfo.name">{{ userInfo.name }}</span>
-                <span v-if="userInfo.phone">{{ userInfo.phone }}</span>
-              </div>
-            </navbar-item>
-            <button @click="onClickOut">退出登录</button>
+      </div>
+      <section class="navbar-content-group--right">
+        <!--   头部搜索模块   -->
+        <navbar-search class="search-module"></navbar-search>
+        <div class="nav-group">
+          <div
+            class="nav-item"
+            :class="nav.class"
+            v-for="(nav, index) in navs"
+            :key="index"
+            @click="onSelectNav(nav)"
+          >
+            <template v-if="nav.plugin">
+              <navbar-item :badge="nav.badge" :svg="nav.svg" :nav="nav" v-popover:[nav.plugin]></navbar-item>
+            </template>
+            <navbar-item :badge="nav.badge" :svg="nav.svg" :nav="nav" v-else></navbar-item>
           </div>
-        </el-popover>
-        <el-popover
-          popper-class="nav-popover"
-          ref="navCustomer"
-          placement="bottom"
-          trigger="hover"
-          :visible-arrow="false"
-        >
-          <div class="nav-custom-info-group">
-            <div class="info-item" v-if="hasExclusiveCustomer">
-              <div class="after-tag-box recommend-tag">推荐</div>
-              <navbar-item
-                :nav="{ label: exclusiveCustomerInfo.name, icon: 'icon-weixin_line' }"></navbar-item>
-              <navbar-item
-                class="qrcode-group"
-                :nav="{
-                label: '微信扫一扫',
-                icon: exclusiveCustomerInfo.qrcode
-              }"
-                mode="vertical"
-              >
+          <!--    提供自定义用户信息插槽    -->
+          <slot name="nav-user-info" v-bind:info="userInfo"></slot>
+          <el-popover
+            popper-class="nav-popover"
+            ref="navInfo"
+            placement="bottom"
+            trigger="hover"
+            :visible-arrow="false"
+          >
+            <div class="nav-user-info-group">
+              <navbar-item :nav="{ icon: userInfo.avatar }" mode="vertical">
+                <div class="info-group">
+                  <span v-if="userInfo.name">{{ userInfo.name }}</span>
+                  <span v-if="userInfo.phone">{{ userInfo.phone }}</span>
+                </div>
               </navbar-item>
+              <button @click="onClickOut">退出登录</button>
             </div>
-            <div class="info-item" @click="onClickCustomer('在线咨询')">
-              <navbar-item :nav="{ label: '在线咨询', icon: 'icon-kefu_xian' }" :svg="true"></navbar-item>
-            </div>
-            <div class="info-item" @click="onClickCustomer('客服热线')">
-              <navbar-item :nav="{ label: '客服热线：400-108-6670', icon: 'icon-telphone_line' }"></navbar-item>
+          </el-popover>
+          <el-popover
+            popper-class="nav-popover"
+            ref="navCustomer"
+            placement="bottom"
+            trigger="hover"
+            :visible-arrow="false"
+          >
+            <div class="nav-custom-info-group">
+              <div class="info-item" v-if="hasExclusiveCustomer">
+                <div class="after-tag-box recommend-tag">推荐</div>
+                <navbar-item
+                  :nav="{ label: exclusiveCustomerInfo.name, icon: 'icon-weixin_line' }"></navbar-item>
+                <navbar-item
+                  class="qrcode-group"
+                  :nav="{
+                  label: '微信扫一扫',
+                  icon: exclusiveCustomerInfo.qrcode
+                }"
+                  mode="vertical"
+                >
+                </navbar-item>
+              </div>
+              <div class="info-item" @click="onClickCustomer('在线咨询')">
+                <navbar-item :nav="{ label: '在线咨询', icon: 'icon-kefu_xian' }" :svg="true"></navbar-item>
+              </div>
+              <div class="info-item" @click="onClickCustomer('客服热线')">
+                <navbar-item :nav="{ label: '客服热线：400-108-6670', icon: 'icon-telphone_line' }"></navbar-item>
+              </div>
             </div>
-          </div>
-        </el-popover>
-      </div>
+          </el-popover>
+        </div>
+      </section>
     </div>
     <div v-if="showCustomer" class="customer-container">
       <iframe :src="customerUrl" name="_blank" frameborder="0" width="100%" height="100%"></iframe>
@@ -94,15 +108,15 @@ export default {
   data () {
     return {
       home: process.env.VUE_APP_BASE_SITE,
-      logo: process.env.VUE_APP_BASE_LOGO,
+      logo: process.env.VUE_APP_SIMPLE_LOGO,
       navs: [
-        {
-          label: '前往官网',
-          icon: 'icon-houtui'
-        },
+        // {
+        //   label: '前往官网',
+        //   icon: 'icon-houtui'
+        // },
         {
           label: '消息中心',
-          icon: 'icon-a-Property1gongzuozhuomianProperty2xiaoxizhongxinProperty3grey',
+          icon: 'icon-nav-message',
           badge: 0
         },
         {
@@ -111,6 +125,20 @@ export default {
           svg: true,
           plugin: 'navCustomer'
         }
+      ],
+      websites: [
+        {
+          label: '标讯主站',
+          icon: 'icon-a-Property1gray1'
+        },
+        {
+          label: '剑鱼官网',
+          icon: 'icon-a-Property1gray2'
+        },
+        {
+          label: '商情门户',
+          icon: 'icon-a-Property1gray'
+        }
       ]
     }
   },
@@ -248,6 +276,44 @@ export default {
      */
     onClickCustomer (type) {
       this.$BRACE.$emit('click-nav-customer', type)
+    },
+    /**
+     * 前往商情门户（资讯站群）
+     */
+    goSiteCms () {
+      this.$BRACE.$emit({
+        fKey: 'goSiteCms',
+        spareFn: (link) => this.$BRACE.methods.open({
+          route: { link }
+        })
+      }, '/jycms')
+    },
+    /**
+     * 前往剑鱼官网（brand）
+     */
+    goSiteBrand () {
+      this.$BRACE.$emit({
+        fKey: 'goSiteBrand',
+        spareFn: (link) => this.$BRACE.methods.open({
+          route: { link }
+        })
+      }, '/brand')
+    },
+    onWebsiteNav (nav) {
+      switch (nav.label) {
+        case '标讯主站': {
+          this.goSiteHome()
+          break
+        }
+        case '剑鱼官网': {
+          this.goSiteBrand()
+          break
+        }
+        case '商情门户': {
+          this.goSiteCms()
+          break
+        }
+      }
     }
   }
 }
@@ -529,7 +595,7 @@ export default {
   justify-content: space-between;
   min-height: 64px;
   min-width: 800px;
-  padding: 0 36px;
+  padding: 0 24px;
   box-sizing: border-box;
   background-color: #ffffff;
   box-shadow: 0px 2px 8px -1px rgba(0, 0, 0, 0.0800);
@@ -544,7 +610,8 @@ export default {
   }
 
   .logo {
-    display: inline-block;
+    display: flex;
+    align-items: center;
     width: auto;
     height: 32px;
     cursor: pointer;
@@ -552,6 +619,12 @@ export default {
     img {
       height: 100%;
     }
+    h1{
+      margin-left: 8px;
+      font-size: 18px;
+      line-height: 24px;
+      color: #2ABED1;
+    }
   }
 
   .navbar-content-group {
@@ -560,11 +633,16 @@ export default {
     justify-content: space-between;
 
     .search-module {
-      margin-left: 82px;
-      margin-right: 16px;
+      margin-left: 32px;
+      margin-right: 20px;
       flex: 1;
       max-width: 440px;
     }
+    &--right{
+      flex: 1;
+      @extend .flex-horizontal;
+      justify-content: flex-end;
+    }
   }
 
   .nav-group {
@@ -579,13 +657,40 @@ export default {
     }
 
     .nav-item + .nav-item {
-      margin-left: 48px;
+      margin-left: 20px;
+    }
+  }
+  .website-group{
+    @extend .flex-horizontal;
+    margin-left: 16px;
+    .website-item{
+      @extend .flex-horizontal;
+      padding: 6px 8px;
+      margin-right: 10px;
+      font-size: 14px;
+      border-radius: 6px;
+      color: #1D1D1D;
+      border: 1px solid rgba(0, 0, 0, 0.08);
+      cursor: pointer;
+      .iconfont{
+        margin-right: 4px;
+        color: #686868;
+        font-size: 20px;
+      }
+      &:hover{
+        color: #fff;
+        background: #2ABED1;
+        border-color: #2ABED1;
+        i{
+          color: #fff;
+        }
+      }
     }
   }
   .customer-container{
     // display: none;
     position: fixed;
-     right: 84px;
+    right: 84px;
     bottom: 80px;
     max-height: 674px;
     min-height: 400px;