添加badge小红点和修复企业画像的检索列表

src/api/home/news.js

@@ -14,3 +14,10 @@ export function readPush(params) {
     params
   });
 }
+// 获取未读消息条数
+export function getMsgCount(params) {
+  return request({
+    url: '/mobile/getMsgCount',
+    params
+  });
+}

src/permission.js

@@ -27,6 +27,7 @@ router.beforeEach((to, from, next) => {
             //   router.addRoutes(store.getters.addRoutes); // 动态添加可访问路由表
             //   next({ ...to, replace: true });
             // });
+            store.dispatch('GetBadge');
           })
           .catch(err => {
             store.dispatch('FedLogOut').then(() => {

src/store/getters.js

@@ -6,6 +6,7 @@ const getters = {
   cachedViews: state => state.tagsView.cachedViews,
   token: state => state.user.token,
   avatar: state => state.user.avatar,
+  badge: state => state.user.badge,
   name: state => state.user.name,
   introduction: state => state.user.introduction,
   roles: state => state.user.roles,

src/store/modules/user.js

@@ -1,9 +1,11 @@
 import { login, register, logout, getInfo } from '@/api/login';
+import { getMsgCount } from '@/api/home/news';
 import { getToken, setToken, removeToken } from '@/utils/auth';
 
 const user = {
   state: {
     token: getToken(),
+    badge: null,
     name: '',
     userId: '',
     avatar: '',
@@ -15,6 +17,9 @@ const user = {
     SET_TOKEN: (state, token) => {
       state.token = token;
     },
+    SET_BADGE: (state, badge) => {
+      state.badge = badge;
+    },
     SET_NAME: (state, name) => {
       state.name = name;
     },
@@ -69,6 +74,20 @@ const user = {
       });
     },
 
+    GetBadge({ commit, state }) {
+      return new Promise((resolve, reject) => {
+        getMsgCount()
+          .then(({ data }) => {
+            if (data === 0) data = null;
+            commit('SET_BADGE', data);
+            resolve(data);
+          })
+          .catch(error => {
+            reject(error);
+          });
+      });
+    },
+
     // 获取用户信息
     GetInfo({ commit, state }) {
       return new Promise((resolve, reject) => {

src/views/home/mine.vue

@@ -2,8 +2,22 @@
   <div class="mine_page p0-100">
     <div class="mine_l">
       <router-link :to="item.path" v-for="(item, i) in list" :key="i">
-        <div :class="i == index ? 'active' : ''" @click="index = i">
+        <div
+          :class="i == index ? 'active' : ''"
+          @click="index = i"
+          style="position: relative;"
+        >
           {{ item.name }}
+          <span
+            v-if="item.flag"
+            style="position: absolute;
+              width: 10px;
+              height: 10px;
+              background-color: red;
+              border-radius: 50%;
+              top: 15px;
+              margin-left: 10px;"
+          ></span>
         </div>
       </router-link>
       <div @click="logout">退出登录</div>
@@ -14,6 +28,7 @@
   </div>
 </template>
 <script>
+import { getMsgCount } from '@/api/home/news';
 export default {
   data() {
     return {
@@ -33,7 +48,8 @@ export default {
         },
         {
           path: '/mine/news',
-          name: '消息通知'
+          name: '消息通知',
+          flag: null
         }
       ]
     };
@@ -59,6 +75,9 @@ export default {
     }
   },
   created() {
+    getMsgCount().then(({ data }) => {
+      this.list[3].flag = data;
+    });
     let { path } = this.$route;
     this.index = this.list.findIndex(item => {
       return item.path == path;

src/views/home/news.vue

@@ -48,6 +48,7 @@
 </template>
 <script>
 import { getUserMsgPush, readPush } from '@/api/home/news';
+import user from '@/store/modules/user';
 export default {
   data() {
     return {
@@ -67,6 +68,7 @@ export default {
       });
     },
     handleStatus(item) {
+      if (item.status == 1) return;
       readPush({ id: item.id }).then(res => {
         item.status = 1;
       });

src/views/index.vue

@@ -47,7 +47,7 @@
           <!-- <span>
             <i>20</i>
           </span> -->
-          <el-badge :value="200" :max="10" class="item">
+          <el-badge :value="badge" :max="10" class="item">
             <img :src="avatar" class="user-avatar" />
           </el-badge>
         </div>
@@ -151,6 +151,8 @@
 
 <script>
 import { mapGetters } from 'vuex';
+// import user from '@/store/modules/user';
+// import { getMsgCount } from '@/api/home/news';
 export default {
   name: 'home',
   data() {
@@ -190,8 +192,15 @@ export default {
     };
   },
   computed: {
-    ...mapGetters(['avatar'])
+    ...mapGetters(['avatar', 'badge'])
   },
+  // watch: {
+  //   badge(newVal, oldVal) {
+  //     if (newVal == 0) {
+  //       document.querySelector('.el-badge sup').style = 'display:none';
+  //     }
+  //   }
+  // },
   methods: {
     toSearch() {
       if (!this.input.length) return this.msgError('请输入搜索关键字');
@@ -209,6 +218,19 @@ export default {
       this.path = path;
       this.$router.push({ path });
     }
+  },
+  created() {
+    // console.log(this.badge);
+    // console.log(user.state.badge);
+    // getMsgCount().then(({ data }) => {
+    //   console.log(data);
+    //   this.$store.commit('SET_BADGE', data);
+    // });
+  },
+  mounted() {
+    // if (this.badge == 0) {
+    //   document.querySelector('.el-badge sup').style = 'display:none';
+    // }
   }
 };
 </script>
@@ -267,6 +289,11 @@ export default {
       .el-badge {
         // display: block;
         // position: relative;
+        top: 10px;
+        right: 8px;
+        border: 1px solid #ffa32c;
+        border-radius: 50%;
+        box-shadow: 5px 5px 5px 0px #dadada;
         .user-avatar {
           vertical-align: middle;
           cursor: pointer;
@@ -415,7 +442,7 @@ export default {
   }
 }
 /deep/.el-badge__content.is-fixed {
-  top: 10px;
+  top: 5px;
   right: 15px;
 }
 @media (max-width: 1024px) {

src/views/portrait.vue

@@ -132,13 +132,19 @@ export default {
           getLabelSetting({ companyId: data.companyId }).then(({ data }) => {
             if (data.length) {
               console.log(data);
-              this.portraitList = data.map(item =>
+              // this.portraitList = data.map(item =>
-                item.labelList
+              //   item.labelList
-                  ? item.labelList.filter(v => v.isHas)[0]
+              //     ? item.labelList.filter(v => v.isHas)[0]
-                    ? item.labelList.filter(v => v.isHas)[0]
+              //       ? item.labelList.filter(v => v.isHas)[0]
-                    : ''
+              //       : ''
-                  : undefined
+              //     : undefined
+              // );
+              const arrs = data.map(item =>
+                item.labelList ? item.labelList.filter(v => v.isHas) : undefined
               );
+              arrs.map(item => {
+                this.portraitList = [...this.portraitList, ...item];
+              });
               this.queryParams.labelId = this.portraitList[0].id;
               this.getPortraitList();
             }

src/views/result.vue

@@ -78,7 +78,10 @@
           </span>
         </div>
         <!-- <div v-html="formData.text"></div> -->
-        <div id="text" class="ql-editor">
+        <div
+          id="text"
+          :class="type == 'policy' && formData.method == 1 ? '' : 'ql-editor'"
+        >
           <!-- <editor v-model="formData.text" :min-height="192" /> -->
           <div v-html="formData.text" />
         </div>