<template>
|
<app-list-wrapper v-bind="listWrapperProps">
|
<app-layout-row :top="-10" :bottom="110" :height="'100%'">
|
<app-layout-col :span="24">
|
<app-tab-wrapper
|
v-bind="tabWrapperProps"
|
>
|
<template #header-button="scope">
|
<el-button
|
size="small"
|
icon="Search"
|
type="primary"
|
:disabled="!scope.selected?.view?.id"
|
@click="onOpenDetails(scope.selected.view)">
|
{{
|
$t('common.button.text.view')
|
}}
|
</el-button>
|
</template>
|
<template #log="scope">
|
<log-table v-bind="logTableProps"/>
|
</template>
|
|
<template #step="scope">
|
<step-table v-bind="stepTableProps"/>
|
</template>
|
</app-tab-wrapper>
|
</app-layout-col>
|
</app-layout-row>
|
</app-list-wrapper>
|
<log-details v-bind="logDetailsProps"/>
|
</template>
|
|
<script setup>
|
|
import {useI18n} from 'vue-i18n';
|
import LogTable from "./LogTable";
|
import StepTable from "./StepTable";
|
import LogDetails from "./LogDetails";
|
|
const {t} = useI18n();
|
|
const tabWrapperRef = ref();
|
|
const logTableRef = ref();
|
|
const logDetailsRef = ref();
|
|
const stepTableRef = ref();
|
|
const listWrapperProps = {
|
headerDom: false,
|
title: t('views.log.logInterface.IndexPage.BandTable.title'),
|
complementHeight: 95,
|
};
|
|
const tabWrapperProps = {
|
ref: tabWrapperRef,
|
tabList: [
|
{name: 'log', label: '日志'},
|
// {name: 'step', label: '步骤'}
|
],
|
subActive() {
|
const selected = tabWrapperRef.value.getSelected();
|
setActive(selected)
|
}
|
};
|
|
const logDetailsProps = {
|
ref: logDetailsRef,
|
};
|
|
const logTableProps = {
|
ref: logTableRef,
|
subCurrent(val) {
|
tabWrapperRef.value.setSelected(val);
|
}
|
};
|
|
const stepTableProps = {
|
ref: stepTableRef,
|
};
|
|
const onOpenDetails = (row) => {
|
logDetailsRef.value.onOpen(row);
|
}
|
|
|
const setActive = (val) => {
|
if (Object.keys(val).length > 0) {
|
|
logTableRef.value?.setActive(val);
|
stepTableRef.value?.setActive(val);
|
}
|
}
|
|
defineExpose({
|
setActive
|
});
|
|
</script>
|
