Merge branch 'master-500-dev-lushangqing' into 'master-500-dev'

增加下拉列表组件，柱线图增加是否与下拉列表联动按钮



See merge request !71

@@ -2,6 +2,7 @@ import cacheView from "./modules/cachaView"
 import tableHead from "./modules/tableHead"
 import tableHead from "./modules/tableHead"
 import buttonVal from "./modules/button";
 import buttonVal from "./modules/button";
 import elTreeData from "./modules/elTree";
 import elTreeData from "./modules/elTree";
+import select from "./modules/select";
 
 
 const getters = {
 const getters = {
   sidebar: state => state.app.sidebar,
   sidebar: state => state.app.sidebar,
@@ -19,5 +20,8 @@ const getters = {
   elTreeDatas:state => state.elTreeData.treeDatas,
   elTreeDatas:state => state.elTreeData.treeDatas,
   //进度条的数据
   //进度条的数据
   progressDatas:state => state.progress.progressData,
   progressDatas:state => state.progress.progressData,
+  //下拉选择列表选中数据-
+  selectValues:state => state.select.selectValArr,
+
 }
 }
 export default getters
 export default getters

@@ -12,6 +12,7 @@ import tableHead from './modules/tableHead'
 import buttonVal from "./modules/button";
 import buttonVal from "./modules/button";
 import elTreeData from "./modules/elTree";
 import elTreeData from "./modules/elTree";
 import progress from "./modules/progress";
 import progress from "./modules/progress";
+import select from "./modules/select";
 
 
 Vue.use(Vuex)
 Vue.use(Vuex)
 
 
@@ -28,6 +29,7 @@ const store = new Vuex.Store({
     buttonVal,
     buttonVal,
     elTreeData,
     elTreeData,
     progress,
     progress,
+    select,
   },
   },
   state: { },
   state: { },
   plugins: [initPlugin],
   plugins: [initPlugin],

+
+const select = {
+  state: {
+    selectVal: '',
+    selectValArr:[]
+  },
+
+  mutations: {
+    SELECT_VAL: (state, val) => {
+      state.selectVal=val;
+    },
+    SELECT_VAL_ARR: (state, val) => {
+      state.selectValArr=val;
+    }
+  },
+  actions: {
+
+  }
+}
+
+export default select

@@ -38,6 +38,14 @@ export const monitorCustomBarLineChart = {
         placeholder: '',
         placeholder: '',
         value: true,
         value: true,
       },
       },
