feat: 条件过滤组件公共功能

backend/src/main/java/io/dataease/controller/dataset/DataSetTableFieldController.java

 package io.dataease.controller.dataset;
 
 import io.dataease.base.domain.DatasetTableField;
+import io.dataease.service.dataset.DataSetFieldService;
 import io.dataease.service.dataset.DataSetTableFieldsService;
+import org.springframework.beans.factory.annotation.Autowired;
 import org.springframework.web.bind.annotation.*;
 
 import javax.annotation.Resource;
@@ -17,6 +19,9 @@ public class DataSetTableFieldController {
     @Resource
     private DataSetTableFieldsService dataSetTableFieldsService;
 
+    @Autowired
+    private DataSetFieldService dataSetFieldService;
+
     @PostMapping("list/{tableId}")
     public List<DatasetTableField> list(@PathVariable String tableId) {
         DatasetTableField datasetTableField = DatasetTableField.builder().build();
@@ -28,4 +33,9 @@ public class DataSetTableFieldController {
     public void batchEdit(@RequestBody List<DatasetTableField> list) {
         dataSetTableFieldsService.batchEdit(list);
     }
+
+    @PostMapping("fieldValues/{fieldId}")
+    public List<Object> fieldValues(@PathVariable String fieldId) {
+        return dataSetFieldService.fieldValues(fieldId);
+    }
 }

backend/src/main/java/io/dataease/service/dataset/DataSetFieldService.java

+package io.dataease.service.dataset;
+
+
+import java.util.List;
+
+public interface DataSetFieldService {
+
+    List<Object> fieldValues(String fieldId);
+}

backend/src/main/java/io/dataease/service/dataset/impl/direct/DirectFieldService.java

+package io.dataease.service.dataset.impl.direct;
+
+import io.dataease.base.domain.DatasetTable;
+import io.dataease.base.domain.DatasetTableField;
+import io.dataease.base.domain.Datasource;
+import io.dataease.datasource.provider.DatasourceProvider;
+import io.dataease.datasource.provider.ProviderFactory;
+import io.dataease.datasource.request.DatasourceRequest;
+import io.dataease.datasource.service.DatasourceService;
+import io.dataease.service.dataset.DataSetFieldService;
+import io.dataease.service.dataset.DataSetTableFieldsService;
+import io.dataease.service.dataset.DataSetTableService;
+import org.apache.commons.collections.CollectionUtils;
+import org.apache.commons.lang3.ObjectUtils;
+import org.apache.commons.lang3.StringUtils;
+import org.springframework.stereotype.Service;
+
+import javax.annotation.Resource;
+import java.util.ArrayList;
+import java.util.List;
+import java.util.stream.Collectors;
+
+
+@Service("directDataSetFieldService")
+public class DirectFieldService implements DataSetFieldService {
+
+
+    @Resource
+    private DataSetTableFieldsService dataSetTableFieldsService;
+
+    @Resource
+    private DataSetTableService dataSetTableService;
+
+
+    @Resource
+    private DatasourceService datasourceService;
+
+    @Override
+    public List<Object> fieldValues(String fieldId) {
+
+
+        List<DatasetTableField> list = dataSetTableFieldsService.getListByIds(new ArrayList<String>() {{
+            add(fieldId);
+        }});
+        if (CollectionUtils.isEmpty(list)) return null;
+
+        DatasetTableField field = list.get(0);
+        String tableId = field.getTableId();
+        if (StringUtils.isEmpty(tableId))return null;
+        DatasetTable datasetTable = dataSetTableService.get(tableId);
+        if (ObjectUtils.isEmpty(datasetTable) || StringUtils.isEmpty(datasetTable.getName())) return null;
+        String tableName = datasetTable.getName();
+
+        String dataSourceId = datasetTable.getDataSourceId();
+        if( StringUtils.isEmpty(dataSourceId)) return null;
+        Datasource ds = datasourceService.get(dataSourceId);
+        DatasourceProvider datasourceProvider = ProviderFactory.getProvider(ds.getType());
+        DatasourceRequest datasourceRequest = new DatasourceRequest();
+        datasourceRequest.setDatasource(ds);
+        String querySQL = dataSetTableService.createQuerySQL(ds.getType(), tableName, new String[]{field.getOriginName()});
+        datasourceRequest.setQuery(querySQL);
+        try {
+            List<String[]> rows = datasourceProvider.getData(datasourceRequest);
+            List<Object> results = rows.stream().map(row -> row[0]).distinct().collect(Collectors.toList());
+            return results;
+        } catch (Exception e) {
+            e.printStackTrace();
+        }
+        return null;
+    }
+}

frontend/src/api/dataset/dataset.js

@@ -111,4 +111,12 @@ export function post(url, data) {
   })
 }
 
+export function fieldValues(fieldId) {
+  return request({
+    url: '/dataset/field/fieldValues/' + fieldId,
+    method: 'post',
+    loading: true
+  })
+}
+
 export default { loadTable, getScene, addGroup, delGroup, addTable, delTable, groupTree }

frontend/src/components/canvas/components/Editor/index.vue

