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

This commit is contained in:
熊丽君
2021-08-24 14:18:22 +08:00
parent 0ee2a12ce0
commit 16f699f7a4
9 changed files with 97 additions and 12 deletions

View File

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

View File

@ -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(() => {

View File

@ -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,

View File

@ -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) => {

View File

@ -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;

View File

@ -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;
});

View File

@ -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) {

View File

@ -132,13 +132,19 @@ export default {
getLabelSetting({ companyId: data.companyId }).then(({ data }) => {
if (data.length) {
console.log(data);
this.portraitList = data.map(item =>
item.labelList
? item.labelList.filter(v => v.isHas)[0]
? item.labelList.filter(v => v.isHas)[0]
: ''
: undefined
// this.portraitList = data.map(item =>
// item.labelList
// ? item.labelList.filter(v => v.isHas)[0]
// ? item.labelList.filter(v => v.isHas)[0]
// : ''
// : 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();
}

View File

@ -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>