hongxilin
/
AIxiaocaishen
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

Merge branch 'ds_hxl' into ds

ds_hxl
no99 2 weeks ago
parent
f57f15e53c 98899d1e0d
commit
5a3e63aa09
6 changed files with 326 additions and 271 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 2
      src/views/AIchat.vue
  2. 551
      src/views/AiEmotion.vue
  3. 4
      src/views/DBQBmodel.vue
  4. 4
      src/views/Emotionsmodel.vue
  5. 6
      src/views/Selectmodel.vue
  6. 30
      src/views/homePage.vue

2
src/views/AIchat.vue
View File

@ -4566,7 +4566,7 @@ onUnmounted(() => {
<div class="gif-area">
<img :src="currentGif" alt="AI动画" />
<div class="marquee-container">
<div class="marquee-container" v-if="false">
<div id="top" class="marquee-row top" @mouseenter="floatingTopMouseEnter" @mouseleave="floatingTopMouseLeave">
<div v-for="(questions, index) in questionsList.slice(0, 5)" :key="'top' + index" class="marquee-item"
@click="showQuestions(questions)">

551
src/views/AiEmotion.vue
View File

@ -1,24 +1,44 @@
<template>
<div class="ai-emotion-container">
<!-- 金轮 -->
<div class="golden-wheel">
<img src="@/assets/img/AiEmotion/金轮.png" alt="金轮图标" :class="{ 'rotating-image': isRotating }">
<div class="ai-emotion-container" ref="userInputDisplayRef">
<!-- 金轮 -->
<div class="golden-wheel">
<img
src="@/assets/img/AiEmotion/金轮.png"
class="golden-wheel-img"
alt="金轮图标"
:class="{ 'rotating-image': isRotating }"
/>
</div>
<!-- 消息显示区域 -->
<div class="user-input-display">
<div
v-for="(message, index) in messages"
:key="index"
class="message-container"
>
<!-- 用户输入内容 -->
<div
v-if="message.sender === 'user'"
class="message-bubble user-message"
>
{{ message.text }}
</div>
<!-- 消息显示区域 -->
<div class="user-input-display" ref="userInputDisplayRef">
<div v-for="(message, index) in messages" :key="index" class="message-container">
<!-- 用户输入内容 -->
<div v-if="message.sender === 'user'" class="message-bubble user-message">
{{ message.text }}
</div>
<!-- AI返回结果 -->
<div v-if="message.sender === 'ai'" class="message-bubble ai-message">
{{ message.text }}
</div>
</div>
<!-- AI返回结果 -->
<div v-if="message.sender === 'ai'" class="message-bubble ai-message">
{{ message.text }}
</div>
</div>
</div>
<!-- 输入框和发送按钮 -->
<!-- <footer class="input-container fixed-bottom">
<input type="text" v-model="userInput" placeholder="请输入内容..." class="input-box" />
<button @click="handleSendMessage(userInput)" class="send-button">发送</button>
</footer> -->
<!-- <div class="input-container fixed-bottom">
<input type="text" v-model="userInput" placeholder="请输入内容..." class="input-box" />
<button @click="sendMessage" class="send-button">发送</button>
</div> -->
</div>
<!-- 渲染整个页面 -->
<div v-if="isPageLoaded" class="class01">
@ -135,13 +155,13 @@ import marketTemperature from '@/views/components/marketTemperature.vue';
import blueBorderImg from '@/assets/img/AiEmotion/blueBorder.png' //导入蓝色背景框图片
import { ElMessage } from 'element-plus';
const stockName = ref(''); // 存储股票名称
const stockName = ref(""); // 存储股票名称
const marketTemperatureRef = ref(null); // 引用市场温度计组件
const emoEnergyConverterRef = ref(null)
const emotionDecodRef = ref(null)
const emotionalBottomRadarRef = ref(null)
const messages = ref([]);
const displayDate = ref(''); // 用于存储显示的日期
const displayDate = ref(""); // 用于存储显示的日期
const isPageLoaded = ref(false); // 控制页面是否显示
const isRotating = ref(false);//控制旋转
const userInputDisplayRef = ref(null);//消息区域的引用
@ -152,17 +172,17 @@ const version1 = ref(2); // 版本号
defineExpose({ handleSendMessage })
// 触发图片旋转的方法
function startImageRotation() {
isRotating.value = true;
// 如果你想在一段时间后停止旋转，可以添加以下代码
setTimeout(() => {
isRotating.value = false;
}, 5000); // 5 秒后停止旋转
isRotating.value = true;
// 如果你想在一段时间后停止旋转，可以添加以下代码
setTimeout(() => {
isRotating.value = false;
}, 5000); // 5 秒后停止旋转
}
// 发送消息方法
async function handleSendMessage(input) {
console.log('发送内容:', input);
console.log("发送内容:", input);
// 检查用户输入内容是否为空
if (input.trim()) {
@ -171,39 +191,40 @@ async function handleSendMessage(input) {
// 触发图片旋转
isRotating.value = true;
try {
// 用来调用工作流接口的参数
const params = {
content: userMessage.text,
userData: {
token: '9ior41AF0xTIbIG2pRnnbZi0+fEeMx8pywnIlrmTwo5FbqJ9lWrSWOxp9MkpKiNtedtUafqvzIwpFKrwuMs',
language: 'cn',
brainPrivilegeState: '1',
swordPrivilegeState: '1',
stockForecastPrivile: '1',
spaceForecastPrivile: '1',
aibullPrivilegeState: '1',
aigoldBullPrivilegeS: '1',
airadarPrivilegeStat: '1',
marketList: 'hk,cn,usa,my,sg,vi,in,gb',
},
};
const result = await getReplyAPI(params);
const response = await result.json(); // 解析返回的 JSON 数据
console.log('工作流接口返回数据:', response);
// 解析 data 字段
const parsedData = JSON.parse(response.data); // 将字符串形式的 JSON 转换为对象
console.log('解析后的数据:', parsedData);
if (parsedData && parsedData.market && parsedData.code) {
console.log('工作流接口返回股票信息:', parsedData);
// 更新股票名称
stockName.value = parsedData.name || '未知股票';
// 请求数据接口
fetchData(parsedData.code, parsedData.market);
try {
// 用来调用工作流接口的参数
const params = {
content: userMessage.text,
userData: {
token:
"9ior41AF0xTIbIG2pRnnbZi0+fEeMx8pywnIlrmTwo5FbqJ9lWrSWOxp9MkpKiNtedtUafqvzIwpFKrwuMs",
language: "cn",
brainPrivilegeState: "1",
swordPrivilegeState: "1",
stockForecastPrivile: "1",
spaceForecastPrivile: "1",
aibullPrivilegeState: "1",
aigoldBullPrivilegeS: "1",
airadarPrivilegeStat: "1",
marketList: "hk,cn,usa,my,sg,vi,in,gb",
},
};
const result = await getReplyAPI(params);
const response = await result.json(); // 解析返回的 JSON 数据
console.log("工作流接口返回数据:", response);
// 解析 data 字段
const parsedData = JSON.parse(response.data); // 将字符串形式的 JSON 转换为对象
console.log("解析后的数据:", parsedData);
if (parsedData && parsedData.market && parsedData.code) {
console.log("工作流接口返回股票信息:", parsedData);
// 更新股票名称
stockName.value = parsedData.name || "未知股票";
// 请求数据接口
fetchData(parsedData.code, parsedData.market);
// 更新 span01 的内容
// updateSpan01();
@ -233,16 +254,16 @@ async function fetchData(code, market) {
version: version1.value
};
const stockDataResult = await axios.post(
'http://39.101.133.168:8828/link/api/aiEmotion/client/getAiEmotionData',
// 'https://api.homilychart.com/link/api/aiEmotion/client/getAiEmotionData',
stockDataParams,
{
headers: {
'Content-Type': 'application/json',
},
}
);
const stockDataResult = await axios.post(
"http://39.101.133.168:8828/link/api/aiEmotion/client/getAiEmotionData",
// 'https://api.homilychart.com/link/api/aiEmotion/client/getAiEmotionData',
stockDataParams,
{
headers: {
"Content-Type": "application/json",
},
}
);
const stockDataResponse = stockDataResult.data; // 获取返回所有的数据
console.log('图表数据接口返回数据:', stockDataResponse.data);
@ -276,45 +297,60 @@ async function fetchData(code, market) {
// 渲染组件图表的方法
function renderCharts(data) {
nextTick(() => {
// 渲染股市温度计图表
if (marketTemperatureRef.value && data.GSWDJ) {
console.log('开始渲染股市温度计图表');
console.log('股市温度计数据', data.GSWDJ)
marketTemperatureRef.value.initChart(data.GSWDJ, data.KLine20, data.WDRL);
console.log('股市温度计图表已渲染');
}
// 渲染情绪解码器图表
if (emotionDecodRef.value && data.QXJMQ) {
console.log('开始渲染情绪解码器图表');
console.log('情绪解码器数据', data.QXJMQ)
emotionDecodRef.value.initQXNLZHEcharts(data.KLine20, data.QXJMQ);
console.log('情绪解码器图表已渲染');
}
// 渲染情绪探底雷达图表
if (emotionalBottomRadarRef.value && data.QXTDLD) {
console.log('开始渲染情绪探底雷达图表');
console.log('数据', data.QXTDLD)
emotionalBottomRadarRef.value.initEmotionalBottomRadar(data.KLine20, data.QXTDLD);
console.log('情绪探底雷达图表已渲染');
}
// 渲染情绪能量转化器图表
if (emoEnergyConverterRef.value && data.QXNLZHQ) {
console.log('开始渲染情绪能量转化器图表');
console.log('KLine20:', data.KLine20);
console.log('QXNLZHQ:', data.QXNLZHQ);
emoEnergyConverterRef.value.initQXNLZHEcharts(data.KLine20, data.QXNLZHQ);
console.log('情绪能量转化器图表已渲染');
}
});
nextTick(() => {
// 渲染股市温度计图表
if (marketTemperatureRef.value && data.GSWDJ) {
console.log("开始渲染股市温度计图表");
console.log("股市温度计数据", data.GSWDJ);
marketTemperatureRef.value.initChart(data.GSWDJ, data.KLine20, data.WDRL);
console.log("股市温度计图表已渲染");
}
// 渲染情绪解码器图表
if (emotionDecodRef.value && data.QXJMQ) {
console.log("开始渲染情绪解码器图表");
console.log("情绪解码器数据", data.QXJMQ);
emotionDecodRef.value.initQXNLZHEcharts(data.KLine20, data.QXJMQ);
console.log("情绪解码器图表已渲染");
}
// 渲染情绪探底雷达图表
if (emotionalBottomRadarRef.value && data.QXTDLD) {
console.log("开始渲染情绪探底雷达图表");
console.log("数据", data.QXTDLD);
emotionalBottomRadarRef.value.initEmotionalBottomRadar(
data.KLine20,
data.QXTDLD
);
console.log("情绪探底雷达图表已渲染");
}
// 渲染情绪能量转化器图表
if (emoEnergyConverterRef.value && data.QXNLZHQ) {
console.log("开始渲染情绪能量转化器图表");
console.log("KLine20:", data.KLine20);
console.log("QXNLZHQ:", data.QXNLZHQ);
emoEnergyConverterRef.value.initQXNLZHEcharts(data.KLine20, data.QXNLZHQ);
console.log("情绪能量转化器图表已渲染");
}
});
}
const scrollToBottom = async () => {
const container = userInputDisplayRef.value;
if (!container) return;
await nextTick();
console.log(container.scrollHeight, "container.scrollHeight");
console.log(container.scrollTop, "container.scrollTop");
console.log(container.offsetHeight, "container.offsetHeight");
container.scrollTop = container.scrollHeight - container.offsetHeight;
};
// setInterval(() =>{
// scrollToBottom();
// },1000);
// 页面挂载完成后触发图片旋转
onMounted(() => {
startImageRotation();
});
</script>
<style scoped>
@ -351,79 +387,90 @@ onMounted(() => {
color: white;
}
.golden-wheel {
width: 100%;
display: flex;
justify-content: center;
}
.golden-wheel-img {
width: 60%;
max-width: 500px;
height: auto;
}
/* 定义旋转动画 */
@keyframes rotate {
from {
transform: rotate(0deg);
}
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
to {
transform: rotate(360deg);
}
}
/* 应用动画到图片 */
.rotating-image {
animation: rotate 5s linear;
/* 5 秒完成一次旋转，线性速度*/
animation: rotate 5s linear;
/* 5 秒完成一次旋转，线性速度*/
}
.bk-image {
background-image: url('@/assets/img/AiEmotion/bk03.png');
background-size: 100% 100%;
/* background-position: center; */
background-repeat: no-repeat;
width: 95%;
height: 30rem;
margin: 0 auto;
margin-top: 20px;
background-image: url("@/assets/img/AiEmotion/bk03.png");
background-size: 100% 100%;
/* background-position: center; */
background-repeat: no-repeat;
width: 95%;
height: 30rem;
margin: 0 auto;
margin-top: 20px;
}
/* 最后文字的颜色 */
.text-container {
position: relative;
top: 40%;
left: 50%;
transform: translate(-50%, -50%);
color: white;
/* 设置文字颜色 */
text-align: left;
/* 文字居中对齐 */
padding: 20px;
position: relative;
top: 40%;
left: 50%;
transform: translate(-50%, -50%);
color: white;
/* 设置文字颜色 */
text-align: left;
/* 文字居中对齐 */
padding: 20px;
}
.text-container p {
margin: 10px 0;
/* 设置段落间距 */
font-size: 40px;
/* 设置字体大小 */
margin-left: 50px;
margin: 10px 0;
/* 设置段落间距 */
font-size: 40px;
/* 设置字体大小 */
margin-left: 50px;
}
.class07 {
background-image: url('@/assets/img/AiEmotion/bk03.png');
/* 使用导入的背景图片 */
background-size: cover;
/* 确保背景图片完整显示 */
background-repeat: no-repeat;
/* 防止背景图片重复 */
width: 95%;
/* 设置容器宽度 */
height: auto;
/* 高度根据内容动态变化 */
min-height: 70rem;
/* 设置最小高度，确保图片显示 */
margin: 0 auto;
background-image: url("@/assets/img/AiEmotion/bk03.png");
/* 使用导入的背景图片 */
background-size: cover;
/* 确保背景图片完整显示 */
background-repeat: no-repeat;
/* 防止背景图片重复 */
width: 95%;
/* 设置容器宽度 */
height: auto;
/* 高度根据内容动态变化 */
min-height: 70rem;
/* 设置最小高度，确保图片显示 */
margin: 0 auto;
}
.class0700 {
margin: 0 auto;
width: fit-content;
margin: 0 auto;
width: fit-content;
}
.class0702 {
margin: 0 auto;
width: fit-content;
margin: 0 auto;
width: fit-content;
}
/* .class0503 {
@ -431,8 +478,8 @@ onMounted(() => {
} */
.class0402 {
width: 80%;
margin: 0 auto;
width: 80%;
margin: 0 auto;
}
.class0601 {
@ -480,28 +527,28 @@ onMounted(() => {
}
.class0701 {
margin: 0 auto;
width: fit-content;
margin: 0 auto;
width: fit-content;
}
.class0501 {
margin: 0 auto;
width: fit-content;
margin: 0 auto;
width: fit-content;
}
.class0403 {
margin: 0 auto;
width: fit-content;
margin: 0 auto;
width: fit-content;
}
.class0301 {
margin: 0 auto;
width: fit-content;
margin: 0 auto;
width: fit-content;
}
.class0201 {
margin: 0 auto;
width: fit-content;
margin: 0 auto;
width: fit-content;
}
.class0401 {
@ -542,30 +589,29 @@ onMounted(() => {
}
.class09 {
text-align: center;
text-align: center;
}
/* 为需要放大的图片添加样式 */
.scaled-img {
transform: scale(2.5);
text-align: center;
transform: scale(2.5);
text-align: center;
}
.lz-img {
margin-bottom: 10rem;
text-align: center;
padding-top: 70px;
margin-bottom: 10rem;
text-align: center;
padding-top: 70px;
}
.class08 {
background-image: url('@/assets/img/AiEmotion/bk03.png');
background-size: 100% 100%;
background-repeat: no-repeat;
width: 95%;
height: auto;
min-height: 40rem;
margin: 0 auto;
background-image: url("@/assets/img/AiEmotion/bk03.png");
background-size: 100% 100%;
background-repeat: no-repeat;
width: 95%;
height: auto;
min-height: 40rem;
margin: 0 auto;
}
.class06 {
@ -585,19 +631,19 @@ onMounted(() => {
}
.class05 {
background-image: url('@/assets/img/AiEmotion/bk03.png');
/* 使用导入的背景图片 */
background-size: 100% 100%;
/* 确保背景图片完整显示 */
background-repeat: no-repeat;
/* 防止背景图片重复 */
width: 95%;
/* 设置容器宽度 */
height: auto;
/* 高度根据内容动态变化 */
min-height: 70rem;
/* 设置最小高度，确保图片显示 */
margin: 0 auto;
background-image: url("@/assets/img/AiEmotion/bk03.png");
/* 使用导入的背景图片 */
background-size: 100% 100%;
/* 确保背景图片完整显示 */
background-repeat: no-repeat;
/* 防止背景图片重复 */
width: 95%;
/* 设置容器宽度 */
height: auto;
/* 高度根据内容动态变化 */
min-height: 70rem;
/* 设置最小高度，确保图片显示 */
margin: 0 auto;
}
.class04 {
@ -711,102 +757,101 @@ onMounted(() => {
}
.class01 {
width: 90%;
/* 固定容器宽度 */
min-height: 100px;
/* 设置最小高度，确保初始显示 */
height: auto;
/* 高度根据内容动态变化 */
padding: 40px;
/* 添加内边距，确保内容与边界有间距 */
box-sizing: border-box;
/* 包括内边距在宽度和高度计算中 */
background-color: #5e81a7;
margin: 0 auto;
/* 居中容器 */
margin-bottom: 10rem;
width: 90%;
/* 固定容器宽度 */
min-height: 100px;
/* 设置最小高度，确保初始显示 */
height: auto;
/* 高度根据内容动态变化 */
padding: 40px;
/* 添加内边距，确保内容与边界有间距 */
box-sizing: border-box;
/* 包括内边距在宽度和高度计算中 */
background-color: #5e81a7;
margin: 0 auto;
/* 居中容器 */
margin-bottom: 10rem;
}
.ai-emotion-container {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 20px;
position: relative;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 20px;
position: relative;
}
.user-input-display {
margin-top: 20px;
display: flex;
flex-direction: column;
width: 100%;
margin-top: 20px;
display: flex;
flex-direction: column;
width: 100%;
}
.message-container {
display: flex;
margin-bottom: 10px;
display: flex;
margin-bottom: 10px;
}
.user-message {
background-color: #007bff;
color: #fff;
padding: 10px 15px;
border-radius: 15px;
max-width: 60%;
text-align: left;
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
align-self: flex-end;
background-color: #007bff;
color: #fff;
padding: 10px 15px;
border-radius: 15px;
max-width: 60%;
text-align: left;
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
align-self: flex-end;
}
.ai-message {
background-color: #f1f1f1;
color: #333;
padding: 10px 15px;
border-radius: 15px;
max-width: 60%;
text-align: left;
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
align-self: flex-start;
background-color: #f1f1f1;
color: #333;
padding: 10px 15px;
border-radius: 15px;
max-width: 60%;
text-align: left;
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
align-self: flex-start;
}
.input-container {
display: flex;
align-items: center;
gap: 10px;
display: flex;
align-items: center;
gap: 10px;
}
.fixed-bottom {
position: fixed;
bottom: 100px;
left: 0;
width: 100%;
background-color: #f8f9fa;
padding: 10px 20px;
box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.1);
position: fixed;
bottom: 100px;
left: 0;
width: 100%;
background-color: #f8f9fa;
padding: 10px 20px;
box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.1);
}
.input-box {
padding: 10px;
font-size: 16px;
border: 1px solid #ccc;
border-radius: 5px;
width: calc(100% - 120px);
padding: 10px;
font-size: 16px;
border: 1px solid #ccc;
border-radius: 5px;
width: calc(100% - 120px);
}
.send-button {
padding: 10px 20px;
font-size: 16px;
color: #fff;
background-color: #007bff;
border: none;
border-radius: 5px;
cursor: pointer;
padding: 10px 20px;
font-size: 16px;
color: #fff;
background-color: #007bff;
border: none;
border-radius: 5px;
cursor: pointer;
}
.send-button:hover {
background-color: #0056b3;
background-color: #0056b3;
}
/* 手机端适配样式 */

4
src/views/DBQBmodel.vue
View File

@ -50,8 +50,8 @@ const goToHomePage = () => {
<style scoped>
.homepage {
width: 100vw;
min-height: 100vh;
/* width: 100vw; */
/* min-height: 100vh; */
background-size: cover;
background-position: center;
background-repeat: no-repeat;

4
src/views/Emotionsmodel.vue
View File

@ -51,8 +51,8 @@ const goToAiEmotion = () => {
<style scoped>
.homepage {
width: 100vw;
min-height: 100vh;
/* width: 100vw; */
/* min-height: 100vh; */
background-image: url('@/assets/img/Emotionsmodel/-s-bg.png');
background-size: cover;
background-position: center;

6
src/views/Selectmodel.vue
View File

@ -52,14 +52,14 @@ const goToEmotionsmodel = () => {
<style scoped>
.homepage {
width: 100vw;
min-height: 100vh;
/* width: 100vw; */
/* min-height: 100vh; */
background-color: #000cfc;
background-image: url('@/assets/img/Selectmodel/-s-bg.png');
background-size: cover;
background-position: center;
background-repeat: no-repeat;
overflow-x: hidden;
display: flex;
flex-direction: column;
align-items: center;

30
src/views/homePage.vue
View File

@ -55,10 +55,10 @@ const tabs = computed(() => [
name: "AIchat",
label: "夺宝奇兵大模型",
},
{
name: "AIfind",
label: "发现",
},
// {
// name: "AIfind",
// label: "发现",
// },
{
name: "AiEmotion",
label: "AI情绪大模型"
@ -214,7 +214,7 @@ const tabContent = ref(null);
const isScrolling = ref(false); //判断用户是否在滚动
const smoothScrollToBottom = async () => {
// console.log('调用滚动到底部的方法')
console.log('调用滚动到底部的方法')
// await nextTick();
const container = tabContent.value;
// console.log(container, 'container')
@ -623,9 +623,12 @@ onMounted(async () => {
.tab-container {
display: flex;
gap: 30px;
margin-right: 40px;
margin-left: 40px;
margin-bottom: 10px;
padding: 0 20px;
justify-content: flex-end;
justify-content: space-between;
height: 100%;
/* 新增右对齐 */
}
@ -633,19 +636,26 @@ onMounted(async () => {
cursor: pointer;
padding: 8px 12px;
font-size: clamp(18px, 3vw, 20px);
color: #999;
/* color: #999; */
color: #fff;
transition: all 0.3s;
border-bottom: 2px solid transparent;
font-weight: bold;
}
.tab-item.active {
color: #000;
border-color: #000;
/* color: #000;
border-color: #000; */
background: linear-gradient(0deg, #ffffff, #fec13e);
-webkit-background-clip: text;
background-clip: text;
-webkit-text-fill-color: transparent;
color: transparent;
border-color: #fec13e;
}
.tab-item:not(.active):hover {
color: #666;
color: #999999;
}
.tab-content {

Write Preview
Loading…
Cancel
Save