From baed413622ff504861ade92e0d848676a4f68b22 Mon Sep 17 00:00:00 2001
From: art_station <hey78450496@163.com>
Date: Mon, 17 Jan 2022 11:05:33 +0800
Subject: [PATCH] =?UTF-8?q?=E7=8E=AF=E5=A2=83=E8=B6=8B=E5=8A=BF=E5=9B=BE?=
 =?UTF-8?q?=E5=9F=BA=E7=A1=80=E4=BB=A3=E7=A0=81=E5=AE=8C=E6=88=90=EF=BC=8C?=
 =?UTF-8?q?=E5=BE=85=E8=AF=A6=E7=BB=86=E6=B5=8B=E8=AF=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/atmosphere/air/trend/index.vue | 85 ++++++++++++++++++++++--
 1 file changed, 80 insertions(+), 5 deletions(-)

diff --git a/src/views/atmosphere/air/trend/index.vue b/src/views/atmosphere/air/trend/index.vue
index 5498474..766cc58 100644
--- a/src/views/atmosphere/air/trend/index.vue
+++ b/src/views/atmosphere/air/trend/index.vue
@@ -26,7 +26,7 @@
         </a-col>
         <a-col :lg="6" :md="12" :sm="24" :xs="24">
           <a-form-item label="监测指标:">
-            <a-select mode="multiple" v-model:value="queryParams.indicatorList" :options="indicatorOptions" placeholder="请选择监测指标"></a-select>
+            <a-select mode="multiple" @change="handleIndicatorChange" v-model:value="queryParams.indicatorList" :options="indicatorOptions" placeholder="请选择监测指标"></a-select>
           </a-form-item>
         </a-col>
         <a-col :lg="6" :md="12" :sm="24" :xs="24">
@@ -34,7 +34,7 @@
         </a-col>
         <a-col :lg="6" :md="12" :sm="24" :xs="24">
           <a-form-item label="纵坐标:">
-            <a-select mode="multiple" v-model:value="queryParams.ycoList" :options="yOptions" allowClear placeholder="请选择纵坐标"></a-select>
+            <a-select mode="multiple" @change="handleYcoChange" v-model:value="queryParams.ycoList" :options="yOptions" allowClear placeholder="请选择纵坐标"></a-select>
           </a-form-item>
         </a-col>
       </a-row>
@@ -59,12 +59,13 @@ export default {
     return {
       queryParams: {
         yearList: ['2020', '2021'],
+        monthList: [],
         areaList: ['南宁市'],
         placeList: [],
         regionLevel: '市级', // 区域等级
         xco: '年度', // 横坐标
-        ycoList: [],
-        indicatorList: [] // 监测指标
+        ycoList: ['ch'],
+        indicatorList: ['so2', 'no2'] // 监测指标
       },
       trendData: [],
       regionLevelOptions: [{ label: '市级', value: '市级' }, { label: '县级', value: '县级' }],
@@ -91,7 +92,9 @@ export default {
       xOptions: [
         { label: '年度', value: '年度' },
         { label: '年月', value: '年月' },
-        { label: '区域/测点名称', value: '区域/测点名称' }
+        { label: '区域', value: '区域' },
+        { label: '测点名称', value: '测点名称' },
+        { label: '监测指标', value: '监测指标' }
       ],
       yOptions: [
         { label: '达标天数（天）', value: 'days' },
@@ -182,8 +185,80 @@ export default {
         this.getCountryPlace();
       }
     },
+    // 纵坐标变化
+    handleYcoChange(value) {
+      if (value.length > 2) {
+        this.$message.warning('纵坐标最多只能选择两个')
+        this.queryParams.ycoList.splice(this.queryParams.ycoList.length - 1)
+      }
+      if (value.includes('rate') || value.includes('aqi') || value.includes('abRate')) {
+        this.queryParams.indicatorList = []
+      }
+      if (value.includes('multi')) {
+        this.queryParams.ycoList = ['multi']
+        this.queryParams.indicatorList = ['multi']
+      }
+      if (value.includes('main')) {
+        this.queryParams.ycoList = ['main']
+        this.queryParams.indicatorList = ['main']
+        
+      }
+      if (value.includes('aqi')) {
+        this.queryParams.ycoList = ['aqi']
+        this.queryParams.indicatorList = ['aqi']
+      }
+    },
+    handleIndicatorChange(value) {
+      if (value.includes('multi')) {
+        this.queryParams.ycoList = ['multi']
+        this.queryParams.indicatorList = ['multi']
+      }
+      if (value.includes('main')) {
+        this.queryParams.ycoList = ['main']
+        this.queryParams.indicatorList = ['main']
+      }
+      if (value.includes('aqi')) {
+        this.queryParams.ycoList = ['aqi']
+        this.queryParams.indicatorList = ['aqi']
+      }
+    },
+    validParams() {
+      console.log("params", this.queryParams);
+      if (this.queryParams.xco === '年月' && this.queryParams.monthList.length === 0) {
+        this.$message.warning('横坐标为年月时，月份选择不能为空')
+        return false
+      }
+      if (this.queryParams.xco === '区域' && this.queryParams.areaList.length === 0) {
+        this.$message.warning('横坐标为区域时，区域选择不能为空')
+        return false
+      }
+      if (this.queryParams.xco === '区域' && this.queryParams.indicatorList.length > 1) {
+        this.$message.warning('横坐标为区域时，监测指标不能多选')
+        return false
+      }
+      if (this.queryParams.xco === '监测指标' && this.queryParams.areaList.length > 1) {
+        this.$message.warning('横坐标为监测指标时，区域不能多选')
+        return false
+      }
+      if (this.queryParams.xco === '测点名称' && this.queryParams.placeList.length === 0) {
+        this.$message.warning('横坐标为测点名称时，测点名称选择不能为空')
+        return false
+      }
+      if (this.queryParams.areaList.length > 0 && this.queryParams.placeList.length > 0) {
+        this.$message.warning('区域与测点名称不能同时选择')
+        return false
+      }
+      if (this.queryParams.ycoList.includes('浓度') && this.queryParams.indicatorList.length === 0) {
+        this.$message.warning('纵坐标为浓度时，监测指标不能为空')
+        return false
+      }
+      return true
+    },
     // 趋势图
     drawTrend() {
+      if (!this.validParams()) {
+        return
+      }
       getTrendChart(this.queryParams).then(res => {
         console.log('res', res);
         if (res.data.code == 0) {