+      {
+        type: 'el-switch',
+        label: '与下拉列表联动',
+        name: 'isVuexSelect',
+        required: false,
+        placeholder: '',
+        value: false,
+      },
       [
       [
         {
         {
           name: '折线设置',
           name: '折线设置',

+/*
+* 下拉列表
+* author lsq
+* 2022/05/17
+* */
+export const monitorSelectOption = {
+  code: 'monitor-select-option',
+  type: 'html',
+  label: '下拉列表',
+  icon: 'iconchaolianjie',
+  options: {
+    setup: [
+      {
+        type: 'el-input-text',
+        label: '图层名称',
+        name: 'layerName',
+        required: false,
+        placeholder: '',
+        value: '背景',
+      },
+      {
+        type: 'el-input-text',
+        label: 'placeholder',
+        name: 'placeholderVal',
+        required: false,
+        placeholder: '',
+        value: '请选择',
+      },
+      {
+        type: 'el-switch',
+        label: '是否可清空',
+        name: 'clearable',
+        required: false,
+        placeholder: '',
+        value: true
+      },
+      {
+        type: 'el-switch',
+        label: '是否可筛选',
+        name: 'filterable',
+        required: false,
+        placeholder: '',
+        value: true
+      },
+  /*    {
+        type: 'el-switch',
+        label: '是否可多选',
+        name: 'multiple',
+        required: false,
+        placeholder: '',
+        value: false
+      },*/
+      {
+        type: 'el-switch',
+        label: '是否加全部',
+        name: 'isAll',
+        required: false,
+        placeholder: '',
+        value: true
+      },
+      {
+        type: 'el-input-number',
+        label: '下拉列表宽度',
+        name: 'selectWidth',
+        required: false,
+        placeholder: '',
+        value: '160'
+      },
+     /* {
+        type: 'el-input-number',
+        label: '下拉列表高度',
+        name: 'selectHeight',
+        required: false,
+        placeholder: '',
+        value: '28'
+      },*/
+      {
+        type: 'el-switch',
+        label: '加边框',
+        name: 'isBorder',
+        required: false,
+        placeholder: '',
+        value: true
+      },
+      {
+        type: 'vue-color',
+        label: '边框颜色',
+        name: 'borderColor',
+        required: false,
+        placeholder: '',
+        value: 'rgba(151, 151, 151, 0.13)',
+      },
+      {
+        type: 'custom-upload',
+        label: '标题图标',
+        name: 'titleIcon',
+        required: false,
+        placeholder: '',
+        value:  require("../../../../../../../assets/images/monitor/capacityAnalysis/icon-trend.png"),
+      },
+      {
+        type: 'vue-color',
+        label: '背景颜色',
+        name: 'bgColor',
+        required: false,
+        placeholder: '',
+        value: '',
+      },
+      {
+        type: 'custom-upload',
+        label: '背景图片',
+        name: 'imageAdress',
+        required: false,
+        placeholder: '',
+        value:  '',
+      },
+      {
+        type: 'el-input-number',
+        label: '字体大小',
+        name: 'fontSize',
+        required: false,
+        placeholder: '',
+        value: '14'
+      },
+      [
+        {
+          name: '标题设置',
+          list: [
+            {
+              type: 'el-switch',
+              label: '是否有标题',
+              name: 'isTitle',
+              required: false,
+              placeholder: '',
+              value: false,
+            },
+            {
+              type: 'el-input-text',
+              label: '标题名称',
+              name: 'titleName',
+              required: false,
+              placeholder: '',
+              value: '系统信息',
+            },
+
+            {
+              type: 'el-select',
+              label: '字体位置',
+              name: 'textAlign',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                {code: 'center', name: '居中'},
+                {code: 'left', name: '左对齐'},
+                {code: 'right', name: '右对齐'},
+              ],
+              value: 'left'
+            },
+
+            {
+              type: 'el-input-number',
+              label: '字体大小',
+              name: 'titleFontSize',
+              required: false,
+              placeholder: '',
+              value: '18'
+            },
+            {
+              type: 'vue-color',
+              label: '字体颜色',
+              name: 'titleColor',
+              required: false,
+              placeholder: '',
+              value: '#666'
+            },
+            {
+              type: 'el-select',
+              label: '字体粗细',
+              name: 'titleFontWeight',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                {code: 'normal', name: '正常'},
+                {code: 'bold', name: '粗体'},
+                {code: 'bolder', name: '特粗体'},
+                {code: 'lighter', name: '细体'}
+              ],
+              value: 'normal'
+            },
+          ]
+        },
+        {
+          name: '按钮组设置',
+          list: [
+            {
+              type: 'el-switch',
+              label: '年是否显示',
+              name: 'isYear',
+              required: false,
+              placeholder: '',
+              value: true,
+            },
+            {
+              type: 'el-switch',
+              label: '季度是否显示',
+              name: 'isQuarter',
+              required: false,
+              placeholder: '',
+              value: true,
+            },
+            {
+              type: 'el-switch',
+              label: '月是否显示',
+              name: 'isMonth',
+              required: false,
+              placeholder: '',
+              value: true,
+            },
+          ]
+        },
+
+      ],
+
+    ],
+    position: [
+      {
+        type: 'el-input-number',
+        label: '左边距',
+        name: 'left',
+        required: false,
+        placeholder: '',
+        value: 0,
+      },
+      {
+        type: 'el-input-number',
+        label: '上边距',
+        name: 'top',
+        required: false,
+        placeholder: '',
+        value: 0,
+      },
+      {
+        type: 'el-input-number',
+        label: '宽度',
+        name: 'width',
+        required: false,
+        placeholder: '该容器在1920px大屏中的宽度',
+        value: 550,
+      },
+      {
+        type: 'el-input-number',
+        label: '高度',
+        name: 'height',
+        required: false,
+        placeholder: '该容器在1080px大屏中的高度',
+        value: 50,
+      },
+    ]
+  }
+}

@@ -60,6 +60,7 @@ import {monitorCustomBarLineChartArray} from "./echartsConfigJson/monitorConfigJ
 import {monitorJimuButton} from "./echartsConfigJson/monitorConfigJson/monitor-jimu-button";
 import {monitorJimuButton} from "./echartsConfigJson/monitorConfigJson/monitor-jimu-button";
 import {monitorAjButton} from "./echartsConfigJson/monitorConfigJson/monitor-aj-button";
 import {monitorAjButton} from "./echartsConfigJson/monitorConfigJson/monitor-aj-button";
 import {monitorCustomScatterWeight} from "./echartsConfigJson/monitorConfigJson/monitor-custom-scatter-weight";
 import {monitorCustomScatterWeight} from "./echartsConfigJson/monitorConfigJson/monitor-custom-scatter-weight";
+import {monitorSelectOption} from "./echartsConfigJson/monitorConfigJson/monitor-select-option";
 
 
 export const {widgetTool,monitor} = {
 export const {widgetTool,monitor} = {
   widgetTool : [
   widgetTool : [
@@ -141,6 +142,8 @@ export const {widgetTool,monitor} = {
     // AJ报表按钮，弹框展示
     // AJ报表按钮，弹框展示
     monitorAjButton,
     monitorAjButton,
     // 散点图
     // 散点图
-    monitorCustomScatterWeight
+    monitorCustomScatterWeight,
+    //下拉列表
+    monitorSelectOption
   ]
   ]
 }
 }

@@ -110,10 +110,14 @@ export default {
   },
   },
   computed: {
   computed: {
     //月季度年按钮通过vuex接收值
     //月季度年按钮通过vuex接收值
-    ...mapGetters(['buttonVals']),
+    ...mapGetters(['buttonVals','selectValues']),
     buttonVal(){
     buttonVal(){
       return this.buttonVals;
       return this.buttonVals;
     },
     },
+    //与下拉列表通过vuex联动
+    selectValue(){
+      return this.selectValues;
+    },
     //进度条flag数据
     //进度条flag数据
     ...mapGetters(['progressDatas']),
     ...mapGetters(['progressDatas']),
     progressData(){
     progressData(){
@@ -175,6 +179,24 @@ export default {
 
 
       },
       },
       deep:true
       deep:true
+    },
+    //监听下拉列表
+    selectValue:{
+      handler(val){
+        if(this.optionsSetup.isVuexSelect){
+          let optionsData=this.optionsData;
+          if(this.optionsData.dataType=="dynamicData"){
+            //改变参下拉列表，重新加载动态数据--待测
+            let flag='';
+            if(val){
+              flag=val.join(",");
+            }
+            this.optionsData.dynamicData.contextData.flag=flag;
+          }
+        }
+
+      },
+      deep:true
     }
     }
   },
   },
   created() {
   created() {

@@ -282,15 +282,14 @@ export default {
               }
               }
             ]
             ]
           }
           }