@@ -32,6 +32,7 @@
         :style="getComponentStyle(item.style)"
         :element="item"
         :item="item"
+        @filter-value-change="filterValueChange"
       />
 
       <component
@@ -290,6 +291,10 @@ export default {
 
       const newHeight = (text.split('<br>').length - 1) * lineHeight * fontSize
       return height > newHeight ? height : newHeight
+    },
+
+    filterValueChange(value) {
+      console.log('emit:' + value)
     }
   }
 }

frontend/src/components/widget/DeWidget/DeDrawingWidget.vue

 <script>
 export default {
+  name: 'DeDrawingWidget',
   functional: true,
   props: {
     item: {
@@ -7,14 +8,23 @@ export default {
       default: null
     }
   },
+
   render(createElement, context) {
     const item = context.props.item
     return createElement(item.component, {
       props: {
         options: item.options,
         element: item
+      },
+      on: {
+        'value-change': value => {
+          context.listeners['filter-value-change'] && context.listeners['filter-value-change'](value)
+        }
       }
-    })
+    },
+    context.data,
+    context.children
+    )
   }
 }
 </script>

frontend/src/components/widget/DeWidget/DeSelect.vue

 <template>
 
-  <el-select v-if="options!== null && options.attrs!==null" v-model="options.value" :placeholder="options.attrs.placeholder">
+  <el-select v-if="options!== null && options.attrs!==null" v-model="options.value" :placeholder="options.attrs.placeholder" @change="changeValue">
     <el-option
       v-for="item in options.attrs.datas"
       :key="item[options.attrs.key]"
@@ -29,6 +29,11 @@ export default {
     this.$nextTick(() => {
 
     })
+  },
+  methods: {
+    changeValue(value) {
+      this.$emit('value-change', value)
+    }
   }
 }
 </script>

frontend/src/components/widget/serviceImpl/TextInputServiceImpl.js

@@ -25,7 +25,8 @@ const defaultOptions = {
       placeholder: '请输入关键字'
     },
     value: ''
-  }
+  },
+  filterDialog: true
 }
 
 class TextInputServiceImpl extends WidgetService {
@@ -49,6 +50,11 @@ class TextInputServiceImpl extends WidgetService {
       'background-color': 'rgba(35,190,239,.1)'
     }
   }
+  filterFieldMethod(fields) {
+    return fields.filter(field => {
+      return field['deType'] === 0
+    })
+  }
 //   dynamicIconStype() {
 //     return {
 //       color: '#23beef'

frontend/src/components/widget/serviceImpl/TextSelectServiceImpl.js

