<template> 
 | 
  <el-card class="aui-card--fill" shadow="never"> 
 | 
    <div class="mod-demo__sysnoticeuser"> 
 | 
      <zt-table-wraper v-slot="{ table }" query-url="/sys/notice/my/page"> 
 | 
        <el-form :inline="true" :model="dataForm" @keyup.enter.native="table.query()"> 
 | 
          <el-form-item> 
 | 
            <zt-dict v-model="dataForm.type" :placeholder="$t('notice.type')" dict="notice_type"></zt-dict> 
 | 
          </el-form-item> 
 | 
          <el-form-item class="message-btn"> 
 | 
            <zt-button type="query" @click="table.query()"/> 
 | 
          </el-form-item> 
 | 
        </el-form> 
 | 
        <el-table v-adaptive="{bottomOffset:60}" 
 | 
                  v-loading="table.dataLoading" 
 | 
                  :data="table.dataList" 
 | 
                  border height="650px" @selection-change="table.selectionChangeHandle"> 
 | 
          <el-table-column type="selection" width="40"/> 
 | 
          <el-table-column :label="$t('notice.title')" prop="title"/> 
 | 
          <el-table-column :label="$t('notice.type')" prop="type" width="150"> 
 | 
            <template v-slot="{ row }"> 
 | 
              {{ $store.getters.getDictLabel("notice_type", row.type) }} 
 | 
            </template> 
 | 
          </el-table-column> 
 | 
          <el-table-column :label="$t('notice.senderName')" prop="senderName" width="150"/> 
 | 
          <el-table-column :label="$t('notice.senderDate')" prop="senderDate" width="170"/> 
 | 
          <el-table-column :label="$t('notice.readStatus')" prop="readStatus" width="130"> 
 | 
            <template v-slot="{ row }"> 
 | 
              <el-tag v-if="row.readStatus === 0" size="small" type="danger">{{ $t('notice.readStatus0') }}</el-tag> 
 | 
              <el-tag v-else size="small" type="success">{{ $t('notice.readStatus1') }}</el-tag> 
 | 
            </template> 
 | 
          </el-table-column> 
 | 
          <zt-table-column-handle :has-edit="false" :has-update="false" :table="table"> 
 | 
            <template v-slot="{ row }"> 
 | 
              <zt-table-button @click="viewHandle(row)">{{ $t('notice.view') }}</zt-table-button> 
 | 
            </template> 
 | 
          </zt-table-column-handle> 
 | 
        </el-table> 
 | 
      </zt-table-wraper> 
 | 
    </div> 
 | 
  </el-card> 
 | 
</template> 
 | 
  
 | 
<script> 
 | 
import {addDynamicRoute} from '../../../router' 
 | 
  
 | 
export default { 
 | 
  data() { 
 | 
    return { 
 | 
      dataForm: { 
 | 
        type: '' 
 | 
      } 
 | 
    } 
 | 
  }, 
 | 
  methods: { 
 | 
    viewHandle(row) { 
 | 
      // 路由参数 
 | 
      const routeParams = { 
 | 
        routeName: `${this.$route.name}__${row.id}`, 
 | 
        title: this.$t('notice.view2'), 
 | 
        path: 'notice/notice-user-view', 
 | 
        params: { 
 | 
          id: row.id 
 | 
        } 
 | 
      } 
 | 
  
 | 
      // 如果未读,则标记为已读 
 | 
      if (row.readStatus === 0) { 
 | 
        this.updateReadStatus(row.id) 
 | 
      } 
 | 
  
 | 
      // 动态路由 
 | 
      addDynamicRoute(routeParams) 
 | 
    }, 
 | 
    updateReadStatus(noticeId) { 
 | 
      this.$http['put']('/sys/notice/my/read/' + noticeId).then(res => { 
 | 
        if (res.code !== 0) { 
 | 
          return this.$message.error(res.msg) 
 | 
        } 
 | 
      }).catch(() => { 
 | 
      }) 
 | 
    } 
 | 
  } 
 | 
} 
 | 
</script> 
 |