<template>
  <div class="fullheight">
    <ht-table
      @load="loadData"
      :data="data"
      :pageResult="pageResult"
      :selection="true"
      :show-export="false"
      :show-custom-column="false"
      quick-search-props="sysCode"
      ref="htTable"
      @selection-change="handleSelectionChange"
    >
      <template v-slot:toolbar>
        <!-- <el-input v-model="searchData" style="width:20%" placeholder="请输入系统编码进行查询"/> -->
        <el-button-group>
          <!-- <el-button size="small" @click="searchFunc()" type="success">搜索</el-button> -->
<!--          &lt;!&ndash; <el-button size="small" @click="showDialog()" icon="el-icon-plus" type="success">添加</el-button>-->
          <ht-delete-button url="${portal}/portalMsgSendLog/v1/" :htTable="$refs.htTable"
          :disabled="isDisabled">删除</ht-delete-button>
        </el-button-group>
      </template>
      <template>
        <ht-table-column type="index" width="50" align="center" label="序号" />
        <ht-table-column
          prop="sysCode"
          label="系统编码"
          :sortable="true"
          :show-overflow-tooltip="true"
        >
          <template v-slot="{row}">
            <el-link
              type="primary"
              title="查看详情"
              @click="showDialog(row.id)"
              >{{ row.sysCode }}</el-link
            >
          </template>
        </ht-table-column>
<!--        <ht-table-column-->
<!--          prop="sysCode"-->
<!--          label="系统编码"-->
<!--          :sortable="true"-->
<!--          :show-overflow-tooltip="true"-->
<!--        >-->
<!--        </ht-table-column>-->
<!--        <ht-table-column-->
<!--          prop="flowKey"-->
<!--          label="流程的KEY"-->
<!--          :sortable="true"-->
<!--          :show-overflow-tooltip="true"-->
<!--        >-->
<!--        </ht-table-column>-->
<!--        <ht-table-column-->
<!--          prop="actionType"-->
<!--          label="流程动作类型"-->
<!--          :sortable="true"-->
<!--          :show-overflow-tooltip="true"-->
<!--        >-->
<!--        </ht-table-column>-->
<!--        <ht-table-column-->
<!--          prop="trigNodeId"-->
<!--          label="任务节点"-->
<!--          :sortable="true"-->
<!--          :show-overflow-tooltip="true"-->
<!--        >-->
<!--        </ht-table-column>-->
<!--        <ht-table-column-->
<!--          prop="trigUserId"-->
<!--          label="触发该节点的用户ID"-->
<!--          :sortable="true"-->
<!--          :show-overflow-tooltip="true"-->
<!--        >-->
<!--        </ht-table-column>-->
        <ht-table-column
          prop="sendTime"
          label="发送时间"
          :sortable="true"
          :show-overflow-tooltip="true"
        >
        </ht-table-column>
        <ht-table-column
          prop="title"
          label="消息标题"
          :sortable="true"
          :show-overflow-tooltip="true"
        >
        </ht-table-column>
        <ht-table-column
          prop="content"
          label="文本内容"
          :sortable="true"
          :show-overflow-tooltip="true"
        >
        </ht-table-column>
        <ht-table-column
          prop="status"
          label="状态"
          :sortable="true"
          :show-overflow-tooltip="true"
        >
          <template v-slot="{row}">
            <span v-if="row.status == 0">失败</span>
            <span v-else>成功</span>
          </template>
        </ht-table-column>
      </template>
    </ht-table>
    <PortalMsgSendLog-manager-edit
      ref="PortalMsgSendLogManagerEdit"
    ></PortalMsgSendLog-manager-edit>
  </div>
</template>
<script>
import PortalMsgSendLogManagerEdit from './PortalMsgSendLogManagerEdit.vue'
export default {
  components: {PortalMsgSendLogManagerEdit},
  data() {
    return {
      dialogVisible: false,
      data: [],
      pageResult: {
        page: 1,
        pageSize: 50,
        total: 0,
      },
      PortalMsgSendLog: {},
      saveMethod: 'POST',
      searchData: '',
        isDisabled:true,  //按钮的禁用
      selectedList:[]
    }
  },
    watch: {
    // 监听选中下
     selectedList:{
      handler(val){
        this.isDisabled = val.length < 1 ? true : false
      },
      deep:true
    }
  },
  mounted() {
    this.$validator = this.$root.$validator
  },
  methods: {
    handleSelectionChange(selection){
      this.selectedList = selection
    },
    showDialog(id) {
      this.$refs.PortalMsgSendLogManagerEdit.showDialog(id)
    },
    beforeCloseDialog() {
      this.PortalMsgSendLog = {}
      this.dialogVisible = false
    },
    loadData(param,cb) {
      this.$http
        .post('${portal}/portalMsgSendLog/v1/query', param)
        .then((resp) => {
          let response = resp.data
          this.data = response.rows
          this.pageResult = {
            page: response.page,
            pageSize: response.pageSize,
            total: response.total,
          }
        })
        .finally(() => {
          cb&&cb()
        })
    },
    afterSaveData() {
      setTimeout(() => {
        this.beforeCloseDialog()
        this.$refs.htTable.load()
      }, 500)
    },
    searchFunc() {
      if (this.searchData) {
        let params = {sysCode: this.searchData}
        this.loadData({params})
      }
    },
  },
}
</script>