<template>
|
<HMContainer type="card">
|
<template #header>
|
<el-form ref="queryFormRef" :inline="true" :model="queryParams">
|
<el-form-item label="日期范围" prop="timeRange">
|
<TimeRange v-model="queryParams.timeRange" :quickActive="TimeRangeEnum.CurrentDay" @change="handleQueryTable" />
|
</el-form-item>
|
|
<el-form-item label="业务场景" prop="group_type">
|
<el-select
|
multiple
|
v-model="queryParams.group_type"
|
style="width: 226.4px"
|
placeholder="业务场景"
|
clearable
|
@change="handleQueryTable"
|
>
|
<el-option v-for="item in groupTypeList" :key="item" :value="item" :label="item"></el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="问题内容" prop="question">
|
<el-input
|
v-model="queryParams.question"
|
style="width: 226.4px"
|
placeholder="问题内容"
|
clearable
|
@input="debounceQueryTable"
|
/>
|
</el-form-item>
|
|
<el-form-item label="结果" prop="state">
|
<el-select
|
|
v-model="queryParams.state"
|
style="width: 226.4px"
|
placeholder="结果"
|
clearable
|
@change="handleQueryTable"
|
>
|
<el-option v-for="item in resultList" :key="item" :value="item" :label="item"></el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="操作人员" prop="user">
|
<el-input v-model="queryParams.user" style="width: 226.4px" placeholder="操作人员" clearable @input="debounceQueryTable" />
|
</el-form-item>
|
</el-form>
|
</template>
|
<template #main>
|
<div class="h-full" ref="chatDragContainerRef">
|
<el-table
|
v-loading="tableLoading"
|
ref="draggableTableRef"
|
class="h100"
|
border
|
:row-class-name="isDragStatus ? 'cursor-move' : 'cursor-pointer'"
|
:data="tableData"
|
highlight-current-row
|
>
|
<el-table-column type="index" label="序号" width="55" fixed="left" align="center"></el-table-column>
|
<el-table-column label="用户" prop="user" width="120" fixed="left" show-overflow-tooltip> </el-table-column>
|
<el-table-column prop="time" label="时间" width="185" show-overflow-tooltip> </el-table-column>
|
<el-table-column label="业务场景" width="120" prop="group_type" show-overflow-tooltip> </el-table-column>
|
<el-table-column label="问题内容" prop="question" show-overflow-tooltip> </el-table-column>
|
<el-table-column label="结果" width="80" prop="state" show-overflow-tooltip>
|
<template #default="scope">
|
<span :class="{ 'text-red-500': scope.row.state === 'NG', 'font-bold': scope.row.state === 'NG' }">
|
{{ scope.row.state }}
|
</span>
|
</template>
|
</el-table-column>
|
<el-table-column width="120" label="花费时间(秒)" prop="run_ms" show-overflow-tooltip> </el-table-column>
|
<el-table-column label="操作" width="180" fixed="right" show-overflow-tooltip>
|
<template #default="scope">
|
<div class="space-x-3 items-center flex">
|
<el-tooltip effect="dark" content="回答内容" placement="top">
|
<i class="ywifont ywicon-xiaoxi1 !text-[15px] text-blue-400 cursor-pointer" @click="openShowAnswer(scope.row)"></i>
|
</el-tooltip>
|
</div> </template
|
></el-table-column>
|
</el-table>
|
</div>
|
</template>
|
|
<AnswerView v-model="infoDlgIsShow" :item="infoDlgMapRow"></AnswerView>
|
</HMContainer>
|
</template>
|
|
<script setup lang="ts">
|
import { debounce, getItemMap, toMyFixed } from '/@/utils/util';
|
|
import { onMounted, ref } from 'vue';
|
|
import * as userApi from '/@/api/auth/user';
|
|
import { ElMessage, ElMessageBox } from 'element-plus';
|
import { computed, nextTick } from 'vue';
|
import { getChatHistoryListByPost } from '/@/api/ai/chat';
|
import { getRoleInfoListByPost } from '/@/api/auth/role';
|
import TimeRange from '/@/components/chat/chatComponents/summaryCom/components/recordSet/components/TimeRange.vue';
|
import { TimeRangeEnum } from '/@/components/chat/chatComponents/summaryCom/components/recordSet/components/types';
|
import HMContainer from '/@/components/layout/HMContainer.vue';
|
import { getSceneGroupTreeByPost } from '/@/api/scene';
|
import AnswerView from './optDlg/AnswerView.vue';
|
//#region ====================== 表格数据，table init ======================
|
const tableLoading = ref(false);
|
const tableData = ref([]);
|
const isDragStatus = ref(false);
|
|
//#endregion
|
|
//#region ====================== 表格查询、排序，search form init ======================
|
|
const queryParams = ref({
|
timeRange: [],
|
group_type: [],
|
user: '',
|
question: '',
|
state: '',
|
});
|
|
const resultList = ['OK', 'NG'];
|
// groupType 列表
|
const groupTypeList = computed(() => Array.from(new Set(sceneGroupList.value.map((item) => item.group_type))));
|
const sceneGroupList = ref([]);
|
|
//获取场景选择列表
|
const getSceneGroupList = async () => {
|
const res = await getSceneGroupTreeByPost();
|
sceneGroupList.value = res?.groups ?? [];
|
};
|
|
const handleQueryTable = async () => {
|
const res = await getChatHistoryListByPost({
|
start_time: queryParams.value.timeRange[0],
|
end_time: queryParams.value.timeRange[1],
|
|
group_type: queryParams.value.group_type.join(','),
|
user: queryParams.value.user,
|
question: queryParams.value.question,
|
state:queryParams.value.state
|
});
|
|
tableData.value = (res?.values ?? []).map((item) => {
|
let runSecond;
|
if (item.run_ms !== 0 && !item.run_ms) {
|
runSecond = null;
|
} else {
|
runSecond = toMyFixed(Number(item.run_ms) / 1000, 2);
|
}
|
return {
|
...item,
|
run_ms: runSecond,
|
};
|
});
|
};
|
|
const debounceQueryTable = debounce(handleQueryTable, 400);
|
|
//#endregion
|
//#region ====================== 查看 ======================
|
const infoDlgIsShow = ref(false);
|
const infoDlgMapRow = ref(null);
|
const openShowAnswer = (row) => {
|
infoDlgMapRow.value = row;
|
infoDlgIsShow.value = true;
|
};
|
//#endregion
|
|
const deleteCurrentRow = (row: any) => {
|
ElMessageBox.confirm(`确定删除用户：【${row.user_name}】?`, '提示', {
|
confirmButtonText: '确定',
|
cancelButtonText: '取消',
|
type: 'warning',
|
}).then(async () => {
|
const res = await userApi.deleteUserInfoByPost({
|
user_id: row.user_id,
|
});
|
const foundIndex = tableData.value.findIndex((item) => item === row);
|
foundIndex > -1 && tableData.value.splice(foundIndex, 1);
|
ElMessage.success('删除用户成功');
|
});
|
};
|
//#region ====================== 修改密码操作 ======================
|
const optPasswordDlgIsShow = ref(false);
|
const optPasswordDlgMapRow = ref(null);
|
const openOptPasswordDlg = (row?: any) => {
|
optPasswordDlgMapRow.value = row;
|
optPasswordDlgIsShow.value = true;
|
};
|
|
const updatePasswordOpt = (formValue) => {
|
const foundIndex = tableData.value.findIndex((item) => item.user_id === formValue.user_id);
|
if (foundIndex > -1) {
|
tableData.value[foundIndex] = {
|
...tableData.value[foundIndex],
|
...formValue,
|
};
|
}
|
};
|
|
//#endregion
|
|
//#region ====================== 修改角色操作 ======================
|
const optRoleDlgIsShow = ref(false);
|
const optRoleDlgMapRow = ref(null);
|
const openOptRoleDlg = (row?: any) => {
|
optRoleDlgMapRow.value = row;
|
optRoleDlgIsShow.value = true;
|
};
|
|
const updateRoleOpt = (formValue) => {
|
const foundIndex = tableData.value.findIndex((item) => item.user_id === formValue.user_id);
|
if (foundIndex > -1) {
|
tableData.value[foundIndex] = {
|
...tableData.value[foundIndex],
|
...formValue,
|
};
|
}
|
};
|
|
//#endregion
|
|
// const roleList = ref([]);
|
// const roleMap = computed(() => getItemMap(roleList.value, 'id'));
|
// const getRoleList = async () => {
|
// const res = await getRoleInfoListByPost();
|
|
// roleList.value = res?.values ?? [];
|
// };
|
getSceneGroupList();
|
onMounted(async () => {
|
nextTick(() => {
|
handleQueryTable();
|
});
|
});
|
</script>
|
<style scoped lang="scss"></style>
|
