|
|
@@ -7,8 +7,7 @@
|
|
|
<div v-for="(routerItem, routerItemIdex) in routerList" @click="setCurrentRouter(routerItem)"
|
|
|
:class="`border-b-2 border-transparent hover:border-white p-2 mr-4 cursor-pointer multipleyHeader ${activeRouter?.path === routerItem.path ? 'border-white' : ''}`"
|
|
|
:key="routerItem.path" ref="childDivs" v-show="visibleItems.includes(routerItemIdex)">
|
|
|
- <div v-if="routerItem.children && routerItem.children.length <= 0 && routerItem?.isMenu"
|
|
|
- class="text-nowrap">
|
|
|
+ <div v-if="routerItem.children && routerItem.children.length <= 0 && routerItem?.isMenu" class="text-nowrap">
|
|
|
{{ routerItem.name }}
|
|
|
</div>
|
|
|
<div v-if="routerItem.children && routerItem.children.length > 0" class="flex justify-center items-center">
|
|
|
@@ -48,7 +47,7 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="flex flex-row justify-start items-center text-white header-right">
|
|
|
- <el-badge :value="12" :max="99" class="ml-4 cursor-pointer h-[26px]">
|
|
|
+ <el-badge :value="numberOfLogos" :max="99" class="ml-4 cursor-pointer h-[26px]" :show-zero="false">
|
|
|
<el-icon :size="26" @click="newsDrawer = true">
|
|
|
<Bell />
|
|
|
</el-icon>
|
|
|
@@ -82,28 +81,45 @@
|
|
|
|
|
|
<!-- 消息 -->
|
|
|
<el-drawer v-model="newsDrawer" modal-class="drawerVisClass" :with-header="false" size="45%">
|
|
|
- <div class="w-full h-full">
|
|
|
- <el-table :data="newsDrawerTableData" style="width: 100%" v-loading="newsDrawerLoading">
|
|
|
- <el-table-column prop="msg" label="消息内容">
|
|
|
- <template #default="scope">
|
|
|
- <el-link type="primary" :underline="false" @click="toDetail(scope.row)">{{ scope.row.msg }}</el-link>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column prop="checked" label="状态" width="100">
|
|
|
- <template #default="scope">
|
|
|
- <el-tag :type="scope.row.checked ? 'success' : 'danger'">
|
|
|
- {{ scope.row.checked ? '已读' : '未读' }}
|
|
|
- </el-tag>
|
|
|
+ <div class="w-full h-full flex flex-row" v-loading="newsDrawerLoading">
|
|
|
+ <div class="w-full h-full">
|
|
|
+ <el-table :data="newsDrawerTableData" style="flex1" border>
|
|
|
+ <el-table-column prop="msg" label="消息内容">
|
|
|
+ <template #default="scope">
|
|
|
+ <el-link type="primary" :underline="false" @click="toDetail(scope.row)">{{ scope.row.msg }}</el-link>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="checked" label="状态" width="100">
|
|
|
+ <template #default="scope">
|
|
|
+ <el-tag :type="scope.row.checked ? 'success' : 'danger'">
|
|
|
+ {{ scope.row.checked ? '已读' : '未读' }}
|
|
|
+ </el-tag>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="time" label="时间" width="140" />
|
|
|
+ </el-table>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="messageStyle">
|
|
|
+ <el-dropdown>
|
|
|
+ <span class="el-dropdown-link">
|
|
|
+ <el-icon class="el-icon--right">
|
|
|
+ <el-icon><MoreFilled /></el-icon>
|
|
|
+ </el-icon>
|
|
|
+ </span>
|
|
|
+ <template #dropdown>
|
|
|
+ <el-dropdown-menu>
|
|
|
+ <el-dropdown-item @click="oneClickRead()" :disabled="numberOfLogos <= 0">一键已读</el-dropdown-item>
|
|
|
+ </el-dropdown-menu>
|
|
|
</template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column prop="time" label="时间" width="140" />
|
|
|
- </el-table>
|
|
|
+ </el-dropdown>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</el-drawer>
|
|
|
</template>
|
|
|
|
|
|
<!-- /information/list -->
|
|
|
-
|
|
|
+
|
|
|
<script lang="ts" setup>
|
|
|
import { onMounted, ref, watchEffect, watch } from 'vue';
|
|
|
import { RouteRecordRaw, useRouter, useRoute } from 'vue-router';
|
|
|
@@ -127,6 +143,7 @@ const newsDrawerTableData = ref<any[]>([])
|
|
|
const drawerVis = ref(false)
|
|
|
const newsDrawer = ref(false)
|
|
|
const newsDrawerLoading = ref(false)
|
|
|
+const numberOfLogos = ref(0)
|
|
|
|
|
|
const updateVisibleItems = () => {
|
|
|
const parentWidth = (parentDiv.value?.offsetWidth && parentDiv.value?.offsetWidth - 150) || 10;
|
|
|
@@ -224,6 +241,7 @@ const getNewsDrawerTableData = () => {
|
|
|
time: formatDate(new Date(item.time))
|
|
|
}
|
|
|
})
|
|
|
+ numberOfLogos.value = (data || []).filter((item: any) => !item.checked).length
|
|
|
newsDrawerTableData.value = data
|
|
|
}).catch(err => {
|
|
|
newsDrawerTableData.value = []
|
|
|
@@ -233,13 +251,24 @@ const getNewsDrawerTableData = () => {
|
|
|
})
|
|
|
}
|
|
|
|
|
|
+const oneClickRead = () => {
|
|
|
+ newsDrawerLoading.value = true
|
|
|
+ post(`/information/checkAll`).then(_res => {
|
|
|
+ getNewsDrawerTableData()
|
|
|
+ }).catch(err => {
|
|
|
+ console.log(err, '<==== 失败')
|
|
|
+ }).finally(() => {
|
|
|
+ newsDrawerLoading.value = false
|
|
|
+ })
|
|
|
+}
|
|
|
+
|
|
|
const toDetail = (row: any) => {
|
|
|
console.log(row, '<=== 点击数据')
|
|
|
const { id, type, path } = row
|
|
|
post(`/information/check`, { id }).then(res => {
|
|
|
console.log(res, '<=== 成功')
|
|
|
getNewsDrawerTableData()
|
|
|
- if(path) {
|
|
|
+ if (path) {
|
|
|
router.push({ path });
|
|
|
}
|
|
|
}).catch(err => {
|
|
|
@@ -268,8 +297,11 @@ watchEffect(() => {
|
|
|
);
|
|
|
});
|
|
|
</script>
|
|
|
-
|
|
|
+
|
|
|
<style scoped lang="scss">
|
|
|
+.messageStyle {
|
|
|
+ margin: 15px;
|
|
|
+}
|
|
|
.trademark {
|
|
|
font-size: 20px;
|
|
|
}
|
|
|
@@ -304,11 +336,13 @@ watchEffect(() => {
|
|
|
.drawerVisBtn {
|
|
|
margin-top: 10px;
|
|
|
border-top: 1px solid #999;
|
|
|
+
|
|
|
div {
|
|
|
text-align: center;
|
|
|
line-height: 40px;
|
|
|
color: #fff;
|
|
|
cursor: pointer;
|
|
|
+
|
|
|
&:hover {
|
|
|
background: #086597;
|
|
|
}
|
