sohelp-eleplus 1.1.19 → 1.1.21

package/sohelp-grid-view/filter/config/index.vue

@@ -32,10 +32,7 @@
           ></grid-filter-keywords>
         </template>
         <template #scheme>
-          <grid-filter-scheme
-            v-model="filterConfig.filter.scheme"
-            :properties="propertiesArray"
-          ></grid-filter-scheme>
+          <grid-filter-scheme v-model="filterConfig.filter.scheme" :properties="propertiesArray"></grid-filter-scheme>
         </template>
         <template #config>
           <grid-filter-config v-model="filterConfig"></grid-filter-config>
@@ -50,7 +47,7 @@
   </ele-modal>
 </template>
 <script setup>
-import { defineProps, onMounted, ref, watch } from "vue";
+  import { defineProps, onMounted, ref, watch } from 'vue';
 
   import GridFilterField from './grid-filter-field.vue';
   import GridFilterSort from './grid-filter-sort.vue';
@@ -75,7 +72,6 @@ import { defineProps, onMounted, ref, watch } from "vue";
   const tabsKey = ref(0);
   const propertiesArray = ref([]);
 
-
   const gridActiveTab = ref('list');
   const gridTabs = [
     {
@@ -97,7 +93,8 @@ import { defineProps, onMounted, ref, watch } from "vue";
     {
       name: 'scheme',
       label: '筛选场景'
-    },{
+    },
+    {
       name: 'config',
       label: '基本配置'
     }
@@ -115,7 +112,7 @@ import { defineProps, onMounted, ref, watch } from "vue";
     }
   );
 
