Ver código fonte

修改图表部分样式;

WanGxC 1 ano atrás
pai
commit
fb37f99c54

+ 8 - 3
src/views/adManage/sp/campaigns/chartComponents/adStruct.vue

@@ -10,9 +10,9 @@
             <el-col :span="15">
                 <div style="margin-left: 40%">
                     <span style="background: #3a83f7; width: 18px; height: 10px; margin-top: 8px; display: inline-block; border-radius: 3px;"></span>
-                    <TextSelector v-model="barModelValue1" :options="barOptions1" @change="changeBarOne" style="margin-top: 5px; margin-left: 8px;"/>
+                    <TextSelector v-model="barModelValue1" :options="computedBarOptions1" @change="changeBarOne" style="margin-top: 5px; margin-left: 8px;"/>
                     <span style="background: #f19a37; width: 18px; height: 10px; margin-top: 8px; margin-left: 20px; display: inline-block; border-radius: 3px;"></span>
-                    <TextSelector v-model="barModelValue2" :options="barOptions2" @change="changeBarTwo" style="margin-top: 5px; margin-left: 8px;"/>
+                    <TextSelector v-model="barModelValue2" :options="computedBarOptions2" @change="changeBarTwo" style="margin-top: 5px; margin-left: 8px;"/>
                 </div>
                 <div ref="bar" style="height: 400px;"></div>
             </el-col>
@@ -21,10 +21,12 @@
 </template>
 
 <script setup>
-import { onMounted, ref, inject } from "vue"
+import { onMounted, ref, inject, computed } from "vue"
 import * as echarts from "echarts"
 import TextSelector from '/@/components/TextSelector/index.vue'
 import { getAdStructureData } from "/@/views/adManage/sp/campaigns/api"
+import { createDisabledOptions } from '../../../utils/dropdowndisable'
+
 
 let pieChart = ref()
 let barChart = ref()
@@ -345,6 +347,9 @@ function changeBarTwo(newValue) {
     }
 }
 
+const computedBarOptions1 = computed(() => createDisabledOptions(barOptions1, barModelValue2.value))
+const computedBarOptions2 = computed(() => createDisabledOptions(barOptions2, barModelValue1.value))
+
 // 初始化图表
 function initChart() {
     // 柱状图配置

+ 8 - 3
src/views/adManage/sp/keywords/chartComponents/adStruct.vue

@@ -4,9 +4,9 @@
             <el-col :span="24">
                 <div style="margin-left: 45%">
                     <span style="background: #3a83f7; width: 18px; height: 10px; margin-top: 8px; display: inline-block; border-radius: 3px;"></span>
-                    <TextSelector v-model="barModelValue1" :options="barOptions1" @change="changeBarOne" style="margin-top: 5px; margin-left: 8px;"/>
+                    <TextSelector v-model="barModelValue1" :options="computedBarOptions1" @change="changeBarOne" style="margin-top: 5px; margin-left: 8px;"/>
                     <span style="background: #f19a37; width: 18px; height: 10px; margin-top: 8px; margin-left: 20px; display: inline-block; border-radius: 3px;"></span>
-                    <TextSelector v-model="barModelValue2" :options="barOptions2" @change="changeBarTwo" style="margin-top: 5px; margin-left: 8px;"/>
+                    <TextSelector v-model="barModelValue2" :options="computedBarOptions2" @change="changeBarTwo" style="margin-top: 5px; margin-left: 8px;"/>
                 </div>
                 <div ref="bar" style="height: 400px;"></div>
             </el-col>
@@ -15,10 +15,12 @@
 </template>
 
 <script setup>
-import { onMounted, ref, inject } from "vue"
+import { onMounted, ref, inject, computed } from "vue"
 import * as echarts from "echarts"
 import TextSelector from '/@/components/TextSelector/index.vue'
 import { getAdStructureData } from "/@/views/adManage/sp/keywords/api"
+import { createDisabledOptions } from '../../../utils/dropdowndisable'
+
 
 let barChart = ref()
 const bar = ref()
@@ -282,6 +284,9 @@ function changeBarTwo(newValue) {
     }
 }
 
+const computedBarOptions1 = computed(() => createDisabledOptions(barOptions1, barModelValue2.value))
+const computedBarOptions2 = computed(() => createDisabledOptions(barOptions2, barModelValue1.value))
+
 // 初始化图表
 function initChart() {
     // 柱状图配置

+ 4 - 2
src/views/adManage/sp/targets/chartComponents/adStruct.vue

@@ -19,10 +19,12 @@ import { onMounted, ref, inject, computed } from "vue"
 import * as echarts from "echarts"
 import TextSelector from '/@/components/TextSelector/index.vue'
 import { getAdStructureData } from "/@/views/adManage/sp/targets/api"
-import { createDisabledOptions } from '../utils/dropdowndisable'
+import { createDisabledOptions } from '/@/views/adManage/utils/dropdowndisable'
+import { spCampaignMetricsEnum } from '/@/views/adManage/utils/enum'
 
+console.log('下拉框选项==>>', spCampaignMetricsEnum)
 let barChart = ref()
-const bar = ref()
+const bar = ref() // 图表容器
 const loading = ref(true)
 
 let dateRange = inject('dateRange')

+ 0 - 0
src/views/adManage/sp/targets/utils/dropdowndisable.js → src/views/adManage/utils/dropdowndisable.ts