acs_jinbao/lms/nladmin-ui/src/views/system/notice/NoticeIconReader.vue

<template>
  <el-dialog
    title="消息详情"
    :visible.sync="visible"
    :modal-append-to-body="false"
    :append-to-body="true"
    width="60%">
    <div style="margin-top: 5px">
      <el-descriptions class="margin-top" :column="3" border>
        <el-descriptions-item>
          <template slot="label">
            <i class="el-icon-user"></i>
            标题
          </template>
          {{message.notice_title}}
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label">
            <i class="el-icon-mobile-phone"></i>
            信息类型
          </template>
          <el-tag size="small" type="danger">
            {{ dict.label.notice_type[message.notice_type] }}
          </el-tag>
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label">
            <i class="el-icon-location-outline"></i>
            创建时间
          </template>
          {{ message.create_time }}
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label">
            <i class="el-icon-tickets"></i>
            处理情况
          </template>
          <el-tag size="small" type="warning">
            {{ dict.label.deal_status[message.deal_status] }}
          </el-tag>
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label">
            <i class="el-icon-office-building"></i>
            内容
          </template>
          {{message.notice_content}}
        </el-descriptions-item>
      </el-descriptions>
    </div>
    <span slot="footer" class="dialog-footer">
      <el-button type="primary" size="mini" @click="handleCancel">确 定</el-button>
    </span>
  </el-dialog>
</template>

<script>
import crudNotice from './sysNotice'
import { NOTICE_SHOW_MESSAGE } from './VueBaseCode'
export default {
  dicts: ['deal_status', 'have_read_type', 'notice_type'],
  name: 'NoticeIconReader',
  data() {
    return {
      visible: false,
      confirmLoading: false,
      message: {
        have_read: false,
        notice_type: null,
        deal_status: null,
        notice_content: null,
        notice_id: '',
        create_time: '',
        notice_title: '',
        read_time: ''
      },
      bodyStyle: {
        padding: '0',
        maxHeight: (window.innerHeight * 0.6) + 'px',
        'overflow-y': 'auto'
      },
      modelStyle: {
        width: '60%',
        style: { top: '10px' },
        fullScreen: false
      }
    }
  },
  methods: {
    /**
     * 显示消息内容
     */
    show(row) {
      console.log('sss', row)
      this.visible = true
      this.confirmLoading = true
      this.message = row
      crudNotice.findById(row.notice_id).then(res => {
        this.message = res
        this.confirmLoading = false
      })
    },
    /**
     * 关闭
     */
    handleCancel() {
      this.visible = false
    }
  },
  mounted() {
    // 绑定查看站内信消息事件
    this.$bus.on(NOTICE_SHOW_MESSAGE, this.show)
  },
  destroyed() {
    this.$bus.off(NOTICE_SHOW_MESSAGE)
  }
}
</script>

<style scoped>

</style>