-  onMounted(()=>{
+  onMounted(() => {
     originFilterConfigValue.value = JSON.parse(JSON.stringify(props.config));
     propertiesArray.value = props.config?.properties
       ?.map(({ name, label, hidden }) => {
@@ -165,7 +162,7 @@ import { defineProps, onMounted, ref, watch } from "vue";
     if (res.meta.success) {
       emit('update:modelValue', false);
       moduleCache.clear();
-      emit('done',filterConfig.value);
+      emit('done', filterConfig.value);
       ElMessage.success(res?.meta.message || '操作成功');
     } else {
       ElMessage.error(res?.meta.message || '操作成功');

package/sohelp-grid-view/filter/filter-form.vue

@@ -25,20 +25,22 @@
     <!-- advanced -->
     <div class="advanced-box" ref="advancedBoxRef">
       <filter-condition-item
+        @search="filter"
         v-for="(item, index) in getFilterList"
         :key="item.name"
         v-model="filterValue.filter[index]"
         :properties="propertiesMap?.[item.name]"
         :ref="(el) => setItemRef(el, item.name)"
       ></filter-condition-item>
-
+    </div>
+    <template #footer>
       <div
         class="footer-top-right"
         v-if="filterList.length > 0 && config.filter?.config.filterPosition !== 'MODAL'"
         ref="searchButtonRef"
       >
-        <el-button size="small" plain @click="reset">{{ t('grid.toolbar.reset') }}</el-button>
-        <el-button type="primary" size="small" @click="filter">{{ t('grid.toolbar.filter') }}</el-button>
+        <el-button size="small" plain @click="reset" :icon="Refresh">{{ t('grid.toolbar.reset') }}</el-button>
+        <el-button type="primary" size="small" @click="filter" :icon="Search">{{ t('grid.toolbar.filter') }}</el-button>
         <el-link
           plain
           @click="toggleFilter"
@@ -53,7 +55,7 @@
           <ele-text size="xs" :icon="Minus" v-else> 收缩</ele-text>
         </el-link>
       </div>
-    </div>
+    </template>
   </ele-card>
 </template>
 
@@ -62,7 +64,7 @@
   import FilterConditionItem from '../../sohelp-grid/components/filter-condition-item.vue';
   import { useMobile } from '@/utils/use-mobile';
   import { useI18n } from 'vue-i18n';
-  import { Plus, Minus } from '@element-plus/icons-vue';
+  import { Plus, Minus, Search, Refresh } from '@element-plus/icons-vue';
 
   const { mobile } = useMobile();
   const { t } = useI18n();
@@ -163,7 +165,7 @@
     if (filterPosition?.toUpperCase() === 'TOP') {
       maxRowsConfig.current.index = filterList.value.length;
       maxRowsConfig.height = advancedBoxRef.value?.offsetHeight + 'px';
-      const advancedRow = advancedBoxRef.value.querySelector('.sohelp-filter-condition');
+      const advancedRow = advancedBoxRef.value?.querySelector('.sohelp-filter-condition');
       if (advancedRow) {
         maxRowsConfig.rowHeight = advancedRow.offsetHeight;
       }
@@ -278,13 +280,11 @@
         }
       }
     }
-
-    .footer-top-right {
-      text-align: right;
-      margin-left: auto;
-    }
   }
-
+  .footer-top-right {
+    text-align: right;
+    margin-left: auto;
+  }
   .sohelp-filter {
     .footer-right {
       display: flex;
@@ -298,11 +298,12 @@
     .scheme-box {
       padding-top: 10px;
       display: flex;
-      align-items: center;
+      align-items: flex-start;
       gap: 10px;
 
       .scheme-list {
         display: flex;
+        gap: 5px;
       }
     }
 
@@ -374,7 +375,7 @@
 
   .sohelp-filter.right {
     width: 100%;
-    height: calc(100% - 70px);
+    height: calc(100% - 25px);
     padding-left: 10px;
     margin-left: 0px;
     box-sizing: border-box;
@@ -391,11 +392,14 @@
 
     :deep(.ele-card-footer) {
       width: calc(100% - 30px);
-      background: #fff;
-      z-index: 99999;
+      z-index: 999;
       bottom: 0px;
       position: absolute;
     }
+
+    .scheme-box {
+      flex-direction: column;
+    }
   }
 
   .sohelp-filter.right .sohelp-filter-condition {
@@ -416,7 +420,7 @@
 
   .sohelp-filter.right :deep(.ele-card-body) {
     flex: 1;
-    max-height: calc(100% - 75px);
+    height: 100%;
   }
 
   .sohelp-filter.modal :deep(.ele-card-body) {

package/sohelp-grid-view/filter/index.vue

@@ -4,6 +4,7 @@
   import { computed, ref } from 'vue';
   import FilterConfig from './config/index.vue';
   import { useI18n } from 'vue-i18n';
+  import { Search, Refresh } from '@element-plus/icons-vue';
 
   const emit = defineEmits('change', 'filter', 'update:modelValue', 'close', 'reset', 'save', 'changeFilterScheme');
 
@@ -143,8 +144,10 @@
     ></filter-form>
     <template #footer>
       <div class="footer-right" v-if="config.filter.config.filterPosition !== 'TOP'">
-        <el-button size="small" plain @click="reset">{{ t('grid.toolbar.reset') }}</el-button>
-        <el-button type="primary" size="small" @click="filter(false)">{{ t('grid.toolbar.filter') }}</el-button>
+        <el-button size="small" plain @click="reset" :icon="Refresh">{{ t('grid.toolbar.reset') }}</el-button>
+        <el-button type="primary" size="small" @click="filter(false)" :icon="Search">{{
+          t('grid.toolbar.filter')
+        }}</el-button>
       </div>
     </template>
   </ele-modal>

package/sohelp-grid-view/index.vue

@@ -1,5 +1,5 @@
 <script setup>
-  import { computed, reactive, ref, watch } from 'vue';
+  import { computed, nextTick, reactive, ref, watch } from 'vue';
   import { useMobile } from '@/utils/use-mobile';
   import SohelpFilter from './filter/index.vue';
   import SohelpGrid from '../sohelp-grid/index.vue';
@@ -106,8 +106,8 @@
   });
 
   //工具栏按钮点击事件
-  const toolbarButtonClick = (config) => {
-    emit('toolbarButtonClick', config);
+  const toolbarButtonClick = (config, rows) => {
+    emit('toolbarButtonClick', config, rows);
   };
   //右击菜单按钮点击事件
   const menuRightClick = (config) => {
@@ -128,19 +128,28 @@
 
   /**
    * 查询数据
-   * @param param 区分是高级筛选，还是列筛选
+   * @param params 区分是高级筛选，还是列筛选
    */
-  const reload = (param = {}, callback) => {
-    sohelpGridRef.value.reload(param, callback);
+  const reload = (params = {}, callback) => {
+    sohelpGridRef.value.reload(params, callback);
   };
-  const load = (param = {}, callback) => {
-    sohelpGridRef.value.load(param, callback);
+  /**
+   * 加载数据
+   * @param params
+   * @param callback
+   */
+  const load = (params = {}, callback) => {
+    sohelpGridRef.value.load(params, callback);
   };
+  /**
+   * 刷新数据
+   */
   const refresh = () => {
     sohelpGridRef.value.refresh();
   };
 
   const changeFilterScheme = (schemeValue, filterValue) => {
+    sohelpGridRef.value.reload({});
     emit('changeFilterScheme', schemeValue, filterValue);
   };
   /**
@@ -249,7 +258,11 @@
           @operationButtonClick="operationButtonClick"
           @editClosed="editClosed"
           @currentColumnChange="currentColumnChange"
-        ></sohelp-grid>
+        >
+          <template v-for="(_, name) in $slots" #[name]="slotProps">
+            <slot :name="name" v-bind="slotProps" />
+          </template>
+        </sohelp-grid>
       </template>
     </ele-split-panel>
   </div>