<template>
  <div>
    <div class="i-layout-page-header">
      <PageHeader :title="$route.meta.title" :content="$route.meta.description" hidden-breadcrumb />
    </div>
    <Card :bordered="false" dis-hover class="ivu-mt">
      <view-table ref="table" view-code="Log">
        <template slot-scope="{ row }" slot="command">
          <Button size="small" :title="$t('Front_Btn_Stack_Info')" type="info" custom-icon="fa fa-bars" @click="openStack(row)"></Button>
        </template>
      </view-table>
    </Card>
    <Modal v-model="stackOpened" scrollable :mask-closable="layout.maskClosable" :draggable="layout.draggable" :sticky="true" :reset-drag-position="true" :width="800">
      <div slot="header">
        <slot name="header">
          <span class="title">{{ $t('Front_Label_Stack_Info') }}</span>
          <span class="description">{{ $t('Front_Label_Stack_Info_Desc') }}</span>
        </slot>
      </div>
      <div class="ivu-ml-8 ivu-mr-8">
        {{ log.stack }}
      </div>
      <div slot="footer">
        <Button type="default" custom-icon="fa fa-times" @click="stackOpened = false">{{ $t('Front_Btn_Close') }}</Button>
      </div>
    </Modal>
  </div>
</template>
<script>
  import mixinPage from '../../mixins/page';

  export default {
    name: 'system-log',
    mixins: [mixinPage],
    components: {},
    data() {
      return {
        log: {},
        stackOpened: false
      };
    },
    computed: {},
    created() {},
    methods: {
      openStack(row) {
        this.log = row;
        this.stackOpened = true;
      }
    }
  };
</script>