-          console.log("_+111_+_+_",  this.$refs[item.flag])
-          if (this.optionsData.dataType == "dynamicData") {
-            console.log("(*)(*)",this.optionsData.dynamicData.contextData.flag,item.flag)
+          if (this.optionsData.dataType == "dynamicData" && this.optionsData.dynamicData.contextData) {
+            // console.log("(*)(*)",this.optionsData.dynamicData.contextData.flag,item.flag)
             this.optionsData.dynamicData.contextData.flag = item.flag;
             this.optionsData.dynamicData.contextData.flag = item.flag;
           }
           }
-          this.editorOptions();
+          this.editorOptions(index);
 
 
         })
         })
-        // this.thenData();
+        this.thenData();
         // this.forData();
         // this.forData();
       },
       },
       deep:true
       deep:true
@@ -305,7 +304,7 @@ export default {
   },
   },
   methods: {
   methods: {
     // 修改图标options属性
     // 修改图标options属性
-    editorOptions() {
+    editorOptions(index) {
       // this.forData();
       // this.forData();
 
 
       this.setOptionsTitle();
       this.setOptionsTitle();
@@ -314,7 +313,7 @@ export default {
       this.setOptionsTop();
       this.setOptionsTop();
       this.setOptionsBar();
       this.setOptionsBar();
       this.setOptionsTooltip();
       this.setOptionsTooltip();
-      this.setOptionsData();
+      this.setOptionsData(index);
       this.setOptionsMargin();
       this.setOptionsMargin();
       this.setOptionsLegend();
       this.setOptionsLegend();
       this.setOptionsColor();
       this.setOptionsColor();
@@ -637,11 +636,11 @@ export default {
       })
       })
     },
     },
     // 数据处理
     // 数据处理
