通知公告新增阅读用户列表

src/api/system/notice.js

@@ -68,3 +68,12 @@ export function markNoticeReadAll(ids) {
     params: { ids }
   })
 }
+
+// 查询公告已读用户列表
+export function listNoticeReadUsers(query) {
+  return request({
+    url: '/system/notice/readUsers/list',
+    method: 'get',
+    params: query
+  })
+}

src/views/system/notice/ReadUsers.vue

@@ -0,0 +1,118 @@
+<template>
+  <el-dialog v-model="visible" :title="`「${noticeTitle}」已读用户`" width="760px" top="6vh" append-to-body @close="handleClose">
+    <el-form ref="queryRef" :model="queryParams" size="small" :inline="true" style="margin-bottom: 4px;">
+      <el-form-item prop="searchValue">
+        <el-input
+          v-model="queryParams.searchValue"
+          placeholder="登录名称 / 用户名称"
+          clearable
+          :prefix-icon="Search"
+          style="width: 220px;"
+          @keyup.enter="handleQuery"
+          @clear="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary" icon="Search" size="small" @click="handleQuery">搜索</el-button>
+        <el-button icon="Refresh" size="small" @click="resetQuery">重置</el-button>
+      </el-form-item>
+      <el-form-item style="float: right; margin-right: 0;">
+        <span class="read-stat">
+          共 <strong>{{ total }}</strong> 人已读
+        </span>
+      </el-form-item>
+    </el-form>
+    <el-table v-loading="loading" :data="userList" size="small" stripe height="340px">
+      <el-table-column type="index" label="序号" width="55" align="center" />
+      <el-table-column label="登录名称" prop="userName" align="center" :show-overflow-tooltip="true" />
+      <el-table-column label="用户名称" prop="nickName" align="center" :show-overflow-tooltip="true" />
+      <el-table-column label="所属部门" prop="deptName" align="center" :show-overflow-tooltip="true" />
+      <el-table-column label="手机号码" prop="phonenumber" align="center" width="120" />
+      <el-table-column label="阅读时间" prop="readTime" align="center" width="160">
+        <template #default="scope">
+          <span>{{ parseTime(scope.row.readTime) }}</span>
+        </template>
+      </el-table-column>
+    </el-table>
+    <pagination
+      v-show="total > 0"
+      :total="total"
+      v-model:page="queryParams.pageNum"
+      v-model:limit="queryParams.pageSize"
+      @pagination="getList"
+      style="padding: 6px 0px;"
+    />
+  </el-dialog>
+</template>
+
+<script setup name="ReadUsers">
+import { Search } from "@element-plus/icons-vue"
+import { listNoticeReadUsers } from "@/api/system/notice"
+
+const { proxy } = getCurrentInstance()
+
+const visible = ref(false)
+const loading = ref(false)
+const noticeTitle = ref("")
+const total = ref(0)
+const userList = ref([])
+
+const queryParams = reactive({
+  pageNum: 1,
+  pageSize: 10,
+  noticeId: undefined,
+  searchValue: undefined
+})
+
+function open(row) {
+  queryParams.noticeId = row.noticeId
+  noticeTitle.value = row.noticeTitle
+  queryParams.searchValue = undefined
+  queryParams.pageNum = 1
+  visible.value = true
+  getList()
+}
+
+function getList() {
+  loading.value = true
+  listNoticeReadUsers(queryParams).then(res => {
+    userList.value = res.rows
+    total.value = res.total
+  }).finally(() => {
+    loading.value = false
+  })
+}
+
+function handleQuery() {
+  queryParams.pageNum = 1
+  getList()
+}
+
+function resetQuery() {
+  proxy.resetForm("queryRef")
+  handleQuery()
+}
+
+function handleClose() {
+  userList.value = []
+  total.value = 0
+  queryParams.searchValue = undefined
+}
+
+defineExpose({
+  open
+})
+</script>
+
+<style scoped>
+.read-stat {
+  font-size: 13px;
+  color: #606266;
+  line-height: 28px;
+}
+.read-stat strong {
+  color: #409eff;
+  font-size: 15px;
+  margin: 0 2px;
+}
+</style>

src/views/system/notice/index.vue

@@ -94,6 +94,7 @@
          </el-table-column>
          <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
             <template #default="scope">
+               <el-button link type="primary" icon="User" @click="handleReadUsers(scope.row)" v-hasPermi="['system:notice:list']">阅读用户</el-button>
                <el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['system:notice:edit']">修改</el-button>
                <el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['system:notice:remove']" >删除</el-button>
             </template>
@@ -155,11 +156,13 @@
          </template>
       </el-dialog>
       <notice-detail-view ref="noticeViewRef" />
+      <read-users-dialog ref="readUsersRef" />
    </div>
 </template>
 
 <script setup name="Notice">
 import NoticeDetailView from "@/layout/components/HeaderNotice/DetailView"
+import ReadUsersDialog from "./ReadUsers"
 import { listNotice, getNotice, delNotice, addNotice, updateNotice } from "@/api/system/notice"
 
 const { proxy } = getCurrentInstance()
@@ -283,6 +286,11 @@ function handleViewData(row) {
   proxy.$refs["noticeViewRef"].open(row)
 }
 
+/** 查看已读用户 */
+function handleReadUsers(row) {
+   proxy.$refs["readUsersRef"].open(row)
+}
+
 /** 删除按钮操作 */
 function handleDelete(row) {
   const noticeIds = row.noticeId || ids.value

src/views/system/user/index.vue

@@ -185,14 +185,12 @@
 </template>
 
 <script setup name="User">
-import useAppStore from '@/store/modules/app'
 import TreePanel from "@/components/TreePanel"
 import ExcelImportDialog from "@/components/ExcelImportDialog"
 import UserViewDrawer from "./view"
 import { changeUserStatus, listUser, resetUserPwd, delUser, getUser, updateUser, addUser, deptTreeSelect } from "@/api/system/user"
 
 const router = useRouter()
-const appStore = useAppStore()
 const { proxy } = getCurrentInstance()
 const { sys_normal_disable, sys_user_sex } = useDict("sys_normal_disable", "sys_user_sex")