1

wwl

2025-06-20 375f79172e357300895dbae7ab7fb19bf6e4b4e1

 src/views/system/notice/index.vue

@@ -83,11 +83,9 @@
      </el-table-column>
    </el-table>

    <div class="pag">
      <div class="pag1">
    <div class="pagination-container">
        <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum"
          :limit.sync="queryParams.pageSize" @pagination="getList" />
      </div>
    </div>

    <!-- 添加或修改公告对话框 -->
@@ -145,21 +143,21 @@

    <!-- 通知公告详情 -->
    <el-dialog :title="formIn.noticeTitle" :visible.sync="openDetail" width="800px" append-to-body>
      <div style="margin-top:-20px;margin-bottom:10px;">
      <div class="detail-header">
        <el-tag size="mini" effect="dark" type="warning" v-if="formIn.noticeType === '2'">公告</el-tag>
        <el-tag size="mini" effect="dark" v-else>通知</el-tag>
        <span style="margin-left:20px;">{{ parseTime(formIn.createTime, '{y}-{m}-{d} {h}:{i}:{s}') || '无' }}</span>
        <span class="time">{{ parseTime(formIn.createTime, '{y}-{m}-{d} {h}:{i}:{s}') || '无' }}</span>
      </div>
      <div style="margin-bottom:10px;">
        <span style="font-weight:bold;">接收科室：</span>
      <div class="detail-item">
        <span class="label">接收科室：</span>
        <span>{{ getDeptNames(formIn.deptId) }}</span>
      </div>
      <div style="margin-bottom:10px;">
        <span style="font-weight:bold;">接收用户：</span>
      <div class="detail-item">
        <span class="label">接收用户：</span>
        <span>{{ getUserNames(formIn.userIds) }}</span>
      </div>
      <div class="content">
        <div v-html="formIn.noticeContent" style="margin-left:0px;margin-right:76px" class="ql-editor"></div>
      <div class="detail-content">
        <div v-html="formIn.noticeContent" class="ql-editor"></div>
      </div>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="cancel">关闭</el-button>
@@ -203,6 +201,8 @@
      title: "",
      // 是否显示弹出层
      open: false,
      // 是否为初次加载
      isInitialLoad: true,
      // 查询参数
      queryParams: {
        pageNum: 1,
@@ -285,9 +285,10 @@
        this.noticeList = response.rows;
        this.total = response.total;
        this.loading = false;
        // 高亮或打开详情
        // 高亮或打开详情（仅初次加载时触发详情）
        this.$nextTick(() => {
          this.highlightNotice();
          this.highlightNotice(this.isInitialLoad);
          this.isInitialLoad = false; // 标记为非初次加载
        });
      }).catch((error) => {
        console.error("listNotice error:", error);
@@ -304,13 +305,15 @@
      }
    },
    /** 高亮或打开公告详情 */
    highlightNotice() {
    highlightNotice(isInitialLoad) {
      const { noticeId } = this.$route.query;
      if (noticeId) {
        const notice = this.noticeList.find(item => item.noticeId === noticeId);
        if (notice) {
          this.$refs.table.setCurrentRow(notice);
          this.handledetails(notice);
          if (isInitialLoad) {
            this.handledetails(notice); // 仅初次加载时打开详情
          }
        }
      }
    },
@@ -527,22 +530,66 @@
</script>

<style scoped>
.pag {
  width: 100%;
/* 容器样式，确保内容有适当内边距 */
.app-container {
  padding: 20px;
}

/* 分页容器，替换原 .pag 和 .pag1，居中显示 */
.pagination-container {
  display: flex;
  justify-content: center;
  margin-top: 20px;
}

.pag1 {
  width: 30%;
}

/* 高亮行样式，突出显示路由指定的公告 */
.highlight-row {
  background-color: #e6f7ff;
}

.ql-editor {
/* 对话框底部按钮居中 */
.dialog-footer {
  text-align: center;
  padding: 10px 0;
}

/* 详情对话框头部（类型标签和时间） */
.detail-header {
  margin: -20px 0 10px;
  display: flex;
  align-items: center;
}

.detail-header .time {
  margin-left: 20px;
  color: #606266;
}

/* 详情对话框信息项（接收科室、接收用户） */
.detail-item {
  margin-bottom: 10px;
}

.detail-item .label {
  font-weight: bold;
  color: #303133;
}

/* 详情对话框内容区域，限制富文本高度 */
.detail-content .ql-editor {
  max-height: 300px;
  overflow-y: auto;
  padding: 10px;
  color: #303133;
}

/* 表格操作列，优化按钮间距 */
.small-padding {
  padding: 0 10px;
}

/* 搜索表单顶部间距 */
.mb8 {
  margin-bottom: 8px;
}
</style>