@aplus-frontend/ui 0.0.10 → 0.0.12

package/lib/src/ap-table/interface.d.ts

@@ -62,7 +62,7 @@ export type ExtraProColumnType<T> = Omit<ColumnType<T>, 'children' | 'filters'>
         multiple?: number;
     };
 };
-export type ApColumnType<ValueType extends keyof ApTableValueFields = 'text', RecordType = any> = ExtraProColumnType<any> & {
+export type ApColumnType<ValueType extends keyof ApTableValueFields = 'text', RecordType = any> = ExtraProColumnType<RecordType> & {
     children?: ApColumnType<any, RecordType>[];
     /**
      * 表单项所占据的格子数（1-24格）

package/lib/src/editable-table/interface.d.ts

@@ -0,0 +1,73 @@
+import { ColumnType, TableProps } from 'ant-design-vue/es/table';
+import { ApTableValueFields, ValueEnum } from '../ap-table';
+import { InternalNamePath, NamePath, ValidateOptions } from 'ant-design-vue/es/form/interface';
+
+export type EditableColumnType<ValueType extends keyof ApTableValueFields = 'text', RecordType = any> = Omit<ColumnType<RecordType>, 'children'> & {
+    /**
+     * 在title之后展示一个icon并触发tooltip
+     */
+    tooltip?: string;
+    /**
+     * 是否可以复制（不可编辑模式下可用）
+     */
+    copyable?: boolean;
+    /**
+     * 是否可编辑
+     */
+    editable?: boolean | ((text: any, record: RecordType, index: number) => boolean);
+    /**
+     * 值的枚举，会自动转化把值当成 key 来取出要显示的内容（也会作为select等组件的选项）
+     */
+    valueEnum?: ValueEnum;
+    /**
+     * 自定义表单
+     */
+    customRenderFormItem?: (config: EditableColumnType<ValueType, RecordType>) => any;
+    /**
+     * 指定值类型（将会用于普通列和可编辑表格的渲染）
+     */
+    valueType?: keyof ApTableValueFields;
+    /**
+     * 值类型额外配置的参数（支持函数）
+     */
+    fieldProps?: ApTableValueFields[ValueType] | ((opt?: {
+        value: any;
+        text: any;
+        record: RecordType;
+        index: number;
+        renderIndex: number;
+        column: EditableColumnType<ValueType, RecordType>;
+    }) => ApTableValueFields[ValueType]);
+};
+export type EditableTableProps<RecordType = any> = Omit<TableProps<RecordType>, 'columns' | 'dataSource'> & {
+    /**
+     * 列配置
+     */
+    columns?: EditableColumnType<any, RecordType>[];
+    /**
+     * 同dataSource，传入的数组数据将作为表单的初始数据
+     */
+    value?: RecordType[];
+    'onUpdate:value'?: (value: RecordType[]) => void;
+    /**
+     * 数据修改时触发onChange（也包含数据的删除）
+     * @param value
+     * @returns
+     */
+    onChange?: (value: RecordType[]) => void;
+    /**
+     * 表格最大行数，超过行后将无法调用相关API新增
+     */
+    maxLength?: number;
+    /**
+     * 设置可编辑表格的名字，如果是作为其它表单的一部分，需要设置此字段
+     */
+    name?: any;
+};
+export type EditableTableExpose<ModelType = any> = {
+    resetFields: (name?: NamePath) => void;
+    validateFields: (nameList?: NamePath[] | string, options?: ValidateOptions) => Promise<Partial<ModelType>> | undefined;
+    getFieldsValue: (nameList?: true | InternalNamePath[]) => Partial<ModelType> | undefined;
+    add: (defaultValue?: any) => void;
+    remove: (index: number) => void;
+};

package/lib/src/editable-table/style/index.css

@@ -0,0 +1,11 @@
+.aplus-editable-table .ant-table-cell:has(> .ant-form-item) {
+  padding-top: 20px !important;
+  padding-bottom: 0 !important;
+}
+.aplus-editable-table .ant-form-item {
+  margin-bottom: 20px;
+}
+.aplus-editable-table__header-cell--required {
+  color: #FF4D4F;
+  padding-right: 2px;
+}

package/lib/src/editable-table/utils.d.ts

@@ -0,0 +1,8 @@
+import { EditableColumnType } from './interface';
+
+/**
+ * 获取编辑模式下默认映射的组件
+ * @param valueType
+ * @returns
+ */
+export declare function getEditableComponent(valueType: EditableColumnType['valueType']): any;

package/lib/src/pro-form/components/form-action.vue2.js

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),c=require("ant-design-vue"),r=require("../../base-button/index.js"),v=require("../../basic/index.js"),h=require("../hooks/use-form-context.js");require("../../config-provider/index.js");require("./style/form-action.css");const k=require("../../config-provider/hooks/use-global-config.js"),x=require("../../config-provider/hooks/use-locale.js"),A=require("../../config-provider/hooks/use-namespace.js"),b=e.defineComponent({name:"BasicFormAction",__name:"form-action",props:{showActionButtonGroup:{type:Boolean,default:!0},showResetButton:{type:Boolean,default:!0},showSubmitButton:{type:Boolean,default:!0},showAdvancedButton:{type:Boolean,default:!0},resetButtonOptions:{default:()=>({})},submitButtonOptions:{},actionColOptions:{default:()=>({})},actionSpan:{default:6},isAdvanced:{type:Boolean},hideAdvanceBtn:{type:Boolean}},emits:["toggle-advanced"],setup(i,{emit:d}){const n=i,p=d,m=k.useGlobalConfig("uiMode"),B=e.computed(()=>m.value==="aplus"?{}:{color:"#34b77c"}),{t:o}=x.useLocale(),{em:s}=A.useNamespace("form-action"),{resetAction:f,submitAction:y}=h.useFormContext(),a=e.computed(()=>{const{actionColOptions:t}=n;return{style:{textAlign:"right",flex:1,maxWidth:"100%",minWidth:"25%"},...t}}),u=e.computed(()=>Object.assign({text:o("ap.common.resetText")},n.resetButtonOptions)),l=e.computed(()=>Object.assign({text:o("ap.common.queryText")},n.submitButtonOptions));function C(){p("toggle-advanced")}return(t,g)=>t.showActionButtonGroup?(e.openBlock(),e.createBlock(e.unref(c.Col),e.normalizeProps(e.mergeProps({key:0},a.value)),{default:e.withCtx(()=>[e.createElementVNode("div",{style:e.normalizeStyle([{width:"100%"},{textAlign:a.value.style.textAlign}])},[e.createVNode(e.unref(c.Form).Item,null,{default:e.withCtx(()=>[e.renderSlot(t.$slots,"resetBefore"),t.showResetButton?(e.openBlock(),e.createBlock(e.unref(r.BaseButton),e.mergeProps({key:0,type:"default",class:e.unref(s)("button","space")},u.value,{onClick:e.unref(f)}),{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(u.value.text),1)]),_:1},16,["class","onClick"])):e.createCommentVNode("",!0),e.renderSlot(t.$slots,"submitBefore"),t.showSubmitButton?(e.openBlock(),e.createBlock(e.unref(r.BaseButton),e.mergeProps({key:1,type:"primary",class:e.unref(s)("button","space")},l.value,{onClick:e.unref(y)}),{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(l.value.text),1)]),_:1},16,["class","onClick"])):e.createCommentVNode("",!0),e.renderSlot(t.$slots,"advanceBefore"),t.showAdvancedButton&&!t.hideAdvanceBtn?(e.openBlock(),e.createBlock(e.unref(r.BaseButton),{key:2,type:"link",size:"small",style:e.normalizeStyle(B.value),onClick:C},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(t.isAdvanced?e.unref(o)("ap.common.closeText"):e.unref(o)("ap.common.expandText"))+" ",1),e.createVNode(e.unref(v.BasicArrow),{class:e.normalizeClass(e.unref(s)("item","space")),expand:!t.isAdvanced,up:""},null,8,["class","expand"])]),_:1},8,["style"])):e.createCommentVNode("",!0),e.renderSlot(t.$slots,"advanceAfter")]),_:3})],4)]),_:3},16)):e.createCommentVNode("",!0)}});exports.default=b;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),c=require("ant-design-vue"),r=require("../../base-button/index.js"),v=require("../../basic/index.js"),h=require("../hooks/use-form-context.js");require("../../config-provider/index.js");require("./style/form-action.css");const k=require("../../config-provider/hooks/use-global-config.js"),x=require("../../config-provider/hooks/use-locale.js"),A=require("../../config-provider/hooks/use-namespace.js"),b=e.defineComponent({name:"BasicFormAction",__name:"form-action",props:{showActionButtonGroup:{type:Boolean,default:!0},showResetButton:{type:Boolean,default:!0},showSubmitButton:{type:Boolean,default:!0},showAdvancedButton:{type:Boolean,default:!0},resetButtonOptions:{default:()=>({})},submitButtonOptions:{},actionColOptions:{default:()=>({})},actionSpan:{default:6},isAdvanced:{type:Boolean},hideAdvanceBtn:{type:Boolean}},emits:["toggle-advanced"],setup(i,{emit:d}){const n=i,p=d,m=k.useGlobalConfig("uiMode"),B=e.computed(()=>m.value==="aplus"?{}:{color:"#34b77c"}),{t:o}=x.useLocale(),{em:s}=A.useNamespace("form-action"),{resetAction:f,submitAction:y}=h.useFormContext(),a=e.computed(()=>{const{actionColOptions:t}=n;return{style:{textAlign:"right",flex:1,maxWidth:"100%",minWidth:"25%"},...t}}),u=e.computed(()=>Object.assign({text:o("ap.common.resetText")},n.resetButtonOptions)),l=e.computed(()=>Object.assign({text:o("ap.common.queryText")},n.submitButtonOptions));function C(){p("toggle-advanced")}return(t,g)=>t.showActionButtonGroup?(e.openBlock(),e.createBlock(e.unref(c.Col),e.normalizeProps(e.mergeProps({key:0},a.value)),{default:e.withCtx(()=>[e.createElementVNode("div",{style:e.normalizeStyle([{width:"100%"},{textAlign:a.value.style.textAlign}])},[e.createVNode(e.unref(c.Form).Item,null,{default:e.withCtx(()=>[e.renderSlot(t.$slots,"resetBefore"),t.showSubmitButton?(e.openBlock(),e.createBlock(e.unref(r.BaseButton),e.mergeProps({key:0,type:"primary",class:e.unref(s)("button","space")},l.value,{onClick:e.unref(y)}),{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(l.value.text),1)]),_:1},16,["class","onClick"])):e.createCommentVNode("",!0),e.renderSlot(t.$slots,"submitBefore"),t.showResetButton?(e.openBlock(),e.createBlock(e.unref(r.BaseButton),e.mergeProps({key:1,type:"default",class:e.unref(s)("button","space")},u.value,{onClick:e.unref(f)}),{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(u.value.text),1)]),_:1},16,["class","onClick"])):e.createCommentVNode("",!0),e.renderSlot(t.$slots,"advanceBefore"),t.showAdvancedButton&&!t.hideAdvanceBtn?(e.openBlock(),e.createBlock(e.unref(r.BaseButton),{key:2,type:"link",size:"small",style:e.normalizeStyle(B.value),onClick:C},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(t.isAdvanced?e.unref(o)("ap.common.closeText"):e.unref(o)("ap.common.expandText"))+" ",1),e.createVNode(e.unref(v.BasicArrow),{class:e.normalizeClass(e.unref(s)("item","space")),expand:!t.isAdvanced,up:""},null,8,["class","expand"])]),_:1},8,["style"])):e.createCommentVNode("",!0),e.renderSlot(t.$slots,"advanceAfter")]),_:3})],4)]),_:3},16)):e.createCommentVNode("",!0)}});exports.default=b;

