@skyfox2000/webui 1.4.14 → 1.4.16

package/package.json

@@ -1,6 +1,6 @@
 {
    "name": "@skyfox2000/webui",
-   "version": "1.4.14",
+   "version": "1.4.16",
    "description": "后台前端通用组件定义",
    "type": "module",
    "keywords": [],

package/src/components/content/search/index.vue

@@ -28,7 +28,7 @@ const props = defineProps<{
    /**
     * 表格控制对象
     */
-   gridCtrl: GridControl<AnyData>;
+   gridCtrl?: GridControl<AnyData>;
    /**
     * 模糊查询字段
     */
@@ -39,7 +39,8 @@ const props = defineProps<{
 
 const emits = defineEmits<{
    (e: 'update:search', val: Record<string, any>): void;
-   (e: 'reset'): void;
+   (e: 'onsearch', val: Record<string, any>): void;
+   (e: 'onreset'): void;
 }>();
 
 /**
@@ -60,13 +61,13 @@ const updateHolderSize = () => {
    defaultSlots.value = 0;
    controlSlots.value = 0;
    if (slots.default) defaultSlots.value = getSlotLen(slots.default({}));
-   if (props.gridCtrl.searchBar && slots.control) controlSlots.value = getSlotLen(slots.control({}));
+   if (props.gridCtrl && props.gridCtrl.searchBar && slots.control) controlSlots.value = getSlotLen(slots.control({}));
 
    holderSize.value = 2 - ((defaultSlots.value + controlSlots.value) % 3);
 };
 
 watch(
-   () => props.gridCtrl.searchBar,
+   () => props.gridCtrl?.searchBar,
    () => {
       updateHolderSize();
    },
@@ -77,13 +78,15 @@ const defaultData: Record<string, any> = JSON.parse(JSON.stringify(props.search)
 onMounted(() => {
    updateHolderSize();
    let search = { ...props.search };
-   props.gridCtrl.gridQuery = {
-      ...props.gridCtrl.gridQuery,
-      Query: {
-         ...props.gridCtrl.gridQuery?.Query,
-         ...search,
-      },
-   };
+   if (props.gridCtrl) {
+      props.gridCtrl.gridQuery = {
+         ...props.gridCtrl.gridQuery,
+         Query: {
+            ...props.gridCtrl.gridQuery?.Query,
+            ...search,
+         },
+      };
+   }
 });
 
 const onSearch = () => {
@@ -96,18 +99,21 @@ const onSearch = () => {
       }
    }
 
-   props.gridCtrl.gridQuery = {
-      ...props.gridCtrl.gridQuery,
-      Query: {
-         ...props.gridCtrl.gridQuery?.Query,
-         ...search,
-      },
-   };
+   if (props.gridCtrl) {
+      props.gridCtrl.gridQuery = {
+         ...props.gridCtrl.gridQuery,
+         Query: {
+            ...props.gridCtrl.gridQuery?.Query,
+            ...search,
+         },
+      };
 
-   // 包含分页，需要重新设置
-   props.gridCtrl.pageNo.value = 1;
+      // 包含分页，需要重新设置
+      props.gridCtrl.pageNo.value = 1;
 
-   props.gridCtrl.reload.value = true;
+      props.gridCtrl.reload.value = true;
+   }
+   emits('onsearch', search);
 };
 
 const onReset = () => {
@@ -119,7 +125,7 @@ const onReset = () => {
    }
    emits('update:search', data);
 
-   emits('reset');
+   emits('onreset');
 };
 </script>
 <template>
@@ -130,11 +136,11 @@ const onReset = () => {
       <!-- 默认插槽 -->
       <slot></slot>
       <!-- 受控插槽 -->
-      <slot name="control" v-if="gridCtrl.searchBar"></slot>
+      <slot name="control" v-if="gridCtrl?.searchBar"></slot>
       <!-- 表单操作按钮 占位数量 -->
       <SearchItem class="w-1/3" v-if="holderSize >= 1"> </SearchItem>
       <SearchItem class="w-1/3" v-if="holderSize >= 2"> </SearchItem>
-      <SearchItem v-if="defaultSlots || gridCtrl.searchBar" class="w-1/3 flex justify-end text-right pr-5"
+      <SearchItem v-if="defaultSlots || gridCtrl?.searchBar" class="w-1/3 flex justify-end text-right pr-5"
          :wrapper-col="{ flex: 'auto' }">
          <Space>
             <Button type="primary" @click="onSearch" icon="icon-search">搜索</Button>

package/src/components/content/table/index.vue

@@ -167,7 +167,7 @@ watch(
 
 const visible = ref(false);
 onActivated(() => {
-   if (visible.value && gridCtrl) gridCtrl.reload.value = true;
+   if (visible.value && gridCtrl && gridCtrl.autoload) gridCtrl.reload.value = true;
 });
 
 onMounted(async () => {

package/src/components/form/autoComplete/index.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { ref, onUnmounted, useAttrs, watch, shallowRef, PropType } from 'vue';
+import { ref, onUnmounted, useAttrs, watch, shallowRef, PropType, onActivated } from 'vue';
 import { AutoComplete, Input } from 'ant-design-vue';
 import {
    useInputFactory,
@@ -130,6 +130,10 @@ const onSelected = (value: any) => {
    }
 };
 
+onActivated(() => {
+   if (optionCtrl && optionCtrl.autoload) optionCtrl.reload.value = true;
+});
+
 onUnmounted(() => {
    if (optionCtrl) unloadOption(optionCtrl, props);
 });

package/src/components/form/cascader/index.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { ref, onMounted, onUnmounted, useAttrs, watch, shallowRef } from 'vue';
+import { ref, onMounted, onUnmounted, useAttrs, watch, shallowRef, onActivated } from 'vue';
 import {
    circleLoading,
    useInputFactory,
@@ -79,13 +79,17 @@ const onChanged = (_: ValueType, selected: DefaultOptionType[]) => {
    const labels: string[] = getSelectedLabels(selectedOptions);
 
    emit('update:labels', labels);
-   emit('update:value', values); 
+   emit('update:value', values);
    if (errInfo?.value.errClass && editorCtrl) {
       /// 重新开始验证
       formValidate(editorCtrl);
    }
 };
 
+onActivated(() => {
+   if (optionCtrl && optionCtrl.autoload) optionCtrl.reload.value = true;
+});
+
 onMounted(() => {
    if (url.value && !url.value.fieldMap) {
       url.value.fieldMap = {
@@ -108,14 +112,8 @@ onUnmounted(() => {
          <circleLoading class="text-[#555] mx-[5px] !ml-[10px] !w-4 !h-4" />
          <span>数据加载中...</span>
       </div>
-      <Cascader
-         :options="selectOptions"
-         :class="[errInfo?.errClass]"
-         :allow-clear="true"
-         :placeholder="selectOptions.length > 0 ? '请选择' + labelText : ''"
-         @change="onChanged"
-         v-bind="attrs"
-      />
+      <Cascader :options="selectOptions" :class="[errInfo?.errClass]" :allow-clear="true"
+         :placeholder="selectOptions.length > 0 ? '请选择' + labelText : ''" @change="onChanged" v-bind="attrs" />
    </div>
 </template>
 

package/src/components/form/checkbox/index.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { ref, onMounted, onUnmounted, useAttrs, watch, shallowRef } from 'vue';
+import { ref, onMounted, onUnmounted, useAttrs, watch, shallowRef, onActivated } from 'vue';
 import { Checkbox, CheckboxGroup } from 'ant-design-vue';
 import {
    // circleLoading,
@@ -75,6 +75,10 @@ const onChanged = (e: CheckboxValueType[]) => {
    emit('update:labels', labels);
 };
 
+onActivated(() => {
+   if (optionCtrl && optionCtrl.autoload) optionCtrl.reload.value = true;
+});
+
 onMounted(() => {
    if (url.value && !url.value.fieldMap) {
       url.value.fieldMap = {
@@ -99,20 +103,13 @@ onUnmounted(() => {
       </div> -->
       <CheckboxGroup @change="onChanged" class="w-full mb-[-3px]" v-bind="attrs">
          <template v-if="checkboxOptions.length > 0">
-            <Checkbox
-               v-for="item in checkboxOptions"
-               :key="item.value"
-               :value="item.value"
-               :disabled="
-                  item.disabled || (item.value && disabledItems && disabledItems.indexOf(item.value.toString()) > -1)
-               "
-               :class="[
+            <Checkbox v-for="item in checkboxOptions" :key="item.value" :value="item.value" :disabled="item.disabled || (item.value && disabledItems && disabledItems.indexOf(item.value.toString()) > -1)
+               " :class="[
                   errInfo?.errClass === 'error' ? 'error !text-red-400' : '',
                   'text-nowrap',
                   'pb-1',
                   wrap ? `w-1/${props.wrap}` : '',
-               ]"
-            >
+               ]">
                {{ item.label }}
             </Checkbox>
          </template>

package/src/components/form/radio/index.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { ref, onMounted, onUnmounted, watch, useAttrs, shallowRef } from 'vue';
+import { ref, onMounted, onUnmounted, watch, useAttrs, shallowRef, onActivated } from 'vue';
 import { Radio, RadioChangeEvent, RadioGroup } from 'ant-design-vue';
 import {
    OptionCommProps,
@@ -102,6 +102,10 @@ const onChanged = (e: RadioChangeEvent) => {
    emit('update:labels', labels);
 };
 
+onActivated(() => {
+   if (optionCtrl && optionCtrl.autoload) optionCtrl.reload.value = true;
+});
+
 onMounted(() => {
    if (url.value && !url.value.fieldMap) {
       url.value.fieldMap = {
@@ -118,26 +122,17 @@ onUnmounted(() => {
 </script>
 <template>
    <div class="min-h-[32px] pt-1">
-      <RadioGroup
-         v-model:value="innerValue"
-         :autocheck="false"
-         @change="onChanged"
-         class="w-full flex align-items flex-wrap mb-[-3px]"
-         v-bind="attrs"
-      >
+      <RadioGroup v-model:value="innerValue" :autocheck="false" @change="onChanged"
+         class="w-full flex align-items flex-wrap mb-[-3px]" v-bind="attrs">
          <template v-if="radioOptions.length > 0">
             <template v-for="item in radioOptions" :key="item.value">
-               <Radio
-                  :checked="isValueEqual(item.value, props.value)"
-                  v-if="item.visible !== false"
-                  :value="item.value"
+               <Radio :checked="isValueEqual(item.value, props.value)" v-if="item.visible !== false" :value="item.value"
                   :class="[
                      errInfo?.errClass === 'error' ? 'error !text-red-400' : '',
                      'text-nowrap',
                      'pb-1',
                      wrap ? `w-1/${props.wrap}` : '',
-                  ]"
-               >
+                  ]">
                   {{ item.label }}
                </Radio>
             </template>

package/src/components/form/select/index.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { ref, onMounted, onUnmounted, watch, PropType, useAttrs, shallowRef } from 'vue';
+import { ref, onMounted, onUnmounted, watch, PropType, useAttrs, shallowRef, onActivated } from 'vue';
 import { Select, SelectOption } from 'ant-design-vue';
 import {
    circleLoading,
@@ -172,6 +172,9 @@ watch(
    },
 );
 
+onActivated(() => {
+   if (optionCtrl && optionCtrl.autoload) optionCtrl.reload.value = true;
+});
 
 onMounted(() => {
    if (url.value && !url.value.fieldMap) {

package/src/components/form/treeSelect/index.vue

@@ -1,5 +1,5 @@
 <script lang="ts" setup>
-import { ref, watch, onMounted, PropType } from 'vue';
+import { ref, watch, onMounted, PropType, onActivated } from 'vue';
 import { TreeSelect } from 'ant-design-vue';
 import type { SelectValue, TreeControl, TreeNode } from '@/index';
 import { queryTree, useInputFactory } from '@/index';
@@ -87,6 +87,10 @@ const handleChange = (value: SelectValue) => {
    emit('change', currentValue.value);
 };
 
+onActivated(() => {
+   if (props.treeCtrl && props.treeCtrl.autoload) props.treeCtrl.reload.value = true;
+});
+
 // 组件挂载时加载数据
 onMounted(() => {
    if (!treeCtrl.fieldMap) {

package/src/utils/export-table.ts

@@ -81,9 +81,9 @@ const formatFileName = (fileName: string) => {
       return dayjs().format(formatStr);
    });
 };
+
 // 下载当前条件全部数据
 // 表头相同
-
 export const exportResults = async <T extends Record<string, any>>(
    fileName: string,
    columns: TableColumn[],