|
@@ -1,31 +1,71 @@
|
|
|
<script setup>
|
|
|
-import { ref, unref, computed, onUnmounted } from 'vue';
|
|
|
-import { useMessage, NDatePicker, NTabs, NTab, NRadioGroup, NRadio, NCheckboxGroup, NCheckbox } from 'naive-ui';
|
|
|
+import { ref, unref, computed, onMounted, onUnmounted, nextTick } from 'vue';
|
|
|
+import { useMessage, NDatePicker, NTabs, NTab, NRadioGroup, NRadio, NCheckboxGroup, NCheckbox, NDataTable } from 'naive-ui';
|
|
|
import { BaseButton, RecodeCardItem, TheSubMenu, TheChatView, ChatWelcome, SvgIcon } from '@/components';
|
|
|
import { ChatAsk, ChatAnswer } from '@/components/Chat';
|
|
|
+import { orderApi } from "@/api/order";
|
|
|
import { chatApi } from '@/api/chat';
|
|
|
+import { getAreaOptions, getOrderAreaOptions } from './config/echartOptions'
|
|
|
+import * as echarts from 'echarts';
|
|
|
import dayjs from 'dayjs';
|
|
|
import isSameOrBefore from 'dayjs/plugin/isSameOrBefore';
|
|
|
import isSameOrAfter from 'dayjs/plugin/isSameOrAfter';
|
|
|
|
|
|
-
|
|
|
-import {useInfinite, useScroll, useChat, useRecommend} from '@/composables';
|
|
|
+import { useInfinite, useScroll, useChat, useRecommend } from '@/composables';
|
|
|
|
|
|
const ANSWER_ID_KEY = '@@id@@';
|
|
|
|
|
|
-dayjs.extend(isSameOrBefore)
|
|
|
-dayjs.extend(isSameOrAfter)
|
|
|
+const arr = []
|
|
|
+for (let i = 0; i < 2; i++) {
|
|
|
+ arr.push({
|
|
|
+ title: '2024-06-' + (i + 1),
|
|
|
+ key: 'no' + i,
|
|
|
+ width: '150px',
|
|
|
+ align: 'center'
|
|
|
+ })
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+const columns = ref(arr)
|
|
|
+console.log(columns);
|
|
|
+const tableData = ref([{ no0: 1, no1: 2 }]);
|
|
|
|
|
|
+dayjs.extend(isSameOrBefore);
|
|
|
+dayjs.extend(isSameOrAfter);
|
|
|
+
|
|
|
+let chart = null;
|
|
|
let controller = new AbortController();
|
|
|
|
|
|
const { recordList, isFetching, onScrolltolower, onReset, addHistoryRecord } = useInfinite('/front/bigModel/qa/pageList', { module: 1 });
|
|
|
const { scrollRef, scrollToBottom, scrollToBottomIfAtBottom } = useScroll();
|
|
|
const { chatDataSource, addChat, updateChat, clearChat, updateById } = useChat();
|
|
|
|
|
|
+const echartRef = ref([]);
|
|
|
const message = useMessage();
|
|
|
const reportDate = ref();
|
|
|
-const startDate = ref();
|
|
|
-const endDate = ref();
|
|
|
+const workOrderParams = ref({
|
|
|
+ timeBegin: null,
|
|
|
+ timeEnd: null,
|
|
|
+ whichWay: 1,
|
|
|
+ checkGroup: [],
|
|
|
+})
|
|
|
+
|
|
|
+/**
|
|
|
+ * 将他们分组,
|
|
|
+ * 1、进水指标:jsGroup 出水指标:csGroup 化验指标:hyGroup
|
|
|
+ * 2、组内的数据项和之前一样的,但是只返回勾选的子项
|
|
|
+ * 3、勾选的项如果没值,字段一定也要返回,可以是null or 0
|
|
|
+ * */
|
|
|
+
|
|
|
+// const mockData = {
|
|
|
+
|
|
|
+// jsGroup: [{ jsCod: 1, jsNh3: null, time: '2024/06/05', .... }, {}],
|
|
|
+// csGroup: [],
|
|
|
+// hyGroup: []
|
|
|
+
|
|
|
+// }
|
|
|
+
|
|
|
+
|
|
|
const switchActive = ref(false);
|
|
|
const tabActive = ref("daily");
|
|
|
const model = ref({})
|
|
@@ -51,7 +91,7 @@ const handleCreateDialog = async () => {
|
|
|
}
|
|
|
|
|
|
currenSessionId.value = null;
|
|
|
-
|
|
|
+
|
|
|
recordActive.value = null;
|
|
|
|
|
|
clearChat();
|
|
@@ -67,13 +107,13 @@ const handleChatDetail = async ({ sessionId }) => {
|
|
|
|
|
|
const { data } = await chatApi.getAnswerHistoryDetail({ sessionId });
|
|
|
|
|
|
- chatDataSource.value = data.map(item => ({ ...item, loading: false, }));
|
|
|
+ chatDataSource.value = data.map(item => ({ ...item, loading: false, }));
|
|
|
currenSessionId.value = sessionId;
|
|
|
|
|
|
scrollToBottom();
|
|
|
}
|
|
|
|
|
|
-const onRegenerate = async ({ question, realQuestion }) => {
|
|
|
+const onRegenerate = async ({ question, params1 }) => {
|
|
|
controller = new AbortController();
|
|
|
|
|
|
const sessionId = unref(currenSessionId);
|
|
@@ -81,7 +121,7 @@ const onRegenerate = async ({ question, realQuestion }) => {
|
|
|
data: {
|
|
|
sessionId,
|
|
|
showVal: question,
|
|
|
- question: realQuestion || question,
|
|
|
+ question,
|
|
|
module: 1,
|
|
|
isStrong: Number(unref(switchActive)),
|
|
|
reportDate: reportDate.value
|
|
@@ -90,11 +130,11 @@ const onRegenerate = async ({ question, realQuestion }) => {
|
|
|
onDownloadProgress: ({ event }) => {
|
|
|
const xhr = event.target;
|
|
|
const { responseText } = xhr;
|
|
|
- const [ answer ] = responseText.split(ANSWER_ID_KEY);
|
|
|
+ const [answer] = responseText.split(ANSWER_ID_KEY);
|
|
|
|
|
|
updateChat({
|
|
|
sessionId,
|
|
|
- showVal:question,
|
|
|
+ showVal: question,
|
|
|
answer,
|
|
|
loading: true,
|
|
|
delayLoading: false,
|
|
@@ -106,8 +146,8 @@ const onRegenerate = async ({ question, realQuestion }) => {
|
|
|
|
|
|
try {
|
|
|
const { data } = await chatApi.getChatStream(params);
|
|
|
-
|
|
|
- const [ answer, id ] = data.split(ANSWER_ID_KEY);
|
|
|
+
|
|
|
+ const [answer, id] = data.split(ANSWER_ID_KEY);
|
|
|
|
|
|
updateChat({
|
|
|
id,
|
|
@@ -117,10 +157,10 @@ const onRegenerate = async ({ question, realQuestion }) => {
|
|
|
loading: false,
|
|
|
delayLoading: false
|
|
|
})
|
|
|
-
|
|
|
+
|
|
|
scrollToBottomIfAtBottom();
|
|
|
}
|
|
|
- catch (error){
|
|
|
+ catch (error) {
|
|
|
console.log("取消了请求 - catch", error);
|
|
|
}
|
|
|
finally {
|
|
@@ -129,50 +169,117 @@ const onRegenerate = async ({ question, realQuestion }) => {
|
|
|
}
|
|
|
}
|
|
|
// 提交问题
|
|
|
-const handleSubmit = async (question, realQuestion = '') => {
|
|
|
- // 用于模拟 - 内容生成前置等待状态
|
|
|
-
|
|
|
- if (unref(isExistInHistory)) {
|
|
|
- const { data: sessionId } = await chatApi.getChatSessionTag();
|
|
|
- currenSessionId.value = sessionId;
|
|
|
- }
|
|
|
-
|
|
|
+const handleSubmit = async (question, params) => {
|
|
|
+
|
|
|
+ // if (unref(isExistInHistory)) {
|
|
|
+ // const { data: sessionId } = await chatApi.getChatSessionTag();
|
|
|
+ // currenSessionId.value = sessionId;
|
|
|
+ // }
|
|
|
+
|
|
|
isLoading.value = true;
|
|
|
+ let option = {}
|
|
|
+
|
|
|
+ const isChart = tabActive.value == 'customDaily';
|
|
|
+
|
|
|
+ if (isChart) {
|
|
|
+ // const data = await createLineEchart(params);
|
|
|
+
|
|
|
+ function getRandomInt(min, max) {
|
|
|
+ min = Math.ceil(min);
|
|
|
+ max = Math.floor(max);
|
|
|
+ return Math.floor(Math.random() * (max - min + 1)) + min;
|
|
|
+ }
|
|
|
+ const xAxisData = []
|
|
|
+ const seriesList = []
|
|
|
+
|
|
|
+ for (let i = 0; i < 30; i++) {
|
|
|
+ xAxisData.push('06-' + (i + 1));
|
|
|
+ }
|
|
|
+
|
|
|
+ for (let i = 0; i < 2; i++) {
|
|
|
+ seriesList[i] = [];
|
|
|
+ for (let j = 0; j < 30; j++) {
|
|
|
+ seriesList[i].push(getRandomInt(1, 6))
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ option = getOrderAreaOptions({
|
|
|
+ xAxisData,
|
|
|
+ seriesList
|
|
|
+ });
|
|
|
+
|
|
|
+ }
|
|
|
|
|
|
addChat({
|
|
|
sessionId: unref(currenSessionId),
|
|
|
showVal: question,
|
|
|
- realQuestion,
|
|
|
answer: '',
|
|
|
loading: true,
|
|
|
delayLoading: true,
|
|
|
+ isChart: true
|
|
|
})
|
|
|
|
|
|
+ console.log( chatDataSource.value );
|
|
|
+
|
|
|
scrollToBottom();
|
|
|
|
|
|
- setTimeout(() => onRegenerate({ question, realQuestion }), 2 * 1000);
|
|
|
+ setTimeout(() => {
|
|
|
+ updateChat({
|
|
|
+ sessionId: unref(currenSessionId),
|
|
|
+ showVal: question,
|
|
|
+ answer: '',
|
|
|
+ loading: true,
|
|
|
+ delayLoading: false,
|
|
|
+ isChart: true
|
|
|
+ })
|
|
|
+ if(!chart) {
|
|
|
+ const dom = document.getElementById('chartContainer')
|
|
|
+ console.log( echartRef.value );
|
|
|
+ chart = echarts.init(dom, {width: 680, height: 300});
|
|
|
+ }
|
|
|
+ chart.setOption(option);
|
|
|
+ // chart.resize();
|
|
|
+ // onRegenerate({ question }), 2 * 1000
|
|
|
+ }, 2 * 1000);
|
|
|
}
|
|
|
|
|
|
// 处理推荐问题
|
|
|
-const handleCreateOrder = () => {
|
|
|
-
|
|
|
- if ( tabActive.value === 'customDaily' ) {
|
|
|
- const startDateTime = dayjs(startDate.value);
|
|
|
- const endDateTime = dayjs(endDate.value);
|
|
|
- const thirtyDaysBeforeEndTime = endDateTime.subtract(30, 'day');
|
|
|
- const isStartAfterThirtyDaysBeforeEnd = startDateTime.isSameOrAfter(thirtyDaysBeforeEndTime);
|
|
|
- if (!isStartAfterThirtyDaysBeforeEnd) {
|
|
|
- alert("错误的")
|
|
|
- } else {
|
|
|
- alert("可以的")
|
|
|
- }
|
|
|
- }
|
|
|
- return
|
|
|
- if ( !reportDate.value ) {
|
|
|
- return message.warning('请选择日期');
|
|
|
+const handleCreateOrder = async () => {
|
|
|
+ // const { timeBegin, timeEnd, whichWay, checkGroup } = unref(workOrderParams);
|
|
|
+ // const startDateTime = dayjs(timeBegin);
|
|
|
+ // const endDateTime = dayjs(timeEnd);
|
|
|
+ // const params = {
|
|
|
+ // timeBegin,
|
|
|
+ // timeEnd,
|
|
|
+ // whichWay
|
|
|
+ // };
|
|
|
+
|
|
|
+ let question = `请生成${reportDate.value}智慧工单分析报告`;
|
|
|
+
|
|
|
+ if (tabActive.value === 'customDaily') {
|
|
|
+ // const thirtyDaysBeforeEndTime = endDateTime.subtract(30, 'day');
|
|
|
+ // const isStartAfterThirtyDaysBeforeEnd = startDateTime.isSameOrAfter(thirtyDaysBeforeEndTime);
|
|
|
+
|
|
|
+ // if (!timeBegin) return message.warning('请选择开始日期');
|
|
|
+ // if (!timeEnd) return message.warning('请选择结束日期');
|
|
|
+ // if (!isStartAfterThirtyDaysBeforeEnd) return message.warning('只可生成一个月区间的工单报告');
|
|
|
+ // if (!checkGroup.length) return message.warning('请至少选择一项指标项');
|
|
|
+
|
|
|
+ // checkGroup.forEach(key => params[key] = true);
|
|
|
+ // // [checkGroup, csCheckGroup, hyCheckGroup].flat().forEach(key => params[key] = true);
|
|
|
+
|
|
|
+ // question = `请成生${startDateTime.format("MM月DD日")}-${endDateTime.format("MM月DD日")}的在线仪表的日报工单`
|
|
|
+
|
|
|
+ // } else {
|
|
|
+ // if (!reportDate.value) return message.warning('请选择时间');
|
|
|
}
|
|
|
+ handleSubmit(question)
|
|
|
+ // handleSubmit(question, params);
|
|
|
+}
|
|
|
|
|
|
- handleSubmit(`请生成${reportDate.value}智能工单分析报告`);
|
|
|
+// 创建echart
|
|
|
+const createLineEchart = async (params) => {
|
|
|
+ await orderApi.postOrderChart(params);
|
|
|
}
|
|
|
|
|
|
// 删除历史对话
|
|
@@ -188,22 +295,31 @@ const handleTabChange = (val) => {
|
|
|
}
|
|
|
|
|
|
const dateStartDisabled = (timestamp) => {
|
|
|
- if (endDate.value) {
|
|
|
+ const { timeEnd } = workOrderParams.value;
|
|
|
+ if (timeEnd) {
|
|
|
const currentDate = dayjs(timestamp);
|
|
|
- const endDateValue = dayjs(endDate.value);
|
|
|
+ const endDateValue = dayjs(timeEnd);
|
|
|
return !currentDate.isSameOrBefore(endDateValue);
|
|
|
}
|
|
|
-
|
|
|
}
|
|
|
|
|
|
const dateEndDisabled = (timestamp) => {
|
|
|
- if (startDate.value) {
|
|
|
+ const { timeBegin } = workOrderParams.value;
|
|
|
+ if (timeBegin) {
|
|
|
const currentDate = dayjs(timestamp);
|
|
|
- const endDateValue = dayjs(startDate.value);
|
|
|
+ const endDateValue = dayjs(timeBegin);
|
|
|
return !currentDate.isSameOrAfter(endDateValue);
|
|
|
}
|
|
|
-
|
|
|
}
|
|
|
+
|
|
|
+
|
|
|
+onMounted(async () => {
|
|
|
+
|
|
|
+ await nextTick();
|
|
|
+ console.log( echartRef.value );
|
|
|
+ // chart = echarts.init(echartRef.value, 'light');
|
|
|
+})
|
|
|
+
|
|
|
onUnmounted(() => {
|
|
|
controller.abort();
|
|
|
})
|
|
@@ -220,45 +336,59 @@ onUnmounted(() => {
|
|
|
</template>
|
|
|
|
|
|
<div class="pr-[4px] text-[#5e5e5e]">
|
|
|
- <RecodeCardItem
|
|
|
- v-for="item, index in recordList"
|
|
|
- :key="item.sessionId + index"
|
|
|
- :title="item.showVal"
|
|
|
- :time="item.createTime"
|
|
|
- :data-item="item"
|
|
|
- :class="{'recode-card-item_active': recordActive === item.sessionId}"
|
|
|
- @on-click="handleChatDetail"
|
|
|
- @on-delete="handeChatDelete"
|
|
|
- />
|
|
|
+ <p v-show="!recordList.length" class="pt-[30px] text-[12px] text-[#999] text-center">暂无工单数据</p>
|
|
|
+ <RecodeCardItem v-for="item, index in recordList" :key="item.sessionId + index" :title="item.showVal"
|
|
|
+ :time="item.createTime" :data-item="item"
|
|
|
+ :class="{ 'recode-card-item_active': recordActive === item.sessionId }" @on-click="handleChatDetail"
|
|
|
+ @on-delete="handeChatDelete" />
|
|
|
</div>
|
|
|
</TheSubMenu>
|
|
|
|
|
|
<TheChatView ref="scrollRef" :is-footer="false">
|
|
|
- <ChatWelcome
|
|
|
- title="您好,我是LibraAI智慧工单助手"
|
|
|
- :sub-title="[
|
|
|
- '基于大语言模型的智能工单分析助手,可以为您实现数据分析及数据解读',
|
|
|
- '选择日期并为您生成日报分析'
|
|
|
- ]"
|
|
|
- v-if="!chatDataSource.length"
|
|
|
- />
|
|
|
-
|
|
|
- <div class="conversation-item" v-if="chatDataSource.length">
|
|
|
- <template v-for="item in chatDataSource" :key="item.id">
|
|
|
+ <ChatWelcome title="您好,我是LibraAI智慧工单助手" :sub-title="[
|
|
|
+ '基于大语言模型的智能工单分析助手,可以为您实现数据分析及数据解读',
|
|
|
+ '选择日期并为您生成日报分析'
|
|
|
+ ]" v-if="!chatDataSource.length" />
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ <div class="conversation-item" v-show="chatDataSource.length">
|
|
|
+ <div v-for="item in chatDataSource" :key="item.id">
|
|
|
<ChatAsk :content="item.showVal" :sessionId="item.sessionId"></ChatAsk>
|
|
|
- <ChatAnswer
|
|
|
- :id="item.id"
|
|
|
- :content="item.answer"
|
|
|
- :loading="item.loading"
|
|
|
- :delay-loading="item.delayLoading"
|
|
|
- :isSatisfied="item.isSatisfied"
|
|
|
- @on-click-icon=" params => updateById(params)"
|
|
|
- ></ChatAnswer>
|
|
|
- </template>
|
|
|
+ <ChatAnswer :id="item.id" :content="item.answer" :loading="item.loading" :delay-loading="item.delayLoading"
|
|
|
+ :isSatisfied="item.isSatisfied" @on-click-icon="params => updateById(params)" v-if="!item.isChart">
|
|
|
+ </ChatAnswer>
|
|
|
+ <ChatAnswer content="11111111111" :loading="item.loading" :delay-loading="item.delayLoading" >
|
|
|
+ <div v-show="item.isChart && !item.delayLoading">
|
|
|
+ <div class="echart-warpper" >
|
|
|
+ <span class="#1A2029 font-bold">进水指标</span>
|
|
|
+
|
|
|
+ <!-- <ul class="flex justify-end w-[600px] text-center text-[12px] text-[#666] leading-[18px] space-x-[10px]">
|
|
|
+ <li class="">
|
|
|
+ <span class="inline-block w-[10px] h-[2px] mb-[2px] mr-[4px] bg-[#2185da]"></span>
|
|
|
+ <span>过去</span>
|
|
|
+ </li>
|
|
|
+ <li class="">
|
|
|
+ <span class="inline-block w-[10px] h-[2px] mb-[2px] mr-[4px] bg-[#2ee055]"></span>
|
|
|
+ <span>未来</span>
|
|
|
+ </li>
|
|
|
+ </ul> -->
|
|
|
+ <div id="chartContainer" class="w-[680px] h-[300px]" ref="echartRef" style="width: 680px; height: 300px;"></div>
|
|
|
+ </div>
|
|
|
+ <div class="w-[700px]">
|
|
|
+ <NDataTable :bordered="true" :single-line="false" single-column :columns="columns" :data="tableData"
|
|
|
+ scroll="{ x: true }" size="small"></NDataTable>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </ChatAnswer>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
|
|
|
+
|
|
|
+
|
|
|
<div class="order-container px-[60px] py-[30px] mt-[36px] rounded-[10px] bg-[#fff]" v-if="!chatDataSource.length">
|
|
|
- <div class="flex items-center justify-start space-x-[24px] pb-[20px] border-b-[1px] border-solid border-[#F1F1F1]">
|
|
|
+ <div
|
|
|
+ class="flex items-center justify-start space-x-[24px] pb-[20px] border-b-[1px] border-solid border-[#F1F1F1]">
|
|
|
<n-tabs type="segment" animated style="width: 188px;" size="large" :on-update:value="handleTabChange">
|
|
|
<n-tab name="daily">日报工单</n-tab>
|
|
|
<n-tab name="customDaily">自定义工单</n-tab>
|
|
@@ -272,7 +402,8 @@ onUnmounted(() => {
|
|
|
<div class="flex items-center justify-start text-[16px] space-x-[16px]">
|
|
|
<span class="font-bold">选择时间</span>
|
|
|
<div class="w-[164px] border-[1px] border-[#EFEFF0] rounded-[8px] overflow-hidden">
|
|
|
- <NDatePicker placeholder="选择日期" :readonly="true" v-model:formatted-value="reportDate" value-format="yyyy-MM-dd">
|
|
|
+ <NDatePicker placeholder="选择日期" :readonly="true" v-model:formatted-value="reportDate"
|
|
|
+ value-format="yyyy-MM-dd">
|
|
|
<template #date-icon>
|
|
|
<SvgIcon name="tool-arrow-bottom"></SvgIcon>
|
|
|
</template>
|
|
@@ -292,7 +423,8 @@ onUnmounted(() => {
|
|
|
<div class="flex items-center justify-start mb-[20px] text-[16px] space-x-[16px]">
|
|
|
<span class="font-bold">选择时间</span>
|
|
|
<div class="w-[164px] border-[1px] border-[#EFEFF0] rounded-[8px] overflow-hidden">
|
|
|
- <NDatePicker placeholder="开始日期" :readonly="true" v-model:formatted-value="startDate" value-format="yyyy-MM-dd" :is-date-disabled="dateStartDisabled">
|
|
|
+ <NDatePicker placeholder="开始日期" :readonly="true" v-model:formatted-value="workOrderParams.timeBegin"
|
|
|
+ value-format="yyyy-MM-dd" :is-date-disabled="dateStartDisabled">
|
|
|
<template #date-icon>
|
|
|
<SvgIcon name="tool-arrow-bottom"></SvgIcon>
|
|
|
</template>
|
|
@@ -300,7 +432,8 @@ onUnmounted(() => {
|
|
|
</div>
|
|
|
<span class="text-[16px] text-[#8F959C]">至</span>
|
|
|
<div class="w-[164px] border-[1px] border-[#EFEFF0] rounded-[8px] overflow-hidden">
|
|
|
- <NDatePicker placeholder="结束日期" :readonly="true" v-model:formatted-value="endDate" value-format="yyyy-MM-dd" :is-date-disabled="dateEndDisabled">
|
|
|
+ <NDatePicker placeholder="结束日期" :readonly="true" v-model:formatted-value="workOrderParams.timeEnd"
|
|
|
+ value-format="yyyy-MM-dd" :is-date-disabled="dateEndDisabled">
|
|
|
<template #date-icon>
|
|
|
<SvgIcon name="tool-arrow-bottom"></SvgIcon>
|
|
|
</template>
|
|
@@ -310,48 +443,48 @@ onUnmounted(() => {
|
|
|
|
|
|
<div class="flex items-center justify-start mb-[20px] text-[16px] space-x-[16px]">
|
|
|
<span class="font-bold">统计方式</span>
|
|
|
- <n-radio-group v-model:value="model.radioGroupValue" name="radiogroup2">
|
|
|
- <n-radio value="Radio 1">在线仪表</n-radio>
|
|
|
- <n-radio value="Radio 2">日报</n-radio>
|
|
|
+ <n-radio-group v-model:value="workOrderParams.whichWay" name="radiogroup2">
|
|
|
+ <n-radio :value="1">在线仪表</n-radio>
|
|
|
+ <n-radio :value="0">日报</n-radio>
|
|
|
</n-radio-group>
|
|
|
</div>
|
|
|
|
|
|
<div class="flex items-center justify-start mb-[20px] text-[16px] space-x-[16px]">
|
|
|
<span class="font-bold">进水指标</span>
|
|
|
- <n-checkbox-group v-model:value="model.radioGroupValue" name="radiogroup2">
|
|
|
- <n-checkbox value="Radio 1">进水水量</n-checkbox>
|
|
|
- <n-checkbox value="Radio 2">COD</n-checkbox>
|
|
|
- <n-checkbox value="Radio 2">总氮</n-checkbox>
|
|
|
- <n-checkbox value="Radio 2">总磷</n-checkbox>
|
|
|
- <n-checkbox value="Radio 2">氨氮</n-checkbox>
|
|
|
- <n-checkbox value="Radio 2">SS</n-checkbox>
|
|
|
+ <n-checkbox-group v-model:value="workOrderParams.checkGroup" name="radiogroup2">
|
|
|
+ <n-checkbox value="jsSlq">进水水量</n-checkbox>
|
|
|
+ <n-checkbox value="jsCod">COD</n-checkbox>
|
|
|
+ <n-checkbox value="jsTn">总氮</n-checkbox>
|
|
|
+ <n-checkbox value="jsTp">总磷</n-checkbox>
|
|
|
+ <n-checkbox value="jsNh3">氨氮</n-checkbox>
|
|
|
+ <n-checkbox value="jsSs">SS</n-checkbox>
|
|
|
</n-checkbox-group>
|
|
|
</div>
|
|
|
-
|
|
|
+
|
|
|
<div class="flex items-center justify-start mb-[20px] text-[16px] space-x-[16px]">
|
|
|
<span class="font-bold">出水指标</span>
|
|
|
- <n-checkbox-group v-model:value="model.radioGroupValue" name="radiogroup2">
|
|
|
- <n-checkbox value="Radio 1">出水水量</n-checkbox>
|
|
|
- <n-checkbox value="Radio 2">COD</n-checkbox>
|
|
|
- <n-checkbox value="Radio 2">总氮</n-checkbox>
|
|
|
- <n-checkbox value="Radio 2">总磷</n-checkbox>
|
|
|
- <n-checkbox value="Radio 2">氨氮</n-checkbox>
|
|
|
- <n-checkbox value="Radio 2">SS</n-checkbox>
|
|
|
+ <n-checkbox-group v-model:value="workOrderParams.checkGroup" name="radiogroup2">
|
|
|
+ <n-checkbox value="csSlqc">出水水量</n-checkbox>
|
|
|
+ <n-checkbox value="csCod">COD</n-checkbox>
|
|
|
+ <n-checkbox value="csTn">总氮</n-checkbox>
|
|
|
+ <n-checkbox value="csTp">总磷</n-checkbox>
|
|
|
+ <n-checkbox value="csNh3">氨氮</n-checkbox>
|
|
|
+ <n-checkbox value="csSs">SS</n-checkbox>
|
|
|
</n-checkbox-group>
|
|
|
</div>
|
|
|
|
|
|
<div class="flex items-start justify-start mb-[20px] text-[16px] space-x-[16px]">
|
|
|
<span class="font-bold">化验指标</span>
|
|
|
<div class="w-[500px]">
|
|
|
- <n-checkbox-group v-model:value="model.radioGroupValue" name="radiogroup2">
|
|
|
- <n-checkbox value="Radio 1">1#好氧池硝酸盐</n-checkbox>
|
|
|
- <n-checkbox value="Radio 2">2#好氧池硝酸盐</n-checkbox>
|
|
|
- <n-checkbox value="Radio 2">1#缺氧氨氮</n-checkbox>
|
|
|
- <n-checkbox value="Radio 2">2#缺氧氨氮</n-checkbox>
|
|
|
- <n-checkbox value="Radio 2">1#缺氧池硝酸盐</n-checkbox>
|
|
|
- <n-checkbox value="Radio 2">2#缺氧池硝酸盐</n-checkbox>
|
|
|
- <n-checkbox value="Radio 2">二沉池正磷酸盐</n-checkbox>
|
|
|
- </n-checkbox-group>
|
|
|
+ <n-checkbox-group v-model:value="workOrderParams.checkGroup" name="radiogroup2">
|
|
|
+ <n-checkbox value="no3Hlj1Jqr">1#好氧池硝酸盐</n-checkbox>
|
|
|
+ <n-checkbox value="no3Hlj2Jqr">2#好氧池硝酸盐</n-checkbox>
|
|
|
+ <n-checkbox value="nh31Jqr">1#缺氧氨氮</n-checkbox>
|
|
|
+ <n-checkbox value="nh32Jqr">2#缺氧氨氮</n-checkbox>
|
|
|
+ <n-checkbox value="no3Qyc1Jqr">1#缺氧池硝酸盐</n-checkbox>
|
|
|
+ <n-checkbox value="no3Qyc2Jqr">2#缺氧池硝酸盐</n-checkbox>
|
|
|
+ <n-checkbox value="tpRccJqr">二沉池正磷酸盐</n-checkbox>
|
|
|
+ </n-checkbox-group>
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
@@ -362,11 +495,12 @@ onUnmounted(() => {
|
|
|
</dl>
|
|
|
</main>
|
|
|
|
|
|
-
|
|
|
<footer class="pt-[24px]">
|
|
|
<button class="btn-primary" @click="handleCreateOrder">立即生成</button>
|
|
|
</footer>
|
|
|
</div>
|
|
|
+
|
|
|
+
|
|
|
</TheChatView>
|
|
|
</section>
|
|
|
</template>
|
|
@@ -412,11 +546,23 @@ onUnmounted(() => {
|
|
|
background: #1D43CC;
|
|
|
}
|
|
|
}
|
|
|
+
|
|
|
+.echart-warpper {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ flex-flow: column;
|
|
|
+ width: 100%;
|
|
|
+ padding: 20px 0 30px 0;
|
|
|
+ border-radius: 8px;
|
|
|
+}
|
|
|
</style>
|
|
|
|
|
|
<style lang="scss">
|
|
|
.order {
|
|
|
- .n-input__input-el, .n-input__placeholder {
|
|
|
+
|
|
|
+ .n-input__input-el,
|
|
|
+ .n-input__placeholder {
|
|
|
font-size: 14px;
|
|
|
}
|
|
|
}
|
|
@@ -427,6 +573,7 @@ onUnmounted(() => {
|
|
|
font-weight: bold;
|
|
|
color: #5E5E5E;
|
|
|
}
|
|
|
+
|
|
|
.n-tabs-tab--active {
|
|
|
.n-tabs-tab__label {
|
|
|
color: #1A2029;
|