feat: GiForm 新增 show 属性配置，优先级比 hide 高（同步 GiDemo 更新）

src/components/GiForm/src/GiForm.vue

@@ -3,12 +3,14 @@
     <a-grid class="w-full" :col-gap="8" v-bind="options.grid" :collapsed="collapsed">
       <template v-for="(item, index) in columns" :key="item.field">
         <a-grid-item
-          v-if="!isHide(item.hide)" v-show="colVShow(index)" v-bind="item.gridItemProps || props.options.gridItem"
+          v-if="item.show !== undefined ? isShow(item) : !isHide(item.hide)"
+          v-show="colVShow(index)"
+          v-bind="item.gridItemProps || props.options.gridItem"
           :span="item.span || options.gridItem?.span"
         >
           <a-form-item
             v-bind="item.formItemProps" :field="item.field" :rules="item.rules"
-            :disabled="isDisabled(item.disabled)"
+            :disabled="isDisabled(item)"
           >
             <template #label>
               <template v-if="typeof item.label === 'string'">{{ item.label }}</template>
@@ -16,7 +18,7 @@
             </template>
             <slot
               v-if="!['group-title'].includes(item.type || '')" :name="item.field"
-              v-bind="{ disabled: isDisabled(item.disabled) }"
+              v-bind="{ disabled: isDisabled(item) }"
             >
               <template v-if="item.type === 'range-picker'">
                 <DateRangePicker
@@ -72,7 +74,7 @@
 
 <script setup lang="ts">
 import { cloneDeep } from 'lodash-es'
-import type { ColumnsItem, ColumnsItemDisabled, ColumnsItemHide, Options } from './type'
+import type { ColumnsItem, Options } from './type'
 
 interface Props {
   modelValue: any
@@ -150,19 +152,29 @@ const valueChange = (value: any, field: string) => {
   emit('update:modelValue', Object.assign(props.modelValue, { [field]: value }))
 }
 
-const isHide = (hide?: ColumnsItemHide<boolean | object>) => {
+/** 显示表单项 */
-  if (hide === undefined) return false
+const isShow = (item: ColumnsItem) => {
-  if (typeof hide === 'boolean') return hide
+  if (typeof item.show === 'boolean') return item.show
-  if (typeof hide === 'function') {
+  if (typeof item.show === 'function') {
-    return hide(props.modelValue)
+    return item.show(props.modelValue)
   }
 }
 
-const isDisabled = (disabled?: ColumnsItemDisabled<boolean | object>) => {
+/** 隐藏表单项 */
-  if (disabled === undefined) return false
+const isHide = (item: ColumnsItem) => {
-  if (typeof disabled === 'boolean') return disabled
+  if (item.hide === undefined) return false
-  if (typeof disabled === 'function') {
+  if (typeof item.hide === 'boolean') return item.hide
-    return disabled(props.modelValue)
+  if (typeof item.hide === 'function') {
+    return item.hide(props.modelValue)
+  }
+}
+
+/** 禁用表单项 */
+const isDisabled = (item: ColumnsItem) => {
+  if (item.disabled === undefined) return false
+  if (typeof item.disabled === 'boolean') return item.disabled
+  if (typeof item.disabled === 'function') {
+    return item.disabled(props.modelValue)
   }
 }
 

src/components/GiForm/src/type.ts

@@ -50,6 +50,7 @@ export type ColumnsItemPropsKey =
   | keyof A.AlertInstance['$props']
 
 export type ColumnsItemHide<F> = boolean | ((form: F) => boolean)
+export type ColumnsItemShow<F> = boolean | ((form: F) => boolean)
 export type ColumnsItemDisabled<F> = boolean | ((form: F) => boolean)
 export type ColumnsItemRequest<F = any> = (form: F) => Promise<any>
 export type ColumnsItemFormat<T = any> = (
@@ -101,6 +102,7 @@ export interface ColumnsItem<F = any> {
   // 下拉树组件的data
   span?: A.GridItemProps['span']
   data?: A.TreeSelectInstance['$props']['data']
+  show?: ColumnsItemShow<F> // 是否显示（优先级比hide高）
   hide?: ColumnsItemHide<F> // 是否隐藏
   disabled?: ColumnsItemDisabled<F> // 是否禁用
   request?: ColumnsItemRequest<F> // 接口请求api