Compare commits

..

3 Commits

Author SHA1 Message Date
junleea 042c092802 完成系统首页的数据统计 2025-04-06 15:51:15 +08:00
junleea a4281f9226 提示词部分添加历史查询 2025-04-06 14:30:16 +08:00
junleea e7cfc9cef8 完成ppt制作前端部分 2025-04-06 14:00:14 +08:00
4 changed files with 206 additions and 159 deletions

View File

@ -67,7 +67,7 @@ export const lineOptions = {
export const pieOptions = { export const pieOptions = {
title: { title: {
text: 'Referer of a Website', text: '系统开发语言',
subtext: 'Fake Data', subtext: 'Fake Data',
left: 'center', left: 'center',
}, },
@ -84,11 +84,11 @@ export const pieOptions = {
type: 'pie', type: 'pie',
radius: '50%', radius: '50%',
data: [ data: [
{ value: 1048, name: 'Search Engine' }, { value: 1048, name: 'golang' },
{ value: 735, name: 'Direct' }, { value: 735, name: 'Vue3' },
{ value: 580, name: 'Email' }, { value: 580, name: 'TypeScript' },
{ value: 484, name: 'Union Ads' }, { value: 484, name: 'CSS' },
{ value: 300, name: 'Video Ads' }, { value: 300, name: 'Python' },
], ],
emphasis: { emphasis: {
itemStyle: { itemStyle: {

View File

@ -51,19 +51,19 @@
<el-col :span="18"> <el-col :span="18">
<el-card shadow="hover"> <el-card shadow="hover">
<div class="card-header"> <div class="card-header">
<p class="card-header-title">订单动态</p> <p class="card-header-title">会话动态</p>
<p class="card-header-desc">最近一周订单状态包括订单成交量和订单退货量</p> <p class="card-header-desc">最近一周会话动态系统的处理会话数及消息数</p>
</div> </div>
<v-chart class="chart" :option="dashOpt1" /> <v-chart class="chart" :option="dashOpt1_" />
</el-card> </el-card>
</el-col> </el-col>
<el-col :span="6"> <el-col :span="6">
<el-card shadow="hover"> <el-card shadow="hover">
<div class="card-header"> <div class="card-header">
<p class="card-header-title">品类分布</p> <p class="card-header-title">模型使用统计</p>
<p class="card-header-desc">最近一个月销售商品的品类情况</p> <p class="card-header-desc">模型使用统计情况</p>
</div> </div>
<v-chart class="chart" :option="dashOpt2" /> <v-chart class="chart" :option="dashOpt2_" />
</el-card> </el-card>
</el-col> </el-col>
</el-row> </el-row>
@ -72,7 +72,7 @@
<el-card shadow="hover" :body-style="{ height: '400px' }"> <el-card shadow="hover" :body-style="{ height: '400px' }">
<div class="card-header"> <div class="card-header">
<p class="card-header-title">时间线</p> <p class="card-header-title">时间线</p>
<p class="card-header-desc">最新的销售动态和活动信息</p> <p class="card-header-desc">系统功能开发过程</p>
</div> </div>
<el-timeline> <el-timeline>
<el-timeline-item v-for="(activity, index) in activities" :key="index" :color="activity.color"> <el-timeline-item v-for="(activity, index) in activities" :key="index" :color="activity.color">
@ -88,19 +88,18 @@
</el-card> </el-card>
</el-col> </el-col>
<el-col :span="10"> <el-col :span="10">
<el-card shadow="hover" :body-style="{ height: '400px' }"> <el-card :body-style="{ height: '400px' }" shadow="hover">
<div class="card-header"> <template #header>
<p class="card-header-title">渠道统计</p> <div class="content-title">饼状图</div>
<p class="card-header-desc">最近一个月的订单来源统计</p> </template>
</div> <v-chart class="schart" :option="pieOptions" />
<v-chart class="map-chart" :option="mapOptions" /> </el-card>
</el-card>
</el-col> </el-col>
<el-col :span="7"> <el-col :span="7">
<el-card shadow="hover" :body-style="{ height: '400px' }"> <el-card shadow="hover" :body-style="{ height: '400px' }">
<div class="card-header"> <div class="card-header">
<p class="card-header-title">排行榜</p> <p class="card-header-title">模型使用排行榜</p>
<p class="card-header-desc">销售商品的热门榜单Top5</p> <p class="card-header-desc">热门模型使用排行</p>
</div> </div>
<div> <div>
<div class="rank-item" v-for="(rank, index) in ranks"> <div class="rank-item" v-for="(rank, index) in ranks">
@ -108,7 +107,7 @@
<div class="rank-item-content"> <div class="rank-item-content">
<div class="rank-item-top"> <div class="rank-item-top">
<div class="rank-item-title">{{ rank.title }}</div> <div class="rank-item-title">{{ rank.title }}</div>
<div class="rank-item-desc">{{ rank.value }}</div> <div class="rank-item-desc">使用{{ rank.value }}</div>
</div> </div>
<el-progress <el-progress
:show-text="false" :show-text="false"
@ -129,6 +128,7 @@
<script setup lang="ts" name="dashboard"> <script setup lang="ts" name="dashboard">
import { ref, reactive } from 'vue'; import { ref, reactive } from 'vue';
import countup from '@/components/countup.vue'; import countup from '@/components/countup.vue';
import { Function } from '@/types/function';
import { use, registerMap } from 'echarts/core'; import { use, registerMap } from 'echarts/core';
import { BarChart, LineChart, PieChart, MapChart } from 'echarts/charts'; import { BarChart, LineChart, PieChart, MapChart } from 'echarts/charts';
import { import {
@ -140,9 +140,10 @@ import {
} from 'echarts/components'; } from 'echarts/components';
import { CanvasRenderer } from 'echarts/renderers'; import { CanvasRenderer } from 'echarts/renderers';
import VChart from 'vue-echarts'; import VChart from 'vue-echarts';
import { dashOpt1, dashOpt2, mapOptions } from './chart/options'; import { dashOpt1, dashOpt2, pieOptions } from './chart/options';
import chinaMap from '@/utils/china'; import chinaMap from '@/utils/china';
import {GetDashBoardStatisticsService} from '@/api/tool'; import {GetDashBoardStatisticsService} from '@/api/tool';
import {FindFunctionService} from "@/api/function";
use([ use([
CanvasRenderer, CanvasRenderer,
BarChart, BarChart,
@ -155,7 +156,8 @@ use([
VisualMapComponent, VisualMapComponent,
MapChart, MapChart,
]); ]);
registerMap('china', chinaMap); const dashOpt2_ = reactive(dashOpt2);
const dashOpt1_ = reactive(dashOpt1);
//"dashboard_statistics_st": { //"dashboard_statistics_st": {
// "session_num": 176, // "session_num": 176,
@ -172,71 +174,22 @@ interface DashBoardBaseInfo {
today_message_count: number; today_message_count: number;
} }
const baseInfo = ref({} as DashBoardBaseInfo); const baseInfo = ref({} as DashBoardBaseInfo);
const activities = [
{
content: '收藏商品',
description: 'xxx收藏了你的商品就是不买',
timestamp: '30分钟前',
color: '#00bcd4',
},
{
content: '用户评价',
description: 'xxx给了某某商品一个差评吐血啊',
timestamp: '55分钟前',
color: '#1ABC9C',
},
{
content: '订单提交',
description: 'xxx提交了订单快去收钱吧',
timestamp: '1小时前',
color: '#3f51b5',
},
{
content: '退款申请',
description: 'xxx申请了仅退款又要亏钱了',
timestamp: '15小时前',
color: '#f44336',
},
{
content: '商品上架',
description: '运营专员瞒着你上架了一辆飞机',
timestamp: '1天前',
color: '#009688',
},
];
const ranks = [ interface Activitie{
{ content: string;
title: '手机', description: string;
value: 10000, timestamp: string;
percent: 80, color: string;
color: '#f25e43', }
}, const activities = ref<Activitie[]>([]);
{
title: '电脑', interface Rank {
value: 8000, title: string;
percent: 70, value: number;
color: '#00bcd4', percent: number;
}, color: string;
{ }
title: '相机', const ranks = ref<Rank[]>([]);
value: 6000,
percent: 60,
color: '#64d572',
},
{
title: '衣服',
value: 5000,
percent: 55,
color: '#e9a745',
},
{
title: '书籍',
value: 4000,
percent: 50,
color: '#009688',
},
];
const getDashBoardStatistics = async () => { const getDashBoardStatistics = async () => {
let req = { let req = {
@ -246,11 +199,45 @@ const getDashBoardStatistics = async () => {
if (result['code'] === 0) { if (result['code'] === 0) {
console.log('dashboard:', result['data']); console.log('dashboard:', result['data']);
baseInfo.value = result['data']["dashboard_statistics_st"]; baseInfo.value = result['data']["dashboard_statistics_st"];
dashOpt2_.series[0].data = result['data']["dashboard_statistics_model_st"];
let max_model = Math.max(...result['data']["dashboard_statistics_model_st"].map((item: any) => item.value));
ranks.value = result['data']["dashboard_statistics_model_st"].map((item: any) => {
return {
title: item.name,
value: item.value,
percent: (item.value / max_model*2) * 100,
color: '#2d8cf0',
};
});
ranks.value.sort((a, b) => b.value - a.value);
console.log('ranks:', ranks.value);
// //
// //
let sessionData = result['data']["dashboard_statistics_week"]["session_count"];
let messageData = result['data']["dashboard_statistics_week"]["message_count"];
let sessionCounts = sessionData.map((item: any) => item.count);
let messageCounts = messageData.map((item: any) => item.count);
dashOpt1_.series[0].data = sessionCounts;
dashOpt1_.series[1].data = messageCounts;
} else { } else {
console.error('获取统计数据失败:', result['msg']); console.error('获取统计数据失败:', result['msg']);
} }
let function_result = await FindFunctionService(req);
if (function_result['code'] === 0) {
let functions: Function[] = function_result['data'];
activities.value = functions.map((item: any) => {
return {
content: item.Name,
description: item.Function,
timestamp: item.CreatedAt,
color: '#2d8cf0',
};
});
activities.value.unshift({content: '基础管理功能',description: '系统基础管理功能开发',timestamp: "2024-03-23 12:21:42",color: '#2d8cf0'});
activities.value.push({content: '数据统计功能',description: '系统数据统计功能开发',timestamp: "2024-03-23 12:21:42",color: '#2d8cf0'});
} else {
console.error('获取统计数据失败:', function_result['msg']);
}
}; };
getDashBoardStatistics(); getDashBoardStatistics();
</script> </script>
@ -388,4 +375,9 @@ getDashBoardStatistics();
width: 100%; width: 100%;
height: 350px; height: 350px;
} }
.content-title {
font-weight: 400;
font-size: 22px;
color: #1f2f3d;
}
</style> </style>

View File

@ -103,9 +103,10 @@
<el-input <el-input
v-model="inputMessage" v-model="inputMessage"
type="textarea" type="textarea"
maxlength="5000"
style="border: 0" style="border: 0"
:rows="5" :rows="5"
placeholder="输入消息..." placeholder="输入ppt主题即要求...(如制作一份关于人工智能的ppt),最多输入5000字"
@keyup.enter="sendMessage" @keyup.enter="sendMessage"
/> />
<!-- <el-text <!-- <el-text
@ -132,7 +133,7 @@
:disabled="loading" :disabled="loading"
>生成ppt</el-button> >生成ppt</el-button>
</el-col> </el-col>
<el-col :span="3" style="text-align: center"> <!-- <el-col :span="3" style="text-align: center">
<el-select v-model="selectModel" placeholder="选择模型"> <el-select v-model="selectModel" placeholder="选择模型">
<el-option <el-option
v-for="item in ModelList" v-for="item in ModelList"
@ -141,7 +142,7 @@
:value="item.ID" :value="item.ID"
></el-option> ></el-option>
</el-select> </el-select>
</el-col> </el-col> -->
<el-col :span="1" style="text-align: center"> <el-col :span="1" style="text-align: center">
<el-button @click="handleSelectFileVisible" <el-button @click="handleSelectFileVisible"
><el-icon><Files /></el-icon ><el-icon><Files /></el-icon
@ -149,11 +150,10 @@
</el-col> </el-col>
<el-col :span="12" style="text-align: center"> <el-col :span="12" style="text-align: center">
<el-tag <el-tag
v-for="(file, index) in selectedFiles"
:key="index"
closable closable
@close="removeFile(index)" @close="removeFile(0)"
>{{ file.UserFileName }}</el-tag v-if="selectedFile"
>{{ selectedFile.UserFileName }}</el-tag
> >
</el-col> </el-col>
</el-row> </el-row>
@ -161,55 +161,47 @@
</div> </div>
<div> <div>
<!-- 文件对话框 --> <!-- 文件对话框 -->
<el-dialog <el-dialog
v-model="selectFileVisible" v-model="selectFileVisible"
title="从上传文件中选择" title="从上传文件中选择"
width="50%" width="50%"
> >
<el-input <el-input
placeholder="搜索文件" placeholder="搜索文件"
v-model="searchFileQuery" v-model="searchFileQuery"
prefix-icon="el-icon-search" prefix-icon="el-icon-search"
/> />
<el-button @click="uploadMessageFile">上传文件</el-button> <el-button @click="uploadMessageFile">上传文件</el-button>
<!-- 文件列表 --> <!-- 文件列表 -->
<div class="file-list"> <div class="file-list">
<el-checkbox-group v-model="selectedFiles"> <el-radio-group v-model="selectedFile">
<el-checkbox <el-radio
v-for="(item, index) in filteredFiles" v-for="(item, index) in filteredFiles"
:key="index" :key="index"
:label="item" :label="item"
> >
<span class="file-icon"> <span class="file-icon">
<!-- 根据文件类型展示不同图标 --> <!-- 根据文件类型展示不同图标 -->
<i <i v-if="item.UploadType === 'image'" class="el-icon-picture"></i>
v-if="item.UploadType === 'image'" <i v-else-if="item.UploadType === 'file'" class="el-icon-document"></i>
class="el-icon-picture" <!-- 可继续补充其他文件类型图标 -->
></i> </span>
<i {{ item.UserFileName }}
v-else-if="item.UploadType === 'file'" <!-- <span class="file-time">{{ item.CreatedAt }}</span> -->
class="el-icon-document" </el-radio>
></i> </el-radio-group>
<!-- 可继续补充其他文件类型图标 --> </div>
</span> <!-- 底部状态栏和按钮 -->
{{ item.UserFileName }} <div class="footer-bar">
<!-- <span class="file-time">{{ item.CreatedAt }}</span> --> <span class="selected-count">已选 {{ selectedFile ? 1 : 0 }} 个文件</span>
</el-checkbox> <el-button @click="selectFileVisible = false">取消</el-button>
</el-checkbox-group> <el-button type="primary" @click="handleSelectFileConfirm">
</div> 确认添加({{ selectedFile ? 1 : 0 }})
<!-- 底部状态栏和按钮 --> </el-button>
<div class="footer-bar"> </div>
<span class="selected-count"
>已选 {{ selectedFiles.length }} 个文件</span
>
<el-button @click="selectFileVisible = false">取消</el-button>
<el-button type="primary" @click="handleSelectFileConfirm"
>确认添加({{ selectedFiles.length }})</el-button
>
</div>
</el-dialog> </el-dialog>
</div> </div>
<!-- 上传文件对话框 --> <!-- 上传文件对话框 -->
<div> <div>
<el-dialog <el-dialog
@ -308,6 +300,7 @@
const selectFileVisible = ref(false); // const selectFileVisible = ref(false); //
const searchFileQuery = ref(""); // const searchFileQuery = ref(""); //
const filteredFiles = ref<File[]>([]); // const filteredFiles = ref<File[]>([]); //
const selectedFile = ref<File | null>(null); //
const uploadFileVisible = ref(false); // const uploadFileVisible = ref(false); //
const baseInfo = ref<BaseInfo>({ const baseInfo = ref<BaseInfo>({
user_id: 0, user_id: 0,
@ -336,11 +329,12 @@
}); });
}; };
const removeFile = (index: number) => { const removeFile = (index: number) => {
selectedFiles.value.splice(index, 1); selectedFile .value = null; //
}; };
const handleSelectFileVisible = async () => { const handleSelectFileVisible = async () => {
await getFileListData(); // await getFileListData(); //
ElMessage.success("制作PPT当前只支持单文件支持docx、doc、pdf、txt、md等格式的文件");
console.log("selectedFiles:", selectedFiles.value); console.log("selectedFiles:", selectedFiles.value);
selectFileVisible.value = true; // selectFileVisible.value = true; //
console.log("handleSelectFileVisible:", selectFileVisible.value); console.log("handleSelectFileVisible:", selectFileVisible.value);
@ -365,10 +359,11 @@
}; };
const handleSelectFileConfirm = () => { const handleSelectFileConfirm = () => {
// if (selectedFile.value) {
console.log("选中的文件:", selectedFiles.value); //
// console.log("Selected file:", selectedFile.value);
selectFileVisible.value = false; // selectFileVisible.value = false;
}
}; };
const doButtonD = () => { const doButtonD = () => {
@ -440,19 +435,29 @@
ElMessage.warning("当前会话已结束创建ppt请新建会话"); ElMessage.warning("当前会话已结束创建ppt请新建会话");
return; return;
} }
loading.value = true;
let req = { let req = {
token: localStorage.getItem('token'), token: localStorage.getItem('token'),
function: "spark-create-ppt", function: "spark-create-ppt",
query: inputMessage.value, query: inputMessage.value,
fileUrl: fileUrl + selectedFiles.value[0].file_store_name,
fileName: selectedFiles.value[0].UserFileName,
} }
if(selectedFile.value){
//docxdocpdftxtmd
let fileType = selectedFile.value.file_store_name.split('.').pop();
if (fileType !== "docx" && fileType !== "doc" && fileType !== "pdf" && fileType !== "txt" && fileType !== "md") {
ElMessage.warning("当前只支持docx、doc、pdf、txt、md等格式的文件");
return;
}
req["fileUrl"] = selectedFile.value.file_store_name;
req["fileName"] = selectedFile.value.UserFileName;
}
loading.value = true;
let pMsgContent =""; let pMsgContent ="";
if (req.fileUrl) { if (req["fileUrl"]) {
//url //url
pMsgContent += `[${req.fileName}](${req.fileUrl})` + "\n"; pMsgContent += `[${req["fileUrl"]}](${req["fileUrl"]})` + "\n";
pMsgContent = pMsgContent + req.query; pMsgContent = pMsgContent + req.query;
} else { } else {
pMsgContent = req.query; pMsgContent = req.query;

View File

@ -24,8 +24,8 @@
<el-button type="primary" @click="generatePrompt">生成Prompt</el-button> <el-button type="primary" @click="generatePrompt">生成Prompt</el-button>
<div class="prompt-template"> <div class="prompt-template">
<h3>Prompt 模板</h3> <h3>Prompt 模板</h3>
<el-button type="success" size="small" @click="addTemplate">模板新增</el-button> <!-- <el-button type="success" size="small" @click="addTemplate">模板新增</el-button> -->
<div v-for="(template, index) in templates" :key="index" class="template-item"> <div v-for="(template, index) in templates" :key="index" class="template-item" @click="addTemplate(template)">
<div class="template-title">{{ template.title }}</div> <div class="template-title">{{ template.title }}</div>
<div class="template-desc">{{ template.desc }}</div> <div class="template-desc">{{ template.desc }}</div>
</div> </div>
@ -74,6 +74,15 @@
</el-dropdown> </el-dropdown>
</div> </div>
</div> </div>
<!-- 历史会话 -->
<el-button @click="showSession">历史提示词</el-button>
<el-dialog title="历史提示词" v-model="isShowSession">
<div v-for="(session, index) in sessionList" :key="index" class="template-item" @click="selectSession(session)">
<div class="template-title">{{ session.Name }}</div>
<!-- <div class="template-desc">{{ template.desc }}</div> -->
</div>
</el-dialog>
</div> </div>
</template> </template>
@ -83,6 +92,9 @@ import { WSMessage} from "@/types/im";
import { FindModelListByFunctionName } from "@/api/function"; import { FindModelListByFunctionName } from "@/api/function";
import { Model } from "@/types/model"; import { Model } from "@/types/model";
import { ElMessage } from "element-plus"; import { ElMessage } from "element-plus";
import { GetMessageService } from "@/api/im";
import { FindSessionService } from "@/api/session";
import { Session } from '@/types/session';
// Prompt // Prompt
const taskInput = ref(''); const taskInput = ref('');
const resultPrompt = ref(''); const resultPrompt = ref('');
@ -111,6 +123,8 @@ const topP = ref(0.7);
// ID // ID
const sessionID = ref(0); const sessionID = ref(0);
const isShowSession = ref(false);
const sessionList = ref<Session[]>([]);
// Prompt // Prompt
const templates = ref([ const templates = ref([
@ -133,9 +147,10 @@ const generatePrompt = () => {
}; };
// //
const addTemplate = () => { const addTemplate = (template) => {
// //
console.log('添加模板功能待实现'); console.log('添加模板功能待实现:', template);
taskInput.value = template.desc;
}; };
// //
@ -198,8 +213,10 @@ const sendMessage = () => {
const GetModelListByFunctionName = async () => { const GetModelListByFunctionName = async () => {
let req = { let req = {
function: "gen-ai-chat", function: "gen-prompt",
token: localStorage.getItem("token"), token: localStorage.getItem("token"),
temperature: temperature.value,
top_p: topP.value,
}; };
try{ try{
let result = await FindModelListByFunctionName(req); let result = await FindModelListByFunctionName(req);
@ -246,6 +263,39 @@ const GetModelListByFunctionName = async () => {
GetModelListByFunctionName(); GetModelListByFunctionName();
const showSession = async () => {
//
let req = {
token: localStorage.getItem("token"),
type: "UserID",
session_type: 2, //
};
let result = await FindSessionService(req);
if (result["code"] === 0) {
sessionList.value = result["data"];
console.log("session_list:", sessionList.value);
} else {
ElMessage.error(result["msg"]);
}
isShowSession.value = true;
};
const selectSession = async (session: Session) => {
let req = {
token: localStorage.getItem("token"),
session_id: session.ID,
};
let result = await GetMessageService(req);
if (result["code"] === 0) {
taskInput.value = result["data"][0].Msg;
resultPrompt.value = result["data"][1].Msg;
console.log("session_list:", result["data"]);
} else {
ElMessage.error(result["msg"]);
}
};
onUnmounted(() => { onUnmounted(() => {
if (socket.value) { if (socket.value) {