package/lib/src/theme/ap-action/item.css

@@ -4,21 +4,36 @@
   line-height: 22px;
   cursor: pointer;
 }
-.aplus-action-item--primary {
+.aplus-action-item-aplus--primary {
   color: #0070ff;
 }
-.aplus-action-item--primary:not(.aplus-action-item--disabled):hover {
+.aplus-action-item-aplus--primary:not(.aplus-action-item--disabled):hover {
   color: #66a9ff;
 }
-.aplus-action-item--success {
+.aplus-action-item-admin--primary {
+  color: #1890FF;
+}
+.aplus-action-item-admin--primary:not(.aplus-action-item--disabled):hover {
+  color: #5EB1FF;
+}
+.aplus-action-item-aplus--success {
   color: #2ed1a3;
 }
-.aplus-action-item--error {
+.aplus-action-item-aplus--error {
   color: #FF4D4F;
 }
-.aplus-action-item--warn {
+.aplus-action-item-aplus--warn {
   color: #FFA940;
 }
+.aplus-action-item-admin--success {
+  color: #52C41A;
+}
+.aplus-action-item-admin--error {
+  color: #FF4D4F;
+}
+.aplus-action-item-admin--warn {
+  color: #FAAD14;
+}
 .aplus-action-item--loading {
   opacity: 0.35;
   transition: opacity 0.2s;

package/lib/src/theme/ap-form/modal-form.css

@@ -6,12 +6,16 @@
   border-bottom: 1px solid #E9EDF3;
   margin-bottom: 0;
 }
-.aplus-ap-form-modal-form .ant-modal-body {
+.aplus-ap-form-modal-form__content-admin {
   padding: 20px;
 }
 .aplus-ap-form-modal-form__footer {
   padding-top: 20px;
 }
+.aplus-ap-form-modal-form__footer-admin {
+  border-top: 1px solid #E9EDF3;
+  padding: 12px 20px;
+}
 .aplus-ap-form-modal-form .ant-modal-close {
   top: 16px;
 }

package/lib/src/theme/editable-table/index.css

@@ -0,0 +1,11 @@
+.aplus-editable-table .ant-table-cell:has(> .ant-form-item) {
+  padding-top: 20px !important;
+  padding-bottom: 0 !important;
+}
+.aplus-editable-table .ant-form-item {
+  margin-bottom: 20px;
+}
+.aplus-editable-table__header-cell--required {
+  color: #FF4D4F;
+  padding-right: 2px;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@aplus-frontend/ui",
-  "version": "0.0.10",
+  "version": "0.0.12",
   "main": "lib/index.js",
   "module": "es/index.mjs",
   "files": [