Navigation Menu

Skip to content

Commit

Permalink
perf: 优化expose
Browse files Browse the repository at this point in the history
  • Loading branch information
@greper
greper committed Jun 19, 2021
1 parent fb9c04f commit f1d75b5
Show file tree
Hide file tree
Showing 4 changed files with 198 additions and 102 deletions.
10 changes: 6 additions & 4 deletions packages/fast-crud/src/components/crud/fs-form-wrapper.jsx
View file
Expand Up @@ -47,18 +47,20 @@ export default {
const emitOnOpened = ref();
const title = ref();
const open = (opts) => {
//提取formrapper的配置
const { wrapper } = opts;
if (wrapper.onOpen) {
wrapper.onOpen(opts);
}
title.value = wrapper.title;
formWrapperIs.value = opts.wrapper.is;
formWrapper.value = {
..._.omit(wrapper, "title", "onOpen", "onClosed", "onOpened")
..._.omit(wrapper, "title", "onOpen", "onClosed", "onOpened", "is")
};
delete formWrapper.value.is;
formWrapperIs.value = opts.wrapper.is;
//form的配置
formOptions.value = {
..._.omit(opts, "wrapper")
..._.omit(opts, "wrapper"),
slots: props.slots
};

// 打开表单对话框
Expand Down
37 changes: 1 addition & 36 deletions packages/fast-crud/src/components/fs-crud.vue
View file
Expand Up @@ -16,7 +16,7 @@

<div v-if="actionbar && actionbar.show !== false" class="fs-crud-actionbar">
<slot name="actionbar-left"></slot>
<fs-actionbar v-bind="actionbar" @action="onActionHandle" />
<fs-actionbar v-bind="actionbar" />
<slot name="actionbar-right"></slot>
</div>

Expand All @@ -32,7 +32,6 @@
@update:compact="$emit('update:compact', $event)"
@update:columns="$emit('update:columns', $event)"
@refresh="$emit('refresh')"
@action="onToolbarHandle"
/>
<slot name="toolbar-right"></slot>
</div>
Expand All @@ -52,7 +51,6 @@
:row-handle="rowHandle"
:data="data"
:cell-slots="computedCellSlots"
@row-handle="onRowHandle"
/>
<!-- 编辑对话框 -->
<fs-form-wrapper
Expand Down Expand Up @@ -250,36 +248,6 @@ function useTable(props, ctx) {
});
const formWrapperRef = ref();
const { proxy } = getCurrentInstance();
const onRowHandle = (scope) => {
const { key } = scope;
const tableColumnCI = proxy.$fsui.tableColumn;
const index = scope[tableColumnCI.index];
const row = scope[tableColumnCI.row];
const e = { mode: key, initialForm: row, slots: ctx.slots, index };
if (key === "edit") {
formWrapperRef.value.open({ ...props.editForm, ...e });
} else if (key === "view") {
formWrapperRef.value.open({ ...props.viewForm, ...e });
}
};
const onActionHandle = (e) => {
if (e.key === "add") {
formWrapperRef.value.open({
...props.addForm,
mode: "add",
initialForm: e.initialForm,
slots: ctx.slots
});
}
};
const onToolbarHandle = (e) => {
logger.debug("toolbar handle", e);
};
const computedClass = computed(() => {
const clazz = { compact: props.toolbar.compact !== false };
if (props.customClass) {
Expand All @@ -294,9 +262,6 @@ function useTable(props, ctx) {
computedTable,
computedToolbar,
computedCellSlots,
onRowHandle,
onActionHandle,
onToolbarHandle,
formWrapperRef,
computedFormSlots,
computedSearchSlots,
Expand Down
99 changes: 42 additions & 57 deletions packages/fast-crud/src/use/use-crud.ts
View file
Expand Up @@ -121,28 +121,32 @@ export function useCrud(ctx: UseCrudProps) {
}

function useRemove() {
const doRemove = async function (context) {
// TODO i18n
try {
await ui.messageBox.confirm({
title: t("fs.rowHandle.remove.confirmTitle"), // '提示',
message: t("fs.rowHandle.remove.confirmMessage"), // '确定要删除此记录吗?',
type: "warn"
});
} catch (e) {
logger.info("delete canceled", e.message);
return;
}
context.row = context[ui.tableColumn.row];
await crudBinding.value.request.delRequest(context);
ui.notification.success(t("fs.rowHandle.remove.success"));
await doRefresh();
};
return {
rowHandle: {
buttons: {
remove: {
click: doRemove
click: async (context) => {
context.row = context[ui.tableColumn.row];
await expose.doRemove(context);
}
},
edit: {
click: async (context) => {
context.row = context[ui.tableColumn.row];
await expose.openEdit({
row: context.row,
index: context.index
});
}
},
view: {
click: async (context) => {
context.row = context[ui.tableColumn.row];
await expose.openView({
row: context.row,
index: context.index
});
}
}
}
}
Expand Down Expand Up @@ -198,6 +202,20 @@ export function useCrud(ctx: UseCrudProps) {
};
}

function useActionbar() {
return {
actionbar: {
buttons: {
add: {
click() {
expose.openAdd();
}
}
}
}
};
}

function useEditable() {
const { compute } = useCompute();

Expand All @@ -221,7 +239,7 @@ export function useCrud(ctx: UseCrudProps) {
text: "删除",
type: "danger",
click: ({ index }) => {
expose.editable.removeRow(index);
expose.editable.doRemoveRow({ index });
}
}
},
Expand All @@ -242,24 +260,8 @@ export function useCrud(ctx: UseCrudProps) {
save: {
text: "保存",
loading: false,
click: async ({ index }) => {
const editableRow = expose.editable.getEditableRow(index);
editableRow.save({
index,
async doSave({ isAdd, changed, row, setData }) {
try {
editableRow.isLoading = true;
if (isAdd) {
const ret = await crudBinding.value.request.addRequest({ form: changed });
setData(ret);
} else {
await crudBinding.value.request.editRequest({ form: changed, row });
}
} finally {
editableRow.isLoading = false;
}
}
});
click: ({ index }) => {
expose.editable.doSaveRow({ index });
},
show: compute(({ index }) => {
return !!expose.editable?.getEditableRow(index)?.isEditing;
Expand All @@ -268,7 +270,7 @@ export function useCrud(ctx: UseCrudProps) {
cancel: {
text: "取消",
click: async ({ index }) => {
expose.editable.getEditableRow(index).inactive();
await expose.editable?.doCancelRow({ index });
},
show: compute(({ index }) => {
return !!expose.editable?.getEditableRow(index)?.isEditing;
Expand All @@ -278,25 +280,7 @@ export function useCrud(ctx: UseCrudProps) {
text: "删除",
type: "danger",
click: async ({ index }) => {
try {
await ui.messageBox.confirm({
title: t("fs.rowHandle.remove.confirmTitle"), // '提示',
message: t("fs.rowHandle.remove.confirmMessage"), // '确定要删除此记录吗?',
type: "warn"
});
} catch (e) {
logger.info("delete canceled", e.message);
return;
}
const row = expose.editable.getEditableRow(index);
if (row.isAdd) {
expose.editable.removeRow(index);
} else {
const rowData = row.getRowData(index);
await crudBinding.value.request.delRequest({ row: rowData });
doRefresh();
}
ui.notification.success(t("fs.rowHandle.remove.success"));
expose.editable?.doRemoveRow({ index });
}
}
}
Expand All @@ -314,6 +298,7 @@ export function useCrud(ctx: UseCrudProps) {
useSearch(),
useEvent(),
useTable(),
useActionbar(),
useEditable(),
defaultCrudOptions.commonOptions(ctx),
options
Expand Down

0 comments on commit f1d75b5

Please sign in to comment.