<template> 
 | 
  <el-card class="aui-card--fill" shadow="never"> 
 | 
    <div class="mod-demo__sysnotice"> 
 | 
      <zt-table-wraper v-slot="{ table }" delete-url="/sys/notice" query-url="/sys/notice/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()"/> 
 | 
            <zt-button type="add" @click="table.editHandle()"/> 
 | 
            <zt-button type="delete" @click="table.deleteHandle()"/> 
 | 
          </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"/> 
 | 
          <zt-table-column-dict :label="$t('notice.type')" dict="notice_type" prop="type" width="150"/> 
 | 
          <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.status')" prop="status" width="130"> 
 | 
            <template v-slot="{ row }"> 
 | 
              <el-tag v-if="row.status === 0" size="small" type="danger">{{ $t('notice.status0') }}</el-tag> 
 | 
              <el-tag v-else size="small" type="success">{{ $t('notice.status1') }}</el-tag> 
 | 
            </template> 
 | 
          </el-table-column> 
 | 
          <zt-table-column-handle :has-edit="canEdit" :table="table" width="150"> 
 | 
            <template v-slot="{ row }"> 
 | 
              <zt-table-button v-if="row.status === 1" @click="viewHandle(row)">{{ 
 | 
                  $t('notice.view') 
 | 
                }} 
 | 
              </zt-table-button> 
 | 
            </template> 
 | 
          </zt-table-column-handle> 
 | 
        </el-table> 
 | 
        <!-- 弹窗, 新增 / 修改 --> 
 | 
        <add-or-update @refreshDataList="table.query"/> 
 | 
      </zt-table-wraper> 
 | 
    </div> 
 | 
  </el-card> 
 | 
</template> 
 | 
  
 | 
<script> 
 | 
import AddOrUpdate from './notice-add-or-update' 
 | 
import {addDynamicRoute} from '../../../router' 
 | 
  
 | 
export default { 
 | 
  data() { 
 | 
    return { 
 | 
      dataForm: { 
 | 
        type: '' 
 | 
      } 
 | 
    } 
 | 
  }, 
 | 
  components: { 
 | 
    AddOrUpdate 
 | 
  }, 
 | 
  methods: { 
 | 
    canEdit(row) { 
 | 
      return row.status === 0 
 | 
    }, 
 | 
    viewHandle(row) { 
 | 
      // 路由参数 
 | 
      const routeParams = { 
 | 
        routeName: `${this.$route.name}__${row.id}`, 
 | 
        title: this.$t('notice.view1'), 
 | 
        path: 'notice/notice-view', 
 | 
        params: { 
 | 
          id: row.id 
 | 
        } 
 | 
      } 
 | 
      // 动态路由 
 | 
      addDynamicRoute(routeParams) 
 | 
    } 
 | 
  } 
 | 
} 
 | 
</script> 
 |