-    setOptionsData() {
+    setOptionsData(index) {
       const optionsData = this.optionsData; // 数据类型 静态 or 动态
       const optionsData = this.optionsData; // 数据类型 静态 or 动态
       optionsData.dataType == "staticData"
       optionsData.dataType == "staticData"
         ? this.staticDataFn(optionsData.staticData)
         ? this.staticDataFn(optionsData.staticData)
-        : this.dynamicDataFn(optionsData.dynamicData, optionsData.refreshTime);
+        : this.dynamicDataFn(optionsData.dynamicData, optionsData.refreshTime,index);
     },
     },
     staticDataFn(val) {
     staticDataFn(val) {
       // const series = this.options.series;
       // const series = this.options.series;
@@ -688,21 +687,21 @@ export default {
         }*/
         }*/
       })
       })
     },
     },
-    dynamicDataFn(val, refreshTime) {
+    dynamicDataFn(val, refreshTime,index) {
       if (!val) return;
       if (!val) return;
       if (this.ispreview) {
       if (this.ispreview) {
-        this.getEchartData(val);
+        this.getEchartData(val,index);
         this.flagInter = setInterval(() => {
         this.flagInter = setInterval(() => {
-          this.getEchartData(val);
+          this.getEchartData(val,index);
         }, refreshTime);
         }, refreshTime);
       } else {
       } else {
-        this.getEchartData(val);
+        this.getEchartData(val,index);
       }
       }
     },
     },
