cosey 0.3.4 → 0.3.5

package/components/table/index.d.ts

@@ -28,7 +28,7 @@ declare const _Table: {
         formProps: {
             type: import("vue").PropType<Partial<import("vue").ExtractPropTypes<{
                 schemes: {
-                    type: import("vue").PropType<import("..").FormItemProps<import("..").FieldType>[]>;
+                    type: import("vue").PropType<import(".").TableQueryScheme[]>;
                     default: () => never[];
                 };
                 grid: {
@@ -351,7 +351,7 @@ declare const _Table: {
         formProps: {
             type: import("vue").PropType<Partial<import("vue").ExtractPropTypes<{
                 schemes: {
-                    type: import("vue").PropType<import("..").FormItemProps<import("..").FieldType>[]>;
+                    type: import("vue").PropType<import(".").TableQueryScheme[]>;
                     default: () => never[];
                 };
                 grid: {

package/components/table/table-column/renderer.d.ts

@@ -1,4 +1,4 @@
-import { SwitchProps, type TableColumnCtx } from 'element-plus';
+import { type LinkProps, SwitchProps, type TableColumnCtx } from 'element-plus';
 import { type TableColumnProps } from './table-column';
 import { type LongTextProps } from '../../long-text';
 import { type MediaCardProps } from '../../media-card';
@@ -27,12 +27,21 @@ export type RendererType = 'text' | 'date' | 'datetime' | 'media' | {
     type: 'switch';
     props?: Partial<SwitchProps>;
     api?: (value: any, row: any) => Promise<any>;
+} | {
+    type: 'click';
+    props?: Partial<LinkProps>;
+    onClick?: (params: {
+        row: any;
+        value: any;
+        index: number;
+        column: TableColumnCtx<any>;
+    }) => void;
 };
 export declare const mapRendererColumnProps: Record<string, TableColumnProps>;
 /**
  * 可组合其他组件进行渲染
  */
-export declare function renderer<T extends RendererType>({ cellValue, row }: RendererOptions, type: RendererType | undefined, t: Translator): any;
+export declare function renderer<T extends RendererType>({ cellValue, row, index, column }: RendererOptions, type: RendererType | undefined, t: Translator): any;
 /**
  * 导出表格数据时使用的渲染器，只需要获取文本数据
  */

package/components/table/table-column/renderer.js

@@ -1,5 +1,5 @@
-import { ref, createVNode, mergeProps } from 'vue';
-import { ElSwitch, ElMessage, ElTag } from 'element-plus';
+import { createVNode, mergeProps, ref, isVNode } from 'vue';
+import { ElLink, ElSwitch, ElMessage, ElTag } from 'element-plus';
 import { get } from 'lodash-es';
 import { LongText as _LongText } from '../../long-text/index.js';
 import { MediaCard as _MediaCard } from '../../media-card/index.js';
@@ -9,6 +9,9 @@ import { Scope } from '../../../utils/vue.js';
 import { formatAsDate, formatAsDateTime } from '../../../utils/date.js';
 import { toArray } from '../../../utils/array.js';
 
+function _isSlot(s) {
+  return typeof s === 'function' || Object.prototype.toString.call(s) === '[object Object]' && !isVNode(s);
+}
 const mapRendererColumnProps = {
   media: {
     minWidth: 104,
@@ -24,7 +27,9 @@ const mapRendererColumnProps = {
 };
 function renderer({
   cellValue,
-  row
+  row,
+  index,
+  column
 }, type = "text", t) {
   if (isEmpty(cellValue)) {
     return "";
@@ -89,6 +94,21 @@ function renderer({
           }), null)]
         });
       }
+    case "click":
+      return createVNode(ElLink, mergeProps({
+        "type": "primary",
+        "underline": "never",
+        "style": "font-weight: normal; word-break: break-all;"
+      }, obj.props, {
+        "onClick": () => obj.onClick?.({
+          row,
+          value: cellValue,
+          index,
+          column
+        })
+      }), _isSlot(cellValue) ? cellValue : {
+        default: () => [cellValue]
+      });
   }
 }
 function exportRenderer(row, column, cellValue, index) {
@@ -110,6 +130,7 @@ function exportRenderer(row, column, cellValue, index) {
     case "media":
     case "longtext":
     case "switch":
+    case "click":
       return cellValue;
     case "mediagroup":
       return JSON.stringify(cellValue);

package/components/table/table-column/table-column.vue.js

@@ -46,7 +46,10 @@ const TableColumn = defineComponent({
           obj.formatter = (row, column, cellValue, index) => {
             return renderer({
               cellValue,
-              row}, obj.renderer, t);
+              row,
+              column,
+              index
+            }, obj.renderer, t);
           };
           const renderType = typeof obj.renderer === "object" ? obj.renderer.type : obj.renderer;
           const renderProps = mapRendererColumnProps[renderType];

package/components/table/table-query/table-query.d.ts

@@ -1,10 +1,16 @@
 import { type FieldType } from '../../field';
 import { type FormItemProps } from '../../form';
 import { type FormQuerySlots, type FormQueryEmits, type FormQueryExpose } from '../../form-query';
-import { type PropType, type ExtractPropTypes } from 'vue';
+import { type PropType, type ExtractPropTypes, VNodeChild } from 'vue';
+export type TableQueryScheme = FormItemProps<FieldType> & {
+    render?: (params: {
+        model: Record<string, any>;
+    }) => VNodeChild;
+    slots?: Record<string, unknown>;
+};
 export declare const tableQueryProps: {
     schemes: {
-        type: PropType<FormItemProps<FieldType>[]>;
+        type: PropType<TableQueryScheme[]>;
         default: () => never[];
     };
     grid: {

package/components/table/table-query/table-query.vue.d.ts

@@ -2,7 +2,7 @@ import { type TableQuerySlots } from './table-query';
 type __VLS_Slots = TableQuerySlots;
 declare const __VLS_component: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
     schemes: {
-        type: import("vue").PropType<import("../..").FormItemProps<import("../..").FieldType>[]>;
+        type: import("vue").PropType<import("./table-query").TableQueryScheme[]>;
         default: () => never[];
     };
     grid: {
@@ -155,7 +155,7 @@ declare const __VLS_component: import("vue").DefineComponent<import("vue").Extra
     "update:collapsed": (val: boolean) => any;
 }, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     schemes: {
-        type: import("vue").PropType<import("../..").FormItemProps<import("../..").FieldType>[]>;
+        type: import("vue").PropType<import("./table-query").TableQueryScheme[]>;
         default: () => never[];
     };
     grid: {
@@ -318,7 +318,7 @@ declare const __VLS_component: import("vue").DefineComponent<import("vue").Extra
     scrollIntoViewOptions: boolean | Record<string, any>;
     minFields: number;
     collapsed: boolean;
-    schemes: import("../..").FormItemProps<keyof import("../..").MapFieldTypeComponentProps>[];
+    schemes: import("./table-query").TableQueryScheme[];
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
 export default _default;

package/components/table/table-query/table-query.vue.js

@@ -1,10 +1,10 @@
-import { defineComponent, useTemplateRef, reactive, onBeforeMount, createBlock, openBlock, unref, mergeProps, withKeys, withModifiers, withCtx, createElementBlock, Fragment, renderList } from 'vue';
+import { defineComponent, ref, reactive, onBeforeMount, createBlock, openBlock, resolveDynamicComponent, unref } from 'vue';
 import { tableQueryProps, omittedTableQueryProps, tableQueryExposeKeys } from './table-query.js';
 import { reactiveOmit } from '@vueuse/core';
 import { cloneDeep } from 'lodash-es';
 import { FormItem as _FormItem } from '../../form/index.js';
 import { FormQuery as _FormQuery } from '../../form-query/index.js';
-import { createMergedExpose } from '../../../utils/vue.js';
+import { createMergedExpose, defineTemplate } from '../../../utils/vue.js';
 
 var stdin_default = /* @__PURE__ */defineComponent({
   ...{
@@ -18,7 +18,7 @@ var stdin_default = /* @__PURE__ */defineComponent({
   }) {
     const props = __props;
     const formQueryProps = reactiveOmit(props, omittedTableQueryProps);
-    const formQueryRef = useTemplateRef("formQuery");
+    const formQueryRef = ref();
     const formModel = reactive({});
     onBeforeMount(() => {
       props.schemes.forEach(item => {
@@ -40,26 +40,39 @@ var stdin_default = /* @__PURE__ */defineComponent({
       }
     };
     __expose(createMergedExpose(tableQueryExposeKeys, () => formQueryRef.value, customExpose));
-    return (_ctx, _cache) => {
-      return openBlock(), createBlock(unref(_FormQuery), mergeProps({
-        ref: "formQuery"
-      }, unref(formQueryProps), {
+    const template = defineTemplate(h => {
+      return h(_FormQuery, {
+        ...formQueryProps,
+        ref: formQueryRef,
         model: formModel,
-        onKeyup: withKeys(withModifiers(onEnter, ["prevent"]), ["enter"])
-      }), {
-        default: withCtx(() => [(openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.schemes, (item, i) => {
-          return openBlock(), createBlock(unref(_FormItem), mergeProps({
-            key: i,
-            ref_for: true
-          }, item, {
-            modelValue: formModel[item.prop],
-            "onUpdate:modelValue": $event => formModel[item.prop] = $event
-          }), null, 16, ["modelValue", "onUpdate:modelValue"]);
-        }), 128
-        /* KEYED_FRAGMENT */))]),
-        _: 1
-        /* STABLE */
-      }, 16, ["model", "onKeyup"]);
+        onKeyupEnterPrevent: onEnter
+      }, () => {
+        return props.schemes.map(item => {
+          const {
+            slots,
+            render,
+            ...rest
+          } = item;
+          if (render) {
+            return h(_FormItem, rest, {
+              ...slots,
+              default: () => {
+                return render({
+                  model: formModel
+                });
+              }
+            });
+          }
+          return h(_FormItem, {
+            ...rest,
+            modelValue: formModel[rest.prop],
+            "onUpdate:modelValue": value => formModel[rest.prop] = value
+          }, slots);
+        });
+      });
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(resolveDynamicComponent(unref(template)));
     };
   }
 });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "cosey",
-  "version": "0.3.4",
+  "version": "0.3.5",
   "description": "基于 Vue3 + vite 的后台管理系统框架",
   "type": "module",
   "main": "index.js",