update trace log

This commit is contained in:
Qiuxia Fan 2022-07-26 11:11:21 +08:00
parent 673b1a41a8
commit 0322264ef3
3 changed files with 19 additions and 39 deletions

View File

@ -38,6 +38,7 @@ limitations under the License. -->
</div> </div>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import { provide } from "vue";
import { useI18n } from "vue-i18n"; import { useI18n } from "vue-i18n";
import { useDashboardStore } from "@/store/modules/dashboard"; import { useDashboardStore } from "@/store/modules/dashboard";
import Header from "../related/log/Header.vue"; import Header from "../related/log/Header.vue";
@ -52,6 +53,7 @@ const props = defineProps({
activeIndex: { type: String, default: "" }, activeIndex: { type: String, default: "" },
needQuery: { type: Boolean, default: true }, needQuery: { type: Boolean, default: true },
}); });
provide("options", props.data);
const { t } = useI18n(); const { t } = useI18n();
const dashboardStore = useDashboardStore(); const dashboardStore = useDashboardStore();

View File

@ -39,6 +39,7 @@ limitations under the License. -->
</div> </div>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import { provide } from "vue";
import type { PropType } from "vue"; import type { PropType } from "vue";
import Filter from "../related/trace/Filter.vue"; import Filter from "../related/trace/Filter.vue";
import TraceList from "../related/trace/TraceList.vue"; import TraceList from "../related/trace/TraceList.vue";
@ -55,6 +56,7 @@ const props = defineProps({
activeIndex: { type: String, default: "" }, activeIndex: { type: String, default: "" },
needQuery: { type: Boolean, default: true }, needQuery: { type: Boolean, default: true },
}); });
provide("options", props.data);
const { t } = useI18n(); const { t } = useI18n();
const dashboardStore = useDashboardStore(); const dashboardStore = useDashboardStore();
function removeWidget() { function removeWidget() {

View File

@ -33,33 +33,6 @@ limitations under the License. -->
{{ t("viewLogs") }} {{ t("viewLogs") }}
</el-button> </el-button>
</div> </div>
<el-dialog
v-model="showTraceLogs"
:destroy-on-close="true"
fullscreen
@closed="showTraceLogs = false"
>
<div>
<el-pagination
v-model:currentPage="pageNum"
v-model:page-size="pageSize"
:small="true"
layout="prev, pager, next"
:pager-count="5"
:total="total"
@current-change="turnLogsPage"
/>
<LogTable
:tableData="traceStore.traceSpanLogs || []"
:type="`service`"
:noLink="true"
>
<div class="log-tips" v-if="!traceStore.traceSpanLogs.length">
{{ t("noData") }}
</div>
</LogTable>
</div>
</el-dialog>
</h5> </h5>
<div class="mb-5 blue sm"> <div class="mb-5 blue sm">
<Selector <Selector
@ -148,7 +121,7 @@ limitations under the License. -->
</template> </template>
<script lang="ts"> <script lang="ts">
import dayjs from "dayjs"; import dayjs from "dayjs";
import { ref, defineComponent, computed } from "vue"; import { ref, defineComponent, computed, inject } from "vue";
import { useI18n } from "vue-i18n"; import { useI18n } from "vue-i18n";
import { useTraceStore } from "@/store/modules/trace"; import { useTraceStore } from "@/store/modules/trace";
import { Option } from "@/types/app"; import { Option } from "@/types/app";
@ -156,6 +129,9 @@ import copy from "@/utils/copy";
import graphs from "./components/index"; import graphs from "./components/index";
import LogTable from "@/views/dashboard/related/components/LogTable/Index.vue"; import LogTable from "@/views/dashboard/related/components/LogTable/Index.vue";
import { ElMessage } from "element-plus"; import { ElMessage } from "element-plus";
import getDashboard from "@/hooks/useDashboardsSession";
import { useDashboardStore } from "@/store/modules/dashboard";
import { LayoutConfig } from "@/types/dashboard";
export default defineComponent({ export default defineComponent({
name: "TraceDetail", name: "TraceDetail",
@ -164,6 +140,7 @@ export default defineComponent({
LogTable, LogTable,
}, },
setup() { setup() {
const options: LayoutConfig | undefined = inject("options");
const { t } = useI18n(); const { t } = useI18n();
const traceStore = useTraceStore(); const traceStore = useTraceStore();
const loading = ref<boolean>(false); const loading = ref<boolean>(false);
@ -171,6 +148,7 @@ export default defineComponent({
const displayMode = ref<string>("List"); const displayMode = ref<string>("List");
const pageNum = ref<number>(1); const pageNum = ref<number>(1);
const pageSize = 10; const pageSize = 10;
const dashboardStore = useDashboardStore();
const total = computed(() => const total = computed(() =>
traceStore.traceList.length === pageSize traceStore.traceList.length === pageSize
? pageSize * pageNum.value + 1 ? pageSize * pageNum.value + 1
@ -195,18 +173,16 @@ export default defineComponent({
} }
async function searchTraceLogs() { async function searchTraceLogs() {
showTraceLogs.value = true; const { widgets } = getDashboard(dashboardStore.currentDashboard);
const res = await traceStore.getSpanLogs({ const widget = widgets.filter((d: { type: string }) => d.type === "Log");
condition: { const item = {
relatedTrace: { ...widget,
filters: {
sourceId: options?.id || "",
traceId: traceId.value || traceStore.currentTrace.traceIds[0].value, traceId: traceId.value || traceStore.currentTrace.traceIds[0].value,
}, },
paging: { pageNum: pageNum.value, pageSize }, };
}, dashboardStore.setWidget(item);
});
if (res.errors) {
ElMessage.error(res.errors);
}
} }
function turnLogsPage(page: number) { function turnLogsPage(page: number) {