<template xmlns:v-slot="http://www.w3.org/1999/XSL/Transform">
    <div class="full-height">
        <CurdPanel ref="curdPanelRef"
                   title-search-form="任务日志查询"
                   title-data-table="任务日志列表"
                   :doQuery="LogsTaskLogApi.doQuery"
                   :doGet="LogsTaskLogApi.doGet"
                   :queryFormLabelPosition="'top'"
                   :allowAdd="false"
                   :allowEdit="false"
                   :allowDelete="false"
                   :allowRefresh="false"
                   close-on-save
                   fullHeight
                   autoLoad>


            <!-- 查询条件区域 -->
            <template v-slot:search-form="{formData}">
                <el-form-item label="记录时间" prop="recordtime">
                    <el-date-picker v-model="formData.recordtime" type="datetimerange" range-separator="至" start-placeholder="开始时间"
                                    end-placeholder="结束时间" value-format="timestamp">
                    </el-date-picker>
                </el-form-item>
                <el-form-item label="服务器地址" prop="serverip">
                    <el-input v-model="formData.serverip" @keyup.native.enter="queryData"/>
                </el-form-item>
                <el-form-item label="服务器名称" prop="servername">
                    <el-input v-model="formData.servername" @keyup.native.enter="queryData"/>
                </el-form-item>
                <el-form-item label="任务名称" prop="name">
                    <el-input v-model="formData.name" @keyup.native.enter="queryData"/>
                </el-form-item>
                <el-form-item label="执行结果" prop="result">
                    <el-select v-model="formData.result" placeholder="请选择执行结果">
                        <el-option label="执行成功" value="执行成功"/>
                        <el-option label="执行异常" value="执行异常"/>
                    </el-select>
                </el-form-item>
            </template>

            <!-- 表格列区域 -->
            <template slot="table-columns">
                <el-table-column type="index" width="50" align="center" label="#"/>
                <el-table-column prop="serverip" label="服务器地址" show-overflow-tooltip/>
                <el-table-column prop="servername" label="服务器名称" show-overflow-tooltip/>
                <el-table-column prop="name" label="任务名称" show-overflow-tooltip/>
                <el-table-column prop="consumetime" label="执行耗时" show-overflow-tooltip>
                    <template slot-scope='scope'>{{ scope.row.consumetime + "ms" }}</template>
                </el-table-column>
                <el-table-column prop="recordtime" label="记录/完成时间" :formatter="formatterDateTime" show-overflow-tooltip>
                </el-table-column>
                <!--<el-table-column prop="exceptioninfo" label="异常信息" show-overflow-tooltip/>-->
                <el-table-column prop="result" label="执行结果" show-overflow-tooltip/>
                <el-table-column label="操作" align="center" width="100px">
                    <template slot-scope="scope">
                        <el-button title="异常信息" icon="el-icon-fa-book" class="red" v-if='scope.row.exceptioninfo'
                                   @click="handlerExceptionView(scope.row.exceptioninfo)">异常信息
                        </el-button>
                    </template>
                </el-table-column>
            </template>
        </CurdPanel>

        <el-dialog close-on-press-escape append-to-body v-draggable title="查看堆栈信息" :visible.sync="exception.visible" width="80%">
            <template>
                <el-input v-if="exception.visible" type="textarea" :rows="25" v-model="exception.info" readonly></el-input>
            </template>
        </el-dialog>
    </div>

</template>
<script>
import BaseApi from '@/api/base/BaseApi';

export default {
    data() {
        return {
            LogsTaskLogApi: BaseApi('/logs/LogsTaskLog'),
            exception: {
                info: '',
                visible: false
            }
        };
    },
    methods: {
        queryData() {
            this.$refs.curdPanelRef.pageTable.handleLoad();
        },
        handlerExceptionView(info) {
            this.exception.info = info;
            this.exception.visible = true;
        },
    }
};
</script>
