dify-proxy-fontend/apps/web-antd/src/views/ppt/index.vue

104 lines
2.2 KiB
Vue

<script lang="ts" setup>
import type { PPTTempItem } from '@vben/common-ui';
import { onMounted, reactive, ref } from 'vue';
import { PptListView, PptWorkView } from '@vben/common-ui';
import { notification } from 'ant-design-vue';
import { getWorkflowInfo, getWorkflowList, sendPpt } from '#/api';
let temp = reactive<PPTTempItem>({
id: 'ee3889b6-50fa-463e-b956-3b93447727fc',
name: '海南科技项目可研报告PPT生成',
});
interface ResultItem {
key: number;
role: 'ai' | 'user';
content: string;
footer?: any;
}
const hitsory = ref([]);
const loading = ref(true);
const itemMessage = ref<ResultItem[]>([]);
const getLogs = async (appid: string) => {
loading.value = true;
const res = await getWorkflowList({
appid,
limit: 5,
});
hitsory.value = res;
loading.value = false;
};
async function handleClick(item: PPTTempItem) {
temp = item;
const res = await getWorkflowInfo({
appid: temp.appId,
workflowRunId: item.workflowRunId,
});
itemMessage.value = [];
if (res.inputs) {
itemMessage.value.push({
key: itemMessage.value.length + 1,
role: 'user',
content: res.inputs.declarationDoc,
});
}
if (res.outputs) {
itemMessage.value.push({
key: itemMessage.value.length + 1,
role: 'ai',
content: res.outputs.result,
});
}
}
async function handleClickMode(item: PPTTempItem) {
notification.success({
message: `${item.name}`,
description: '已选取',
duration: 3,
});
temp = item;
}
onMounted(() => {
getLogs(temp.id);
});
</script>
<template>
<div class="layout">
<div class="lg:w-1/6">
<PptListView
title="选择模板"
:items="hitsory"
:loading="loading"
@click-mode="handleClickMode"
@click="handleClick"
/>
</div>
<PptWorkView
:item="temp"
:run-workflow="sendPpt"
:item-message="itemMessage"
/>
</div>
</template>
<style scoped lang="less">
.layout {
width: 100%;
min-width: 1400px;
height: 100%;
display: flex;
background: hsl(216deg 21.74% 95.49%);
font-family: AlibabaPuHuiTi, v-deep(var(--ant-font-family)), sans-serif;
border-radius: v-deep(var(--ant-border-radius));
}
</style>