#ctx.modal

API tắt dựa trên Ant Design Modal, dùng để chủ động mở modal trong RunJS (thông báo thông tin, popup xác nhận, v.v.). Được triển khai bởi ctx.viewer / hệ thống view.

#Kịch bản áp dụng

Lưu ý: ctx.modal khả dụng trong môi trường RunJS có ngữ cảnh view (như JSBlock trong page, luồng sự kiện, v.v.); trong backend hoặc ngữ cảnh không UI có thể không tồn tại, khi sử dụng khuyến nghị dùng optional chaining (ctx.modal?.confirm?.()).

#Định nghĩa kiểu

modal: {
  info: (config: ModalConfig) => Promise<void>;
  success: (config: ModalConfig) => Promise<void>;
  error: (config: ModalConfig) => Promise<void>;
  warning: (config: ModalConfig) => Promise<void>;
  confirm: (config: ModalConfig) => Promise<boolean>;  // 用户点确定返回 true，取消返回 false
};

ModalConfig giống với cấu hình phương thức tĩnh Modal của Ant Design.

#Phương thức thường dùng

#Tham số cấu hình

Giống với Modal của Ant Design, các trường thường dùng bao gồm:

#Quan hệ với ctx.message, ctx.openView

#Ví dụ

#Popup thông tin đơn giản

ctx.modal.info({
  title: '提示',
  content: '操作已完成',
});

#Popup xác nhận và điều khiển luồng

const confirmed = await ctx.modal.confirm({
  title: '确认删除',
  content: '确定要删除这条记录吗？',
  okText: '确定',
  cancelText: '取消',
});
if (!confirmed) {
  ctx.exit();  // 用户取消时终止后续步骤
  return;
}
await ctx.runAction('destroy', { filterByTk: ctx.record?.id });

#Popup xác nhận với onOk

await ctx.modal.confirm({
  title: '确认提交',
  content: '提交后将无法修改，确定继续？',
  async onOk() {
    await ctx.form.submit();
  },
});

#Thông báo lỗi

try {
  await someOperation();
  ctx.modal.success({ title: '成功', content: '操作已完成' });
} catch (e) {
  ctx.modal.error({ title: '错误', content: e.message });
}

#Liên quan

• ctx.message: Thông báo nhẹ tạm thời, tự biến mất
• ctx.exit(): Khi người dùng hủy xác nhận, thường dùng if (!confirmed) ctx.exit() để kết thúc luồng
• ctx.openView(): Mở view tùy chỉnh, phù hợp tương tác phức tạp