-    async getEchartData(val) {
+    async getEchartData(val,index) {
       const data = this.queryEchartsData(val);
       const data = this.queryEchartsData(val);
       this.chartDataItem.push(data);
       this.chartDataItem.push(data);
-      console.log("900000",this.optionsData.dynamicData?this.optionsData.dynamicData.contextData.flag:'009')
+      // console.log("900000",this.optionsData.dynamicData?this.optionsData.dynamicData.contextData.flag:'009')
       // return  await Promise.all(this.chartDataItem)//.then(data => {console.log("data",data,this.optionsData.dynamicData.contextData.flag )})
       // return  await Promise.all(this.chartDataItem)//.then(data => {console.log("data",data,this.optionsData.dynamicData.contextData.flag )})
       /*if(this.chartData.length==this.chartDataItem.length){
       /*if(this.chartData.length==this.chartDataItem.length){
         let arr=[];
         let arr=[];
@@ -713,9 +712,9 @@ export default {
           });
           });
         })
         })
       }*/
       }*/
-      // data.then(res => {
-      //   this.renderingFn(res,this.optionsData.dynamicData.contextData.flag);
-      // });
+      data.then(res => {
+        this.renderingFn(res,this.optionsData.dynamicData.contextData.flag);
+      });
     },
     },
     async thenData(){
     async thenData(){
       const res = await this.getEchartData()
       const res = await this.getEchartData()

+<template>
+  <div class="select-option-container" :style="styleObj">
+    <div class="select-option-title" :style="titleStyle">
+      <img :src="imgStyle.titleIcon" alt="" class="icon-title">
+      {{elTreeBtnTitleName}}{{ transStyle.titleName }}
+    </div>
+    <div class="select-option-item">
+      <el-select v-model="selectVal" @change="selectChange" :style="selectStyle"
+                 :placeholder="placeholderVal" :clearable="clearable"
+                 :filterable="filterable" :multiple="multiple">
+        <el-option
+          v-for="item in selectOption"
+          :key="item.value"
+          :label="item.label"
+          :value="item.value"
+          :disabled="item.disabled"
+        />
+      </el-select>
+    </div>
+
+  </div>
+</template>
+
+<script>
+import {mapGetters} from "vuex";
+export default {
+  name: "selectOption",
+  data() {
+    return {
+      selectVal:'',
+      selectOption:[{value:1,label:'选项1',disabled:false},{value:2,label:'选项3',disabled:true}],
+      options: {},
+      optionsSetUp: {},
+      optionsPosition:{},
+      optionsData:{},
+      //按钮组
+      btnGroup:[
+        {name:'月',code:'month',isDisplay:'true'},
+        {name:'季度',code:'quarter',isDisplay:'true'},
+        {name:'年',code:'year',isDisplay:'true'},
+      ],
+      btnActive:'month',
+      dataTitle:''
+    }
+  },
+  components: {},
+  props: {
+    value: Object,
+    ispreview: Boolean
+  },
+  computed: {
+    //placeholderVal的值
+    placeholderVal(){
+      return this.optionsSetUp.placeholderVal;
+    },
+    //是否可清空
+    clearable(){
+      return this.optionsSetUp.clearable;
+    },
+    //是否可筛选
+    filterable(){
+      return this.optionsSetUp.filterable;
+    },
+    //是否可多选
+    multiple(){
+      return this.optionsSetUp.multiple;
+    },
+    elTreeBtnTitleName(){
+      let btnTitleName=this.$route.query.btnTitleName
+      return btnTitleName;
+    },
+    //下拉列表样式
+    selectStyle(){
+      return{
+        width:this.optionsSetUp.selectWidth+'px',
+        // height:this.optionsSetUp.selectHeight+'px'
+      }
+    },
+    transStyle() {
+      return this.objToOne(this.options);
+    },
+    styleObj() {
+      const allStyle = this.optionsPosition;
+      return {
+        position: this.ispreview ? "absolute" : "static",
+        width: allStyle.width + "px",
+        height: allStyle.height + "px",
+        left: allStyle.left + "px",
+        top: allStyle.top + "px",
+        'background':this.transStyle.bgColor,
+        'border':this.transStyle.isBorder?'0.5px solid '+this.transStyle.borderColor:'none',
+        'box-shadow':this.transStyle.isShadow?'0px 3px 12px '+this.transStyle.borderColor:'none',
+        'background-image':'url(' + this.transStyle.imageAdress + ')',
+        // 'background-position':'center',
+        'background-repeat':'no-repeat',
+        'background-size':'contain'
+      };
+    },
+    //图片样式
+    imgStyle(){
+      return{
+        titleIcon:this.transStyle.titleIcon
+      }
+    },
+    //标题样式设置
+    titleStyle(){
+      return{
+        'display':this.transStyle.isTitle?'flex':'none',
+        'text-align':this.transStyle.textAlign,
+        'font-size':this.transStyle.titleFontSize+'px',
+        color: this.transStyle.titleColor,
+        'font-weight': this.transStyle.titleFontWeight
+      }
+    },
+    btnStyle(){
+      return{
+        'font-size':this.transStyle.fontSize
+      }
+    }
+  },
+  watch: {
+    value: {
+      handler(val) {
+        this.options = val;
+        this.optionsSetUp = val.setup;
+        this.optionsPosition = val.position;
+        this.handlerData();
+        this.pushAll();
+        this.btnDisplay();
+
+      },
+      deep: true
+    }
+  },
+  mounted() {
+    // this.initImageUrl();
+    this.options=this.value;
+    this.optionsSetUp = this.value.setup;
+    this.optionsPosition = this.value.position;
+    this.handlerData();
+    this.pushAll();
+    this.btnDisplay();
+
+  },
+  methods: {
+    //选项是否加全部
+    pushAll(){
+      if(this.optionsSetUp.isAll){
+        this.selectOption.unshift({label:'全部',value:'all'})
+      }
+    },
+    //select的change事件
+    selectChange(val){
+      let data=[];
+      if(!this.optionsSetUp.multiple){
+        data.push(val);
+      }
+      this.$store.commit('SELECT_VAL_ARR', data);
+
+    },
+    //计算按钮是否显示
+    btnDisplay(){
+      this.btnGroup.map((item,index)=>{
+        if(item.code=='year'){
+          item.isDisplay=this.transStyle.isYear;
+        }else if(item.code=='quarter'){
+          item.isDisplay=this.transStyle.isQuarter;
+        }else{
+          item.isDisplay=this.transStyle.isMonth;
+        }
+
+      })
+      this.btnGroup.some((item, index) => {
+        if(item.isDisplay){
+          this.btnActive=item.code;
+          return true;//当内部return true时跳出整个循环
+
+        }
+      });
+      this.setBtnVal(this.btnActive);
+    },
+    changeType(item){
+      this.btnActive=item.code;
+      this.setBtnVal(item.code);
+    },
+    //传值-vuex-按钮值
+    setBtnVal(val){
+      this.$store.commit('CHANGE_BUTTON',val);
+
+    },
+    handlerData() {
+      const resData = this.optionsData;
+      resData.dataType == "staticData"
+        ? this.handlerStaticData(resData.staticData)
+        : this.handlerDynamicData(resData.dynamicData, resData.refreshTime);
+    },
+    handlerStaticData(data) {
+
+    },
+    handlerDynamicData(data, refreshTime) {
+      if (!data) return;
+      /* if (this.ispreview) {
+         this.getEchartData(data);
+         this.flagInter = setInterval(() => {
+           this.getEchartData(data);
+         }, refreshTime);
+       } else {
+         this.getEchartData(data);
+       }*/
+    }
+
+
+  },
+}
+</script>
+
+<style scoped lang="scss">
+.select-option-container{
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding:10px;
+}
+.select-option-style{
+  width:60px;
+}
+.select-option-title{
+  padding:5px;
+  display: flex;
+  align-items: center;
+}
+.icon-title{
+  margin-right:5px;
+}
+.select-option-item{
+  padding:5px;
+}
+</style>

@@ -92,8 +92,8 @@ export default {
       let param = {
       let param = {
         type:e.data.type,
         type:e.data.type,
         data:{
         data:{
-          resId: e.data.data.resId,
-          resType: e.data.data.resType
+          resId: e.data.data?e.data.data.resId:'',
+          resType: e.data.data?e.data.data.resType:''
         }
         }
 
 
       }
       }
@@ -114,7 +114,6 @@ export default {
     },
     },
     //树节点点击事件
     //树节点点击事件
     handleNodeClick(data,node){
     handleNodeClick(data,node){
-      console.log("*(*(*(",node,data);
       if(this.optionsSetup.isFrame){
       if(this.optionsSetup.isFrame){
         this.setSrc(data,node);
         this.setSrc(data,node);
       }
       }
@@ -184,7 +183,6 @@ export default {
       }
       }
 
 
       this.iframeSrc=srcName+tokenUrl+busId+resId+resType+btnTitleName+titleName;
       this.iframeSrc=srcName+tokenUrl+busId+resId+resType+btnTitleName+titleName;
-      console.log("iframeSrc",busId+resId+resType+btnTitleName)
     },
     },
     editorOptions() {
     editorOptions() {
       this.setOptionsData();
       this.setOptionsData();
@@ -220,7 +218,6 @@ export default {
     getEchartData(val) {
     getEchartData(val) {
       const data = this.queryEchartsData(val);
       const data = this.queryEchartsData(val);
       data.then(res => {
       data.then(res => {
-        console.log("aaaa",res)
         if(res[0] && res[0].data){
         if(res[0] && res[0].data){
           this.treeData=res[0].data;
           this.treeData=res[0].data;
           this.setSrc(this.treeData[0])
           this.setSrc(this.treeData[0])

@@ -63,6 +63,7 @@ import monitorButtonExport from "./monitor/buttonExport";
 import monitorJimuButton from "./monitor/monitorJimuButton";
 import monitorJimuButton from "./monitor/monitorJimuButton";
 import monitorAjButton from "./monitor/monitorAjButton";
 import monitorAjButton from "./monitor/monitorAjButton";
 import monitorCustomScatterWeight from "./monitor/monitorCustomScatterWeight.vue";
 import monitorCustomScatterWeight from "./monitor/monitorCustomScatterWeight.vue";
+import monitorSelectOption from "./monitor/selectOption.vue";
 
 
 export default {
 export default {
   name: "WidgetTemp",
   name: "WidgetTemp",
@@ -117,7 +118,8 @@ export default {
     monitorButtonExport,
     monitorButtonExport,
     monitorJimuButton,
     monitorJimuButton,
     monitorAjButton,
     monitorAjButton,
-    monitorCustomScatterWeight
+    monitorCustomScatterWeight,
+    monitorSelectOption
   },
   },
   model: {
   model: {
     prop: "value",
     prop: "value",

@@ -74,6 +74,7 @@ import monitorButtonExport from "./monitor/buttonExport";
 import monitorJimuButton from "./monitor/monitorJimuButton";
 import monitorJimuButton from "./monitor/monitorJimuButton";
 import monitorAjButton from "./monitor/monitorAjButton";
 import monitorAjButton from "./monitor/monitorAjButton";
 import monitorCustomScatterWeight from "./monitor/monitorCustomScatterWeight";
 import monitorCustomScatterWeight from "./monitor/monitorCustomScatterWeight";
+import monitorSelectOption from "./monitor/selectOption.vue";
 
 
 export default {
 export default {
   name: "Widget",
   name: "Widget",
@@ -127,7 +128,8 @@ export default {
     monitorButtonExport,
     monitorButtonExport,
     monitorJimuButton,
     monitorJimuButton,
     monitorAjButton,
     monitorAjButton,
-    monitorCustomScatterWeight
+    monitorCustomScatterWeight,
+    monitorSelectOption
   },
   },
   model: {
   model: {
     prop: "value",
     prop: "value",