canrd-outside / order-erp-front · Commits

Commit 21f7a854fe2455315287d04e895661ff739bce17

Authored by 无木
1 parent 8e4f486f

fix(demo): account list page validate and save

Inline Side-by-side
Showing 3 changed files with 15 additions and 5 deletions
src/views/demo/system/account/AccountModal.vue
  View file @21f7a85
... ... @@ -16,6 +16,7 @@
16 16 emits: ['success', 'register'],
17 17 setup(_, { emit }) {
18 18 const isUpdate = ref(true);
  19 + const rowId = ref('');
19 20  
20 21 const [registerForm, { setFieldsValue, updateSchema, resetFields, validate }] = useForm({
21 22 labelWidth: 100,
... ... @@ -32,6 +33,7 @@
32 33 isUpdate.value = !!data?.isUpdate;
33 34  
34 35 if (unref(isUpdate)) {
  36 + rowId.value = data.record.id;
35 37 setFieldsValue({
36 38 ...data.record,
37 39 });
... ... @@ -59,7 +61,7 @@
59 61 // TODO custom api
60 62 console.log(values);
61 63 closeModal();
62   - emit('success');
  64 + emit('success', { isUpdate: unref(isUpdate), values: { ...values, id: rowId.value } });
63 65 } finally {
64 66 setModalProps({ confirmLoading: false });
65 67 }
... ...
src/views/demo/system/account/account.data.ts
  View file @21f7a85
... ... @@ -61,7 +61,7 @@ export const accountFormSchema: FormSchema[] = [
61 61 label: '密码',
62 62 component: 'InputPassword',
63 63 required: true,
64   - show: false,
  64 + ifShow: false,
65 65 },
66 66 {
67 67 label: '角色',
... ...
src/views/demo/system/account/index.vue
  View file @21f7a85
... ... @@ -45,9 +45,10 @@
45 45 components: { BasicTable, PageWrapper, DeptTree, AccountModal, TableAction },
46 46 setup() {
47 47 const [registerModal, { openModal }] = useModal();
48   - const [registerTable, { reload }] = useTable({
  48 + const [registerTable, { reload, updateTableDataRecord }] = useTable({
49 49 title: '账号列表',
50 50 api: getAccountList,
  51 + rowKey: 'id',
51 52 columns,
52 53 formConfig: {
53 54 labelWidth: 120,
... ... @@ -82,8 +83,15 @@
82 83 console.log(record);
83 84 }
84 85  
85   - function handleSuccess() {
86   - reload();
  86 + function handleSuccess({ isUpdate, values }) {
  87 + if (isUpdate) {
  88 + // 演示不刷新表格直接更新内部数据。
  89 + // 注意：updateTableDataRecord要求表格的rowKey属性为string并且存在于每一行的record的keys中
  90 + const result = updateTableDataRecord(values.id, values);
  91 + console.log(result);
  92 + } else {
  93 + reload();
  94 + }
87 95 }
88 96  
89 97 function handleSelect(deptId = '') {
... ...