133 lines
3.2 KiB
Vue
133 lines
3.2 KiB
Vue
<template>
|
||
<div class="guess-you-want-to-ask-card">
|
||
<div class="card-title">
|
||
<img src="@/assets/imgs/jyh/ai/icon_cnxw.png" style="width: 20px;height: 20px;margin-right: 8px"></img>
|
||
<span>猜你想问</span>
|
||
<d-button @click="changeQuestions" class="jyh-button1" variant="solid">
|
||
<div class="flex flex-center">
|
||
<img style="height: 15px;margin-right: 8px" width="16" src="@/assets/imgs/jyh/ai/icon_reflush.png" />
|
||
<span>换一批</span>
|
||
</div>
|
||
</d-button>
|
||
</div>
|
||
<div class="card-description">
|
||
<button v-for="(question, index) in questions" :key="index" class="question-button" @click="emits('submit',question)">
|
||
{{ question }}
|
||
</button>
|
||
</div>
|
||
</div>
|
||
</template>
|
||
|
||
<script setup>
|
||
import { nextTick, onMounted, ref } from 'vue';
|
||
import axios from 'axios';
|
||
|
||
const emits = defineEmits(['submit']);
|
||
|
||
// 假设的图标 URL，你可以根据实际情况修改
|
||
const iconUrl = 'https://example.com/icon.png';
|
||
|
||
// 初始化问题列表
|
||
const questions = ref([
|
||
// '获取代码行数超过100万行的前10款软件',
|
||
// '查找v0.15.5版本的livebook软件详情',
|
||
// '获取5个安全评分低于30的高风险软件',
|
||
// '查询下载量前10的恶意包',
|
||
// '查询金融行业软件的高危漏洞修复方案',
|
||
// '统计不同业务领域的平均安全评分',
|
||
// '危险和严重的个人预警通知',
|
||
// '我的订阅列表'
|
||
]);
|
||
|
||
// 换一批问题的函数
|
||
const changeQuestions = () => {
|
||
fetchFollowupQuestions()
|
||
};
|
||
|
||
onMounted(() => {
|
||
fetchFollowupQuestions()
|
||
})
|
||
|
||
const VITE_AI_API_HOST = import.meta.env.VITE_AI_API_HOST;
|
||
// 猜你想问接口
|
||
const fetchFollowupQuestions = async (question,df_id,sql_id='') => {
|
||
debugger
|
||
try {
|
||
// 构造请求参数（需根据实际文档补充 df_id 和 sql_id，示例中使用空字符串占位）
|
||
const params = {
|
||
questions: questions.value,
|
||
// df_id: df_id || '', // 使用当前会话ID，若无则为空
|
||
// sql_id: sql_id || '' // 同上
|
||
};
|
||
const response = await axios.post(
|
||
`${VITE_AI_API_HOST}/api/v0/update_recommend_questions`,
|
||
params
|
||
);
|
||
debugger
|
||
const createRes = response.data;
|
||
if (createRes&&createRes.questions) {
|
||
questions.value = createRes.questions
|
||
} else {
|
||
// Message.error('创建会话失败，未获取到会话ID');
|
||
}
|
||
} catch (error) {
|
||
console.error('查询相关问题失败:', error);
|
||
// Message.error('创建会话失败，请重试');
|
||
}
|
||
};
|
||
</script>
|
||
|
||
<style scoped lang="scss">
|
||
.guess-you-want-to-ask-card {
|
||
border-radius: 24px;
|
||
background: #FFFFFF;
|
||
padding: 18px 24px;
|
||
}
|
||
|
||
|
||
.card-title {
|
||
display: flex;
|
||
align-items: center;
|
||
color: #191919;
|
||
font-family: HarmonyOS Sans SC;
|
||
font-weight: bold;
|
||
font-size: 16px;
|
||
line-height: 24px;
|
||
letter-spacing: 0px;
|
||
text-align: left;
|
||
}
|
||
|
||
.card-title i {
|
||
margin-right: 8px;
|
||
}
|
||
|
||
.title-icon {
|
||
width: 20px;
|
||
height: 20px;
|
||
margin-right: 8px;
|
||
}
|
||
|
||
.card-description {
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
gap: 8px;
|
||
margin-top: 20px;
|
||
}
|
||
|
||
.question-button {
|
||
border: none;
|
||
border-radius: 35px;
|
||
background: #F3F3F3;
|
||
padding: 6px 12px;
|
||
cursor: pointer;
|
||
}
|
||
|
||
.question-button:hover {
|
||
background-color: #e0e0e0;
|
||
}
|
||
|
||
.jyh-button1 {
|
||
margin-left: auto;
|
||
}
|
||
</style>
|