feat: 碳源投加修改

src/views/control/MedicinalView.vue

@@ -627,7 +627,8 @@ onUnmounted(() => {
                             v-model:value1="dataSourceParams.qycYxyOne"
                             :btn-group="[
                               { label: '手动', value1: '', value2: '' },
-                              { label: '化验', value1: waterConfigParams.qyXsyHYOne }
+                              { label: '化验', value1: waterConfigParams.qyXsyHYOne },
+                              { label: '预测', value1: '', disabled: true }
                             ]"></BaseChooseItem>
                           <BaseChooseItem
                             tab-key="south"
@@ -638,7 +639,8 @@ onUnmounted(() => {
                             v-model:value1="dataSourceParams.qycAdOne"
                             :btn-group="[
                               { label: '手动', value1: '', value2: '' },
-                              { label: '化验', value1: waterConfigParams.qyAdHYOne }
+                              { label: '化验', value1: waterConfigParams.qyAdHYOne },
+                              { label: '预测', value1: '', disabled: true }
                             ]"></BaseChooseItem>
                           <BaseChooseItem
                             tab-key="south"
@@ -775,7 +777,8 @@ onUnmounted(() => {
                             v-model:value1="dataSourceParams.qycYxyTwo"
                             :btn-group="[
                               { label: '手动', value1: '', value2: '' },
-                              { label: '化验', value1: waterConfigParams.qyXsyHYTwo}
+                              { label: '化验', value1: waterConfigParams.qyXsyHYTwo},
+                              { label: '预测', value1: '', disabled: true }
                             ]"></BaseChooseItem>
                           <BaseChooseItem
                             tab-key="south"
@@ -786,7 +789,8 @@ onUnmounted(() => {
                             v-model:value1="dataSourceParams.qycAdTwo"
                             :btn-group="[
                               { label: '手动', value1: '', value2: '' },
-                              { label: '化验', value1: waterConfigParams.qyAdHYTwo}
+                              { label: '化验', value1: waterConfigParams.qyAdHYTwo},
+                              { label: '预测', value1: '', disabled: true }
                             ]"></BaseChooseItem>
                           <BaseChooseItem
                             tab-key="south"

src/views/control/components/TheEchartPanel.vue

@@ -1,18 +1,23 @@
 <script setup>
 import { ref, computed, onMounted, watch, onUnmounted } from 'vue';
-import { NSpin, NSelect, NDatePicker } from "naive-ui";
+import { NSpin, NSelect, NDatePicker, useMessage } from "naive-ui";
 import * as echarts from 'echarts';
 import { startOfDay } from "date-fns/esm"
 import { controlApi } from "@/api/control"
 import dayjs from 'dayjs';
-
 const props = defineProps(['htfksdOne','htfksdTwo']);
 const isDomSizeChange = defineModel('change');
 
+const message = useMessage();
+
 let echart = null;
 let tempTabItemOneKey = 0;
 let tempTabItemTwoKey = 'jzxsOne';
-const datePickerValue = ref(null);
+
+const currentDay = dayjs().format('YYYY-MM-DD');
+const yesterday = dayjs().subtract(1, 'day').format('YYYY-MM-DD');
+
+const datePickerValue = ref([yesterday, currentDay]);
 const dateRangeRef = ref(null);
 const selectValue = ref(['0']);
 const coefficientDataSource = ref([]);
@@ -123,6 +128,12 @@ const handleSelectOptions = (selectOptionList) => {
         }
       });
     }
+    
+    if ( selectOptionList.length > 3 ) {
+      selectValue.value = tempArr.slice(0, -1);
+      return message.warning("数据看板最大选择项为3个")
+    }
+    
     localStorage.setItem('selectValue', JSON.stringify(tempArr));
   }
 
@@ -176,12 +187,6 @@ const getWaterEchartOptions = ({ data, xAxis = [] }) => {
         smooth: true,
         type: 'line',
         symbolSize: 10,
-        // lineStyle: {
-        //   color: '#1ee7ff'
-        // },
-        // itemStyle: {
-        //   color: 'red'
-        // },
         data: d1,
       }
   })
@@ -224,6 +229,19 @@ const getWaterEchartOptions = ({ data, xAxis = [] }) => {
 
   const option = {
     backgroundColor: '#FFF',
+    legend: {
+      x: 'center',
+      y: 'top',
+      show: true,
+      left: '10px',
+      top: '16px',
+      itemWidth: 6,
+      itemGap: 20,
+      textStyle: {
+        color: '#556677',
+      },
+      // data: ['直接登录平台', '扫码登录平台', '总'],
+    },
     title: {
       show: !xAxis.length,
       text: '暂无数据',
@@ -235,7 +253,7 @@ const getWaterEchartOptions = ({ data, xAxis = [] }) => {
       }
     },
     grid: {
-      top: '40px',
+      top: '60px',
       bottom: '50px',
       left: '5%',
       right: '5%',
@@ -401,7 +419,6 @@ const getEchartOptions = (data) => {
 const initWaterEchartData = async () => {
   show.value = true;
   const [tBegin, tEnd] = datePickerValue.value || [];
-
   const timeBegin = tBegin ? dayjs(tBegin).format('YYYY-MM-DD') : null;
   const timeEnd = tEnd ? dayjs(tEnd).format('YYYY-MM-DD') : null;
   const { data } = await controlApi.getAllEchartData({ timeBegin, timeEnd });
@@ -464,7 +481,7 @@ onMounted(async () => {
   
   echartOptions = tempArr;
 
-  selectValue.value = localCacheSelectVal ? JSON.parse(localCacheSelectVal) : [0]
+  selectValue.value = localCacheSelectVal ? JSON.parse(localCacheSelectVal) : ["0"]
 
   selectOptions.value = echartOptions;
 
@@ -499,7 +516,7 @@ onUnmounted(() => {
     <div class="select-wrapper">
       <NDatePicker
         clearable
-        class="w-[300px]"
+        class="w-[300px] flex-shrink-0"
         size="small"
         type="daterange"
         ref="dateRangeRef"
@@ -509,7 +526,7 @@ onUnmounted(() => {
         v-model:formatted-value="datePickerValue"
       ></NDatePicker>
       <NSelect
-        class="w-[200px]"
+        class="w-[340px]"
         :multiple="activeIndex != 1"
         :options="selectOptions"
         :value="selectValue"