添加dashboard基础数据展示,gen-chat添加模型选择、参数选择,功能管理修复模型选择问题
This commit is contained in:
parent
52b4969610
commit
6aa60cb512
|
|
@ -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,
|
||||
}
|
||||
})
|
||||
}
|
||||
|
|
@ -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;
|
||||
}
|
||||
|
|
@ -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>
|
||||
|
|
|
|||
|
|
@ -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;
|
||||
|
|
|
|||
|
|
@ -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;
|
||||
|
|
|
|||
|
|
@ -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) {
|
||||
|
|
|
|||
|
|
@ -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>
|
||||
|
|
|
|||
Loading…
Reference in New Issue