<template>
  <el-dialog
    :title="'应用日志'"
    :visible.sync="visible"
    width="80%"
    @close="cancel"
  >
    <el-form>
        <el-form-item v-if="ingressesVisible">
          <el-card shadow="nerver" style="font-size: 15px">
            <div>
              <el-table
                :data="
                  ingressesData.slice(
                    (pageIndex - 1) * pageSize,
                    pageIndex * pageSize
                  )
                "
                style="width: 100%"
              >
                <el-table-column prop="rowKey" label="rowKey">
                </el-table-column>
                <el-table-column label="properties">
                  <template slot-scope="scope">
                    <div
                      v-for="(value, name, index) in scope.row.properties"
                      :key="index"
                    >
                      {{ name }}: {{ value }}
                    </div>
                  </template>
                </el-table-column>
              </el-table>
              <el-pagination
                @size-change="sizeChangeHandle"
                @current-change="currentChangeHandle"
                :current-page="pageIndex"
                :page-sizes="this.$store.state.settings.pageSizeList"
                :page-size="pageSize"
                :total="totalPage"
                layout="total, sizes, prev, pager, next, jumper"
              >
              </el-pagination>
            </div>
          </el-card>
        </el-form-item>
    </el-form>
  </el-dialog>
</template>

<script>
export default {
  data() {
    return {
      //定义可见性，即获取数据成功与否后再可见
      visible: false,
      ingressesVisible: false,
      serviceVisible: false,
      eventsVisible: false,
      name: "",
      applicationLog: [],
      eventsData: [], //定义应用事件数据结构体
      totalPage: 0,
      pageIndex: 1,
      pageSize: this.$store.state.settings.pageSize,
    };
  },
  methods: {
    init(name) {
      this.name = name;
      this.$nextTick(() => {
        // 获取路由
        this.$http({
          url: this.$http.adornUrl(
            `/hbase/getMpInfoByHbaseTablename/${this.name}`
          ),
          method: "get",
          //
        })
          .then((res) => {
            if(res.data.code==500){
              this.$message({
                type: 'info',
                message: '暂无数据'
          });  
            }
            this.ingressesData = res.data;
            this.totalPage = this.ingressesData.length;
            this.ingressesVisible = true;
            this.visible = true;
            console.log("ingressesData", this.ingressesData);
          })
          .catch((error) => {
            this.visible = true;
            console.log("获取日志信息错误", error);
          });
      });
    },
    formatMessage() {
      var item = this.eventsData.data.items[0].status;
      var message = "";

      if (item.conditions[0].status == "True") {
        this.appAvaliable = "应用可用";
        message = "应用可用，无事件发生！";
        //this.appAvaliable=`应用出现事件不可用,事件出现的原因为：${item.conditions[0].reason}`
      } else {
        this.appAvaliable = "应用不可用";
        message = `                         应用不可用,出现的原因为：${item.conditions[0].reason}，发出的提示消息为：${item.conditions[0].message}                 `;
      }
      if (item.conditions[1].status == "True") {
        this.appProcess = "应用创建进度完成！";
        this.appeventMessage = message + "     应用创建正常，无事件发生！";
      } else {
        this.appProcess = "应用创建失败！";
        this.appAvaliable = "应用不可用";
        this.appeventMessage =
          message +
          `     应用创建进程失败，原因为：${item.conditions[1].reason}`;
      }
    },

    cancel() {
      this.visible = false;
      this.ingressesVisible = false;
      this.serviceVisible = false;
      this.eventsVisible = false;
      this.baseinformData = [];
      this.ingressesData = [];
      this.serviceData = [];
      this.eventsData = [];
      this.name = "";
      this.version = "";
    },
    // 每页数
    sizeChangeHandle(val) {
      this.pageSize = val;
      this.pageIndex = 1;
    },
    // 当前页
    currentChangeHandle(val) {
      this.pageIndex = val;
    },
    // 通过值返回键值
    getKeyByValue(value, data) {
      return Object.keys(data).find((key) => (data[key] = value));
    },
  },
};
</script>

