添加dashboard基础数据展示,gen-chat添加模型选择、参数选择,功能管理修复模型选择问题

This commit is contained in:
junleea 2025-03-31 19:06:57 +08:00
parent 52b4969610
commit 6aa60cb512
7 changed files with 136 additions and 55 deletions

View File

@ -46,3 +46,17 @@ export const GetFileInfoByMd5Service = (Data) => {
}
})
}
export const GetDashBoardStatisticsService = (Data) => {
const params = new URLSearchParams();
for (let key in Data) {
params.append(key, Data[key])
}
//let request1 = getRequest();
return request.post('/tool/dashboard', params,{
headers: {
'token': Data.token,
}
})
}

View File

@ -7,6 +7,6 @@ export interface Function{
Info: string;
UserID: number;
ModelID: number | Object | Array<any>;
ModelIDS: string| Object | Array<any>;
ModelIDS: string| Object | Array<any> | any;
Function: string;
}

View File

@ -7,8 +7,8 @@
<User />
</el-icon>
<div class="card-content">
<countup class="card-num color1" :end="6666" />
<div>用户访问</div>
<countup class="card-num color1" :end="baseInfo.user_count" />
<div>用户</div>
</div>
</el-card>
</el-col>
@ -18,30 +18,30 @@
<ChatDotRound />
</el-icon>
<div class="card-content">
<countup class="card-num color2" :end="168" />
<div>系统消息</div>
<countup class="card-num color2" :end="baseInfo.message_count" />
<div>系统处理问答数</div>
</div>
</el-card>
</el-col>
<el-col :span="6">
<el-card shadow="hover" body-class="card-body">
<el-icon class="card-icon bg3">
<Goods />
<ChatDotRound />
</el-icon>
<div class="card-content">
<countup class="card-num color3" :end="8888" />
<div>商品数量</div>
<countup class="card-num color3" :end="baseInfo.session_num" />
<div>系统总会话数</div>
</div>
</el-card>
</el-col>
<el-col :span="6">
<el-card shadow="hover" body-class="card-body">
<el-icon class="card-icon bg4">
<ShoppingCartFull />
<ChatDotRound />
</el-icon>
<div class="card-content">
<countup class="card-num color4" :end="568" />
<div>今日订单量</div>
<countup class="card-num color4" :end="baseInfo.today_message_count" />
<div>今日处理问答数</div>
</div>
</el-card>
</el-col>
@ -127,6 +127,7 @@
</template>
<script setup lang="ts" name="dashboard">
import { ref, reactive } from 'vue';
import countup from '@/components/countup.vue';
import { use, registerMap } from 'echarts/core';
import { BarChart, LineChart, PieChart, MapChart } from 'echarts/charts';
@ -141,6 +142,8 @@ import { CanvasRenderer } from 'echarts/renderers';
import VChart from 'vue-echarts';
import { dashOpt1, dashOpt2, mapOptions } from './chart/options';
import chinaMap from '@/utils/china';
import {GetDashBoardStatisticsService} from '@/api/tool';
import { Sunny } from '@element-plus/icons-vue/dist/types';
use([
CanvasRenderer,
BarChart,
@ -154,6 +157,22 @@ use([
MapChart,
]);
registerMap('china', chinaMap);
//"dashboard_statistics_st": {
// "session_num": 176,
// "message_count": 485,
// "user_count": 9625,
// "today_message_count": 10
// }
// },
interface DashBoardBaseInfo {
session_num: number;
message_count: number;
user_count: number;
today_message_count: number;
}
const baseInfo = ref({} as DashBoardBaseInfo);
const activities = [
{
content: '收藏商品',
@ -219,6 +238,22 @@ const ranks = [
color: '#009688',
},
];
const getDashBoardStatistics = async () => {
let req = {
token: localStorage.getItem('token'),
};
let result = await GetDashBoardStatisticsService(req);
if (result['code'] === 0) {
console.log('dashboard:', result['data']);
baseInfo.value = result['data']["dashboard_statistics_st"];
//
//
} else {
console.error('获取统计数据失败:', result['msg']);
}
};
getDashBoardStatistics();
</script>
<style>

View File

@ -99,6 +99,12 @@
:disabled="loading"
>发送</el-button
>
<div>
<p>模型参数</p>
<el-slider v-model="temperature" :min="0" :max="1" :step="0.1">temperature</el-slider>
<el-slider v-model="topP" :min="0" :max="1" :step="0.1"></el-slider>
</div>
</el-col>
<el-col :span="3" style="text-align: center">
<el-select v-model="selectModel" placeholder="选择模型">
@ -163,6 +169,8 @@ const sessionIsShow = ref(false);
const sessionName = ref("");
const ModelList = ref<Model[]>([]);
const selectModel = ref(0);
const temperature = ref(0.5);
const topP = ref(0.9);
const renderMarkdown = (content: string) => {
return md.render(content);
@ -303,6 +311,8 @@ const sendMessage = () => {
function: "gen-ai-chat",
session_id: sessionID.value,
model_id: selectModel.value,
temperature: temperature.value,
top_p: topP.value,
};
try {
socket.value.send(JSON.stringify(msg));
@ -470,7 +480,7 @@ GetModelListByFunctionName();
padding: 10px;
margin-bottom: 20px;
scrollbar-width: 10px;
height: 90%;
height: 100%;
position: relative;
display: flex;
flex-direction: column;

View File

@ -135,7 +135,7 @@ const visible = ref(false);
const visible_add = ref(false);
const isEdit = ref(false);
const isAdd = ref(false);
const rowData = ref({});
const rowData = ref<Function>({} as Function);
const handleEdit = async (row: Function) => {
let data = row;
rowData.value = data;

View File

@ -64,7 +64,7 @@
</div>
<div class="model-params">
<h4>模型参数</h4>
<el-slider v-model="temperature" :min="0" :max="2" :step="0.1"></el-slider>
<el-slider v-model="temperature" :min="0" :max="1" :step="0.1"></el-slider>
<div class="param-value">{{ temperature }}</div>
<el-slider v-model="topP" :min="0" :max="1" :step="0.1"></el-slider>
<div class="param-value">{{ topP }}</div>
@ -78,22 +78,31 @@
</template>
<script setup lang="ts">
import { ref, onMounted, onUnmounted, reactive, nextTick } from "vue";
import { WSMessage, AIQMessage, OllamaMessage } from "@/types/im";
import { ref, onMounted, onUnmounted} from "vue";
import { WSMessage} from "@/types/im";
import { FindModelListByFunctionName } from "@/api/function";
import { Model } from "@/types/model";
import { ElMessage } from "element-plus";
// Prompt
const taskInput = ref('');
const resultPrompt = ref('');
const socket = ref(null);
const deepseekLogo = "https://tse2-mm.cn.bing.net/th/id/OIP-C.-FZbTC72cXtUasfnISVDHgHaHa?rs=1&pid=ImgDetMain";
const sparkLogo = "https://ts1.tc.mm.bing.net/th/id/R-C.421fb106722f3882c9f09650b281473f?rik=jMNRmW%2blXdjDvg&riu=http%3a%2f%2fwww.kuaipng.com%2fUploads%2fpic%2fw%2f2023%2f05-12%2f140009%2fwater_140009_698_698_.png&ehk=XSQ7SDsl6rJCOzDjsbIOvvuGhTv0HbPZTrD6u4yUTzM%3d&risl=&pid=ImgRaw&r=0";
const doubaoLogo ="https://ai-bot.cn/wp-content/uploads/2024/09/doubao-llm-logo1.png";
//
const models = ref([
{
id: 0,
logo: 'https://tse2-mm.cn.bing.net/th/id/OIP-C.-FZbTC72cXtUasfnISVDHgHaHa?rs=1&pid=ImgDetMain',
name: 'Deepseek-R1',
version: 'Deepseek-R1'
},
]);
const ModelList = ref<Model[]>([]);
const pselectModel = ref<Model>();
const selectedModel = ref(models.value[0]);
// Top P
@ -150,6 +159,7 @@ onMounted(() => {
ElMessage.success("连接成功");
};
socket.value.onmessage = (event) => {
let msg: WSMessage = JSON.parse(event.data);
receiveMessage(msg);
@ -181,10 +191,61 @@ const sendMessage = () => {
type: "ollama",
function: "gen-prompt",
session_id: sessionID.value,
model_id: selectedModel.value.id,
};
socket.value.send(JSON.stringify(msg));
};
const GetModelListByFunctionName = async () => {
let req = {
function: "gen-ai-chat",
token: localStorage.getItem("token"),
};
try{
let result = await FindModelListByFunctionName(req);
if (result["code"] === 0) {
ModelList.value = result["data"];
pselectModel.value = ModelList.value[0];
console.log("model_list:", ModelList.value);
} else {
ElMessage.error(result["msg"]);
}
}catch (e) {
console.log(e);
}
models.value = [];
for(let i = 0; i < ModelList.value.length; i++) {
let model = ModelList.value[i];
if (model["Type"] === "deepseek") {
models.value.push({
id: model["ID"],
logo: deepseekLogo,
name: model["Type"],
version: model["Description"],
});
} else if (model["Type"] === "spark") {
models.value.push({
id: model["ID"],
logo: sparkLogo,
name: model["Description"],
version: model["Description"],
});
} else if (model["Type"] === "doubao") {
models.value.push({
id: model["ID"],
logo: doubaoLogo,
name: model["Type"],
version: model["Description"],
});
}
}
selectedModel.value = models.value[0];
};
GetModelListByFunctionName();
onUnmounted(() => {
if (socket.value) {

View File

@ -2,46 +2,7 @@
<div>
<h2>智能选题推荐</h2>
</div>
<el-select v-model="selected" placeholder="请选择" multiple>
<el-option
v-for="item in options"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
<el-button type="primary" @click="handleSearch">查询</el-button>
</template>
<script setup lang="ts">
import { ref, reactive } from 'vue';
interface Option {
value: string;
label: string;
}
interface OptionList {
value: string;
label: string;
}
const selected = ref();
const options = ref<Option[]>([
{ value: 'option1', label: '选项1' },
{ value: 'option2', label: '选项2' },
{ value: 'option3', label: '选项3' },
{ value: 'option4', label: '选项4' },
]);
const handleSearch = async () => {
//
console.log('Selected:', selected.value);
//
// let req={
// token: localStorage.getItem('token'),
// type: "ID",
// id: parseInt(query.name)
// }
// let result = await FindModelService(req);
// tableData.value = result.data;
}
</script>