@@ -18,25 +18,7 @@ const defaultOptions = {
     attrs: {
       multiple: false,
       placeholder: '请选择',
-      datas: [
-        {
-          id: '0',
-          text: '北京'
-        },
-        {
-          id: '1',
-          text: '上海'
-        },
-        {
-          id: '2',
-          text: '广东'
-        },
-        {
-          id: '3',
-          text: '深圳'
-        }
-
-      ],
+      datas: [],
       key: 'id',
       label: 'text',
       value: 'id'
@@ -44,7 +26,8 @@ const defaultOptions = {
     value: ''
   },
   defaultClass: 'text-filter',
-  component: 'de-select'
+  component: 'de-select',
+  filterDialog: true
 }
 
 class TextSelectServiceImpl extends WidgetService {
@@ -63,6 +46,16 @@ class TextSelectServiceImpl extends WidgetService {
   beforeToDraw() {
 
   }
+
+  setOptionDatas(data) {
+    this.options.attrs.datas = data
+  }
+
+  filterFieldMethod(fields) {
+    return fields.filter(field => {
+      return field['deType'] === 0
+    })
+  }
 }
 const textSelectServiceImpl = new TextSelectServiceImpl({ name: 'textSelectWidget' })
 export default textSelectServiceImpl

frontend/src/components/widget/serviceImpl/TimeDateRangeServiceImpl.js

@@ -24,7 +24,8 @@ const defaultOptions = {
     value: ''
   },
   defaultClass: 'time-filter',
-  component: 'de-date'
+  component: 'de-date',
+  filterDialog: true
 }
 
 class TimeDateRangeServiceImpl extends WidgetService {
@@ -43,6 +44,11 @@ class TimeDateRangeServiceImpl extends WidgetService {
   beforeToDraw() {
 
   }
+  filterFieldMethod(fields) {
+    return fields.filter(field => {
+      return field['deType'] === 1
+    })
+  }
 }
 const timeDateRangeServiceImpl = new TimeDateRangeServiceImpl({ name: 'timeDateRangeWidget' })
 export default timeDateRangeServiceImpl

frontend/src/components/widget/serviceImpl/TimeDateServiceImpl.js

@@ -23,7 +23,8 @@ const defaultOptions = {
   },
 
   defaultClass: 'time-filter',
-  component: 'de-date'
+  component: 'de-date',
+  filterDialog: true
 }
 
 class TimeDateServiceImpl extends WidgetService {
@@ -42,6 +43,11 @@ class TimeDateServiceImpl extends WidgetService {
   beforeToDraw() {
 
   }
+  filterFieldMethod(fields) {
+    return fields.filter(field => {
+      return field['deType'] === 1
+    })
+  }
 }
 const timeDateServiceImpl = new TimeDateServiceImpl({ name: 'timeDateWidget' })
 export default timeDateServiceImpl

frontend/src/components/widget/serviceImpl/TimeMonthServiceImpl.js

@@ -22,7 +22,8 @@ const defaultOptions = {
     value: ''
   },
   defaultClass: 'time-filter',
-  component: 'de-date'
+  component: 'de-date',
+  filterDialog: true
 }
 
 class TimeMonthServiceImpl extends WidgetService {
@@ -41,6 +42,11 @@ class TimeMonthServiceImpl extends WidgetService {
   beforeToDraw() {
 
   }
+  filterFieldMethod(fields) {
+    return fields.filter(field => {
+      return field['deType'] === 1
+    })
+  }
 }
 const timeMonthServiceImpl = new TimeMonthServiceImpl({ name: 'timeMonthWidget' })
 export default timeMonthServiceImpl

frontend/src/components/widget/serviceImpl/TimeQuarterServiceImpl.js

@@ -22,7 +22,8 @@ const defaultOptions = {
     value: ''
   },
   defaultClass: 'time-filter',
-  component: 'de-quarter'
+  component: 'de-quarter',
+  filterDialog: true
 }
 
 class TimeQuarterServiceImpl extends WidgetService {
@@ -41,6 +42,11 @@ class TimeQuarterServiceImpl extends WidgetService {
   beforeToDraw() {
 
   }
+  filterFieldMethod(fields) {
+    return fields.filter(field => {
+      return field['deType'] === 1
+    })
+  }
 }
 const timeQuarterServiceImpl = new TimeQuarterServiceImpl({ name: 'timeQuarterWidget' })
 export default timeQuarterServiceImpl

frontend/src/views/panel/edit/index.vue

@@ -74,7 +74,7 @@
       :visible.sync="filterVisible"
       custom-class="de-filter-dialog"
     >
-      <filter-dialog v-if="filterVisible" :widget-id="currentWidgetId">
+      <filter-dialog v-if="filterVisible" :widget-id="currentWidgetId" @re-fresh-component="reFreshComponent">
         <de-drawing-widget
           v-if="filterVisible && currentComponent"
           :id="'component' + currentComponent.id"
@@ -323,6 +323,9 @@ export default {
       this.$store.commit('addComponent', { component })
       this.$store.commit('recordSnapshot')
       this.cancelFilter()
+    },
+    reFreshComponent(component) {
+      this.currentComponent = component
     }
   }
 }

frontend/src/views/panel/filter/filterDialog.vue

@@ -145,7 +145,7 @@ import DeAsideContainer from '@/components/dataease/DeAsideContainer'
 import draggable from 'vuedraggable'
 import DragItem from '@/components/DragItem'
 import { ApplicationContext } from '@/utils/ApplicationContext'
-import { groupTree, loadTable, fieldList } from '@/api/dataset/dataset'
+import { groupTree, loadTable, fieldList, fieldValues } from '@/api/dataset/dataset'
 export default {
   name: 'FilterDialog',
   components: {
@@ -176,7 +176,23 @@ export default {
         label: 'label'
       },
       selectField: [],
-      widget: null
+      widget: null,
+      fieldValues: []
+    }
+  },
+  watch: {
+    selectField(values) {
+      if (values && values.length > 0) {
+        const value = values[0]
+        const fieldId = value.id
+        this.widget && this.widget.setOptionDatas && fieldValues(fieldId).then(res => {
+          const datas = res.data.map(item => {
+            return { id: item, text: item }
+          })
+          this.widget.setOptionDatas(datas)
+          this.$emit('re-fresh-component', this.widget)
+        })
+      }
     }
   },
   created() {
@@ -192,10 +208,8 @@ export default {
     },
     loadDataSetTree() {
       groupTree({}).then(res => {
-        let datas = res.data
-        if (this.widget && this.widget.filterFieldMethod) {
-          datas = this.widget.filterFieldMethod(datas)
-        }
+        const datas = res.data
+
         this.data = datas
       })
     },
@@ -249,7 +263,11 @@ export default {
 
     loadField(tableId) {
       fieldList(tableId).then(res => {
-        this.fieldDatas = res.data
+        let datas = res.data
+        if (this.widget && this.widget.filterFieldMethod) {
+          datas = this.widget.filterFieldMethod(datas)
+        }
+        this.fieldDatas = datas
       })
     },
     showFieldDatas(row) {

frontend/vue.config.js

@@ -14,12 +14,12 @@ module.exports = {
   // 使用mock-server
   devServer: {
     port: port,
-    proxy: {
-      '^(?!/login)': {
-        target: 'http://localhost:8081/',
-        ws: false
-      }
-    },
+    // proxy: {
+    //   '^(?!/login)': {
+    //     target: 'http://localhost:8081/',
+    //     ws: false
+    //   }
+    // },
     open: true,
     overlay: {
       warnings: false,